﻿body {
    font-family: 'Lobster', 'Noto Serif TC';
    #font-family: 'Tenor Sans', 'Noto Serif TC';
}

div.sort {
    font-size: 20px;
    font-weight: 100;
}
div.sort > div.L > a span {
    font-size: 16px;
}

.nov a {
    font-size: 16px;
}
.nov a.logo {
    font-size: 32px;
    text-align: center;
}

header > div {
    text-align: center;
}

.vh65 h1 {
    font-size: 10vw;
    font-weight: 100;
    
    #font-family: 'Lobster', cursive;
    #font-family: 'Dancing Script', cursive;
    #font-family: 'Righteous', cursive;
    #font-family: 'Italiana', serif;
    #font-family: 'Griffy', cursive;
    #font-family: 'Libre Barcode 39', cursive;
    #font-family: 'Libre Barcode 39 Text', cursive;
    #font-family: 'Joti One', cursive;
    #font-family: 'Ravi Prakash', cursive;
    
    #text-transform: uppercase;  /* 定義 - 所有字母為大寫 */
    #text-transform: lowercase;  /* 定義 - 所有字母為小寫 */
    #text-transform: capitalize; /* 定義 - 第一個字母大寫，其餘為小寫 */
}
.vh65 p {
    font-size: 48px;
    font-weight: 600;
}
.vh65 p.s {
    font-size: 24px;
}
.vh65 a {
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    letter-spacing: 3px;
}

.vh25 h3, .vh10 h3 {
    font-weight: 700;
}
.vh25 h3 {
    font-size: 48px;
}
.vh25 p {
    font-size: 24px;
    font-weight: 100;
}

.vh10 h3 {
    font-size: 36px;
    #text-align: justify;
}
.vh10 marquee {
    font-size: 24px;
    font-weight: 700;
}

.explore {
    font-size: 48px;
    text-align: center;
}
.explore.background a {
    font-size: 32px;
    text-align: center;
    font-weight: 600;
}

.explore h3, .explore p {
    font-weight: 700;
}
.explore h3 {
    font-size: 48px;
}
.explore p {
    font-size: 24px;
}

footer h3, footer p {
    font-weight: 700;
}
footer h3 {
    font-size: 48px;
    text-align: center;
}
footer p {
    font-size: 24px;
    letter-spacing: 3px;
    text-align: center;
}
footer p.footer {
    font-size: 20px;
    font-weight: 100;
    font-family: 'Tenor Sans', 'Noto Serif TC';
    
    text-align: center;
}
footer b {
    font-weight: 100;
}
footer a {
    letter-spacing: 3px;
    font-weight: 700;
    text-align: justify;
}
footer a:hover > span.text {
    font-weight: 100;
}

@media (max-width: 1380px) {
    .explore h3 {
        font-size: 36px;
    }
    
    .explore.background a {
        font-size: 24px;
    }
}

@media (max-width: 767px) {
    div.sort {
        font-size: 18px;
    }
    div.sort > div.L > a span {
        font-size: 14px;
    }
    
    .vh65 h1 {
        font-size: 75px;
    }
    .vh65 p {
        font-size: 37.5px;
    }
    .vh65 p.s {
        font-size: 20px;
    }
    .vh65 a {
        font-size: 20px;
    }
    
    .vh25 h3 {
        font-size: 30px;
    }
    .vh25 p {
        font-size: 20px;
    }
    
    .vh10 h3 {
        font-size: 26px;
    }
    .vh10 marquee {
        font-size: 18px;
    }
    
    .explore h3 {
        font-size: 26px;
    }    
    .explore p {
        font-size: 16px;
    }
    
    .explore.background a {
        font-size: 18px;
    }
}

@media (max-width: 500px) {
    div.sort {
        font-size: 18px;
    }
    div.sort > div.R {
        font-size: 15px;
    }
    
    footer p.footer {
        font-size: 16px;
    }
}



/* ==== ==== ==== ==== ==== ==== ==== ==== Touch ==== ==== ==== ==== */
.touch {
    font-family: 'Tenor Sans', 'Noto Serif TC';
}

.touch p.title {
    font-size: 36px;
    #font-size: 54px;
    #line-height: 54px;
    font-weight: 100;
    text-align: center;
}
.touch p.title > span {
    font-size: 36px;
}
.touch p {
    font-size: 18px;
    text-align: justify;
}
.touch a {
    font-size: 17.5px;
    text-shadow: none;
    text-align: center;
}

@media (max-width: 500px) {
    .touch p.title {
        font-size: 30px;
    }
    .touch p.title > span {
        font-size: 32px;
    }
    .touch p {
        font-size: 15px;
    }
}

@media (max-width: 499px) {
    .touch p.title {
        font-size: 28px;
    }
    .touch p.title > span {
        font-size: 21px;
    }
    .touch p {
        font-size: 14px;
    }
}



/* ==== ==== ==== ==== ==== ==== ==== ==== Slider ==== ==== ==== ==== */
.fixed {
    font-family: 'Tenor Sans', 'Noto Serif TC';
}

.fixed h3, .fixed p {
    font-weight: 700;
    text-align: center;
}
.fixed h3 {
    font-size: 48px;
}
.fixed p {
    font-size: 24px;
}
.fixed a:hover {
    font-size: 20px;
    font-weight: 600;
}

@media (max-width: 1380px) {
    .fixed h3 {
        font-size: 36px;
    }
}

@media (max-width: 767px) {
    .fixed h3 {
        font-size: 26px;
    }    
    .fixed p {
        font-size: 16px;
    }
}



/* ==== ==== ==== ==== ==== ==== ==== ==== Slider ==== ==== ==== ==== */
.slick-dots {
    text-align: center;
}

.slider_tittle {
    font-size: 15px;
    line-height: 18px;
}
.slider_tittle_no {
    font-size: 15px;
    line-height: 18px;
}
.slider_tittle_no a {
    font-size: 20px;
    letter-spacing: 3px;
    line-height: 18px;
}   
.slider_tittle_no:hover, .slider_tittle_no a:hover, .slider_tittle_no:focus {
    font-size: 18px;
    letter-spacing: 3px;
    /* text-shadow: 0.5px 0.5px 0.5px #000; */
    font-weight: 400;
}

/* Slider Img A */
.slick-prev, .slick-next {
    font-weight: bold;
    font-size: 0;
    line-height: 0;
}
.slick-prev:before, .slick-next:before {
    /* font-family:"slick"; */
    font-size: 20px;
    line-height: 1;
}

.slick-dots li button {
    line-height: 0;
    font-size: 0;
}



/* ==== ==== ==== ==== ==== ==== ==== ==== Form ==== ==== ==== ==== */
.form-control {
    font-size: 16px;
    font-weight: 400;
    font-family: "Kaushan Script", cursive;
    box-shadow: none;
}

.Btn {
    font-size: 16px;
    font-weight: 600;
    text-align: center;
}



/* ==== ==== ==== ==== ==== ==== ==== ==== Instagram ==== ==== ==== ==== */ 
.instagram > div {
    text-align: center;
}