/*/*/**/*/*/#head {
}
body { background-color: #ebe4d2; }
#list_1 { background-color: #ebe4d2; }
#list_2 { background-color: #ffdb6f; }
#list_3 { background-color: #000000; }
#list_9 .bg { background-image: url(../images/item-estate-5.jpg); background-size: cover; opacity: 0.25; }
/* ////////////////////////////////////// */

.myswiper2 h3{
    color: #ff0000;}
.myswiper2 .h4{
    color: #353535;}
@media (min-width: 576px) {
.myswiper2 img {
        width: 25%;
        margin-left: 15px;
        margin-top: -20px;}
}
@media (max-width: 575px) {
.myswiper2 img {
        width: 46%;}
}
.book_list p{
    font-size: 17px;
    color: #000000;}

.swiper-slide p:nth-of-type(2){
    font-size: 15px;
    line-height: 35px;}



.title_bg { background-image: url('../images/t_bg.png'); background-repeat: no-repeat; background-size: contain; padding: 0px 16px 0px 19px; }
.tk { color: #fa321d; border-top: 1px solid #cacaca; }
.card-body a:hover { color: #FBCE12; }
.tk_allnum, .tk_allnum .fas { font-size: 2em; position: absolute; color: #fff; right: 27px; text-shadow: 0 1.5px 2px #3A3A3A, 1.5px 0 2px #3A3A3A, -1px 0 2px #3A3A3A, 0 -1px 2px #3A3A3A; padding-top: 3px; }
.tk_num { font-size: 2.3em; font-family: Century Gothic; font-weight: normal; }
.btn_tk { font-size: 1.2em; background-color: #f68d11; color: #FFFFFF; border-radius: 8px; padding: 5px 10px; margin-left: 6px; }
.song_title { color: #ffffff; text-align: center; background-image: url('../images/t_bg.png'); background-repeat: no-repeat; background-size: contain; background-position: center center; padding-top: 14px; padding-left: 26px; padding-right: 26px; }
#list_1 .card-body .btn { margin-top: -11px; }
.svg_bg { position: absolute; bottom: -25%; left: 50%; right: 50%; transform: translateX(-50%) scaleX(1.8) scaleY(1.8); z-index: 0; }
.svg_bg path { fill: #ffffff; }
.e_t { font-size: 1.4rem; color: #3576b4; }
.e_d { font-size: 1.3rem; color: #fd4f0f; font-weight: normal; }
.modal-dialog h5 { /*border-top: 1px solid #949494;*/ padding-top: 1rem; }
.event_bg { background-color: #ffffff; }
.event_bg .card {
    background-color: #eaeaea; }
.event_bg .card-body { }
@media (min-width: 992px) {
.event_bg:before { content: ""; background-image: url('../images/c_02.png'); position: absolute; height: 221px; background-size: cover; top: 13px; left: 17px; width: 119px; }
.event_bg:after { content: ""; background-image: url('../images/c_01.png'); position: absolute; width: 164px; height: 132px; background-size: cover; top: 50%; right: 17px; }
}
/*footer*/
/*版權css*/
.bottom { font-size: 13px; }
.bottom a:link, .bottom a:visited { color: #FFF; text-decoration: none; }
.bottom a:hover { font-size: 13px; font-weight: bold; color: #FFF; text-decoration: underline; }
.footer01 { font-size: 13px; font-weight: bold; color: #F16221; background-color: #fff; text-align: center; padding-top: 10px; padding-right: 0; padding-left: 0; padding-bottom: 10px; }
.footer02 { font-size: 13px; text-align: center; color: #444; line-height: 24px; }
.footer02 a:link, .footer02 a:visited { color: #444; text-decoration: none; }
.footer02 a:hover { text-decoration: underline; }

/*event*/
/*#event2 {display: none;}*/

/*model*/
/*.modal-content { background-image: url('../images/shape1_4.png'); background-repeat: no-repeat; background-position: center top; background-size: contain; border: 8px solid #ffb49b; }
.modal-header { border-bottom-width: 0; }
.modal-header .close { padding: 1rem 1rem; margin-top: -1rem; margin-right: -1rem; margin-bottom: -1rem; margin-left: 0px; }
.modal-body { }
.modalbg:before, .modalbg:after { content: ""; left: 0; height: 27%; z-index: -1; width: 100%; bottom: 8px; border-radius: 8px; position: absolute; }
.modalbg:before { background-color: rgba(255, 255, 255, 0); opacity: 1; top: 0.3rem; left: 1rem; }
.modalbg:after { background-color: #ffa5a5; opacity: 1; }
.modalbg { color: #092b65; padding-left: 10px; padding-right: 10px; }*/
/*modal test*/

/*.modal { display: block; position: relative; }
.fade:not(.show) { opacity: 1; }*/

/* ////////////////////////////////////// */
@media (min-width: 992px) {
#mainNav .navbar-nav .nav-link { padding-right: 0.3rem; padding-left: 0.3rem; }
/*#mainNav { padding-bottom: 5px; }*/
#mainNav .nav-item .nav-link:before { display: inline-block; height: 2rem; content: " "; background-color: #9b9b9b; width: 1px; margin-bottom: -9px; }
#mainNav .nav-item:first-child>.nav-link:before { background-color: transparent; }
#mainNav .navbar-nav .nav-link:before { margin-right: 12px; }
}
/**/
.head_text:before, .head_text:after { display: inline-block; height: 21px; content: " "; background-color: #ff9f9f; width: 4px; margin-bottom: 0px; }
.head_text:before { margin-right: 7px; }
.head_text:after { margin-left: 7px; }
.m-item { margin-bottom: 2.5rem; }
.headbg:before, .headbg:after { content: ""; position: absolute; left: 0; height: 27%; z-index: -1; width: 100%; bottom: 19px; border-radius: 8px; }
.headbg:before { background-color: rgba(255, 255, 255, 0); opacity: 1; top: 0.3rem; left: 1rem; z-index: -1; }
.headbg:after { background-color: #ffa5a5; opacity: 1; }
.headbg { color: #092b65; padding-left: 10px; padding-right: 10px; }
.headbg1:before, .headbg1:after { content: ""; position: absolute; left: 0; height: 100%; z-index: -1; width: 100%; bottom: 19px; }
.headbg1:before { background-color: rgba(255, 255, 255, 0); opacity: 1; top: 0.3rem; left: 1rem; z-index: -1; }
.headbg1:after { opacity: 1; background-image: url('../images/pen1.png'); background-position: left bottom; background-size: auto; background-repeat: repeat-x; }
.headbg1 { color: #ffffff; padding-left: 10px; padding-right: 10px; }
.owl-sp img { }
.owl-sp h4 { font-weight: bold; text-align: center; }
.owl-sp .item { }

/*.owl-sp .item::before {position: absolute; content: "";height: 100%;width: 100%;background-color: #1ac492;left: 0px;z-index: -1; border-radius: 30px;}*/
/* /////////////////////////// */
@media (min-width: 576px) {
.card-columns { column-count: 2; }
}

@media (min-width: 768px) {
.card-columns { column-count: 3; }
}

@media (min-width: 992px) {
.card-columns { column-count: 3; }
}

@media (min-width: 1200px) {
.card-columns { column-count: 4; }
}
