/* CSS Document */
.back_index{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
}
#ds1{
    background: url("../img/ds1/bg.jpg");
}
#ds4{
    background: url("../img/ds4/bg.jpg?a0617");
}
#ds5{
    background: url("../img/ds5/bg.jpg?a0617");
}
#ds6{
    background: url("../img/ds6/bg.jpg?a0617");
}
nav:after{
    content: '';
    height: 5px;
    position: absolute;
    width: 100%;
    background: transparent;
    top: -5px;
}
.form_con{
    display: flex;
    width: 70%;
    margin: 0 0 0 15%;
    align-items: flex-start;
}
.form_con #map{
    height: 538px;
    display: flex;
    margin: 0 0 0 5%;
}
#ds3 .uk-flex-middle{
    width: 70%;
    display: block;
    margin: 0 auto;
}
#main .uk-modal-header {
    background: #DFC27F;
}
#main .uk-modal-body {
    font-weight: bold;
}

#main .uk-modal-title {
    color: #ffffff;
    font-weight: bold;
}

#main .uk-close {
    color: #dfc27f;
    background: #FFFF;
    padding: 8px;
}
nav h1{
    margin:0;
}
a.logo {
    width: 27.5%;
    margin: 0 5% 0 3%;
    display:inline-block
}

nav {
    position: fixed;
    z-index: 9;
    bottom: 5%;
    width: 5%;
    display: flex;
    align-items: center;
    background: transparent;
    right: 0;
    flex-direction: column;
}
nav svg.uk-svg {
    color: #DFC27F;
}
nav ul li {
    text-align: revert-layer;
    display: inline-block;
    width: 100%;
    position: relative;
    float: left;
    padding: 0;
}
nav ul li + li {
    margin: 0 0 5% 0;
}
nav ul.menu {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

#index_con h1 {
    margin: 0;
}

#contact {
    background: #043527;
}

.btn_list {
    margin: 5% 0 0 3%;
}

.slideshow_con .uk-dotnav>.uk-active>* {
    background-color: #4F5F73;
}

#ds3 {
    background: url("../img/ds3/pc/bg.jpg");
    background-size: cover;
}

.slides1 {
    width: 60%;
    display: inline-block;
}

#ds3 .tit1 {
    width: 40%;
    float: right;
}
#ds3 .tit1 img{
    width: 100%;
}
#ds3 .tit2 {
    width: 40%;
    float: left;
}

.pic_tit {
    position: absolute;
    right: 1%;
    bottom: 3%;
    color: #E0E3E5;
    z-index: 1;
    font-family: "Microsoft JhengHei";
    letter-spacing: 0.5px;
    text-shadow: 1px 1px 5px rgba(0,0,0,1);
    font-size: 12px;
}

section img {
    width: 100%;
}

.slideshow_con {
}

#main {
    display: block;
    margin: 0 auto;
    background: #040830;
}

body {
    background: #353535;
    font-size: 16px;
    padding-bottom: 0;
    font-family: 'Microsoft JhengHei';
}

@media (max-width: 960px) {
    nav ul li + li {
        margin: 0;
    }
    nav ul li {
        text-align: revert-layer;
        display: inline-block;
        width: 18%;
        position: relative;
        float: left;
        padding: 0 5%;
    }
    nav ul.menu {
        width: 62%;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: flex-end;
        flex-direction: row;
    }
    nav:after{
        content: '';
        height: 5px;
        position: absolute;
        width: 100%;
        background: #DFC27F;
        top: -5px;
    }
    nav {
        position: fixed;
        z-index: 9;
        bottom: 0;
        width: 100%;
        display: flex;
        align-items: center;
        background: #053527;
        flex-direction: row;
    }
    .form_con {
        display: inline-block;
        width: 100%;
        margin: 0 0 0 0;
    }
    .form_con #map{
        height: 50vw;
        display: block;
        width: 84%;
        margin: 0 auto;
    }
    #ds3 {
        background: url("../img/ds3/bg.jpg");
        background-size: cover;
    }
    .slides1 {
        width: 49%;
        display: inline-block;
        margin: 6% 0 0 0;
    }
    #ds3 .tit1 {
        width: 51%;
        float: right;
    }

    #ds3 .tit2 {
        width: 51%;
        float: left;
    }
    nav {
        width: 100%;
    }

    .pic_tit {
        bottom: 3.5%;
    }

    #main {
        margin-bottom: 13%;
    }
}

@media (max-width: 690px) {
    .btn_item svg {
        width: 6px;
        height: auto;
    }

    .uk-icon.uk-slidenav {
        padding: 3px 5px;
    }

    #main {
        width: 100%;
    }
}
