@charset "UTF-8";

/* top video */


/* .l_video {
    position: relative;
    width: 100%;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
} */

.l_video {
    height: auto;
    position: relative;
    width: 100%;
}

.l_video>video {
    /* position: absolute; */
    /* top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%); */
    min-width: 100%;
    min-height: auto;
    width: 100%;
}


/*top visual slide */

section.top_block {
    width: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background-color: #FFE100;
}

div.top_box {
    width: 1000px;
    margin: 0 auto 0 auto;
}

div.top_visual {
    max-width: 100%;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
    line-height: 0;
}

div.top_visual ul {}

div.menu_block {
    width: 1000px;
    max-width: 1000px;
    margin: 40px auto 30px auto;
    position: relative;
    left: 30px;
}

div.menu_block ul {
    display: flex;
    position: relative;
}

div.menu_block ul li {
    width: 20%;
    margin: 0 0 0 0;
    position: relative;
}

div.menu_block ul li img {
    position: relative;
    z-index: 2
}

div.menu_block ul li a:hover {
    color: #999999;
}

div.menu_block ul li img.icon_01 {
    position: absolute;
    top: -20px;
    left: -60px;
    z-index: 1;
    width: 100px;
}

div.menu_block ul li img.icon_02 {
    position: absolute;
    bottom: 45px;
    right: -60px;
    z-index: 1;
    width: 100px;
}

div.menu_block ul li img.icon_03 {
    position: absolute;
    bottom: 95px;
    right: -60px;
    z-index: 1;
    width: 100px;
}

div.menu_block ul li:nth-child(1) {
    z-index: 10;
}

div.menu_block ul li:nth-child(2) {
    z-index: 9;
    margin: 0 0 0 -30px
}

div.menu_block ul li:nth-child(3) {
    z-index: 9;
    margin: 0 0 0 10px
}

div.menu_block ul li:nth-child(4) {
    z-index: 9;
    margin: 0 0 0 -23px
}

div.menu_block ul li:nth-child(5) {
    z-index: 6;
    margin: 0 0 0 -10px
}

div.menu_block ul li p {
    text-align: center;
    position: relative;
    line-height: 1.5;
    font-size: .9rem;
}

div.menu_block ul li:nth-of-type(1) p {
    top: 35px;
}

div.menu_block ul li:nth-of-type(2) p {
    top: 11px;
}

div.menu_block ul li:nth-of-type(3) p {
    top: 50px;
}

div.menu_block ul li:nth-of-type(4) p {
    top: 1px;
}

div.menu_block ul li:nth-of-type(5) p {
    top: 24px;
}

div.banner_block {
    width: 1000px;
    margin: 40px auto;
}

div.banner_block a {
    display: block;
    margin-bottom: 30px;
}

.slider_block {
    width: 100%;
    margin: 0 auto;
}

.slider_block .slider {
    width: 100%;
    min-width: 1400px;
    margin: 20px auto;
}

.slider img {
    width: auto;
}

.slider_block div.prev {
    position: absolute;
    z-index: 1;
    left: 385px;
    top: 43%;
}

.slider_block div.next {
    position: absolute;
    z-index: 1;
    right: 380px;
    top: 43%;
}

.slick-slide {
    padding: 0 0 0 0;
    line-height: 0;
}

.slider_block .slider p {
    margin: -60px 0 0 0;
    padding: 10px 0;
    background-color: #FFF;
    width: 6.25%;
    height: 1.5rem;
    position: absolute;
    bottom: 0;
    z-index: 1;
    text-align: center;
    font-size: 1rem;
    font-family: 'Sawarabi Mincho', "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", sans-serif;
}

.slider li {
    width: 300px;
    height: auto;
    max-height: 400px;
    padding: 0 10px 0 10px;
    background-color: #CCA467;
}


/*スライド画像*/

.slider li img {
    height: auto;
    max-width: 590px;
    min-width: 100%;
}


/*slick*/

.slick-prev:before,
.slick-next:before {
    color: #000;
}


/* 村の情報・新着情報 */

section.content_block_1 {
    position: relative;
    z-index: 4;
    border-bottom: 20px solid #FFF;
    margin: 50px 0 0 0;
}

section.content_block_1 section.content_box {
    display: flex;
    flex-wrap: wrap;
    width: 1000px;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
    background-color: #FFE100;
    background-image: url("../images/top/village_info_bg_01.jpg");
    border-radius: 30px 30px 0 0;
}

section.content_block_1 section.content_box section.visual_block {
    width: 90%;
    margin: 0 auto 0 auto;
    padding: 0 0 422px 0;
    position: relative;
    top: 10px;
    left: 13px;
}

section.content_block_1 section.content_box section.visual_block div.visual_title {
    width: 165px;
    position: absolute;
    top: 15px;
    left: 0;
    right: 0;
    margin: auto;
}

section.content_block_1 section.content_box section.visual_block div.visual {
    width: 100%;
    position: absolute;
    z-index: 3;
}

section.news_block {
    width: 1000px;
    min-height: auto;
    max-height: 350px;
    margin: 30px auto 0 auto;
}

section.news_block h5 {
    width: auto;
    margin: -7px 15px 0 15px;
}

section.news_block section.news {
    display: flex;
}

section.news_block section.news div.border_l {
    width: 50%;
    height: 7px;
    background-color: #598F35;
    margin: 0 5px 0 0;
}

section.news_block section.news div.border_r {
    width: 50%;
    height: 7px;
    background-color: #598F35;
    margin: 0 0 0 5px;
}

section.news_block section.news h5 {
    font-size: 1.3rem;
    text-align: center;
    color: #598F35;
}

section.news_block div.news_box {
    width: 80%;
    height: 160px;
    margin: 0 auto 0 auto;
    padding: 5px 0 5px 0;
    background-color: #FFFFFF;
    overflow-y: auto;
}

section.news_block div.news_box div.news_data {
    margin: 1em .7em 0 .7em;
    padding: 0 0 .5em 0;
}

section.news_block div.news_box div.news_data:last-child {
    border: none;
}

section.news_block dl {
    line-height: 1.6;
}

section.news_block dl a {
    text-decoration: underline;
    color: #598F35;
}

section.news_block dl a:hover {
    text-decoration: underline;
    color: #89AF55;
}

section.news_block dl dt {
    color: #2C893A;
    font-weight: bold;
    display: inline;
}

section.news_line {
    width: 100%;
    height: 30px;
    margin: 0 auto 0 auto;
    background-image: url("../images/top/news_under_line.png");
    background-repeat: repeat-x;
    position: relative;
    z-index: 2;
}

section.line {
    width: 100%;
    height: 20px;
    background-color: #FFFFFF;
    margin: -1px auto 0 auto;
}

section.line {
    width: 100%;
    height: 18px;
    background-image: url("../images/top/line.png");
    background-repeat: repeat-x;
    position: relative;
    z-index: 2;
}


/* 馬路村農協のおすすめ商品 */

section.content_block_2 {
    background-color: #FFE100;
    background-image: url("../images/top/yuzu_bg.jpg");
    background-position: center;
    position: relative;
    z-index: 1;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
}

section.content_block_2 section.content_bg {
    width: 1000px;
    max-width: 1000px;
    margin: 0 auto 0 auto;
    background-image: url("../images/top/recommended_bg_01.jpg");
}

section.content_block_2 section.content_box {
    width: 860px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto 0 auto;
    padding: 45px 0 60px 0;
}

section.content_block_2 section.content_box h3 {
    width: 390px;
    position: absolute;
    top: 80px;
    right: 15px;
}

section.content_block_2 section.content_box h3 div.item_title_kao {
    width: 110px;
    position: absolute;
    top: -40px;
    right: 10px;
    animation: 1.5s linear infinite rotation;
}

section.content_block_2 section.content_box section.item_block_title {
    width: 43%;
    margin: 0 9% 0 0;
    position: relative;
}

section.content_block_2 section.content_box section.item_block_title div.item_img {
    width: 88%;
    margin: 20px auto 0 0;
}

section.content_block_2 section.content_box section.item_block_title div.item_img_1_1 {
    position: absolute;
    left: 100px;
    top: -5px;
    opacity: 0;
}

section.content_block_2 section.content_box section.item_block_title div.item_img_1_1 img {
    width: 88%;
}

section.content_block_2 section.content_box section.item_block_title div.item_img_1_2 {
    position: absolute;
    right: -15px;
    top: 40px;
    opacity: 0;
}

section.content_block_2 section.content_box section.item_block_title div.item_img_1_2 img {
    width: 88%;
}

section.content_block_2 section.content_box section.item_block_title div.item_read {
    line-height: 1.6;
    font-size: 1rem;
    font-weight: bold;
    margin: 15px 0 0 0;
    font-feature-settings: "palt";
    text-align: justify;
}

section.content_block_2 section.content_box section.item_block {
    width: 21%;
    margin: 0 5% 0 0;
    text-align: center;
    position: relative;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(2) {
    margin: 307px 3% 50px 0;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(3) {
    margin: 282px 0 0 0;
    width: 21%;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(4) {
    width: 23%;
    margin: 86px 4% 0 0;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(5) {
    margin: 26px 4% 0 0;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(2) img {
    width: 100%;
    margin: 0 auto 0 auto;
    padding: 0 0 0 0;
}

section.content_block_2 section.content_box section.content section.item_block:nth-of-type(3) section.item_img img {
    width: 195px;
    margin: 0 auto 0 auto;
    image-rendering: -webkit-optimize-contrast;
}

section.content_block_2 section.content_box section.item_block:nth-of-type(4) img {
    width: 96%;
    margin: 0 auto 0 auto;
}

section.content_block_2 section.content_box section.item_block p.title {
    color: #006933;
    font-weight: bold;
    font-size: .9rem;
    margin: 10px 0 0 0;
}

section.content_block_2 section.content_box section.item_block p.title a {
    text-decoration: underline;
    color: #006933;
}

section.content_block_2 section.content_box section.item_block p.title a:hover {
    text-decoration: underline;
    color: #208953;
}

section.content_block_2 section.content_box section.item_block p.txt {
    color: #000000;
    font-weight: bold;
    font-size: .8rem;
    text-align: center;
    margin: 8px 0 0 0;
}

section.content_block_2 section.content_box section.item_block p.price {
    color: #EA5711;
    font-weight: bold;
    font-size: .9rem;
    margin: 5px 0 0 0;
}

section.content_block_2 section.content_box section.item_block div.winter_only_txt {
    position: absolute;
    top: -85px;
    right: 10px;
    width: 55px;
}

@keyframes new_item_txt {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.3);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

section.content_block_2 section.content_box section.item_block div.new_item_txt_animation {
    animation: 1s ease-in-out new_item_txt;
    animation-fill-mode: forwards;
}

section.content_block_2 section.content_box section.item_block div.new_item_txt {
    position: absolute;
    top: -55px;
    right: -5px;
    width: 58px;
    opacity: 0;
}

section.content_block_2 section.content_box section.item_block div.limited_item_txt {
    position: absolute;
    top: -55px;
    right: -5px;
    width: 55px;
}

section.content_block_2 section.content_box section.item_block div.winter_only_txt img,
section.content_block_2 section.content_box section.item_block div.new_item_txt img,
section.content_block_2 section.content_box section.item_block div.limited_item_txt img {
    width: 95%;
}

section.content_block_2 section.content_box section.content {
    width: 100%;
    display: flex;
    position: relative;
    margin: 30px 0 0 0;
}

section.content_block_2 section.content_box section.content section.item_block {
    position: relative;

}

section.content_block_2 section.content_box section.content section.item_block:nth-of-type(1) {
    margin: 0px 0 0 0;
}

section.content_block_2 section.content_box section.content section.item_block:nth-of-type(2) {
    margin: 28px 0 0 4%;
}

section.content_block_2 section.content_box section.content section.item_block:nth-of-type(3) {
    margin: 22px 0 0 4%;
}

section.content_block_2 section.content_box section.content section.item_block:nth-of-type(4) {
    margin: 13px 0 0 4%;

}


/* 各ページへのリンク */


/* アニメーション */

@keyframes banner_animation_01 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.5);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

div.banner_animation_01 {
    animation: 1s ease-in-out banner_animation_01;
    animation-fill-mode: forwards;
}

@keyframes banner_animation_02 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.3);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

div.banner_animation_02 {
    animation: 1s ease-in-out banner_animation_02;
    animation-fill-mode: forwards;
}

@keyframes banner_animation_03 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-8deg);
    }

    100% {
        transform: rotate(0);
    }
}

div.banner_animation_03 {
    animation: 1s steps(1) infinite banner_animation_03;
}

@keyframes banner_animation_04 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(5deg);
    }

    100% {
        transform: rotate(0);
    }
}

div.banner_animation_04 {
    animation: 1s steps(1) infinite banner_animation_04;
}

@keyframes banner_animation_05 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.3);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

div.banner_animation_05 {
    animation: 1s ease-in-out banner_animation_05;
    animation-fill-mode: forwards;
}

@keyframes banner_animation_06 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.3);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

div.banner_animation_06 {
    animation: 1s ease-in-out banner_animation_06;
    animation-fill-mode: forwards;
}

section.content_block_3 {
    background-image: url("../images/top/bg_01.jpg");
    background-position: center;
    width: 1000px;
    margin: 0 auto 0 auto;
    border-radius: 0 0 30px 30px;
}

section.content_block_3 div.banner_block {
    display: flex;
    flex-wrap: wrap;
    width: 850px;
    margin: 0 auto 0 auto;
}

section.content_block_3 h3 {
    width: 370px;
    margin: 0 auto 0 auto;
    padding: 30px 0 20px 0;
}

section.content_block_3 div.banner_box {
    position: relative;
}

section.content_block_3 div.banner_box:nth-of-type(1) {
    width: 30%;
    margin: 60px 5% 0 0;
}

section.content_block_3 div.banner_box:nth-of-type(2) {
    width: 30%;
    margin: 60px 5% 0 0;
}

section.content_block_3 div.banner_box:nth-of-type(3) {
    width: 30%;
    margin: 44px 0 0 0;
}

section.content_block_3 div.banner_box:nth-of-type(4) {
    width: 30%;
    margin: 45px 5% 40px 0;
}

section.content_block_3 div.banner_box:nth-of-type(5) {
    width: 30%;
    margin: 45px 5% 40px 0;
}

section.content_block_3 div.banner_box:nth-of-type(6) {
    width: 30%;
    margin: 45px 0 40px 0;
}

section.content_block_3 div.banner_box div.nav_01,
section.content_block_3 div.banner_box div.nav_02,
section.content_block_3 div.banner_box:nth-of-type(3) div,
section.content_block_3 div.banner_box div.nav_03,
section.content_block_3 div.banner_box div.nav_04 {
    position: absolute;
}

section.content_block_3 div.banner_box div.nav_01 {
    width: 80px;
    top: -45px;
    left: 42%;
    right: 0;
    opacity: 0;
}

section.content_block_3 div.banner_box div.nav_02 {
    width: 100px;
    top: -50px;
    left: 33%;
    right: 0;
    opacity: 0;
}

section.content_block_3 div.banner_box:nth-of-type(3) div.nav_05_1 {
    width: 150px;
    top: -35px;
    left: -20px;
    right: 0;
    animation: 1s steps(1) infinite banner_animation_03;
}

section.content_block_3 div.banner_box:nth-of-type(3) div.nav_05_2 {
    width: 75px;
    top: -17px;
    right: 0;
    right: 0;
    animation: 1s steps(1) infinite banner_animation_04;
}

section.content_block_3 div.banner_box div.nav_03 {
    width: 110px;
    top: -30px;
    right: -20px;
    opacity: 0;
}

section.content_block_3 div.banner_box div.nav_04 {
    width: 110px;
    top: -30px;
    right: -20px;
    opacity: 0;
}

section.content_block_3 div.banner_box img {
    z-index: 2;
}


/* アニメーション */

@keyframes onlineshop_animation_01 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-15deg);
    }

    100% {
        transform: rotate(0);
    }
}

.item_onlineshop_animation {
    animation: 1s infinite ease-in-out onlineshop_animation_01;
}

@keyframes item_animation_01 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.2);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.item_animation_01 {
    animation: 1s ease-in-out item_animation_01;
    animation-fill-mode: forwards;
}

@keyframes item_animation_02 {
    0% {
        right: 20px;
        opacity: 0;
    }

    100% {
        right: -15px;
        opacity: 1;
    }
}

.item_animation_02 {
    animation: 1s ease-in-out item_animation_02;
    animation-fill-mode: forwards;
}


/* ごっくんぼうやアニメーション */

@keyframes rotation {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(30deg);
    }

    100% {
        transform: rotate(0);
    }
}


/* 柚子胡椒アニメーション */

@keyframes rotation2 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(5deg);
    }

    100% {
        transform: rotate(0);
    }
}


/* 商品カテゴリ タイトル */

@keyframes category_title_animation {
    0% {
        right: -1500px;
        opacity: 0;
    }

    70% {
        right: 40px;
        opacity: 1;
    }

    100% {
        right: 0;
        opacity: 1;
    }
}

.category_title_animation {
    animation: 1.5s ease-in-out category_title_animation;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_01 */

@keyframes item_animation_03 {
    0% {
        right: -10px;
        opacity: 0;
    }

    100% {
        right: 15px;
        opacity: 1;
    }
}

.item_animation_03 {
    animation: 1s ease-in-out item_animation_03;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_02 */

@keyframes item_animation_04 {
    0% {
        top: -45px;
        opacity: 0;
    }

    100% {
        top: -95px;
        opacity: 1;
    }
}

.item_animation_04 {
    animation: 1s ease-in-out item_animation_04;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_03 */

@keyframes item_animation_05 {
    0% {
        right: 15px;
        opacity: 0;
    }

    100% {
        right: 47px;
        opacity: 1;
    }
}

.item_animation_05 {
    animation: 1s ease-in-out item_animation_05;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_04 */

@keyframes item_animation_06 {
    0% {
        right: -40px;
        opacity: 0;
    }

    100% {
        right: -23px;
        opacity: 1;
    }
}

.item_animation_06 {
    animation: 1s ease-in-out item_animation_06;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_05 */

@keyframes item_animation_07 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(20deg);
    }

    100% {
        transform: rotate(0);
    }
}

.item_animation_07 {
    animation: 1.2s infinite ease-in-out item_animation_07;
    animation-fill-mode: forwards;
}


/* 商品カテゴリ chara_06 */

@keyframes item_animation_08 {
    0% {
        top: -60px;
        opacity: 0;
    }

    100% {
        top: -43px;
        opacity: 1;
    }
}

.item_animation_08 {
    animation: 1s ease-in-out item_animation_08;
    animation-fill-mode: forwards;
}


/* ようこそ、うまじむら */

@keyframes item_animation_09 {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    80% {
        transform: scale(1.3);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.item_animation_09 {
    animation: 1s ease-in-out item_animation_09;
    animation-fill-mode: forwards;
}

@keyframes item_animation_10 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(15deg);
    }

    /*   100%{ transform:rotate(0);} */
}

.item_animation_10 {
    animation: 1s steps(2) infinite item_animation_10;
}

@keyframes item_animation_11 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(-10deg);
    }

    /*   100%{ transform:rotate(0);} */
}

.item_animation_11 {
    animation: 1s steps(2) infinite item_animation_11;
}


/* フッター */

@keyframes footer_animation_1 {
    0% {
        transform: rotate(0);
    }

    35% {
        transform: rotate(-8deg);
    }

    70% {
        transform: rotate(-3deg);
    }

    100% {
        transform: rotate(0);
    }

    /*   100%{ transform:rotate(0);} */
}

.footer_animation_1 {
    animation: 1s steps(1) infinite footer_animation_1;
}

.footer_animation_1 img {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -ms-interpolation-mode: nearest-neighbor;
    /* IE8+ */
    image-rendering: -webkit-optimize-contrast;
    /* Safari (WebKit) */
    image-rendering: -moz-crisp-edges;
    /* Firefox (Gecko) */
    image-rendering: -o-crisp-edges;
    /* Opera 12.x */
    image-rendering: pixelated;
    /* Chrome 41+, Opera 29+ (CSS4) */
}


/* 馬路村の柚子 */

section.umaji_yuzu_content {
    width: 1000px;
    margin: 60px auto 60px auto;
    display: flex;
    position: relative;
    left: 65px;
}

section.umaji_yuzu_content div.visual {
    width: 600px;
}

section.umaji_yuzu_content section.txt {
    /*
-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-orientation: upright;
*/
    /* すべて縦方向に表示 */
    width: 100%;
}

.text-combine {
    -webkit-text-combine: horizontal;
    -ms-text-combine-horizontal: all;
    text-combine-upright: all;
}

section.umaji_yuzu_content {
    display: flex;
}

section.umaji_yuzu_content div.line_04 {
    width: 14px;
    margin: 0 70px 0 0;
}

section.umaji_yuzu_content div.line_04 img {
    height: 100%;
}

section.umaji_yuzu_content section.txt h4 {
    font-size: 3.8rem;
    margin: 0 20px 10px 0;
    letter-spacing: .2em;
}

section.umaji_yuzu_content section.txt h5 {
    font-size: 1.6rem;
    color: #2C893A;
    font-feature-settings: "palt";
    font-weight: bold;
    margin: -.6em 0 0 0;
    letter-spacing: 0.05em;
}

section.umaji_yuzu_content section.txt div.txt_box p {}

section.umaji_yuzu_content section.txt section.txt_block {
    margin: 30px 20px 0 0;
    -webkit-font-feature-settings: 'palt';
    font-feature-settings: 'palt';
    letter-spacing: 0.03em;
    display: flex;
}

section.umaji_yuzu_content section.txt div.top_block {
    width: 62%;
    line-height: 1.8;
    font-size: 1.1rem;
    text-align: justify;
}

section.umaji_yuzu_content section.txt div.bottom_block {
    width: 62%;
    line-height: 1.8;
    font-size: 1.1rem;
    text-align: justify;
}

section.umaji_yuzu_content section.txt div.yuzu_img_01 {
    width: 20%;
    margin: 0 0 0 5%;
}

section.umaji_yuzu_content section.txt div.yuzu_img_02 {
    width: 20%;
    margin: 40px 0 0 5%;
}


/* instagram */

.l_insta_bg {
    background-color: #fffdd0;
    padding: 10px 0 0 0;
    margin: 80px 0;
}

h3.insta {
    color: #000;
    margin: 10px auto 20px auto;
    text-align: center;
    font-size: 1.4rem;
}

.l_insta {
    width: 100%;
    min-width: 1100px;
    margin: 0 auto 10px auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-between;
}

.l_insta .insta_block {
    width: 15.5%;
    margin: 0 0 20px 0;
    border: 1px solid #EEE;
    background-color: #FFF;
}

.l_insta .insta_block section.l_icon_user {
    margin: 2% 2% 2% 2%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.l_insta .insta_block section.l_icon_user div.icon {
    width: 20px;
}

.l_insta .insta_block section.l_icon_user div.user_name {
    width: auto;
    margin: 0 0 0 5px;
    line-height: 20px;
}

.l_insta .insta_block figure img {
    width: 100%;
    vertical-align: middle;
}


/* 商品カテゴリー */

section.content_block_4 {
    margin: 0 0 0 0;
    padding: 40px 0 0 0;
}

section.content_block_4 h3 {
    width: 230px;
    margin: 20px auto 10px auto;
    position: relative;
    right: -1500px;
}

section.content_block_4 div.category_block {
    width: 950px;
    height: 270px;
    margin: 0 auto 0 auto;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

section.content_block_4 div.category_block div.item {
    width: 20%;
    margin: 0 0 0 0;
    text-align: center;
    position: relative;
}

section.content_block_4 div.category_block div.item:nth-of-type(1) {
    top: 43px;
}

section.content_block_4 div.category_block div.item:nth-of-type(2) {
    top: 7px;
}

section.content_block_4 div.category_block div.item:nth-of-type(3) {
    top: 10px;
}

section.content_block_4 div.category_block div.item:nth-of-type(4) {
    top: 8px;
}

section.content_block_4 div.category_block div.item:nth-of-type(5) {
    top: 98px;
}

section.content_block_4 div.category_block div.item div.img {
    position: absolute;
    opacity: 0;
}

section.content_block_4 div.category_block div.item div.img img {
    width: 100%;
}

section.content_block_4 div.category_block div.item:nth-of-type(1) div.img {
    width: 100px;
    top: -65px;
    right: 15px;
}

section.content_block_4 div.category_block div.item:nth-of-type(2) div.img {
    width: 60px;
    top: -95px;
    right: 67px;
    z-index: 2;
}

section.content_block_4 div.category_block div.item:nth-of-type(5) div.img {
    width: 86px;
    top: -83px;
    right: 47px;
    z-index: 2;
}

section.content_block_4 div.category_block div.item img {
    position: relative;
}

section.content_block_4 div.category_block div.item:nth-of-type(1) img {
    width: 32%;
    margin: 0 0 0 0;
}

section.content_block_4 div.category_block div.item:nth-of-type(2) img {
    width: 31%;
    margin: 7px 0 0 0;
}

section.content_block_4 div.category_block div.item:nth-of-type(3) img {
    width: 32%;
    margin: 7px 0 0 0;
}

section.content_block_4 div.category_block div.item:nth-of-type(4) img {
    width: 32%;
    margin: 7px 0 0 0;
}

section.content_block_4 div.category_block div.item:nth-of-type(5) img {
    width: 42%;
    margin: -24px 0 0 0;
}

section.content_block_4 div.category_block div.item p {
    font-size: .9rem;
    font-weight: bold;
    margin: 5px 0 0 0;
}

section.content_block_4 div.category_block div.item a {
    text-decoration: none;
    position: relative;
    z-index: 1;
}

section.content_block_4 div.category_block div.item a::after {
    /* position: absolute;
  bottom: -20px;
  content: '';
  width: 100%;
  height: 5px;
  background: #FFE100;
  opacity: 0;
  visibility: hidden;
  transition: .2s;
  margin: auto;
  border-radius: 5px; */
}

section.content_block_4 div.category_block div.item:nth-of-type(1) a::after {
    width: 88px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block div.item:nth-of-type(2) a::after {
    width: 104px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block div.item:nth-of-type(3) a::after {
    width: 114px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block div.item:nth-of-type(4) a::after {
    width: 70px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block div.item:nth-of-type(5) a::after {
    width: 78px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block div.item a:hover::after {
    /* bottom: -30px;
  opacity: 1;
  visibility: visible; */
}

section.content_block_4 div.category_block div.item a:hover {
    text-decoration: none;
}

section.content_block_4 div.category_block div.item a.item_hover {
    opacity: 1;
}

section.content_block_4 div.category_block_2 {
    width: 1000px;
    margin: -10px auto 0 auto;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

section.content_block_4 div.category_block_2 div.item {
    margin: 0 5% 0 0;
    text-align: center;
    position: relative;
}

section.content_block_4 div.category_block_2 div.item p {
    position: relative;
}

section.content_block_4 div.category_block_2 div.item_recipe {
    position: absolute;
    width: 400px;
    top: 5px;
    left: 0;
    z-index: 2;
}

section.content_block_4 div.category_block_2 div.item_recipe div.item_recipe_txt {
    position: absolute;
    right: 13px;
    top: 0px;
    width: 110px;
    animation: 1.5s linear infinite rotation2;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(2) {
    width: 12%;
    margin: 85px 10% 37px 450px;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(3) {
    width: 22%;
    margin: 52px 0 0 0;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(2) p {
    left: 0;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(3) p {
    left: 0;
}

section.content_block_4 div.category_block_2 div.item div.img {
    position: absolute;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(2) div.img {
    width: 86px;
    top: -47px;
    right: -23px;
    opacity: 0;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(3) div.img {
    width: 116px;
    top: 17px;
    right: -38px;
    z-index: 2;
}

section.content_block_4 div.category_block_2 div.item p {
    font-size: .9rem;
    font-weight: bold;
    margin: 5px 0 0 0;
}

section.content_block_4 div.category_block_2 div.item a {
    text-decoration: none;
}

section.content_block_4 div.category_block_2 div.item a:hover {
    text-decoration: none;
}

section.content_block_4 div.category_block_2 div.item a {
    text-decoration: none;
    position: relative;
    z-index: 1;
}

section.content_block_4 div.category_block_2 div.item a::after {
    /* position: absolute;
  bottom: -20px;
  content: '';
  width: 100%;
  height: 5px;
  background: #FFE100;
  opacity: 0;
  visibility: hidden;
  transition: .1s;
  margin: auto;
  border-radius: 5px; */
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(2) a::after {
    width: 88px;
    left: 0;
    right: 0;
}

section.content_block_4 div.category_block_2 div.item:nth-of-type(3) a::after {
    width: 45px;
    left: 0;
    right: 0;
}

section.content_block_4 div.category_block_2 div.item a:hover::after {
    /* bottom: -30px;
  opacity: 1;
  visibility: visible; */
}

section.content_block_4 div.category_block_3 {
    width: 1000px;
    margin: 25px auto 0 auto;
    display: flex;
    flex-wrap: wrap;
}

section.content_block_4 div.category_block_3 div.item {
    text-align: center;
    position: relative;
    text-align: center;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(1) {
    width: 14%;
    margin: -8px 5% 10px 50px;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(2) {
    width: 16%;
    margin: 37px 5% 10px 0;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(3) {
    width: 16%;
    margin: 31px 6% 10px 0;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(4) {
    width: 27%;
    margin: -45px 50px 10px 0;
}

section.content_block_4 div.category_block_3 div.item div.img {
    position: absolute;
    opacity: 0;
}

section.content_block_4 div.category_block_3 div.item div.img img {
    width: 100%;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(2) div.img {
    width: 106px;
    top: -43px;
    right: 30px;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(1) img {
    width: 38%;
    margin: 0 0 0 0;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(2) img {
    width: 42%;
    margin: 0 0 0 0;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(3) img {
    width: 90%;
    margin: 0 0 0 0;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(4) img {
    width: 90%;
    margin: 0 0 0 0;
}

section.content_block_4 div.category_block_3 div.item p {
    font-size: .9rem;
    font-weight: bold;
    margin: 5px 0 0 0;
}

section.content_block_4 div.category_block_3 div.item a {
    text-decoration: none;
}

section.content_block_4 div.category_block_3 div.item a:hover {
    text-decoration: none;
}

section.content_block_4 div.category_block_3 div.item a {
    text-decoration: none;
    position: relative;
    z-index: 1;
}

section.content_block_4 div.category_block_3 div.item a::after {
    /* position: absolute;
  bottom: -20px;
  content: '';
  width: 100%;
  height: 5px;
  background: #FFE100;
  opacity: 0;
  visibility: hidden;
  transition: .1s;
  margin: auto;
  border-radius: 5px; */
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(1) a::after {
    width: 140px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(2) a::after {
    width: 130px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(3) a::after {
    width: 35px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block_3 div.item:nth-of-type(4) a::after {
    width: 150px;
    left: -50px;
    right: -50px;
}

section.content_block_4 div.category_block_3 div.item a:hover::after {
    /* bottom: -30px;
  opacity: 1;
  visibility: visible; */
}

section.content_block_4 div.btn {
    width: 75px;
    margin: 5px auto 0 auto;
    padding: 4px 0;
    border-radius: 10px;
    background-color: #f18415;
    color: #FFF;
    font-size: 80%;
}

section.content_block_4 a:hover div.btn {
    background-color: #f1A435;
}

section.content_block_4 div.line {
    width: 950px;
    margin: 0 auto 0 auto;
    text-align: right;
}

section.content_block_4 div.line img {
    width: 62%;
}

section.content_block_4 div.line_2 {
    width: 950px;
    margin: 0 auto 0 auto;
    position: relative;
    top: -20px;
    text-align: right;
}

section.content_block_4 div.line_2 img {
    width: 62%;
}


/* バナー・リンク類 */

section.bg_03 {
    height: 939px;
    background-image: url("../images/top/bg_03.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 1050px;
    margin: 40px 0 0 0;
    padding: 40px 0 40px 0;
}

section.bg_03 div.content_block {
    width: 1000px;
    margin: 0 auto 80px auto;
}

section.bg_03 div.content_block div.content_box {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 0 0;
    text-align: center;
    line-height: 1.4;
}

section.bg_03 div.content_block div.content_box div.img_col_3 {
    width: 32%;
    position: relative;
}

section.bg_03 div.content_block div.content_box div.img_col_3:nth-of-type(2) {
    width: 27%;
    margin: 0 0 0 3%;
    background-color: #FFF;
    padding: 20px 10px;
    border-radius: 20px;
}

section.bg_03 div.content_block div.content_box div.img_col_3:nth-of-type(3) {
    width: 27%;
    margin: 0 0 0 3%;
    background-color: #FFF;
    padding: 20px 10px;
    border-radius: 20px;
}

@keyframes paper_animation {
    0% {
        background-color: #006BB6;
        transform: rotate(0);
    }

    25% {
        background-color: #006BB6;
        transform: rotate(10deg);
    }

    50% {
        background-color: #006BB6;
        transform: rotate(0);
    }

    75% {
        background-color: #FF0000;
        transform: rotate(-5deg);
    }

    100% {
        background-color: #FF0000;
        transform: rotate(0);
    }
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.paper {
    width: 100%;
    position: relative;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.paper div.back_number {
    width: 120px;
    position: absolute;
    right: 10px;
    bottom: 10px;
    background-color: #006BB6;
    padding: 5px 3px;
    line-height: 1;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.paper a:hover div.back_number {
    background-color: #FF0000;
    animation: .4s ease-in paper_animation;
    animation-fill-mode: forwards;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.paper div.back_number img {
    width: 90%;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.cm {
    width: 233px;
    height: 200px;
    margin: 20px 0 0 auto;
    background-image: url("../images/top/youtube_button.png");
    background-repeat: no-repeat;
    background-size: 980px;
    background-position: 0;
    animation: 10s steps(1) infinite cm;
    position: relative;
    right: 20px;
}

@keyframes cm {
    0% {
        background-position: 0;
    }

    25% {
        background-position: -249px;
    }

    50% {
        background-position: -498px;
    }

    75% {
        background-position: -746px;
    }

    100% {
        transform: rotate(0);
    }
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.cm a {
    display: block;
    width: auto;
    height: 100%;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.access {
    position: absolute;
    right: 0;
    bottom: 100px;
    margin: 20px 0 0 0;
}

@keyframes access_fukidasi {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-8deg);
    }

    100% {
        transform: rotate(0);
    }
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.access div.button {
    width: 160px;
    position: absolute;
    top: 10px;
    right: 0;
    animation: 1s ease-in-out infinite access_fukidasi;
    transform-origin: left bottom;
}

@keyframes access_chara {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(2deg);
    }
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.access div.chara {
    width: 120px;
    position: absolute;
    top: 30px;
    right: 130px;
}

section.bg_03 div.content_block div.content_box div.img_col_3 div.access div.chara:hover {
    animation: .1s steps(1) access_chara;
    transform-origin: right bottom;
    animation-fill-mode: forwards;
}

section.bg_03 div.content_block div.content_box div.fb {
    height: 560px;
}

section.bg_03 div.content_block div.content_box div.img_col_2 {
    width: 49%;
}

section.bg_03 div.content_block div.content_box div.img_col_2:nth-of-type(2) {
    margin: 0 0 0 2%;
}

section.bg_03 div.content_block div.title {
    position: relative;
    width: 190px;
    margin: 0 auto 20px auto;
    position: relative;
    top: 125px;
}

section.bg_03 div.content_block h3 {}

section.bg_03 div.content_block div.title+div.content_box {
    width: 80%;
    display: flex;
    flex-wrap: wrap;
    margin: 25px auto 80px auto;
    text-align: center;
    line-height: 1.4;
    position: relative;
    top: 110px;
}

section.bg_03 div.content_block div.content_box div.img_col_4 {
    width: 23.5%;
    position: relative;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2),
section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(3),
section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(4) {
    margin: 0 0 0 2%
}

@keyframes flag_animation_01 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes flag_animation_02 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(8deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes flag_animation_03 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-12deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes flag_animation_04 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(12deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes shihainin_animation {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(10deg);
    }

    100% {
        transform: rotate(0);
    }
}

section.bg_03 div.content_block div.content_box div.img_col_4 div.flag {
    width: 20px;
    position: absolute;
    top: -30px;
    left: 20px;
    animation: 1s steps(1) infinite flag_animation_01;
    transform-origin: center bottom;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2) div.flag {
    width: 25px;
    top: -34px;
    left: 5px;
    animation: 1s steps(1) infinite flag_animation_02;
    transform-origin: center bottom;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2) div.shihainin {
    width: 45px;
    top: -19px;
    left: 33px;
    position: absolute;
    z-index: 2;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2):hover div.shihainin {
    animation: 1s ease-in-out shihainin_animation;
    transform-origin: right bottom;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2):hover::before div.shihainin {
    transform: rotate(0);
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(3) div.flag {
    width: 20px;
    top: -30px;
    left: auto;
    right: 15px;
    animation: 1s steps(1) infinite flag_animation_03;
    transform-origin: center bottom;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(4) div.flag {
    width: 25px;
    top: -35px;
    left: auto;
    right: 10px;
    animation: 1s steps(1) infinite flag_animation_04;
    transform-origin: center bottom;
}

section.bg_03 div.content_block div.content_box div.img_col_4 img {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -ms-interpolation-mode: nearest-neighbor;
    /* IE8+ */
    image-rendering: -webkit-optimize-contrast;
    /* Safari (WebKit) */
    image-rendering: -moz-crisp-edges;
    /* Firefox (Gecko) */
    image-rendering: -o-crisp-edges;
    /* Opera 12.x */
    image-rendering: pixelated;
    /* Chrome 41+, Opera 29+ (CSS4) */
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(1) p {
    margin: 2px 0 0 0;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(2) p {
    margin: 2px 0 0 0;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(3) p {
    margin: 2px 0 0 0;
}

section.bg_03 div.content_block div.content_box div.img_col_4:nth-of-type(4) p {
    margin: 4px 0 0 0;
}

section.bg_03 div.content_block div.content_box div.img_col_4 a {
    text-decoration: none;
    color: #000000;
}

section.bg_03 div.content_block div.content_box div.img_col_4 a:hover {
    color: #FFFFFF;
}

@keyframes title_icon_01 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-8deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes title_icon_02 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(12deg);
    }

    100% {
        transform: rotate(0);
    }
}

section.bg_03 div.content_block div.icon_01 {
    position: absolute;
    top: -15px;
    left: -20px;
    width: 20px;
    animation: 1s ease-in-out infinite title_icon_01;
    transform-origin: center bottom;
}

section.bg_03 div.content_block div.icon_02 {
    position: absolute;
    top: -15px;
    right: -20px;
    width: 20px;
    animation: 1s ease-in-out infinite title_icon_02;
    transform-origin: center bottom;
}

@media (max-width: 1360px) {
    .slider_block .slider {
        width: 100%;
        min-width: 1260px;
        margin: 20px auto;
    }

    .slider li {
        width: 300px;
        height: auto;
        max-height: 400px;
        padding: 0 10px 0 10px;
        background-color: #CCA467;
    }

    .slider li img {
        height: auto;
        max-width: 510px;
        min-width: 100%;
    }

    .slider_block div.prev {
        position: absolute;
        z-index: 1;
        left: 385px;
        top: 43%;
    }

    .slider_block div.next {
        position: absolute;
        z-index: 1;
        right: 380px;
        top: 43%;
    }
}

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


/*
@media (max-width: 1100px) {
}

*/

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

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

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