/*

Table of Contents

- Import Fonts
- General
  - General Styles
  - Selection
  - Typography
  - Buttons
  - Modal
- Site Navigation
  - Menu
- Page Elements
  - Header
  - Footer
- Helper Classes
  - Margin

*/

/* ------------------------------------------------------------------
Import Fonts
------------------------------------------------------------------ */

/*@import url('https://fonts.googleapis.com/css?family=Nunito|Open+Sans:700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans');

@font-face {
    font-family: Moon;
    src: local(../font/Moon Bold.otf);
    font-weight: bold;
}
*/

/* ------------------------------------------------------------------
General Styles
------------------------------------------------------------------ */

body {
    width: 100%;
    height: auto;
    overflow-x: hidden;
    -ms-overflow-style: scrollbar;
    font-family: Montserrat, PingFangTC-Regular, Roboto, Noto Sans TC, PingFang, LiHei Pro, 微軟正黑體, Microsoft JhengHei, sans-serif;
    font-size: 1.6rem;
    letter-spacing: 0.01em;
    line-height: 1.7;
    color: #000;
    transition: background-color .5s;
}

    body.modal-open {
        overflow: hidden;
        position: fixed;
    }

img {
    max-width: 100%;
    height: auto;
}

iframe {
    border: 0;
}

body,
input,
textarea,
select,
button {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: rgba(0, 0, 0, 0.6);
}

    a:hover,
    a:focus {
        text-decoration: none;
        color: rgba(9, 43, 156, 0.753);
        outline: 0;
    }

    a:active {
        color: #af8346;
    }


/*Background color*/

/*Point-link Color*/

.a-red {
    color: #ed1c24;
}

.a-brown {
    color: #af8246;
}

.a-red:hover {
    color: rgba(150, 29, 60, 0.5);
}

.a-brown:hover {
    text-decoration: none;
    color: rgba(175, 130, 70, 0.5);
    outline: 0;
}

ul,
li {
    list-style: none;
    margin: 0;
    padding: 0;
}

:focus {
    outline: none;
}

/* ------------------------------------------------------------------
Selection
------------------------------------------------------------------ */

::-moz-selection {
    background: #000;
    color: #fff;
}

::-webkit-selection {
    background: #000;
    color: #fff;
}

::selection {
    background: #000;
    color: #fff;
}

/* ------------------------------------------------------------------
Typography
------------------------------------------------------------------- */



    .text-light h1,
    .text-light h2,
    .text-light h3,
    .text-light h4,
    .text-light h5,
    .text-light h6,
    .text-light .h1,
    .text-light .h2,
    .text-light .h3,
    .text-light .h4,
    .text-light .h5,
    .text-light .h6 {
        color: #fff;
    }

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    line-height: 1.4;
    font-weight: 700;
    color: #111;
}

h1,
.h1 {
    font-size: 27px;
}
.ManualH1 {
    font-size: 24px;
}
h2,
.h2 {
    font-size: 23px;
}
.ManualH2 {
    font-size: 16px;
}

h3,
.h3 {
    font-size: 18px;
}

h4,
.h4 {
    font-size: 16px;
}

h5,
.h5 {
    font-size: 14px;
}

h6,
.h6 {
    font-size: 12px;
}

.text-xs {
    font-size: 12px;
}

/*
p,
ol,
ul,
blockquote {
    margin: 0 0 10px;
}
*/

blockquote {
    border-color: #f7f7f7;
}

    blockquote.serif-quote {
        border: 0;
        padding-left: 0;
        padding-right: 0;
    }


/* ------------------------------------------------------------------
Transition elsements
------------------------------------------------------------------- */

a,
.btn {
    -webkit-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -moz-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -o-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
}

/* ------------------------------------------------------------------
Reset box-shadow
------------------------------------------------------------------- */

.btn,
.well,
.panel,
.progress,
.form-control,
.form-control:hover,
.form-control:focus {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
}

/* ------------------------------------------------------------------
Reset border-radius
------------------------------------------------------------------- */

.well,
.label,
.alert,
.modal-content {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
}

/* ------------------------------------------------------------------
Forms
------------------------------------------------------------------- */

.form-row {
    height: auto;
    overflow: hidden;
}

p.form-row {
    height: auto;
    overflow: hidden;
}

.form-control {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    height: 44px;
    padding: 8px 10px;
    border: 1px solid #e4e4e4;
    box-sizing: border-box;
    border-radius: 0;
    font-size: 13px;
    line-height: 18px;
    background: transparent;
    box-shadow: none;
    -webkit-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -moz-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -o-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
}

    .form-control:focus {
        border-color: #333;
    }

/* Form sizes */

.input-lg,
.form-horizontal .form-group-lg .form-control {
    height: 44px;
    font-size: 16px;
}

.input-sm,
.form-horizontal .form-group-sm .form-control {
    height: 30px;
    font-size: 14px;
}

label {
    display: block;
    max-width: 100%;
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 400;
}

select::-ms-expand {
    display: none;
}

select {
    /* appearance: none; */
    -moz-appearance: none;
    -webkit-appearance: none;
}

option::-ms-expand {
    display: none;
}

option {
    -moz-appearance: none;
    /* Firefox */
    -webkit-appearance: none;
    /* Safari 和 Chrome */
    /* appearance: none; */
}

    /* --背景色字体颜色--*/

    option:hover {
        color: #fff;
        background-color: #1E90FF;
    }

textarea {
    resize: none;
}

/* ------------------------------------------------------------------
Buttons
------------------------------------------------------------------- */

.btn {
    font-size: 14px;
    padding: 15px 30px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}

    .btn.focus,
    .btn:focus,
    .btn.active.focus,
    .btn.active:focus,
    .btn:active.focus,
    .btn:active:focus {
        background: none;
        outline: 0;
    }

    /* Button types */

    .btn.btn-round {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px;
    }

    .btn.btn-circle {
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        -o-border-radius: 30px;
        border-radius: 30px;
    }

    /* Button colors */

    .btn.btn-red {
        background: #961d3c;
        color: #fff;
    }

        .btn.btn-red:hover {
            background: rgba(150, 29, 59, 0.9);
        }

    /*Black*/

    .btn.btn-b {
        background: #000;
        color: #fff;
    }

        .btn.btn-b:hover,
        .btn.btn-b:focus {
            background: rgba(0, 0, 0, 0.8);
            color: #fff;
        }



.btn-fb {
    background: #32528B;
    color: #fff;
}

.btn-google {
    background: #DC544C;
    color: #fff;
}

.btn-line {
    background: #1EBD22;
    color: #fff;
}

.btn-regnize-ok {
    background: #ccc;
    color: #888;
}

    .btn-regnize-ok:hover {
        cursor: inherit;
        background: #ccc;
        color: #888;
        /* -webkit-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000); */
        /* -moz-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -o-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000); */
        /* transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000); */
    }

/* Button sizes */

.btn.btn-xl {
    width: 400px;
    height: 44px;
    /*    padding: 10px 80px;*/
    font-size: 16px;
    line-height: 15px;
}

.btn.btn-lg {
    width: 240px;
    height: 44px;
    /*    padding: 10px 80px;*/
    font-size: 16px;
    line-height: 15px;
}

.btn.btn-sm {
    width: 190px;
    height: 44px;
    /*padding: 10px 40px;*/
    font-size: 16px;
    line-height: 15px;
}

.btn.btn-xs {
    width: 120px;
    height: 30px;
    /*    padding: 15px 50px;*/
    font-size: 12px;
    line-height: 0px;
}

.btn-sm-left {
    float: left;
    /* margin-left: -10px;*/
}

.btn-sm-right {
    float: right;
    margin-right: -10px;
}

.btn-xxs {
    padding: 8px;
    border: 1px solid #ddd;
    background-color: #eee;
}

.btn i {
    margin-left: 20px;
}

/* -------------------------------------------------------------------
Responsive Media Querries
------------------------------------------------------------------- */

@media (max-width: 1400px) {
}

@media (max-width: 1024px) {
}

/*平版橫幅*/

@media (min-width: 993px) and (max-width:1200px) {
}

/*平版直拿*/

@media (min-width: 768px) and (max-width: 992px) {
}

@media (max-width: 991px) {
    .btn-sm-left {
        margin: 5px auto;
        margin-left: 0px;
    }

    .btn-sm-right {
        margin: 5px auto;
        margin-right: 0px;
    }
}

/*手機*/

@media (min-width: 501px) and (max-width: 767px) {
}

/*手機iphone*/

@media (max-width: 500px) {
    /* Button sizes */
    .btn.btn-xl {
        width: 100%;
    }

    .btn.btn-lg {
        width: 100%;
    }

    .btn.btn-sm {
        width: 100%;
        margin: 10px auto;
    }

    .btn.btn-xs {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
Wrapper
------------------------------------------------------------------- */

#wrap {
    width: 1170px;
    height: auto;
    overflow: hidden;
    margin: 50px auto;
    /*border: 1px solid #f00*/
    ;
}

@media (max-width: 1024px) {
    #wrap {
        width: 100%;
    }
}

/* ------------------------------------------------------------------
Pagination
------------------------------------------------------------------- */

.pagination > li {
    display: inline-block;
}

    .pagination > li > a,
    .pagination > li > span {
        background: #f7f7f7;
        border: 0;
        height: 32px;
        width: 32px;
        padding: 0;
        margin: 0;
        text-align: center;
        line-height: 32px;
        font-size: 10px;
        color: #111;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -o-border-radius: 2px;
        border-radius: 2px;
    }

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background: #111;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background: #f0f0f0;
    color: #111;
}

/* ------------------------------------------------------------------
Tabs and Accordion
------------------------------------------------------------------- */

.nav-tabs {
    border-color: #eee;
}

    .nav-tabs > li > a {
        font-size: 12px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -o-border-radius: 2px;
        border-radius: 2px;
    }

    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        border: 1px solid #eee;
        border-bottom-color: transparent;
    }

    .nav-tabs > li > a:hover,
    .nav-tabs > li > a:focus {
        background: #eee;
    }

.tab-content {
    border: 1px solid #eee;
    border-top: 0;
    padding: 15px;
}

    .tab-content :last-child {
        margin-bottom: 0;
    }

/* Accordion */

.panel-group {
    border: 1px solid #eee;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
}

    .panel-group .panel {
        border-radius: 0;
    }

.panel {
    border: 0;
    border-bottom: 1px solid #eee;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-color: #eee;
}

.panel-heading {
    padding: 15px 20px;
}

.panel-default > .panel-heading {
    background: transparent;
    border-color: #eee;
}

.panel-heading a {
    position: relative;
    display: block;
}

    .panel-heading a:after {
        position: absolute;
        content: "\f106";
        top: 50%;
        right: 0px;
        margin-top: -7px;
        font-family: "FontAwesome";
        font-size: 14px;
        line-height: 1;
    }

    .panel-heading a.collapsed:after {
        content: "\f107";
    }

.panel-title {
    font-size: 12px;
}

.panel-group .panel + .panel {
    border-top: 0;
    margin-top: 0;
}

/* ------------------------------------------------------------------
Modal
------------------------------------------------------------------- */

.popup-item {
    cursor: pointer;
}

.modal-dialog {
    margin: 80px auto;
}

.modal-body {
    padding: 20px 60px;
}

.modal-backdrop {
    height: auto;
    overflow: hidden;
}

/* ------------------------------------------------------------------
Side Bar Style
------------------------------------------------------------------- */

ul.sidebar-menu li {
    /*height: 60px;*/
    padding: 25px 0px 25px 20px;
    /*border: 1px solid #000;*/
}

.sidebar-menu li:hover {
    background-color: #961D3C;
    cursor: pointer;
}

.active,
.sidebar-item:focus {
    background-color: #961D3C;
    color: #fff;
}

#sidebar-left {
    margin: 0;
}

/* ------------------------------------------------------------------
Helper Classes
------------------------------------------------------------------ */

/* Float
============================================= */

.f-left {
    float: left !important;
}

.f-right {
    float: right !important;
}

.clear {
    clear: both;
}



/* Letter Spacing
============================================= */

.ls-minus-1 {
    letter-spacing: -1px;
}

.ls-minus-2 {
    letter-spacing: -2px;
}

.ls-plus-1 {
    letter-spacing: 1px;
}

.ls-plus-2 {
    letter-spacing: 2px;
}

.ls-plus-3 {
    letter-spacing: 3px;
}

.ls-plus-4 {
    letter-spacing: 4px;
}

.ls-plus-5 {
    letter-spacing: 5px;
}

.ls-plus-6 {
    letter-spacing: 6px;
}


@media (min-width: 768px) {

}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {

}





/* -------------------------------------------------------------------
Page Style
------------------------------------------------------------------- */

.wrap-page {
    margin: 45px auto 250px auto;
}


/* --------------------------------------------------------
Main
-------------------------------------------------------- */
.wrap-member {
    width: 784px;
    height: auto;
    overflow: auto;
}
.Manual-wrap-member {
    width: 1098px;
    height: auto;
    overflow: auto;
}
@media only screen and (max-width: 991px) {
    .wrap-member {
        width: 80%;
    }
}
@media only screen and (max-width: 550px) {
    .wrap-member {
        width: 98%;
    }
}


.bggray{
    background-color:#fff; 
}
.myshadow{
    box-shadow: 3px 3px 10px rgba(0,0,0,.2);
}
.mainbox{
    text-align: center;
    margin:15px 0;
    background-color: #fff;
}
.titlelogo {
    padding:0px 10px 0px 10px;
}
.titlelogo img{
    width:150px;
}
.title{
    font-size:16px;
    color:#777;
    letter-spacing: 2px;
}
.ctciitem {
    width:432px;
    margin:4px auto 0 auto;
}
.ctciitem input{
    display: inline-block;
    margin:2px 0 3px 0;
    border-radius: 3px;
}
@media only screen and (max-width: 767px) {
    .ctciitem {
    width:85%;
}
}

.verify-img{

    line-height: 42px;
}
.verify-img button{
    font-size:12px;
    border:none;
    background-color: rgba(0,0,0,0);
    color:#777;
}
.rememberme{
    text-align: left;
    padding:0;
    color:#777;
}
.mainbtn a{
    display: inline-block;
    width: 100%;
    color:#555;
    font-size:15px;
    font-weight: 400;
    padding:2px;
    letter-spacing: 2px;
    border:1px solid #ccc;
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(bottom, #eeeeee 0%, #ffffff 50%); /* FF3.6-15 */
    background: -webkit-linear-gradient(bottom, #eeeeee 0%,#ffffff 50%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to top, #eeeeee 0%,#ffffff 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eee',GradientType=0 ); /* IE6-9 */
}
.mainbtn a:hover{
    border:1px solid #999;
}
.mainbtn a:active{
    background: #ddd; /* Old browsers */
    background: -moz-linear-gradient(bottom, #fff 0%, #eee 40%); /* FF3.6-15 */
    background: -webkit-linear-gradient(bottom, #fff 0%,#eee 40%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to top, #fff 0%,#eee 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#ddd',GradientType=0 ); /* IE6-9 */
}
.mainbtn2{
    padding:15px 0;
}
.endarea{
    padding:2px 0 15px 0;
}
@media only screen and (max-width: 550px) {
    .endarea{
    padding-bottom: 15px;
}
}

.announce{
    margin:5px 18% 10px 18%;
    font-size: 14px;
    font-weight: 400;
    color:#333;
}
.announce a{
    color:#f15a24;
}
.announce a:hover{
    color:#fca300 !important;
}
@media only screen and (max-width: 620px) {
    .announce{
        margin:5px 30px 20px 30px;
    }
}
.password-announce{
    padding:10px 20px;
    margin:0 10% 20px 10%;
    font-size: 14px;
    font-weight: 400;
    color:#333;
    background-color: #f9ede4;
    border-radius: 10px;
    line-height: 20px;
}

.h-30{
    height: 30px;
}


/* --------------------------------------------------------
Header
--------------------------------------------------------- */
.hdorange{
    background-color: #fca300;
    height: 30px;
}
.hdmenu{
    text-align: center;
    font-size:14px;
    border-bottom: 1px solid #ccc;
    color:#555;
    padding:5px 10px 0 10px;
}
.hdmenu ul li{
    display: inline-block;
    padding:2px 0 5px 0;
}
.hdmenu ul li a{

}
.hdmenu ul li a:hover{
    color:#999;
}
.hdmenu ul li span{
    color:#aaa;
}
.hdmenu ul li form{
    display: inline-block;
}
.hdmenu ul li form select{
    line-height: 24px;
    padding:0 10px;
    border: none;
    border-radius: 1px;
    background-color: #ddd;
}
.hdmenu ul li form select option{
    text-align: center;
}




/* --------------------------------------------------------
Login
--------------------------------------------------------- */
.loginhead{
    margin:10px 0 -10px 0;
    padding:5px 10px;
    background-color:#555;
    text-align: center;
    font-size:18px;
    color:#fbb03b;
}
.lost_password a{
    color:#777;
}
.lost_password a:hover, .lost_password a:active, ..lost_password a:focus{
    color:#999;
}
.inputiconseries input{
    padding:0 0 0 36px;
    height: 30px;
}
.inputicon{
    display: block;
    position: absolute;
    padding:16px 0 0 14px ;
}
.inputicon{
    font-size:14px;
    color:#333;
}
.lgoragne{
    background-color: #fff;
    padding:0px 15px 0px 15px;
}
.lgoragne p{
    text-align: center;
    font-size:14px;
    color:#fff;
    margin:5px;
}
.lgregis{
    width:240px;
    margin:0 auto;
    font-size:13px;
}
.lgregis a:hover{
    color:#aaa;
}
.lgtext{
    text-align: left;
    padding:5px 5px ;
    margin:0 20px;
    border-top:1px solid #eee;
}
.lgtext h2{
    font-size:14px;
    font-weight: 500;
    margin: 10px 0 0px 0;
}
.lgtext p{
    font-size:12px;
    font-weight: 500;
    color:#949393;
    line-height: 18px;
}
.lgicon1{
    color:#29abe2;
}
.lgicon2{
    color:#ffbe2c;
}
.lgicon3{
    color:#39b54a;
}

.verify6{
    padding:0;
}


/* --------------------------------------------------------
密碼
--------------------------------------------------------- */
.inputiconseries-2 input{
    padding:0 0 0 70px;
}
.inputiconseries-3 input{
    padding:0 0 0 97px;
}
.inputiconseries-4 input{
    padding:0 0 0 110px;
}
.inputicon{
    display: block;
    position: absolute;
    padding:6px 0 0 12px ;
}
.inputicon{
    font-size:14px;
    color:#333;
}


/* --------------------------------------------------------
使用者欄位
--------------------------------------------------------- */
.ctciuserbox{
    padding: 10px 20px 20px 4px;
    text-align: left;
}
.ctciuser{
    text-align: left;
    color:#333;
    font-size:14px;
    font-weight: 400; 
    display: inline-block;
}
.ctciuserid{
    color:#555;
    font-size:14px;
    font-weight: 400; 
    padding:0 0 0 20px;
    display: inline-block;
}
.userform{
    text-align: left;
    color:#333;
    font-size:14px;
    font-weight: 400;
    margin:0;
    padding:0 35px 20px 35px ;
}
.userform input{
    border-radius: 3px;
    height: 30px;
}
.userinput{
    margin-bottom: 8px;
    text-align: left;
}
.wronginfo{
    color:#ed1c24;
    font-size:14px;
    font-weight: 400;
    text-align: right;
}
.userinputtltle{
    display: inline-block;
    padding:0 0 0 4px;
    text-align: left;
    font-size: 14px;
    font-weight: 400;
}
.userinput textarea{
    width: 100%;
    height: 6em;
    border:1px #ccc solid;
    border-radius: 3px;
    padding:10px;
    height: 70px;
}
.subtitle{
    font-size:18px;
    font-weight: 600;
    color:#333;
    padding:8px 15px;
    margin:15px 20px 20px 20px;
    border-top:1px solid #ddd;
    border-bottom:1px solid #ddd;
    text-align: left;
    letter-spacing: 1px;
}
.infomenu ul{
    font-size:14px;
    margin:15px 10px 25px 10px;
}

.infomenu ul li{
    display: inline-block;
    margin:0px 4px;
}
@media only screen and (max-width: 600px) {
    .infomenu ul li{
        display: block;
        margin:8px 40px;
}
}

.infoalink{
    color:#333;
    display: block;
    padding:4px 25px;
    margin:0 10px;
    background-color:#F9F4EF;
    border-radius: 3px;
}
.infoalink:hover, .infoalink:focus, .infoalink:active{
    color:#111;
    -webkit-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -moz-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -o-transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    transition: all 0.1s cubic-bezier(0.300, 0.100, 0.580, 1.000);
}
.hddelete a{
    display: block;
    background-color:#e65a25;
    padding:4px 25px;
    margin:0 10px;
    color:#fff;
    border-radius: 3px;
}
.hddelete a:hover{
    background-color:#d8421a;
    color:#fff !important;
}


/* --------------------------------------------------------
隱私權政策
--------------------------------------------------------- */
.terms {
    margin:5px 18% 20px 18%;
    font-size: 13px;
    font-weight: 400;
    color:#777;
    text-align: left;
    line-height: 22px;
}
.terms h2{
    font-size: 17px;
    font-weight: 400;
    color:#333;
    text-align: left;
    border-bottom: 1px solid #ccc; 
    padding: 10px 0 10px 0;
}


/* --------------------------------------------------------
RWD
--------------------------------------------------------- */


@media only screen and (max-width: 1450px) {}

@media only screen and (max-width: 1400px) {}

@media only screen and (min-width: 1200px) {}

@media only screen and (max-width: 1199px) {}

@media only screen and (max-width: 1000px) {}

@media only screen and (min-width: 992px) {}

@media only screen and (max-width: 991px) {}

@media only screen and (min-width: 768px) {}

@media only screen and (max-width: 767px) {}

@media only screen and (max-width: 620px) {}

@media only screen and (max-width: 550px) {}

@media only screen and (max-width: 440px) {}

@media only screen and (max-width: 420px) {}