﻿/*body {
    min-width: 320px;
    width: auto !important;
}*/


header#menu20170313 {
    position: sticky;
    height: auto;
    padding-left: 1em !important;
    padding-right: 1em !important;
    min-width: 320px;
}

header#menu20170313 .change-align {
    display: flex;
    justify-content: space-between;
    margin:0px !important;
    padding-top:0.60em;
    padding-bottom:0.60em;
}

header#menu20170313 .change-align #shortcut{
    min-width:320px;
    
}

header#menu20170313 .test1{
    height:73px;
    background-color:inherit;
}

header#menu20170313 .test{
    display: flex;
    justify-content: space-between;
    height:auto;
    /*border: 0.1rem solid #ff6a00;*/
    background-color:inherit;
}

header#menu20170313 .test h1.change-h1-diplay a {
    margin-left:0px !important;
}

header#menu20170313 .test h1.change-h1-diplay a img{
    min-width:240px;
}

/*https://stackoverflow.com/questions/42586729/bootstrap-4-change-hamburger-toggler-color*/
.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,104,53, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.navbar-toggler.custom-toggler {
    border-color: rgb(30,161,142);
    z-index:550;
}



#ContentPlaceHolder1_form1 {
    /*border: 0.1rem solid #32a1ce;*/
    min-width:320px;
}

.siteSearch i {
    color: #006835;
}

.change-align .siteSearch i {
    font-size: 2em;
}

.test .siteSearch .input-group{
    height:100%;
}

.test .siteSearch i {
    font-size: 1.6em;
    padding-right: 10px;
}

@media screen and (min-width: 1025px) {
    header #menu20170313 {
        height: 133px; /*配合 menu_block >> 133  */
    }

    .navbar-toggler.custom-toggler {
        border-color: rgb(30,161,142);
    }
}

#navbartoggler {
    display: flex !important;
}

@media screen and (max-width: 1024px) {

    .navbar-toggler.custom-toggler {
        display: inline-block !important;
    }    
}

@media screen and (max-width: 768px) {

    header#menu20170313 {
        padding-left: 0.8em !important;
        padding-right: 0.8em !important;
    }

    header#menu20170313 .change-align {
        padding-top: 0.40em;
        padding-bottom: 0.40em;
    }

    /*header#menu20170313 .bar {
        right: 0.8em;
        top: 0.8em;
    }*/
}

@media screen and (max-width: 700px) {
    .siteSearch input {
        display: none !important;
    }
}


@media screen and (max-width: 400px) {

    header#menu20170313 .test h1.change-h1-diplay a {
        width: 150px;
        overflow: hidden;
        vertical-align: top;
    }

    #headSearch button {
        display: none !important;
    }
}

#searchmodal button{
    font-size:1rem;
}

#searchmodal span{
    color:red;
}

@media screen and (min-width: 401px) {
    .test .siteSearch button {
        display: none !important;
    }
    .test .siteSearch a {
        display: none !important;
    }
}

.input-group.input-group-unstyled input.form-control {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.input-group-unstyled .input-group-addon {
    border-radius: 4px;
    border: solid 1px;
    border-color:transparent;
    background-color: transparent;
    outline:none;
}

    .input-group-unstyled .input-group-addon:hover {
        border-color: #037F3E; /* for input */
    }

.fancybox-wrap.fancybox-desktop.fancybox-opened {
    z-index: 9982;
}

.fancybox-overlay.fancybox-overlay-fixed {
    z-index: 9981; /* for header:9980*/
}

