@charset "utf-8";
div.editor {}
div.editor, div.editor p, div.editor dl, div.editor dd, div.editor ul, div.editor li {font-size: 1rem; font-weight: 400}
div.editor table {width: auto !important}
div.editor ul li {list-style: disc}
div.editor ol li {list-style: decimal}
div.editor img {padding-top: 1rem; padding-bottom: 1rem}
div.editor table th{padding: 2px;}

div.back {text-align: center}
div.back>a {
    background: #0099e5;
    border-radius: .25rem;
    color: #fff;
    padding: .5rem 1.5rem
}
div.back>a:hover {background: #0476a3;}

/*麵包屑*/
nav.crumbs>span {color: #0099e5;}
nav.crumbs>span::after {
    content: "\f105";
    font-weight: 900;
    color: #000;
    margin-left: .5rem;
    margin-right: .25rem;
}
nav.crumbs>span:last-of-type::after {content: none}

/*pagination*/
a.page-link {padding: .5rem .75rem}
li.page-item:first-of-type>a.page-link,
li.page-item:last-of-type>a.page-link {padding: .5rem}

/*title*/
/*title with line*/
div.titleLine h2 {
   border-bottom: 1px #000 solid;
}


/*title without line*/
div.titleBLine {border-bottom: 1px dashed #ddd;}
div.titleBLine>span{color:#0069aa}
div.title{
    text-align: center;
}
div.title>h1{
    display: inline-block;
    color: #0069aa;
    text-align: center;
    position: relative;
}
div.title>h1::before{
    content: '';
    position: absolute;
    left: -80px;
    top: 45%;
    width: 50px;
    height: 2px;
    background-color: #0069aaa1;
}
div.title>h1::after{
    content: '';
    position: absolute;
    right: -80px;
    top: 45%;
    width: 50px;
    height: 2px;
    background-color: #0069aaa1;
 }

 @media screen and (max-width: 640px) {
    div.title>h1::before{
        content: '';
        position: absolute;
        left: -50px;
        top: 45%;
        width: 35px;
        height: 2px;
        background-color: #0069aaa1;
    }
    div.title>h1::after{
        content: '';
        position: absolute;
        right: -50px;
        top: 45%;
        width: 35px;
        height: 2px;
        background-color: #0069aaa1;
     }
  }

div.title>h1>img{width:40px !important;padding-right: 5px;padding-bottom: 5px}

/*item title*/
div.pTitle {
    border-left: 5px solid #0069aa;
    margin-bottom: 1.5rem;
    padding-left: .75rem;
    
}

div.pTitle>h2 {
    font-size: 1.5rem;
    color:#0069aa
}

div.sponsors {background: none}
div.sponsors>h2 {text-align: center;}

h3.pTitle {
    background: #862069;
    color: #fff;
    margin-bottom: 0;
    padding: .5rem;
}

h4.pTitle {
    color: #862069;
    margin-bottom: 0;
    padding: .5rem;
}
h4.pTitle::before {
    content: "\f45c";
    font-weight: 900;
    margin-right: .5rem;
}

/*list*/
dl.List, dl.listImg, dl.listCube, div.listPic {margin-bottom: 0;}
/*一般列表*/
dl.List>dd {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 1.25rem;
    padding-bottom: 1.25rem;
}
dl.List>dd>span {color: #0069aa;}
dl.List>dd:last-of-type {border-bottom: none;}
dl.List>dd>p {
    color: #666;
    margin-bottom: 0;
    /*單行文字限制*/
    overflow:hidden;
    text-overflow : ellipsis;
    white-space : nowrap;
}
dl.List>dd>p>a {
    font-size: 1.15rem;
    font-weight: 500;
}

/*圖片列表*/
dl.listImg>dd {text-align: center;}
dl.listImg>dd>p {
    font-size: 1rem;
    font-weight: 500;
    text-align: left;
}
dl.listImg>dd>figure {
    width: 100%;
    max-width: 248px;
    /*        height: 100vh;*/
    max-height: 248px;
    overflow: hidden;
    margin-bottom: .25rem;
    position: relative;
    border: 1px #ddd solid;
}
dl.listImg>dd>figure>figcaption {
    display: none;
    width: 100%;
    background: rgba(0, 146, 204, 0.75);
    position: absolute;
}
dl.listImg>dd>figure>figcaption>p {
    width: 100%;
    height: 100vh;
    font-size: 1.25rem;
    font-weight: 400;
    color: #fff;
    text-align: center;
    margin-bottom: 0;
}
dl.listImg>dd>figure:hover>figcaption {display: block;}

/*方塊帶文字列表*/
dl.listCube>dd>figure {
    background: #ccc;
    border-radius: .35rem;
    font-size: 1.35rem;
    padding: 1rem;
}
dl.listCube>dd>figure:hover {background: #e4ccb3}

/*列表帶圖片*/
div.listPic>div {
    border: 1px solid #ccc;
    padding: .5rem;
}
div.listPic>div>div:nth-of-type(2)>p {margin-bottom: .5rem;}
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(1) {
    color: #ff9012;
}
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(2) {
    font-size: 1.25rem;
    margin-bottom: 0;
}
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(2),
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(3) {
    /*單行文字限制*/
    overflow:hidden;
    text-overflow : ellipsis;
    white-space : nowrap;
}
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(4) {
    text-align: right;
}
div.listPic>div>div:nth-of-type(2)>p:nth-of-type(4)>a {color: #ff9012;}

/*product detail*/
.nav-pills {border-bottom: 1px solid #0099e5}
.nav-pills .nav-link {
    background: #ccc;
    border-radius: 0;
    color: #7c7c7c;
    padding: .5rem 1.75rem .25rem
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    background: #0099e5;
}

/*aside nav*/
nav.sideNav {margin-bottom: 1.5rem;}
nav.sideNav button.navbar-toggler {width:100%; border: 1px solid #0099e5  !important; padding-top: .75rem; padding-bottom: .75rem;}
nav.sideNav button.navbar-toggler:hover {background: none; border-color: #0099e5  !important}
nav.sideNav button.navbar-toggler>i {color: #0099e5 }
nav.sideNav button.navbar-toggler>i::before,
nav.sideNav button.navbar-toggler>i::after {margin: 0}
nav.sideNav button.navbar-toggler:hover>i {color: #0099e5 }
.navbar-light ul.sideNav {
    width: 100%;
    background: #ddd;
    flex-direction: column !important;
}
.navbar-light ul.sideNav .nav-item {
    text-align: left;
    border-bottom: 1px #fff solid;
    padding: 0
}
.navbar-light ul.sideNav .nav-item .nav-link {
    border-bottom: none;
    font-size: 1.15rem;
    color: #221e1f;
    letter-spacing: 0;
    padding: 1rem;
    line-height: 1.5rem;
}
.navbar-light ul.sideNav .nav-item .nav-link:hover,
.navbar-light ul.sideNav .nav-item[active] .nav-link {background: #0069aa !important;
    border-bottom: none;
    color: #fff;
}

/*links*/
div.item img{border: 1px solid #ccc;}
div.item img:hover{border: 1px solid #0069aa;}
div.item p{text-align: center;padding-top: .5rem}

/*contact*/
div.contactIntro {text-align: center; margin-bottom: 3rem;}
dl.contact sup{color:red}
/*addInf icon*/
dl.addContact>dd>span{color:#0099e5}

/*驗證碼*/
dd.Code>img{height: 45px !important;width: auto !important}


/*map*/
div.map>iframe {width: 100%; height: 40vh !important;}