/* ===== 防止畫面右方出現空白 =====*/
html, body {
    width: auto !important;
    overflow-x: hidden !important;
}
/* ===== 防止畫面右方出現空白 =====*/


/* ===== body開始 ===== */
body {
    /*navbar不固定在畫面上方*/
    /*padding-top:50px;*/
}
    /* ===== body結束 ===== */

    /* ===== 網頁載入彈跳視窗開始 ===== */

    body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom {
        margin-right: 0px;
    }

#loader h1 {
    text-indent: -9999px;
}

.modal-title {
    color: #FFF;
    font-size: 1.5em;
    text-align: center;
    /*text-shadow:1px 1px 2px black;*/
    font-weight: bolder;
}

ul.AD {
    list-style: none;
}

    ul.AD li {
    }

        ul.AD li a {
            display: block;
            text-decoration: none;
            margin: 10px auto;
            width: 300px;
        }

            ul.AD li a:hover {
            }

            ul.AD li a img {
                border-width: 2px;
                border-color: #FFF;
                border-style: solid;
                border-radius: 5px;
            }

@media screen and (max-width:480px) {
    ul.AD li a {
        width: 260px;
    }
}

.modal-header {
    border-bottom: none;
    padding-bottom: 0px;
}

    .modal-header .close {
        opacity: 0.8;
        color: #FFF;
        font-size: 30px;
    }

.modal-body {
    padding-top: 10px;
}

.modal-content {
    background-color: #FFE8D0;
    background-image: url(../images/1_right.png);
    background-position: right bottom;
    background-repeat: no-repeat;
}

/* ===== 網頁載入彈跳視窗結束 ===== */

/* ===== nav開始 ===== */
.nav {
    background-color: black;
    padding-top: 10px;
}

.navbar {
    /*navbar不固定在畫面上方*/
    margin-bottom: 0px;
    border-radius: 0px;
}

.navbar-nav {
    margin: 20px;
}

.navbar-brand {
    line-height: 50px;
}

.navbar-brand h4 {
        font-weight: bolder;
    }

.navbar-inverse {
    background-color: black;
    border-bottom: solid;
    border-bottom-color: #FFE8D0;
    border-bottom-width: 2px;
}

.navbar-default {
    background-color: transparent;
    border-color: transparent;
}

.navbar-toggle {
    margin-right: 0px;
    margin-top: 18px;
}

.navbar-inverse .navbar-nav > li > a, .navbar-inverse .navbar-brand {
    color: #FFF;
    transition: all ease-in-out .3s;
	padding: 10px 15px;
}

    .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:active {
        background-color: #FFE8D0;
        border-radius: 5px;
        font-weight: bolder;
        font-size: 17px;
		color: #333;
    }

.ccr-logo {
    margin-top: 0px;
    padding-top: 15px;
}
/* ===== nav結束 ===== */


/* ===== 浮動廣告開始 ===== */
/*#abgne_float_ad {
    display: none;
    position: absolute;
}

    #abgne_float_ad .abgne_close_ad {
        display: block;
        text-align: right;
        cursor: pointer;
        font-size: 0.9em;
        font-weight: bold;
        color: #FFF;
    }

    #abgne_float_ad a img {
        border: none;
    }

    #abgne_float_ad img {
        border: none;
        width: 100%;
        height: 100%;
    }

@media screen and (max-width:768px) {
    #abgne_float_ad img {
        width: 80%;
        height: 80%;
    }
}*/
/* ===== 浮動廣告結束 ===== */


/* ===== Header開始 ===== */

#ccr-header .ccr-slug {
    padding: 0px;
}

#carousel1 {
    background-color: black;
}

.carousel .item img {
    width: 100%;
}

.glyphicon-chevron-left, .glyphicon-chevron-right {
    border-color: #FFF;
    border-radius: 100%;
    border-style: solid;
    border-width: 3px;
    padding: 10px;
}

.carousel-indicators li {
    border-color: #FFE8D0;
    border-width: 2px;
    width: 12px;
    height: 12px;
    background-color: #FFF;
}

.carousel-indicators .active {
    background-color: #FFE8D0;
    width: 14px;
    height: 14px;
}
/* ===== Header結束 ===== */


/* ===== 精選民宿開始 ===== */
.ccr-service-bg {
    padding-top: 5px;
    padding-bottom: 50px;
    background-color: #FFE8D0;
    background-image: url(../images/1_right.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-attachment: scroll;
}

#ccr-service .ccr-item {
    padding: 10px 0px 12px 0px;
}

.ccr-item div {
    padding-right: 5px;
}

.element_from_top {
    margin: 0 auto;
}

h1.element_from_top {
    font-size: 24px;
    /*width:200px;*/
    color: #666666;
}

#ccr-skill .ccr-skill-title h1 {
    font-size: 24px;
    /*width:200px;*/
    color: #FFF;
}

#ccr-service .ccr-first-iteam, #ccr-service .ccr-second-iteam, #ccr-service .ccr-third-iteam, #ccr-service .ccr-fourth-iteam {
    margin-bottom: 10px;
}

#ccr-service .ccr-item img {
    height: auto;
}

@media screen and (min-width:768px) {
    #ccr-service .ccr-item img {
        box-shadow: 3px 3px 10px #2D1A16;
    }
}

/*避免行動裝置點選圖片返回頁面時版面突兀*/
/*@media screen and (max-width:769px) {
    #ccr-service .ccr-item img:hover {
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}*/
#ccr-service .ccr-item div:nth-child(odd) img:hover {
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg);
}

#ccr-service .ccr-item div:nth-child(even) img:hover {
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    transform: rotate(5deg);
}

ul.Areas {
}

    ul.Areas li {
        float: left;
        /*width:60px;*/
        /*border: 1px solid #666666;*/
        border: 1px solid #FFF;
        margin: 0 5px 5px 0;
        border-radius: 5px;
        background-color:#32bb90;
    }

        ul.Areas li a {
            display: block;
            text-align: center;
            /*color: #666666;*/
            color: #FFF;
            font-weight: 600;
            cursor: pointer;
            padding: 5px;
            border-radius: 5px;
        }

       

            ul.Areas li a.active {
                background: #000;
                /*color: #f00;*/
            }

             ul.Areas li a.sales {
        background-color: #F00;
}

.TainanGinShen {
    margin-top: 15px;
}

.TainanGinShen .sales {
            /*background:#F00;*/
        }

            .TainanGinShen .sales:before {
                content: '折扣中';
                position: absolute;
                /*color:#FF0;*/
                background: #ff2a00;
                padding: 2px 3px;
                z-index: 2;
                left: 15px;
                transition:z-index .5s;
                color:#FF0;
                font-weight:bolder;
            }

    .TainanGinShen .sales:hover:before {
        z-index:0;
        background: rgba(255,255,255,0);
        color:rgba(255,255,255,0);
    }

            .TainanGinShen .sales img {
                border: 3px solid #F00;
            }
@media screen and (max-width:768px) {
    .TainanGinShen .sales:before {
                
                left: 3px;
            }

     
}
/* ===== 精選民宿結束 ===== */

/* ===== 推薦民宿開始 ===== */


.ccr-skill-bg {
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: black;
    background-image: url(../images/2_left.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-attachment: scroll;
}

#ccr-skill .ccr-skill-item {
    padding-top: 20px;
}

/*#ccr-skill .ccr-skill-title h1 {
    color: #FFF;
    font-size: 24px;
}*/

@media screen and (min-width:769px) {
    .ccr-skill-item {
        margin-left: 210px;
    }

        .ccr-skill-item div {
            width: 360px;
        }
}
/* ===== 推薦民宿結束 ===== */

/* ===== 本月之星開始 ===== */
.ccr-portfolio-bg {
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: black;
    background-image: url(../images/2_left.png);
    /*background-color: #FFE8D0;
    background-image: url(../images/3_right.png);*/
    background-repeat: no-repeat;
    /*background-position: right bottom;*/
    background-position: left bottom;
    background-attachment: scroll;
}

#ccr-portfolio h1 {
    color: #FFF;
}

.ccr-portfolio-isotop-menu {
    padding-top: 10px;
}

#ccr-portfolio .ccr-portfolio-item {
    margin-top: 15px;
}

#ccr-portfolio .ccr-menu li {
    background-color: black;
}

.ccr-designation p {
    text-align: center;
}

.MonthStar {
    margin-top: 10px;
}

.StarRight {
    text-align: left;
}


    .StarRight h2 {
        font-size: 20px;
        color: black;
        background-image: url(../images/Block4Img/logo.png);
        background-repeat: no-repeat;
        padding-left: 80px;
        line-height: 56px;
        padding-top: 12px;
    }

    .StarRight h3 {
        font-size: 20px;
        color: #FFFF00;
    }

    .StarRight p {
        font-size: 16px;
        color: #FFF;
    }

    .StarRight ul {
        overflow: hidden;
        margin-top: 10px;
    }

        .StarRight ul li {
            float: left;
        }

            .StarRight ul li a {
                display: block;
                margin-right: 5px;
            }

                .StarRight ul li a:hover {
                }

            .StarRight ul li img {
				padding: 5px;
            }

    .StarRight .BookNow {
        margin-top: 15px;
        padding-right: 50px;
    }

@media screen and (max-width:769px) and (min-width:481px) {
    .StarRight {
        padding-left: 120px;
        padding-top: 15px;
    }
}

@media screen and (max-width:481px) {
    .StarRight {
        margin-top: 15px;
    }

        .StarRight h2 {
            font-size: 16px;
            padding-top: 12px;
        }

        .StarRight h3 {
            font-size: 16px;
        }

        .StarRight p {
            font-size: 14px;
        }

        .StarRight ul {
            overflow: hidden;
            margin-top: 10px;
        }

            .StarRight ul li {
                float: left;
                padding-right: 2px;
            }

                .StarRight ul li a {
                    display: block;
                    margin-right: 0px;
                }

                    .StarRight ul li a:hover {
                    }

                .StarRight ul li img {
                    width: 80px;
                }

        .StarRight .BookNow {
            margin-top: 15px;
        }
}

/* ===== 本月之星結束 ===== */


/* ===== 分類民宿開始 ===== */
#ccr-about-us .ccr-about-us-slug p {
    color: #666666;
}

#ccr-about-us .ccr-us-item img {
    background-color: transparent;
    border-radius: 5px;
    margin-bottom: 0px;
}

/*奇偶數轉的角度不一樣*/
#ccr-about-us .ccr-us-item div:nth-child(odd) img:hover {
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    -o-transform: rotate(20deg);
    transform: rotate(20deg);
}

#ccr-about-us .ccr-us-item div:nth-child(even) img:hover {
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    transform: rotate(-20deg);
}

.ccr-about-us-bg {
    padding-top: 10px;
    padding-bottom: 20px;
    background-color: #FFE8D0; /*black;*/
    background-image: url(../images/Category/bg.jpg);
    background-repeat: no-repeat;
    /*background-image:url(../images/eternal_castle_right.png);
    background-repeat:no-repeat;
    background-position:right bottom;
    background-attachment:scroll;*/
}

    .ccr-about-us-bg h1 {
        padding-top: 0px;
        padding-bottom: 0px;
    }

@media screen and (max-width:480px) {
    #ccr-about-us .ccr-us-first-item, #ccr-about-us .ccr-us-second-item, #ccr-about-us .ccr-us-third-item, #ccr-about-us .ccr-us-fourth-item {
        padding-bottom: 0px;
    }
}

#ccr-about-us .ccr-us-item {
    margin-top: 0px;
}

#ccr-about-us .ccr-designation p {
    color: #666666;
    font-style: normal;
    font-weight: bolder;
}

@media screen and (max-width:768px) and (min-width:400px) {
    #ccr-about-us .ccr-designation p {
        font-size: 14.5px;
    }
}

@media screen and (max-width:375px) and (min-width:280px) {
    #ccr-about-us .ccr-designation p {
        font-size: 15px;
    }
}

.ccr-about-us-slug h1 {
    text-shadow: 3px 3px 5px black;
}

@media screen and (max-width:767px) and (min-width:480px) {
    .ccr-about-us-slug h1 {
        font-size: 1.4em;
    }
}

@media screen and (max-width:479px) {
    .ccr-about-us-slug h1 {
        font-size: 1.2em;
    }
}

.fancybox-nav {
    height: 80%;
    width: 40px;
}

.fancybox-inner {
    border-radius: 5px;
    min-height: 470px;
}

.fancybox-skin {
    background-color: black;
    border-radius: 5px;
}

.fancybox-custom .fancybox-skin {
    box-shadow: 0 0 50px #222;
}



/* ===== 分類民宿結束 ===== */

/* ===== 台南市民宿總覽開始 ===== */
/* ===== Links開始 ===== */
ul.otherLinks {
    margin-bottom: 15px;
}

    ul.otherLinks li {
        float: left;
        width: 19%;
        border-right: 1px solid #733900;
        margin: 5px auto;
    }

@media screen and (min-width:769px) {
    ul.otherLinks li:nth-child(5n) {
        border-right: 1px solid rgba(255,255,255,0);
    }
}

@media screen and (max-width:768px) and (min-width:481px) {
    ul.otherLinks li {
        float: left;
        width: 24%;
        border-right: 1px solid #733900;
        margin: 5px auto;
    }

        ul.otherLinks li:nth-child(4n) {
            border-right: 1px solid rgba(255,255,255,0);
        }
}

@media screen and (max-width:480px) {
    ul.otherLinks li {
        float: left;
        width: 49%;
        border-right: 1px solid #733900;
        margin: 5px auto;
    }

        ul.otherLinks li:nth-child(even) {
            border-right: 1px solid rgba(255,255,255,0);
        }
}

ul.otherLinks li a {
    color: #733900;
}
/* ===== Links結束 ===== */

#ccr-team {
    clear: both;
}

.ccr-team-bg {
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: #FFE8D0;
    background-image: url(../images/3_right.png);
    /*background-color: black;
    background-image: url(../images/4_left.png);*/
    background-repeat: no-repeat;
    /*background-position: left bottom;*/
    background-position: right bottom;
    background-attachment: scroll;
}

#ccr-team .ccr-team-title {
    padding-top: 0px;
    padding-bottom: 15px;
}

    #ccr-team .ccr-team-title h1 {
        color: #666666;
    }

    #ccr-team .ccr-team-title p {
        font-size: 13px;
        /*color: #FFF;*/
        color: #666666;
        margin: 0px 0;
        display: none;
    }

@media screen and (max-width:769px) {
    #ccr-team .ccr-team-title p {
        display: block;
    }
}

#ccr-team .ccr-team-item h3 {
    color: #FFF;
    /*background-color: #FFE8D0;*/
    background-color: black;
    border-radius: 5px;
    padding-bottom: 10px;
    cursor: pointer;
}

.ccr-team-item div {
    margin-bottom: 15px;
}

.ccr-team-item .row {
    margin-left: 0px;
    margin-bottom: 0px;
}

ul.ccr-social {
    color: #FFF;
    font-size: 0.9em;
    text-align: left;
    left: 5px;
    display: none;
}

@media screen and (min-width:769px) {
    ul.ccr-social {
        display: block;
    }
}


@media screen and (max-width:767px) {
    ul.ccr-social {
        padding-left: 25%;
    }
}

ul.ccr-social li {
    list-style-image: url(../images/03.gif);
    list-style-position: inside;
    margin-left: 1em;
    text-indent: -1em;
}

    ul.ccr-social li a {
        color: #666666;
        text-decoration: none;
    }

        ul.ccr-social li a:hover {
            color: #FF6600;
            /*background-color:#FFE8D0;*/
            text-decoration: underline;
            /*font-weight: bolder;
            font-size: 15px;*/
            font-style: italic;
        }

.glyphicon-search {
    font-size: 14px;
    line-height: 25px;
}

/* ===== 台南市民宿總覽結束 ===== */


/* ===== 刊登廣告開始 ===== */



.ccr-touch-bg {
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: black;
    background-image: url(../images/4_left.png);
    /*background-color: #FFE8D0;
    background-image: url(../images/1_right.png);*/
    background-repeat: no-repeat;
    /*background-position: right bottom;*/
    background-position: left bottom;
    background-attachment: scroll;
}

#ccr-touch input, #ccr-touch textarea {
    background-color: white;
    color: black;
    border-radius: 5px;
}

.ccr-button {
    margin-top: 10px;
    padding: 10px 95px;
}

#ccr-touch .ccr-button {
    /*background-color: black;*/
    background-color: #FFE8D0;
    color: #666666;
    border-bottom: 1px solid #FFE8D0;
    transition: all ease-in-out .5s;
}

    #ccr-touch .ccr-button:hover {
        background-color: #FFF;
        /*color: #FFE8D0;*/
        color: black;
        border-bottom: 1px solid #FFF;
        /*font-size: 1.2em;*/
        font-weight: bolder;
    }

#ccr-touch .ccr-touch-form {
    padding-top: 20px;
}

/* ===== 刊登廣告結束 ===== */

/* ===== Footer開始 ===== */
.ccr-footer-bg {
    font-size: 9pt;
    /*color: #FFF;*/
    color: black;
    background-color: #FFE8D0;
    /*background-color: black;*/
    border-top: 1px solid black;
}

a.twstay {
    font-size: 14px;
    font-style: italic;
    margin-left: 5px;
    margin-right: 5px;
    font-weight: bolder;
    /*color:#43BCC3;*/
    color: #0033FF;
}
/* ===== Footer結束 ===== */

/* ===== Go to top開始 ===== */
a#ccr-back-top {
    border-radius: 5px;
}

    a#ccr-back-top:hover {
        width: 40px;
        height: 40px;
    }
/* ===== Go to top結束 ===== */


/* 標題加水平線 */
@media screen and (min-width:767px) {
    .ccr-title h1:before, .ccr-skill-title h1:before, h1.element_from_top:before, #ccr-team .ccr-team-title h1:before, .ccr-touch-title h1:before {
        content: "";
        width: 60%;
        height: 1px;
        background-color: #666666;
        opacity: 0.7;
        position: absolute;
        top: 50%;
        left: 20%;
        z-index: 1;
    }




    .ccr-title h1 b, h1.element_from_top b, ccr-team-title h1 b, .ccr-touch-title h1 b {
        /*background-color: #FFE8D0;*/
        background-color: black;
        z-index: 2;
        position: relative;
        padding: 0 20px;
    }



    .ccr-skill-title h1 b, #ccr-team .ccr-team-title h1 b {
        background-color: black;
        z-index: 2;
        position: relative;
        padding: 0 20px;
    }

    .ccr-title h1 b, #ccr-team .ccr-team-title h1 b {
        background-color: #FFE8D0;
    }
}


.ccr-touch-title > h1.element_from_top:before, .ccr-touch-title > h1.element_from_top,.ccr-portfolio-title > h1.element_from_top:before {
    color: #FFF;
}
@media screen and (min-width:767px) {
    .ccr-touch-title > h1.element_from_top:before,.ccr-portfolio-title > h1.element_from_top:before{
        background-color: #FFF;
    }
}
.holiday{
    background: #831F1F;
    margin: auto;
    border-radius: .5rem;
    padding: 7px;
    width: 50%;
}
.holiday .holiday-,.holiday .holiday-t{
	display: inline-block;
}
.holiday .holiday-t p::after{
	content: "→";
}
.holiday-t p{
	color: #fff;
    font-weight: 900;	
}
.holiday- a{
    color: #f00;
    text-decoration: none;
    font-weight: 900;	
	cursor: pointer;
}
.holiday- a:hover{	
	color: #A800CE;
}
.holiday-{
    background: #fff;
    border-radius: .5rem;
    padding: 5px 10px;
    margin-right: 2px;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.80);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.80);
	cursor: pointer;
}
.holiday-:hover{	
	position: relative;
	left: 1px;
	top: 1px;
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.0);
    box-shadow: 0px 0px 3px rgba(0,0,0,0.0);
}
.holiday h1{	
		font-size: 1.5em;
	color: #28BF92;
	padding-top: 15px;
    font-weight: 900;
	
}
.line{
	padding-top: 15px;	
}
.line a{
    text-decoration: none;
	color: rgba(0,200,3,1.00);
    font-weight: 900;
		font-size: 1.2em;
	cursor: pointer;
}
.line a:hover{
	color: rgba(0,200,3,1.00);
	position: relative;
	left: 1px;
	top: 1px;
}
.line img{
    display: inline;
    width: 120px;
    border-radius: .5rem;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.50);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.50);
    vertical-align: text-bottom;
	cursor: pointer;
}
.line img:hover{
	position: relative;
	left: 1px;
	top: 1px;
    -webkit-box-shadow: 0px 0px 1px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 1px rgba(0,0,0,0.5);
}
@media screen and (max-width:767px) {
	.holiday{
	width: 100%;
}
.holiday .holiday-t{
	display: block;

}
	.holiday-{		
	margin-bottom: 8px;
	}
	.holiday-t p{
		font-size: 1.4em;
	}
	.holiday .holiday-t p::after{
	content: "↓";
}

.inline{
    display: inline-block;
}
}