@charset "UTF-8";
.pcnono{
    display:none;
}

.logotitle{
    text-align:center;
    margin-right:8px;
    color:#A07149;
    font-size: 1.0em;
   
    font-family:Microsoft JhengHei;
    vertical-align:middle;
    margin-top:5px;
}

.box1-group{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    position:relative;
    /*margin-bottom: -1px;*/
    background-color: #f4f4f4;

    border:0px red solid;
}
.box1-link{
    text-decoration: none;
    background-color: #ffffff;
    color:#696969;
    height:150px;
    width:220px;
   
}

.box1-link h6{

 font-size: 20px;
}
.box1-img{
    width:60px;
    margin:0 auto 0 rem;
    margin-top: 1.0rem;
    background-color: #ffffff;

}
.box1-body{
    flex: 1 1 auto;
    /*padding:1.25rem 1.25 rem;*/
    padding-top:20px;
}

.box2-body {
    width: 426px;/*365px;*/
    border: 1px #D3D3D3 solid;
    margin-left: 11px;
    margin-right: 10px;
    margin-bottom:5px;
     background: #ffffff;

}

.box2 ul {
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 0;
    text-align: left;
    list-style-type: none;
    font-size: 20px;
    margin-block-start: 1em;
    margin-block-end: 1em;
    padding-inline-start: 40px;
    unicode-bidi: isolate;
}

    .box2 ul li::before {
        content: "🌿"; /*&#127807; https://www.w3schools.com/charsets/ref_emoji_plants.asp*/
        padding-right: 8px;
        padding-left: 1px;
    }

.liorange li::before {
    content: "🍊" !important; /*&#127818;*/
    padding-right: 8px;
    padding-left: 1px;
}

.litree li::before {
    content: "🌳" !important; /*&#127795;*/
    padding-right: 8px;
    padding-left: 1px;
}


/*
.box2 ul li {

}
*/
    .box2 ul li a {
        text-decoration: none;
        color: #696969;
        font-size: 20px;
    }





.box2-img{
    width:100% ;/* 365px;*/
    margin:0 auto 0 ;
    /*margin-top: 1.0rem;*/
    /*background-color: #ffffff;*/

}

.box3-group{
    margin-left:6.5%;
    margin-right:6.5%;
}

.box3-body {
    width: 1320px; /*1112px;*/
    /*border:1px #f4fef4 solid;*/
    margin-left: 5px;
    margin-right: 5px;
}

#nav-tabContent ul {
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 0;
    text-align: left;
    list-style-type: none;
    font-size: 20px;
    margin-block-start: 1em;
    margin-block-end: 1em;
    padding-inline-start: 15px;
    padding-inline-end: 15px;
    unicode-bidi: isolate;
}


#nav-tabContent ul li::before{
     content: "📌" !important; /*&#128204;*/
    padding-right: 8px;
    padding-left: 1px;
}


@media (max-width:1330px){
     .box1-link{
        width:16.666666%;
     }

}

@media (max-width:1024px){
    .mnono{
        display: none;
    }
    .myes{
        display:flex;
    }

    .box1-link{
        text-decoration: none;
        background-color: #ffffff;
        color:#696969;
        height:150px;
       width:33.3333%;
    
    }
    .box2-body{
    width:100%;
    border:1px #f4fef4 solid;
    margin-left: 0px;
    margin-right:0px;
    background:#ffffff ;
}
.box3-group{
    margin-left:0;
    margin-right:0;
}

.box3-body{
    width:100%;
    /*border:1px #f4fef4 solid;*/
    margin-left: 0px;
    margin-right:0px;
    margin-bottom: 5px;
    
}

    .logotitlem{
        text-align:center;
        margin-right:0px;
        color:#A07149;
        font-size: 0.9em;
    
        font-family:Microsoft JhengHei;
        vertical-align:middle;
        margin-top:5px;
    }
}


@media (max-width:992px){
    .mnono{
        display: none;
    }

    .box1-link{
        text-decoration: none;
        background-color: #ffffff;
        color:#696969;
        height:150px;
        width:33.333333%;
    
    }
    

    .box2-body{
        width:100%;
        border:1px #f4fef4 solid;
        margin-left: 0px;
        margin-right:0px;
        background:#ffffff ;
    }

    
        .box3-group{
    margin-left:0;
    margin-right:0;
}
 .box3-body{
        width:100%;
        /*border:1px #f4fef4 solid;*/
        margin-left: 0px;
        margin-right:0px;
        /* width:570px;*/
        margin-bottom: 5px;
    }



    .logotitlem{
        text-align:center;
        margin-right:0px;
        color:#A07149;
        font-size: 0.9em;
    
        font-family:Microsoft JhengHei;
        vertical-align:middle;
        margin-top:5px;
    }
}


@media (max-width:768px){
    .mnono{
        display: none;
    }

    .box1-link{
        text-decoration: none;
        background-color: #ffffff;
        color:#696969;
        height:110px;
        width:33.333333%;
    
    }

    .box1-link svg{
        width: 50px;
        height: 50px;
    }

    .box2-body{
        width:100%;
        border:1px #f4fef4 solid;
        margin-left: 0px;
        margin-right:0px;
        background:#ffffff ;
    }

        .box3-group{
    margin-left:0;
    margin-right:0;
}
 .box3-body{
        width:100%;
        /*border:1px #f4fef4 solid;*/
        margin-left: 0px;
        margin-right:0px;
        margin-bottom: 5px;
        
    }


    .logotitlem{
        text-align:center;
        margin-right:0px;
        color:#A07149;
        font-size: 0.9em;
    
        font-family:Microsoft JhengHei;
        vertical-align:middle;
        margin-top:5px;
    }
}


@media (max-width:576px){
    .mnono{
        display: none;
    }
    
    .box1-body{
    
    padding-top:15px;
}

    .box1-link{
        text-decoration: none;
        background-color: #ffffff;
        color:#696969;
        height:105px;
        /*width:185px;*/
        width:33.333333%;

       
    
    }
       .box1-link svg{
        width: 50px;
        height: 50px;
         padding-top: 5px !important;
    }

    .box2-body{
        width:100%;
        border:1px #f4fef4 solid;
        margin-left: 0px;
        margin-right:0px;
        background:#ffffff ;
    }

    .box3-group{
    margin-left:0;
    margin-right:0;
}

        .box3-body{
        width:100%;
        /*border:1px #f4fef4 solid;*/
        margin-left: 0px;
        margin-right:0px;
        margin-bottom: 5px;
        
    }
    .box3-body legend{
        font-size: 22px !important;
    }
    #mdwsdv{
        font-size: 20px !important;
        margin-top:0px !important;
        margin-bottom:5px !important;
    }
        

}