@media (min-width:1227px) {
    /*選單母項目樣式*/
    .join2top-menu {
        /*margin: 0 20px 0px;*/
        /*padding-top: 25px;*/
        /*border-top: 1px solid #ddd;*/
        display: inline-block;
        vertical-align:middle;
    }

        .join2top-menu > ul {
            text-align: center;
        }

            .join2top-menu > ul > li {
                display: inline-block;
                /*border-left: 1px solid #ddd;*/
                /*padding: 0 2px;*/
            }

        .join2top-menu li:hover > div {
            /*display: block;*/
	    /*background-color:#ffd700;*/
        }

        .join2menu {
            font:normal 14px 微軟正黑體;
            /*color: #555;*/
            /*margin: 0 20px 60px;*/
            padding:5px 10px;
	    color: #000000;
        }
            .join2top-menu .join2menu{
                color: #444;
		font-size:14px;
		font-weight:600
		/*padding: 10px 10px;*/ /*long間距至plugin.html.css調*/
            }
            .join2top-menu .join2menu:hover {
                color: #cc0066;
 		transition: color 0.3s ease-out;
            }
    .join2menu:hover {
         color: #000;
                
            
    }
    /*選單子項目樣式*/
    .join2top-menubox {
        display:none;
    }
    .menu-item {
        display:none;
    }
    .join2top-menubox,
    .join2top-menubox-item {
        position: absolute;
        width: auto;
        height: auto;
        box-shadow: 0 0 2px rgba(0,0,0,0.2);
        z-index: 9000;
        background: white;
         /*join2-Cindy*/
        padding: 0px 0 0px 0;
        border-top:2px solid #f6ad3c;
        margin:5px 0;
    }
    .join2top-menubox-item {
        left:100%;
        top:-10px;
    }
        .join2top-menubox > ul,
        .join2top-menubox-ul,
        .join2top-menubox-item > ul {
            display: block;
            text-align: left;
            float: left;
        }
        
            .join2top-menubox > ul > li,
            .join2top-menubox-ul > li,
            .join2top-menubox-item > ul > li {
                display: block;
                position:relative;
            }
            /*文字 list style*/
	    /*join2-Cindy*/
            /*.join2top-menubox-ul > li::before,
            .join2top-menubox-item > ul > li::before {
                content:"";
                position:absolute;
                left:14px;
                top:16px;
                width:5px;
                height:5px;
                background:#555;
            }*/
                .join2top-menubox > ul> li > a,
                .join2top-menubox-ul > li > a {
                    white-space:nowrap;
                    display: block;
                    font-size: 15px;
                    color: #555;
                    padding: 10px 30px 10px 30px;
                }

                 .join2top-menubox-item > ul > li > a{
                    white-space:nowrap;
                    font-size: 15px;
                    color: #555;
                    padding: 10px 30px 10px 30px;
                }
        .join2top-menubox li:hover {
	    /*join2-Cindy*/
		color: #000;
	    	transition: background-color 1s ease-out;
        	background-color:#f6ad3c;
            
            /*background-color: #b0b0b0;*/
            
        }

    .join2top-menubox-ul > li > a.join2-item-goitem ,
    .join2top-menubox-item > ul > li > a.join2-item-goitem,
    .join2top-menubox-ul > li > a.join2-item-goback ,
    .join2top-menubox-item > ul > li > a.join2-item-goback{
        display:none;
        padding:0 0 0 0;
    } 
    .join2top-menu .search-box form, .join2top-menu .store-search-box{
        display:none;
    }
}
@media (max-width:1001px) {

    .join2top-menu .search-box form, .join2top-menu .search-box{
        display:inline-block !important;
        padding:10px 0 0 0;
    }
    .join2-bottombox-left, .join2-bottombox-right {
        bottom: 40px;
    }
}
@media (max-width:769px) {

    .join2top-menu .join2menu{
        color: #fff;
		padding: 10px 0;
        font-family:'microsoft jhenghei';
   }
    .join2menu, .join2top-menubox > ul > li > a, .join2top-menubox-item > ul > li > a {
        font-family: 'microsoft jhenghei';
    }
}

@media(max-width: 1228px)
 {
       .join2top-menu .join2menu{
        color: #fff;
	padding: 10px 0;
        font-family:'microsoft jhenghei';
	font-weight: 100;
   }
    .join2menu, .join2top-menubox > ul > li > a, .join2top-menubox-item > ul > li > a {
        font-family: 'microsoft jhenghei';
    }
      
    .master-wrapper-content {
        /*join2-Cindy*/
        z-index:9;
    }

    .join2top-menu {
        text-align: center;
        position:fixed;
        top:0;
        left:0;
        bottom:0;
        z-index:9000;
        background:rgba(0,0,0,0.7);
    }

    .join2top-menu > ul {
        width:200px;
        display:block;
    }

    .join2top-menu > ul > li ,
    .join2top-menubox > ul > li,
    .join2top-menubox-item > ul > li{
        display:block;
        position:relative;
    }
    .join2menu ,
    .join2top-menubox > ul > li > a,
    .join2top-menubox-item > ul > li > a {
        display:block;
        font-size:14px;
        color:#e2e2e2;
        padding:18px 0px 18px 20px;
        border-bottom:1px solid rgba(255,255,255,0.2);
    }
    .join2top-menubox > ul > li > a.join2-hide,
    .join2top-menubox-item > ul > li > a.join2-hide,
    .join2top-menubox > ul > li.join2-hide,
    .join2top-menubox-item > ul > li.join2-hide {
        border:none;
        display:none;
    }
    ul.join2top-menubox-ul {
     background-color: rgba(137, 140, 124, 0.66); 
    }
    /*goitem and item-goitem*/
    /****.join2-goitem::before,
    .join2-item-goitem::before,
    .join2-goitem::after,
    .join2-item-goitem::after {
        position: absolute;
        content: "";
        height: 2px;
        width: 10px;
        background: #ffffff;
    }
    .join2-goitem::before,
    .join2-item-goitem::before {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        top:24px;
    }
    .join2-goitem::after,
    .join2-item-goitem::after {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        top:30px;
    }
    .join2-goitem,******/
    .join2top-menubox > ul > li > a.join2-item-goitem,
    .join2top-menubox-item > ul > li > a.join2-item-goitem {
        position:absolute;
        right:0;
        padding:26px 27px 25px 18px;
        color:#e2e2e2;
        border:none;
    }
    .join2top-menubox > ul > li > a.join2-item-goitem {
        position:absolute;
        right:0;
        padding:26px 27px 25px 18px;
        color:#e2e2e2;

    }

    /*goback and item-goback*/
    .join2-goback::before,
    .join2-item-goback::before {
        content: "上層選單";
    }

    .join2-goback {
        display:block;
        padding:18px 0 18px 20px;
        font-size:15px;
        color:#e2e2e2;
        border-bottom:1px solid rgb(0,0,0);
    }

    .join2itemhide>div ,.join2-hide,
    .join2top-menubox ,.join2menuhide,
    .join2top-menubox > ul > li > a.join2-hide,
    .join2top-menubox > ul > li.join2-hide,
    .join2-imghide{
        border:none;
        display:none;
    }
    .join2-hide > div ,
    .join2-show{
        display:block;
    }
    /*top and bottom BOX*/
    .join2-topbox-left,
    .join2-bottombox-left {
        position:fixed;
        left:0px;
        width:40px;
        height:40px;
        z-index:9003;
    }

    .join2-topbox-right,
    .join2-bottombox-right {
        position:fixed;
        left:200px;
        width:40px;
        height:40px;
        border-left:1px solid rgb(255,255,255);
        border-radius:0;
        z-index:9003;
        background-color:rgba(0,0,0,0.7)
    }

    .join2-topbox-left,
    .join2-topbox-right {
        /*join2-Cindy*/
        top:20px;
    }

    .join2-bottombox-left,
    .join2-bottombox-right {
        bottom:0;
    }

    .join2-show-menu,
    .join2-hide-menu {
        /*position:absolute;
        padding:40px 40px 0px 0px;*/
        /*join2-liuyan*/
        position:absolute;
        padding:40px 40px 0px 0px;
        left:0;
        top:0;
    }

    .join2-show-menustyle {
        /*join2-liuiyan*/
        content:"";
        position:fixed;
	    left: 0;
        padding:2px 20px 0px 0px;
        margin:10px 0 0 12px;
        background:#444;
        z-index:-1;
    }

    .join2-show-menustyle::before,
    .join2-show-menustyle::after {
        content:"";
        position:absolute;
        width:20px;
        height:2px;
        background:#444;
        top:8px;
    }
    .join2-show-menustyle::before {
        top:8px;
    }
    .join2-show-menustyle::after {
        top:16px;
    }

    .join2-hide-menustyle::after,
    .join2-hide-menustyle::before {
        position: absolute;
        content: "";
        height: 2px;
        width: 22px;
        background: #ffffff;
        left:9px;
        z-index:-1;
    }
    .join2-hide-menustyle::before {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        top:18px;
    }
    .join2-hide-menustyle::after {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        top:18px;
    }

    .join2-gradually-hide {
        opacity:0;
        left:-390px; /*long連結擋到畫面，所以設到-390位置*/
    }
    .join2-insertgo-menu {
        width:0px;
    }
}



    .header-menu{
        display:none;
    }
@media (min-width: 769px) {
.join2-product-slider{
	margin-left: 0%;
	}

}
@media (min-width: 1001px) {
	.join2-product-slider{
	margin-left: 15%;
}
    .join2top-menu .search-box form, .join2top-menu .search-box{
        display:none;
    }
}
@media (min-width: 1367px) {

}