/* ----- メインビジュアル ----- */

.top_visual_container {
    position: relative;
}

#slider {
    border-radius: 5px;
    overflow: hidden;
}

#slider img {
    aspect-ratio: 1166 / 500;
    object-fit: cover;
}

.dots-wrap {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 2.4rem;
    left: 0;
    right: 0;
}

.dots-wrap li {
    width: .8rem;
    height: .8rem;
    margin: 0 .5rem;
    background: #fff;
    border-radius: 50%;
    border: 1px solid #fff;
    cursor: pointer;
    opacity: .8;
}

.dots-wrap li:hover,
.dots-wrap li.slick-active {
    background: transparent;
}

.dots-wrap li button {
    display: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    padding: 0;
    border: none;
    background-color: transparent;
}

/* ----- お知らせ ----- */

.top_news_container {
    margin-top: 3.6rem;
    margin-bottom: 7.6rem;
}

.top_news_inner {
    background: #FAF6EC;
    border-radius: 5px;
    padding-top: 3.6rem;
    padding-bottom: 3.6rem;
}

.top_news_heading {
    font-size: 1.9rem;
    font-weight: 600;
    width: 18%;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #c1beb6;
}

.news_list {
    width: 82%;
    padding-left: 5%;
    padding-right: 4%;
}

.news_list_item {
    line-height: 1.6;
    align-items: flex-start;
}

.news_list_item + .news_list_item {
    padding-top: 1.2rem;
}

.news_list_date {
    width: 12%;
    color: #666;
    font-size: 1.4rem;
    padding-top: .1rem;
}

.news_list_title {
    width: 88%;
    font-weight: 500;
    font-size: 1.4rem;
}

.news_list_title a{
    text-decoration: underline;
}

/* ----- アバウト ----- */

.top_about_container {
    margin-bottom: 13rem;
}

.top_about_inner {
    justify-content: space-between;
    align-items: center;
}

.top_about_img {
    width: 44.5vw;
    margin-left: calc(50% - 50vw);
}

.top_about_img img {
    border-radius: 0 5px 5px 0;
}

.top_about_body {
    width: 47%;
}

.top_about_heading {
    width: 48rem;
    max-width: 100%;
    margin-bottom: 3.6rem;
}

.top_about_text {
    font-size: 1.6rem;
    line-height: 1.9;
    text-align: justify;
}

.about_link_container {
    position: relative;
    padding-top: 3.6rem;
}

.about_ill {
    position: absolute;
    width: 14.5rem;
    top: 0;
    right: -2rem;
}

/* ----- おすすめ・定番商品 ----- */

.top_recommend_container {
    margin-bottom: 8rem;
}

.top_item_heading {
    position: relative;
    margin-bottom: 5.8rem;
}

.top_item_heading_icon {
    width: 10.3rem;
    left: -4%;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    z-index: -1;
}

.top_item_heading_text {
    width: auto;
    height: 3.2rem;
}

.top_standard_container {
    margin-bottom: 14rem;
}

#recommend .item_list_item {
    width: 22vw;
    margin-right: 1.8vw;
    max-width: 31rem;
}

#recommend .item_list_expl {
    font-size: 1.5rem;
}

#recommend .item_list_name {
    font-size: 1.7rem;
}


/* ----- ギフト ----- */

.top_gift_container {
    background: #EAF2DF;
    padding-top: 10rem;
    padding-bottom: 10rem;
    margin-bottom: 14rem;
}

.top_gift_inner {
    position: relative;
}

.top_gift_ill {
    position: absolute;
    width: 16rem;
    top: -12rem;
    left: -2rem;
}

.top_gift_header {
    position: relative;
    align-items: flex-end;
    padding-left: 11.2rem;
    padding-bottom: 7rem;
}

.top_gift_heading {
    width: 21.6rem;
    margin-right: 3.2rem;
}

.top_gift_text {
    font-size: 1.5rem;
    line-height: 1.75;
    text-align: justify;
    margin-bottom: -.2rem;
}

/* ----- 茶舗 ----- */

.top_chaho_container {
    margin-top: 14rem;
}

.top_chaho_main_img {
    margin-bottom: 10rem;
}

.top_chaho_main {
    flex-direction: column;
    align-items: center;
    margin-bottom: 8rem;
}

.top_chaho_logo {
    width: 15rem;
    margin-bottom: 5.4rem;
}

.top_chaho_heading {
    text-align: center;
    margin-bottom: 3.4rem;
    font-size: 2.6rem;
    letter-spacing: .2rem;
}

.top_chaho_text {
    width: 56rem;
    font-size: 1.6rem;
    line-height: 1.9;
    text-align: justify;
}

.top_chaho_link {
    margin-top: 6rem;
}


/* ----- ブログ ----- */

.top_blog_container {
    margin-top: 10rem;
}

.top_blog_main_img {
    margin-bottom: 10rem;
}

.top_blog_main_img img {
    border-radius: 5px;
}

.top_blog_header {
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 6rem;
}

.top_blog_heading {
    width: auto;
    height: 2.8rem;
}

.blog_link_all {
    font-size: 1.7rem;
}

.blog_list_item {
    padding: 0;
    width: 20vw;
    margin-right: 1.8vw;
    max-width: 32rem;
}

.blog_item_img {
    border-radius: 5px;
}

.blog_item_img img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

.blog_item_title {
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: 700;
    margin-top: 1.4rem;
}

.blog_item_sub {
    margin-top: 2.8rem;
}

.blog_item_date {
    font-size: 1.5rem;
    color: #666666;
}

.blog_item_cat {
    font-size: 1.5rem;
    color: #85B23E;
    margin-left: 1.2rem;
}


.blog_links_container {
    margin-top: 12rem;
    padding-top: 13rem;
    padding-bottom: 13rem;
    justify-content: center;
    align-items: center;
    background-image: url(https://file003.shop-pro.jp/PA01495/755/common/link_about.jpg);
    background-size: cover;
    position: relative;
}


.blog_links_container::after {
    position: absolute;
    content: "";
    background: #000;
    opacity: .5;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.blog_links_heading{
    position: relative;
    z-index: 2;
    width: 15.7rem;
}

.blog_links{
    position: relative;
    z-index: 2;
    padding-left: 10rem;
}

.blog_link{
    font-size: 2rem;
    color: #fff;
}

.blog_link + .blog_link{
    margin-top: 2.6rem;
}

/*
.blog_links {
width: 50%;
padding: 9rem 0;
position: relative;
justify-content: center;
align-items: center;
background-size: cover;
flex-direction: column;
}

.blog_links::after {
position: absolute;
content: "";
background: #000;
opacity: .5;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
}

.blog_links:first-child {
background-image: url(https://file003.shop-pro.jp/PA01495/755/common/link_yakushima.jpg)
}

.blog_links:last-child {
background-image: url(https://file003.shop-pro.jp/PA01495/755/common/link_about.jpg)
}

.blog_link + .blog_link {
margin-top: 2.6rem;
}

.blog_link {
position: relative;
z-index: 2;
border: 1px solid #fff;
background: transparent;
color: #fff;
}

.blog_link:hover {
border-color: #64911d;
color: #fff;
background: #64911d;
}
*/


/* ----- 実店舗のご案内・体験ツアー ----- */

.top_real_container {
    margin-top: 14rem;
}

.top_real_inner {
    width: 88%;
    margin: 0 auto 10rem;
    justify-content: space-between;
    align-items: center;
}

.top_real_body {
    width: 40%;
}

.top_real_heading {
    margin-bottom: 3.2rem;
}

.top_shop .top_real_heading img {
    width: auto;
    height: 3.2rem;
}

.top_tour .top_real_heading img {
    width: auto;
    height: 8.2rem;
}

.top_real_text {
    font-size: 1.6rem;
    line-height: 1.9;
    text-align: justify;
}

.top_real_text_sub {
    margin-top: 2rem;
    font-size: 1.5rem;
    line-height: 1.75;
    text-align: justify:
}

.top_shop .top_real_link {
    margin-top: 3rem;
}

.top_tour .top_real_link {
    margin-top: 5.2rem;
}

.top_real_img {
    width: 52%;
    border-radius: 5px;
    overflow: hidden;
}

.top_tour {
    flex-direction: row-reverse;
}

/* ----- ふるさと納税 ----- */

.furusato_inner {
    width: 88%;
    margin: auto;
    background: #FAF6EC;
    border-radius: 5px;
    overflow: hidden;
}

.furusato_img {
    width: 40%;
}

.furusato_body {
    width: 60%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 4rem 6%;
}

.furusato_heading {
    width: 28.5rem;
    margin-bottom: 1.2rem;
}

.furusato_text {
    font-size: 1.7rem;
    line-height: 1.4;
    color: #C74A3A;
    font-weight: 700;
    margin-bottom: 2.6rem;
}

.furusato_links {
    width: 100%;
    justify-content: center;
}

.furusato_link {
    margin-left: 3.4%;
}

/*----------------------------------------------------

スマートフォンのみ

----------------------------------------------------*/


@media screen and (max-width: 767px) {
    /* ----- メインビジュアル ----- */

    .top_visual_container {
        padding-left: 0;
        padding-right: 0;
    }

    #slider {
        border-radius: 0;
    }

    #slider img {
        aspect-ratio: 900 / 500;
    }

    .dots-wrap {
        bottom: 1.6rem;
    }

    .dots-wrap li {
        width: .7rem;
        height: .7rem;
        margin: 0 .4rem;
    }

    /* ----- お知らせ ----- */

    .top_news_container {
        position: relative;
        margin-top: 4rem;
        margin-bottom: 6rem;
    }

    .top_news_inner {
        padding: 3.6rem 1.6rem;
    }

    .top_news_heading {
        font-size: 1.9rem;
        letter-spacing: .1rem;
        width: 100%;
        border-right: none;
        margin-bottom: 2.4rem;
    }

    .news_list {
        width: 100%;
        padding: 0;
    }

    .news_list_item {
        line-height: 1.5;
    }

    .news_list_item + .news_list_item {
        padding-top: 1.6rem;
    }

    .news_list_date {
        width: 100%;
        font-size: 1.2rem;
        padding-bottom: .3rem;
    }

    .news_list_title {
        width: 100%;
        font-size: 1.4rem;
    }

    /* ----- アバウト ----- */

    .top_about_container {
        margin-bottom: 7rem;
    }

    .top_about_inner {
        flex-direction: column-reverse;
    }

    .top_about_img {
        margin-top: 6rem;
        width: auto;
        margin-left: calc(50% - 50vw);
    }

    .top_about_img img {
        aspect-ratio: 5 / 3;
        object-fit: cover;
    }

    .top_about_body {
        width: 100%;
    }

    .top_about_heading {
        width: 100%;
        max-width: 38rem;
        margin-bottom: 3.4rem;
    }

    .top_about_text {
        font-size: 1.5rem;
        line-height: 1.8;
    }

    .about_link_container {
        padding-top: 3.6rem;
    }

    .about_ill {
        width: 10rem;
        top: 0;
        right: 0;
    }

    /* ----- おすすめ・定番商品 ----- */

    .top_recommend_container {
        margin-bottom: 6rem;
    }

    .top_item_heading {
        padding-left: 2rem;
        margin-bottom: 4rem;
    }

    .top_item_heading_icon {
        width: 7.5rem;
        left: -1rem;
    }

    .top_item_heading_text {
        height: 2.4rem;
    }

    .top_standard_container {
        margin-bottom: 10rem;
    }

    #recommend .item_list_item {
        width: 50vw;
        margin-right: 3.4vw;
        max-width: 26rem;
    }

    #recommend .item_list_expl {
        font-size: 1.3rem;
    }

    #recommend .item_list_name {
        font-size: 1.6rem;
    }


    /* ----- ギフト ----- */

    .top_gift_container {
        padding-top: 7rem;
        padding-bottom: 7rem;
        margin-bottom: 8rem;
    }

    .top_gift_ill {
        width: 12.4rem;
        top: -5rem;
        left: unset;
        right: 1.4rem;
        transform: scale(-1, 1);
    }

    .top_gift_header {
        padding-left: 0;
        padding-bottom: 4rem;
    }

    .top_gift_heading {
        width: 17.4rem;
        margin-right: 0;
        padding-bottom: 2.4rem;
    }

    .top_gift_text {
        font-size: 1.3rem;
        margin-bottom: 0;
    }

    /* ----- 茶舗 ----- */

    .top_chaho_container {
        margin-top: 8rem;
    }

    .top_chaho_main_img {
        margin-bottom: 6rem;
    }

    .top_chaho_main {
        margin-bottom: 6rem;
    }

    .top_chaho_logo {
        width: 11rem;
        margin-bottom: 4.4rem;
    }

    .top_chaho_heading {
        margin-bottom: 2.4rem;
        font-size: 2rem;
    }

    .top_chaho_text {
        width: 100%;
        font-size: 1.5rem;
        line-height: 1.8;
    }

    .top_chaho_link {
        margin-top: 4.4rem;
    }


    /* ----- ブログ ----- */

    .top_blog_container {
        margin-top: 6rem;
    }

    .top_blog_main_img {
        margin-bottom: 6rem;
    }

    .top_blog_main_img img {
        aspect-ratio: 354 / 196;
        object-fit: cover;
    }

    .top_blog_header {
        margin-bottom: 4rem;
    }

    .top_blog_heading {
        height: 2.4rem;
    }

    .blog_link_all {
        font-size: 1.4rem;
    }

    .blog_list_item {
        padding: 0;
        width: 46vw;
        margin-right: 3.2vw;
        max-width: 26rem;
    }

    .blog_item_title {
        font-size: 1.6rem;
        margin-top: 1.2rem;
    }

    .blog_item_sub {
        margin-top: 2rem;
    }

    .blog_item_date {
        font-size: 1.4rem;
    }

    .blog_item_cat {
        font-size: 1.3rem;
        margin-left: 1rem;
    }

    .blog_links_container {
        margin-top: 6rem;
        padding-top: 8rem;
        padding-bottom: 8.4rem;
        flex-direction: column;
    }

    .blog_links_heading{
        width: 11rem;
        margin-bottom: 3.4rem;
    }

    .blog_links{
        padding-left: 0;
    }

    .blog_link{
        font-size: 1.7rem;
    }

    .blog_link + .blog_link{
        margin-top: 2rem;
    }

    /*
    .blog_links_container {
    margin-top: 6rem;
}

    .blog_links {
    width: 100%;
    padding: 6rem 0;
}

    .blog_link + .blog_link {
    margin-top: 1.6rem;
}
    */


    /* ----- 実店舗のご案内・体験ツアー ----- */

    .top_real_container {
        margin-top: 8rem;
    }

    .top_real_inner {
        width: 100%;
        margin-bottom: 6rem;
    }

    .top_real_body {
        width: 100%;
        margin-bottom: 4.4rem;
    }

    .top_real_heading {
        margin-bottom: 3.2rem;
    }

    .top_shop .top_real_heading img {
        height: 2.5rem;
    }

    .top_tour .top_real_heading img {
        height: 6.5rem;
    }

    .top_real_text {
        font-size: 1.5rem;
        line-height: 1.8;
    }

    .top_real_text_sub {
        margin-top: 1.4rem;
        font-size: 1.4rem;
    }

    .top_shop .top_real_link {
        margin-top: 3rem;
    }

    .top_tour .top_real_link {
        margin-top: 3rem;
    }

    .top_real_img {
        width: 100%;
    }

    .top_real_img img {
        aspect-ratio: 3 / 2;
        object-fit: cover;
    }

    .top_tour {
        flex-direction: column;
    }

    /* ----- ふるさと納税 ----- */

    .furusato_inner {
        width: 100%;
        padding: 2rem 2rem 4rem;
    }

    .furusato_img {
        width: 100%;
    }

    .furusato_body {
        width: 100%;
        padding: 3.6rem 6% 0;
    }

    .furusato_heading {
        width: 23rem;
        margin: 0 auto 1.2rem;
    }

    .furusato_text {
        font-size: 1.5rem;
        text-align: center;
        margin-bottom: 2rem;
    }

    .furusato_links {
        width: 100%;
        line-height: 1.8;
        justify-content: flex-start;
    }

    .furusato_link {
        margin-left: 3.4%;
    }
}