

.n-nav {
    font-family: 'Poppins', sans-serif,'微軟正黑體',sans-serif;
    line-height: 1.5;
    color: #777;
    max-width: 1430px;
    width: 98%;
    margin: 0 auto;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    padding-top: 22px;
    padding-bottom: 10px;
}

.n-nav > div > a {
    color: #777;
    transition: .3s;
}

@media (max-width: 1024px) {
    .n-nav {
        flex-flow: column;
        justify-content: center;
        align-items: flex-start;
    }
}

.n-nav > div {
    margin-right: 20px;
    font-size: 18px;
    cursor: context-menu;
    position: relative;
    flex-shrink: 0;
}

.n-nav > div.chinese {
    margin-right: 20px;
    font-size: 18px;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
}

.n-nav > a > div {
    margin-right: 20px;
    font-size: 18px;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    color: #777;
}

.n-nav > a > div:hover {
    color: #74c043;
    transition: .3s;
}

@media (max-width: 1024px) {
    .n-nav > div {
        margin-right: 0;
        flex-basis: 100%;
        padding-left: 10px;
    }

}

.n-nav > div#n-shrink {
    margin-right:0px;
    max-width: 100px;
    width: 1%;
}

@media (max-width: 1024px) {
    .n-nav > div#n-shrink {
        display: none;
    }
}

.n-nav > div::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

.n-nav > div.n-no-arrow::after {
    border: none;
    margin-left: 0;
}

.n-nav > div:hover {
    color: #74c043;
    transition: .3s;
}

.n-nav > div > a {
    color: #777;
    transition: .3s;
    cursor: pointer;
}

.n-nav > div:hover > a {
    color: #74c043;
}

.nav > div:hover > div > div > div {
    color: #777;
}

.n-nav > div div {
    font-size: 16px;
    z-index: 12;
}

.n-nav > div > div:not(.n-search-btn) {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 22px;
    left: -78px;
    padding-top: 8px;
}


.n-nav > div#n-products.chinese > div{
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
}

.n-nav > div#n-products.chinese_01 > div{
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: -22px;
    padding-top: 30px;
}

.n-nav > div#n-products.jp > div{
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: -62px;
    padding-top: 30px;
}

.n-nav > div#n-resources > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 22px;
    left: -60px;
    padding-top: 8px;
}

.n-nav > div#n-application > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 22px;
    left: 0;
    padding-top: 8px;
}

.n-nav > div#n-resources.chinese > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
}

.n-nav > div#n-resources.chinese_01 > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 22px;
    left: 0;
    padding-top: 8px;
}



.n-nav > div#n-resources.jp > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
}

.n-nav > div#n-resources.jp_01 > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
}

.n-nav > div#n-about-us > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 22px;
    left: 0;
    padding-top: 8px;
}

.n-nav > div#n-about-us.chinese > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
}

.n-nav > div#n-about-us.jp > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: -80px;
    padding-top: 30px;
}

.n-nav > div#n-language-box > div {
    display: none;
    /*border: 1px solid #777;*/
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 61px;
}



.n-nav > div > div > div {
    border: 1px solid #777;
    display: flex;
    flex-flow: column nowrap;
}

.n-nav > div > div > div.n-language-zone {
    transform: translate(-16px, 0px);
}

.n-nav > div > div > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

.n-nav > div > div > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

.n-nav > div > div > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

.n-nav > div > div > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

.n-nav > div > div > div > div > a {
    color: #777;
    transition: .3s;
}

.n-nav > div > div > div > div:hover > a {
    color: #fff;
    transition: .3s;
}

.n-nav > div > div > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}



.n-nav > div > div > div > div:not(:last-child) {
    border-bottom: solid 1px #777;
}

.n-nav > div > div > div > a > div:not(.last-div) {
    border-bottom: solid 1px #777;
}

.n-nav > div > div > div > div.n-arrow::after,
div.pin-header-sensor.n-arrow::after,
div.box-header-sensor.n-arrow::after,
div.female-header-sensor.n-arrow::after,
div.plug-connectors-sensor.n-arrow::after,
div.wafer-sensor.n-arrow::after,
div.fpc-sensor.n-arrow::after,
div.terminal-block-sensor.n-arrow::after,
div.machined-pin-header-sensor.n-arrow::after,
div.pci-sensor.n-arrow::after,
div.waterproof-sensor.n-arrow::after,
div.usb-sensor.n-arrow::after {
    display: inline-block;
    margin-right: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid transparent;
    border-right: 0;
    border-bottom: .3em solid transparent;
    border-left: .3em solid;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: 7px;
}

div.n-nav > div#n-resources > div > div > div.n-arrow {
    position: relative;
}

div.n-nav > div#n-resources > div > div > a > div.n-arrow::after {
    display: inline-block;
    margin-right: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid transparent;
    border-right: 0;
    border-bottom: .3em solid transparent;
    border-left: .3em solid;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: 7px;
}

img.n-logo {
    /*max-width: 325px;*/
    width: 256px;
    height: auto;
    transform: translate(0, -7px);
}

div input.n-input-index {
    border: 1px solid #777;
    padding: 3px 8px;
    border-radius: 6px 0 0 6px;
    color: #777;
    width: 140px;
}

div input.n-input-index:focus {
    outline: none;
    color: #777;
}


div#n-search-bar div.n-search-btn {
    background-color: #777;
    border-radius: 0 6px 6px 0;
    padding: 3px 4px;
    color: #fff;
    display: flex;
    flex-flow: column;
    justify-content: center;
    font-size: 14px;
}

div#n-search-bar div.n-search-btn:hover {
    /*background-color: #74c043;*/
}

div#n-search-bar {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    /*display: none;*/
}

/*--  language & contact us icon 處理---------*/
div#n-language-box {
    display: flex;
    flex-flow: column;
    align-items: center;
    transform: translate(0, -13px);
    z-index: 12;
}
div#n-contact-us {
    display: flex;
    flex-flow: column;
    align-items: center;
    transform: translate(0, -13px);
}
div#n-search {
    /*display: flex;*/
    display: none;
    flex-flow: column;
    align-items: center;
    transform: translate(0, -16px);
}

.n-nav > div >div div {
    background-color: #fff;
}


/*--  language & contact us icon 處理---end--*/


 /*--------------  第二層版型 start------------*/
.n-nav > div#n-products:hover > div {
    display: flex;
    flex-flow: column;
}

.n-nav > div#n-resources:hover > div {
    display: flex;
    flex-flow: column;
}

.n-nav > div#n-application:hover > div {
    display: flex;
    flex-flow: column;
}

.n-nav > div#n-about-us:hover > div {
    display: flex;
    flex-flow: column;
}

.n-nav > div#n-language:hover > div {
    display: flex;
    flex-flow: column;
}

.n-nav > div#n-language-box:hover > div {
    display: flex;
    flex-flow: column;
}
/*--------------  第二層版型 end--------------*/


/*--------------  第三層版型 start------------*/

div#n-headers {
    position: relative;
}

div#n-headers > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-headers:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-28px, -1px);
    z-index: 2;
}

div#n-headers.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(17px, -1px);
    z-index: 2;
}

div#n-headers.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-14px, -1px);
    z-index: 2;
}

@media (max-width: 1280px) {
    div#n-headers:hover > div {
        transform: translate(3px, -1px);
    }
}

div#n-headers:hover > div {
    display: flex;
}

div#n-headers:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-headers:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-headers:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-headers:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-headers > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-headers > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-floating {
    position: relative;
}

div#n-floating > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-floating:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(12px, -1px);
    z-index: 2;
}

div#n-floating.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(17px, -1px);
    z-index: 2;
}

div#n-floating.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(18px, -1px);
    z-index: 2;
}

div#n-floating.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-14px, -1px);
    z-index: 2;
}

div#n-floating.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(34px, -1px);
    z-index: 2;
}

@media (max-width: 1280px) {
    div#n-floating:hover > div {
        transform: translate(3px, -1px);
    }
}

div#n-floating:hover > div {
    display: flex;
}

div#n-floating:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-floating:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-floating:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-floating:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-floating > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-floating > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-terminal {
    position: relative;
}

div#n-terminal > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-terminal:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-24px, -1px);
    z-index: 2;
}

div#n-terminal.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(17px, -1px);
    z-index: 2;
}

div#n-terminal.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(18px, -1px);
    z-index: 2;
}

div#n-terminal.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-14px, -1px);
    z-index: 2;
}

div#n-terminal.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-14px, -1px);
    z-index: 2;
}

div#n-terminal.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-94px, -1px);
    z-index: 2;
}

@media (max-width: 1280px) {
    div#n-terminal:hover > div {
        transform: translate(3px, -1px);
    }
}

div#n-floating:hover > div {
    display: flex;
}

div#n-terminal:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-terminal:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-terminal:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-terminal:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-terminal > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-terminal > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-automotive {
    position: relative;
}

div#n-automotive > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-automotive:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(51px, -1px);
}

div#n-automotive.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(14px, -1px);
}

div#n-automotive.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(106px, -1px);
}

div#n-automotive.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(2px, -1px);
}

div#n-automotive.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(34px, -1px);
}

div#n-automotive:hover > div {
    display: flex;
}

div#n-automotive:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-automotive:hover > div > a >div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-automotive:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-automotive:hover > div > a >div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-automotive > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-automotive > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-b-to-b {
    position: relative;
}

div#n-b-to-b > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-b-to-b:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(33px, -1px);
}

div#Videos {
    position: relative;
}

div#Videos > div {
    display: none;
}

div#Videos:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: -165px;
    right: -100%;
    transform: translate(118px, -1px);
}

div#Videos.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: -165px;
    right: -100%;
    transform: translate(127px, -1px);
}

div#download{
    position: relative;
}

div#download > div {
    display: none;
}

div#download:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0px;
    right: -100%;
    transform: translate(0px, -1px);
}

div#download.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0px;
    left: 100%;
    width: auto;
}
div#download:hover > div > a >div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}
div#download:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}
div#download> div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}



div#n-b-to-b.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(50px, -1px);
}

div#n-b-to-b.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-6px, -1px);
}

div#n-b-to-b.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(2px, -1px);
}

div#n-b-to-b.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(58px, -1px);
}

div#Videos.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: -165px;
    right: -230px;
    transform: translate(106px, -1px);
}

@media (max-width: 1285px) {
    div#n-b-to-b:hover > div {
        transform: translate(5px, -1px);
    }

    div#n-b-to-b.chinese:hover > div {
        transform: translate(49px, -1px);
    }
}

div#n-b-to-b:hover > div {
    display: flex;
}

div#n-b-to-b:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-b-to-b:hover > div > a >div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#Videos:hover > div > a >div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-b-to-b:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-b-to-b:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#Videos:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-b-to-b > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-b-to-b > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#Videos > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-w-to-b {
    position: relative;
}

div#n-w-to-b > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-w-to-b:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-52px, -1px);
}

div#n-w-to-b.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-2px, -1px);
}

div#n-w-to-b.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(24px, -1px);
}

div#n-w-to-b.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-19px, -1px);
}

div#n-w-to-b.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(-14px, -1px);
}

@media (max-width: 1285px) {
    div#n-w-to-b.jp:hover > div {
        transform: translate(-18px, -1px);
    }
}

div#n-w-to-b:hover > div {
    display: flex;
}

div#n-w-to-b:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-w-to-b:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-w-to-b:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-w-to-b:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-w-to-b > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-w-to-b > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/


/*--------------  第三層版型 start------------*/

div#n-io {
    position: relative;
}

div#n-io > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-io:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -86%;
    transform: translate(-129px, -1px);
}

div#n-io.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -86%;
    transform: translate(43px, -1px);
}

div#n-io.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -86%;
    transform: translate(-24px, -1px);
}

div#n-io.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -86%;
    transform: translate(34px, -1px);
}

@media (max-width: 1285px) {
    div#n-io.chinese:hover > div {
        transform: translate(42px, -1px);
    }
}

div#n-io.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -86%;
    transform: translate(0, -1px);
}

@media (max-width:1285px) {
    div#n-io.jp:hover > div {
        transform: translate(1px, -1px);
    }
}

div#n-io:hover > div {
    display: flex;
}

div#n-io:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-io:hover > div > a >div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-io:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-io:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-io > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-io > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-card-edge {
    position: relative;
}

div#n-card-edge > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-card-edge:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(-35px, -1px);
}

div#n-card-edge.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(28px, -1px);
}

div#n-card-edge.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(13px, -1px);
}

div#n-card-edge.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(55px, -1px);
}

div#n-card-edge.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(-19px, -1px);
}

div#n-card-edge:hover > div {
    display: flex;
}

div#n-card-edge:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-card-edge:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-card-edge:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-card-edge:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-card-edge > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-card-edge > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-customized {
    position: relative;
}

div#n-customized > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-customized:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -60%;
    transform: translate(147px, -1px);
}

div#n-customized.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(28px, -1px);
}

div#n-customized.chinese_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -40%;
    transform: translate(100px, -1px);
}

div#n-customized.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -60%;
    transform: translate(169px, -1px);
}

div#n-customized.jp_01:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -60%;
    transform: translate(104px, -1px);
}

div#n-customized:hover > div {
    display: flex;
}

div#n-customized:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-customized:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-customized:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-customized:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-customized > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-customized > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/

/*--------------  第三層版型 start------------*/

div#n-company-profile {
    position: relative;
}

div#n-company-profile > div {
    display: none;
}

/*.n-nav > div > div > div > div > div {
    display: none;
}*/

div#n-company-profile:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -65%;
    transform: translate(152px, -1px);
}

div#n-company-profile.chinese:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -65%;
    transform: translate(44px, -1px);
}

div#n-company-profile.jp:hover > div {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -65%;
    transform: translate(28px, -1px);
}

div#n-company-profile:hover > div {
    display: flex;
}

div#n-company-profile:hover > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-company-profile:hover > div > a > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
    color: #777;
}

div#n-company-profile:hover > div > div:not(:last-child) {
    border-bottom: 1px solid #777;
}

div#n-company-profile:hover > div > a > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div#n-company-profile > div > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}

div#n-company-profile > div > a > div:hover {
    background-color: #74c043;
    color: #fff;
    transition: .3s;
}
/*--------------  第三層版型 end--------------*/


/*--------------  第四層版型 start------------*/
/*a.a-relative {
    position: relative;
}

a.a-relative > div.pin-header-pitch-box  {
    display: none;
}

a.a-relative:hover > div.pin-header-pitch-box {
    display: flex;
    border: 1px solid #777;
    flex-flow: column nowrap;
    position: absolute;
    top: 0;
    right: -100%;
    transform: translate(24px, -1px);
}*/

div.pin-header-sensor {
    position: relative;
}

div.pin-header-sensor > div.pin-headers-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 288px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.pin-header-sensor > div.pin-headers-step-4-box.jp {
    left: 272px;
}

div.pin-header-sensor > div.pin-headers-step-4-box.sc {
    left: 128px;
}

div.pin-header-sensor > div.pin-headers-step-4-box.tc {
    left: 128px;
}

div.pin-header-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box {
    display: block;
    z-index: 30;
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box > div {
    color: #777;
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;

}

div.pin-header-sensor:hover > div.pin-headers-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.pin-header-sensor:hover > div.pin-headers-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}




/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.female-header-sensor {
    position: relative;
}

div.female-header-sensor > div.female-headers-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 288px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.female-header-sensor > div.female-headers-step-4-box.jp {
    left: 272px;
}

div.female-header-sensor > div.female-headers-step-4-box.sc {
    left: 128px;
}

div.female-header-sensor > div.female-headers-step-4-box.tc {
    left: 128px;
}

div.female-header-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.female-header-sensor:hover > div.female-headers-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.female-header-sensor:hover > div.female-headers-step-4-box {
    display: block;
    z-index: 30;
}

div.female-header-sensor:hover > div.female-headers-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.female-header-sensor:hover > div.female-headers-step-4-box > div {
    color: #777;
}

div.female-header-sensor:hover > div.female-headers-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;

}

div.female-header-sensor:hover > div.female-headers-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.female-header-sensor:hover > div.female-headers-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.female-header-sensor:hover > div.female-headers-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.box-header-sensor {
    position: relative;
}

div.box-header-sensor > div.box-headers-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 288px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.box-header-sensor > div.box-headers-step-4-box.jp {
    left: 272px;
}

div.box-header-sensor > div.box-headers-step-4-box.sc {
    left: 128px;
}

div.box-header-sensor > div.box-headers-step-4-box.tc {
    left: 128px;
}

div.box-header-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.box-header-sensor:hover > div.box-headers-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.box-header-sensor:hover > div.box-headers-step-4-box {
    display: block;
    z-index: 30;
}

div.box-header-sensor:hover > div.box-headers-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.box-header-sensor:hover > div.box-headers-step-4-box > div {
    color: #777;
}

div.box-header-sensor:hover > div.box-headers-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.box-header-sensor:hover > div.box-headers-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.box-header-sensor:hover > div.box-headers-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.box-header-sensor:hover > div.box-headers-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.plug-connectors-sensor {
    position: relative;
}

div.plug-connectors-sensor > div.plug-connectors-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 288px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.plug-connectors-sensor > div.plug-connectors-step-4-box.jp {
    left: 272px;
}

div.plug-connectors-sensor > div.plug-connectors-step-4-box.sc {
    left: 128px;
}

div.plug-connectors-sensor > div.plug-connectors-step-4-box.tc {
    left: 128px;
}

div.plug-connectors-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box {
    display: block;
    z-index: 30;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box > div {
    color: #777;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.plug-connectors-sensor:hover > div.plug-connectors-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/


/*--------------  第四層版型 start------------*/

div.machined-pin-header-sensor {
    position: relative;
}

div.machined-pin-header-sensor > div.machined-pin-header-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 277px;
    border: 1px solid #777;
    transform: translate(11px, 0);
    padding: 0 !important;
}

div.machined-pin-header-sensor > div.machined-pin-header-step-4-box.jp {
    left: 261px;
}

div.machined-pin-header-sensor > div.machined-pin-header-step-4-box.sc {
    left: 117px;
}

div.machined-pin-header-sensor > div.machined-pin-header-step-4-box.tc {
    left: 117px;
}

div.machined-pin-header-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box {
    display: block;
    z-index: 30;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box > div {
    color: #777;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.machined-pin-header-sensor:hover > div.machined-pin-header-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/



/*--------------  第四層版型 start------------*/

div.wafer-sensor {
    position: relative;
}

div.wafer-sensor > div.wafer-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 203px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.wafer-sensor > div.wafer-step-4-box.jp {
    left: 200px;
}

div.wafer-sensor > div.wafer-step-4-box.sc {
    left: 158px;
}

div.wafer-sensor > div.wafer-step-4-box.tc {
    left: 158px;
}

div.wafer-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.wafer-sensor:hover > div.wafer-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.wafer-sensor:hover > div.wafer-step-4-box {
    display: block;
    z-index: 30;
}

div.wafer-sensor:hover > div.wafer-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.wafer-sensor:hover > div.wafer-step-4-box > div {
    color: #777;
}

div.wafer-sensor:hover > div.wafer-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.wafer-sensor:hover > div.wafer-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.wafer-sensor:hover > div.wafer-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.wafer-sensor:hover > div.wafer-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.fpc-sensor {
    position: relative;
}

div.fpc-sensor > div.fpc-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 203px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.fpc-sensor > div.fpc-step-4-box.jp {
    left: 200px;
}

div.fpc-sensor > div.fpc-step-4-box.sc {
    left: 158px;
}

div.fpc-sensor > div.fpc-step-4-box.tc {
    left: 158px;
}

div.fpc-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.fpc-sensor:hover > div.fpc-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.fpc-sensor:hover > div.fpc-step-4-box {
    display: block;
    z-index: 30;
}

div.fpc-sensor:hover > div.fpc-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.fpc-sensor:hover > div.fpc-step-4-box > div {
    color: #777;
}

div.fpc-sensor:hover > div.fpc-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.fpc-sensor:hover > div.fpc-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.fpc-sensor:hover > div.fpc-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.fpc-sensor:hover > div.fpc-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.terminal-block-sensor {
    position: relative;
}

div.terminal-block-sensor > div.terminal-block-step-4-box {
    display: none;
    position: absolute;
    top: -221px;
    left: 231px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.terminal-block-sensor > div.terminal-block-step-4-box.jp {
    left: 120px;
}

div.terminal-block-sensor > div.terminal-block-step-4-box.sc {
    left: 120px;
}

div.terminal-block-sensor > div.terminal-block-step-4-box.tc {
    left: 120px;
}

div.terminal-block-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box {
    display: block;
    z-index: 30;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box > div {
    color: #777;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.terminal-block-sensor:hover > div.terminal-block-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/


/*--------------  第四層版型 start------------*/

div.pci-sensor {
    position: relative;
}

div.pci-sensor > div.pci-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 66px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.pci-sensor > div.pci-step-4-box.jp {
    left: 66px;
}

div.pci-sensor > div.pci-step-4-box.sc {
    left: 65px;
}

div.pci-sensor > div.pci-step-4-box.tc {
    left: 65px;
}

div.pci-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.pci-sensor:hover > div.pci-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.pci-sensor:hover > div.pci-step-4-box {
    display: block;
    z-index: 30;
}

div.pci-sensor:hover > div.pci-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.pci-sensor:hover > div.pci-step-4-box > div {
    color: #777;
}

div.pci-sensor:hover > div.pci-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;
}

div.pci-sensor:hover > div.pci-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.pci-sensor:hover > div.pci-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.pci-sensor:hover > div.pci-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.waterproof-sensor {
    position: relative;
}

div.waterproof-sensor > div.waterproofs-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 306px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.waterproof-sensor > div.waterproofs-step-4-box.jp {
    left: 248px;
}

div.waterproof-sensor > div.waterproofs-step-4-box.sc {
    left: 240px;
}

div.waterproof-sensor > div.waterproofs-step-4-box.tc {
    left: 240px;
}

div.waterproof-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box {
    display: block;
    z-index: 30;
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box > div {
    color: #777;
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;

}

div.waterproof-sensor:hover > div.waterproofs-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.waterproof-sensor:hover > div.waterproofs-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/

/*--------------  第四層版型 start------------*/

div.usb-sensor {
    position: relative;
}

div.usb-sensor > div.usb-step-4-box {
    display: none;
    position: absolute;
    top: -1px;
    left: 90px;
    border: 1px solid #777;
    transform: translate(0, 0);
    padding: 0 !important;
}

div.usb-sensor > div.usb-step-4-box.jp {
    left: 218px;
}

div.usb-sensor > div.usb-step-4-box.sc {
    left: 91px;
}

div.usb-sensor > div.usb-step-4-box.tc {
    left: 91px;
}

div.usb-sensor:hover {
    /* background-color: #74c043 !important;*/
}

div.usb-sensor:hover > div.usb-step-4-box:hover {
    /*background-color: #fff !important;*/
}

div.usb-sensor:hover > div.usb-step-4-box {
    display: block;
    z-index: 30;
}

div.usb-sensor:hover > div.usb-step-4-box:hover > div:hover {
    /*padding: 15px 25px 15px 15px;
    white-space: nowrap;*/
    background-color: #74c043 !important;
    color: #fff;
}

div.usb-sensor:hover > div.usb-step-4-box > div {
    color: #777;
}

div.usb-sensor:hover > div.usb-step-4-box > div > div {
    padding: 15px 25px 15px 15px;
    white-space: nowrap;

}

div.usb-sensor:hover > div.usb-step-4-box > div:not(.last-div) {
    border-bottom: 1px solid #777;
}

div.usb-sensor:hover > div.usb-step-4-box > div:hover {
    background-color: #74c043 !important;
}

div.usb-sensor:hover > div.usb-step-4-box > div:hover > div {
    background-color: #74c043 !important;
}


/*--------------  第四層版型 end--------------*/









div.n-cellphone-header {
    display: none;
}

div.n-cell-wrap {
    display: none;
}

@media (max-width: 1280px) {

    div.n-nav {
        display: none;
    }


    /*------------- 手機 Nav start --------------*/
    div.n-cellphone-header {
        max-width: 1275px;
        width: 100%;
        margin: 0 auto;
        flex-flow: row;
        position: relative;
        /*border: 1px solid #ccc;*/
        display: flex;
        padding: 15px;
    }

    div.n-cellphone-header > img.n-cellphone-logo {
        /*margin: 5px 0 0 10px;*/
        max-width: 325px;
        width: 30.5%;
        height: auto;
        cursor: pointer;
    }

    @media (max-width: 600px) {
        div.n-cellphone-header > img.n-cellphone-logo {
            width: 200px;
            /*display: none;*/

        }
    }

    div.n-sandwich {
        position: absolute;
        right: 15px;
        top: 13px;
    }

    .n-bar1, .n-bar2, .n-bar3 {
        width: 35px;
        height: 5px;
        background-color: #74c043;
        margin: 6px 0;
        transition: 0.4s;
    }

    .n-change .n-bar1 {
        -webkit-transform: rotate(-45deg) translate(-9px, 6px);
        transform: rotate(-45deg) translate(-9px, 6px);
    }

    .n-change .n-bar2 {
        opacity: 0;
    }

    .n-change .n-bar3 {
        -webkit-transform: rotate(45deg) translate(-8px, -8px);
        transform: rotate(45deg) translate(-8px, -8px);
    }

    @media (max-width: 768px) {
        .n-bar1, .n-bar2, .n-bar3 {
            height: 4px;
            margin: 4px 0;
        }

        .n-change .n-bar1 {
            -webkit-transform: rotate(-45deg) translate(-9px, 2px);
            transform: rotate(-45deg) translate(-9px, 2px);
        }

        .n-change .n-bar2 {
            opacity: 0;
        }

        .n-change .n-bar3 {
            -webkit-transform: rotate(45deg) translate(-8px, -4px);
            transform: rotate(45deg) translate(-8px, -4px);
        }
    }

    div.n-cell-wrap {
        display: flex;
        flex-flow: column;
        align-items: center;
        font-family: 'Poppins', sans-serif, '微軟正黑體', sans-serif;
        line-height: 1.5;
        color: #777;
        margin-top: 32px;
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 15px;
    }

    div.n-cell-wrap.n-change {
        display: none;
    }

    div.n-language-box {
        display: flex;
        flex-flow: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        max-width: 768px;
    }

    div.n-language-box div {
        font-size: 13px;
        padding: 5px
    }

    div.n-language-box a div {
        font-size: 13px;
        padding: 5px;
        color: #777;
    }

    div.n-language-box div.active {
        color: #fff;
        background-color: #777;
        border-radius: 6px;
    }

    div.n-language-box div:not(:last-child) {
        margin-right: 6px;
    }

    div.n-language-box a div:not(.last-div) {
        margin-right: 6px;
    }

    .n-cell-search-box {
        display: flex;
        flex-flow: row;
        align-items: center;
        justify-content: center;
        margin-top: 26px;
        margin-bottom: 17px;
    }

    .n-cell-search-box div.n-search-btn {
        background-color: #777;
        border-radius: 0 6px 6px 0;
        padding: 3px 8px;
        color: #fff;
        display: flex;
        flex-flow: column;
        justify-content: center;
        cursor: pointer;
        font-size: 16px;
    }

    .n-cell-search-box input.n-input-index {
        border: 1px solid #777;
        padding: 0 8px;
        border-radius: 6px 0 0 6px;
        color: #777;
        width: 250px;
        font-size: 18px;
    }
    div.n-nav-wrap {
        width: 100%;
        border-bottom: 1px solid #777;
        padding-bottom: 2px;
        padding-top: 6px;
    }

    div.n-first-stage {
        width: 100%;
        font-size: 18px;
        padding: 8px 0;
        /*border-bottom: 1px solid #777;*/
        position: relative;
        /*cursor: pointer;*/
    }

    /*div.n-first-stage::after {
        content: '\002B';
        color: #777;
        !*font-weight: bold;*!
        !*float: right;*!
        position: absolute;
        top: 7px;
        right: 5px;
        !*margin-left: 5px;*!
    }*/

    div.navBtn {
        background-color: #777;
        width: 85px;
        height: 20px;
        position: absolute;
        right: 10px;
        bottom: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
    }

    div.navBtn > span.btn{
        font-size: 20px;
        color: #fff;
    }

    div.navNextBtn {
        background-color: #74c043;
        width: 75px;
        height: 16px;
        position: absolute;
        right: 12px;
        bottom: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
    }

    div.navNextBtn > span.btn{
        font-size: 18px;
        color: #fff;
    }

    div span.n-ct-us {
        position: absolute;
        top: -25px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    div.n-nav-list {
        width: 100%;
        margin: -10px auto 0;
        color: #74c043;
        font-size: 16px;
        position: relative;
        /*max-height: 0;*/
        display: none;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

    div.n-second-stage.n-accordion-second > a {
        color: #74c043;
    }

   
    div.n-nav-list > a > div.n-second-stage {
        line-height: 40px;
        width: 93%;
        margin: 5px auto 5px;
        /*padding-left: 25px;*/
        position: relative;
        /*display: none;*/
        border-bottom: 1px dashed #777;
        cursor: pointer;
        color: #74c043;
    }

    div.n-nav-list > div.n-second-stage {
        line-height: 40px;
        width: 93%;
        margin: 5px auto 5px;
        /*padding-left: 25px;*/
        position: relative;
        /*display: none;*/
        border-bottom: 1px dashed #777;
        cursor: pointer;
    }

    div.n-nav-list > a > div.n-second-stage.n-nodashed {
        border-bottom: none;
    }

    div.n-nav-list > div.n-second-stage.n-nodashed {
        border-bottom: none;
    }

    div.n-nav-list-detail {
        border-bottom: 1px dashed #777;
        margin: -11px auto 0;
        width: 100%;
        /*max-height: 0;*/
        padding-bottom: 12px;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
        display: none;
    }

    div.n-nav-list-detail.n-nodashed {
        border-bottom: none;
    }

    div.n-nav-list > div.n-second-stage::after {
        /*content: '\002B';
        !*color: #777;*!
        position: absolute;
        !*font-weight: bold;*!
        !*float: right;*!
        top: 0;
        right: 18px;
        !*margin-left: 5px;*!*/
    }

    div.n-nav-list > div.n-second-stage.n-noafter::after {
        content: '';
    }

    div.n-nav-list > div.n-second-stage.j-active::after {
        /*content: "\2212";*/
    }

    div.n-nav-list > div.n-second-stage.j-active {
        border-bottom: none;
    }

    div.n-nav-list-detail > div {
        /*display: none;*/
    }

    div.n-nav-list-detail > a > div {
        line-height: 40px;
        width: 80%;
        margin: 0 auto;
        /*padding-left: 25px;*/
        position: relative;
        color: #777;
        cursor: pointer;
    }

    footer.mobile div.n-nav-list-detail > a > div {
        color: #999;
    }

    div.n-nav-list-detail > a > div > span {
        position: absolute;
        left: -23px;
        top: 10px;
        font-size: 20px;
    }

    div.n-nav-list-detail > a {
        margin: 0;
        padding: 0;
    }

    div.n-first-stage.n-active:after {
       /* content: "\2212";*/
    }

    /*
    div.n-nav-list-detail > div > div:first-child {
        margin-top: -8px;
    }
    */
    /*div.n-nav-list > div > div:last-child {
        margin-bottom: 12px;
    }*/
    /*div.n-first-stage > div > div > span {
        position: absolute;
        right: 5px;
        top: 6px;
    }*/
    div.n-nav-list > div:not(:last-child) {
        /*border-bottom: 1px dashed #777;*/
    }
}

@media (max-width: 320px) {
    .n-cell-search-box input.n-input-index {
        width: 205px;
    }
}
/*-------------- 手機 Nav end ---------------*/

/*-----------------首頁 Banner 開始------------*/
    body {
        padding: 0;
        margin: 0;
    }
    div.n-banner {
        margin:0 auto 0;
        width: 100%;
        padding: 0;
        background-color: rgba(0,0,0,.1);
        /*background-color: #fff;*/
        position: relative;
        height: 715px;
        color: #74c043;
        /*background-image: url("../images/index/1303_banner_tpm.jpg");*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*background-repeat: no-repeat;*/
        display: block;
    }


    div.home-banner-desk {
        display: block;
        margin:10px auto 0;
        max-width: 1303px;
        width: 100%;
        padding: 0;
    }

    div.home-banner-mobile {
        display: none;
        margin:10px auto 0;
        padding: 0;
    }

    div.home-banner-desk img {
        width: 100%;
        height: auto;
    }

    div.home-banner-mobile img {
        width: 100%;
        height: auto;
    }

    h1.bnTitle {
        position: absolute;
        top: 13%;
        left: 15%;
        font-size: 45px;
        font-weight: normal;
    }
    p.bnText {
        position: absolute;
        top: 22%;
        left: 15%;
        font-size: 18px;
        line-height: 28px;
    }
    img.floating_01 {
        position: absolute;
        top: 55%;
        left: 64%;
    }
    img.floating_02 {
        position: absolute;
        top: 39%;
        left: 55%;
    }

    @media (max-width: 768px) {
        div.home-banner-mobile {
            display: block;
        }
        div.home-banner-desk {
            display: none;
        }
    }

/*-----------------首頁 Banner 結束------------*/


header.fixed {
    top: -98px;
}

#num_search {
    margin-right: 0;
}
