html, body {
    height: 100%;
    background-color: white;
}

h1, h2, h3, h4, h5, h6, div, dl, dt, dd, p {
    margin: 0;
    padding: 0;
}

li {
	list-style-type:none;
}

.l-main {
    line-height: 1.2;
    margin-left: -15;
}

.p-index_title
{
    min-height: 100vh;
    width: 98vw;
}

.p-top-kv__pic {
    position: absolute;
    z-index: 1;
}

.p-top-kv__pic--01 {
    left:0%;
    top: 0;
}

.p-top-kv__pic--01 img{
    width:50vw;
}

.p-top-kv__pic--02{
    right: 8%;
    top: 0;
}

.p-top-kv__pic--02 img{
    width:33vw;
}

.p-top-kv__pic--03{
    right: 20%;
    top: 31vw;
}

.p-top-kv__pic--03 img{
    width: 25vw;
}

.p-top-kv__pic--scroll {
    right:3%;
    top: 33vw;
}

.swiper-no-large .swiper-slide {
    position: static;
    width: auto;
    height: auto;
}

.p-top-kv__txt {
    position: absolute;
    z-index: 3;
}

.p-top-kv__txt--01 {
    left: 5%;
    top: 34vw;
    -webkit-transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    -webkit-clip-path: inset(0 99% 0 0);
    clip-path: inset(0 99% 0 0);
    opacity: 0;
}

.p-top-kv__txt--01.is-inview {
        -webkit-clip-path: inset(0 0% 0 0);
        clip-path: inset(0 0% 0 0);
        opacity: 1;
}
.p-top-kv__txt--01 img {
    width: 33vw;
}

.p-top-kv__txt--02 {
    left: 33%;
    top: 23vw;
    -webkit-transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    -webkit-clip-path: inset(0 99% 0 0);
            clip-path: inset(0 99% 0 0);
    opacity: 0;
}

.p-top-kv__txt--02.is-inview {
    -webkit-clip-path: inset(0 0% 0 0);
    clip-path: inset(0 0% 0 0);
    opacity: 1;
}

.p-top-kv__txt--02 img {
    width: 50vw;
}

.p-top-kv__txt--03 {
    left: 87%;
    top: -5vw;
    -webkit-transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, -webkit-clip-path 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    -webkit-clip-path: inset(0 99% 0 0);
            clip-path: inset(0 99% 0 0);
    opacity: 0;
}

.p-top-kv__txt--03.is-inview {
    -webkit-clip-path: inset(0 0% 0 0);
    clip-path: inset(0 0% 0 0);
    opacity: 1;
}

.p-top-kv__txt--03 img {
    width: 20vw;
}

/*info*/
.p-index_info
{
    margin-top: 22vw;
    max-height: 600px;
}

.background-info {
    position: relative;
    background: #f8f8f8;
    height: 600px;
    width: 85%;
}

.background-info p {
    position: absolute;
    top: 40%;
    left: 10%;
    width: 750px;
    line-height: 20px;
    font-size: 14px;
}
/*info*/

/*Description*/
.p-index_Description
{
    margin-top: 10vw;
    padding-left: 0%;
}

.background-Description
{
    position: relative;
    background:black;
    height: 600px;
    width: 85%;
}

.background-Description img
{
    width: 70vw;
}

.p-top-kv__pic--04 {
    right:-10%;
    position: absolute;
    z-index: 1;
}

.p-top-kv__pic--04 img {
    width: 50vw;
}

.text-Description
{
    float: left;
    padding-left: 10%;
    padding-top: 15%;
    text-align: center;
    line-height: 34px;
    color: white;
}

.text-Description h1
{
    font-size: 40px;
    line-height: 50px;
}
/*Description*/

/*menu*/
.p-index_menu
{
    margin-top: 15vw;
}

.main-nav {
    display: -webkit-flex;
    display: flex;
}

.main-nav .menu-even {
    margin-top: 100px;
}

.main-nav a {
    display: block;
    padding: 10px;
}
/*menu*/

/*produce*/
.p-index_produce
{
    margin-top: 15vw;
}

.background-produce
{
    background-image: url(../image/backimage1.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    /* min-width:100vw; */
}

.produceImg
{
    width: 30%;
    height: auto;
    margin-top: -150px;
}

.produceTextImg
{
    position: absolute;
    margin-left:-80px;
}

.produceHeadingImg
{
    float: right;
    height: 20vw;
    min-width: 30vw;
    margin-top: -5%;
}

.produceText
{
    float: right;
    padding-right: 10%;
    margin-top: -50vh;
    text-align: right;
    line-height: 30px;
    color: white;
}
/*produce*/

/*eats*/
.background-eats
{
    background-image: url(../image/backimage2.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:140vh;
    /* min-width:100vw; */
    position: relative;
}

.eatsImg
{
    float: right;
    margin-top: -100px;
    position: absolute;
    right: 0;
}

.eatsTextImg
{
    float: right;
    position: absolute;
    right: 8%;
    bottom: 15%;
}

.eatsHeadingImg
{
    float: left;
    height: 20vw;
    min-width: 30vw;
    padding-top: 5%;
}

.eatsText
{
    float: left;
    position: absolute;
    padding-left: 15%;
    margin-top: 60vh;
    text-align: left;
    line-height: 30px;
    color: black;
    font-weight: bold;
}
/*eats*/

/*mtg*/
.background-mtg
{
    background-image: url(../image/backimage3.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    /* min-width:100vw; */
}

.mtgImg
{
    position: absolute;
    height: auto;
    margin-top: -100px;
}

.mtgTextImg
{
    position: absolute;
    margin-left:350px;
    margin-top: 300px;
}

.mtgHeadingImg
{
    position: absolute;
    height: 20vw;
    min-width: 30vw;
    margin-top: -5%;
    right: 10;
}

.mtgText
{
    float: right;
    padding-right: 10%;
    margin-top: 35vh;
    text-align: right;
    line-height: 30px;
    color: white;
}
/*mtg*/

/*products*/
.background-products
{
    background-image: url(../image/backimage4.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:200vh;
    /* min-width:100vw; */
    position: relative;
}

.productsImg
{
    float: right;
    margin-top: -100px;
    position: absolute;
    right: 0;
}

.productsTextImg
{
    float: right;
    position: absolute;
    right: 8%;
    top: 50%;
    z-index: 2;
}

.productsHeadingImg
{
    float: left;
    height: 20vw;
    min-width: 30vw;
    padding-top: 5%;
    padding-left: 5%;
}

.productsText
{
    float: left;
    position: absolute;
    padding-left: 15%;
    margin-top: 60vh;
    text-align: left;
    line-height: 30px;
    color: black;
    font-weight: bold;
    z-index: 2;
}

.products_menu
{
    position: absolute;
    background: #f8f8f8;
    height: 530px;
    width: 85%;
    bottom: 10%;
    z-index: 1;
}

.products_menu table
{
    font-weight: bold;
}

.products_menu ul
{
    list-style: none;
}

.products_menu li
{
    padding: 70px 10px 0px 132px;
    text-indent: -122.4px;
}

.products_menu p
{
    padding-left: 135px;
    font-size: 13px;
    margin-top: -10px;
    line-height: 30px;
}

.products_menu img {
    width: 100px;
    height: 100px;
    margin: -14px 18px -20px 0;
    vertical-align: middle;
}

/*products*/

/*crub*/
.background-crub
{
    background-image: url(../image/backimage5.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    min-width:90vw;
}

.crubImg
{
    position: absolute;
    height: auto;
    margin-top: -100px;
}

.crubTextImg
{
    position: absolute;
    margin-left:350px;
    margin-top: 230px;
}

.crubHeadingImg
{
    position: absolute;
    height: 20vw;
    min-width: 30vw;
    margin-top: -5%;
    right: 10;
}

.crubText
{
    float: right;
    padding-right: 10%;
    margin-top: 35vh;
    text-align: right;
    line-height: 30px;
    color: white;
}
/*crub*/

/*aaa*/
.background-aaa
{
    background-image: url(../image/backimage2.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height:140vh;
    /* min-width:100vw; */
    position: relative;
}

.aaaImg
{
    float: right;
    margin-top: -100px;
    position: absolute;
    right: 0;
}

.aaaTextImg
{
    float: right;
    position: absolute;
    right: 8%;
    bottom: 15%;
}

.aaaHeadingImg
{
    float: left;
    height: 20vw;
    min-width: 30vw;
    padding-top: 5%;
    padding-left: 5%;
}

.aaaText
{
    float: left;
    position: absolute;
    padding-left: 15%;
    margin-top: 60vh;
    text-align: left;
    line-height: 30px;
    color: black;
    font-weight: bold;
}
/*aaa*/

/*town*/
.background-town
{
    background-image: url(../image/backimage7.png);
    height:100vh;
    /* min-width:100vw; */
}

.townImg
{
    padding-top: 18%;
    right: 1px;
    position: absolute;
    z-index: 1;
}

.sp_br {
  display: none;
}

.townText
{
    padding-top: 5%;
    padding-left: 15%;
    text-align: left;
    line-height: 50px;
    color: white;
    font-weight: bold;
}
/*town*/

/* footer */
.background-footer
{
    background-image: url(../image/footer.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
    height:100vh;
    /* min-width:100vw; */
    position: relative;
}

.background-footer p
{
    margin: 0;
    color: black;
    font-size: 60px;
    font-weight: bold;
    position: absolute;
    top: 20%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%)
}

.background-footer img
{
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%)
}

.footer-text
{
    margin: 0;
    color: black;
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%)
}
/* footer */

@media screen and (max-width:480px) {
	.p-top-kv__pic--01 img{
        width:100%;
    }

    .p-top-kv__txt--01 {
        top: 65vw;
    }

    .p-top-kv__txt--01 img {
        width: 50vw;
    }

    .p-top-kv__txt--02 {
        left: 13%;
        top: 135vw;
    }

    .p-top-kv__txt--02 img {
        width: 80vw;
    }

    .p-top-kv__txt--03 {
        left: 78%;
    }

    .p-top-kv__pic--02 {
        right: 0;
        top: 120vw;
    }

    .p-top-kv__pic--02 img {
        width: 53vw;
    }

    .p-top-kv__pic--03 {
        left: 0;
        top: 140vw;
    }

    .p-top-kv__pic--03 img {
        width: 55vw;
    }

    .p-top-kv__pic--scroll {
        right: 3%;
        top: 168vw;
    }

    .p-top-kv__pic--scroll img {
        width: 8vw;
    }

    .background-info
    {
        width: 100vw;
        margin-top: 62vw;
    }


    .sp_br {
      display: block;
    }

    .background-info p {
        top: 10%;
        width: 68vw;
    }

    .background-Description {
        background: black;
        height: 600px;
        width: 100vw;
    }

    .p-top-kv__pic--04 {
        right: 0%;
        position: static;
        z-index: 1;
    }

    .p-top-kv__pic--04 img {
        width: 100vw;
    }

    /* Description */
    .background-Description img {
        width: 100vw;
        padding-top: 25px;
    }

    .text-Description h1 {
        font-size: 30px;
        line-height: 40px;
    }
    /* Description */



    /* menu */
    .main-nav {
        display: none;
    }

    .p-index_menu
    {
        margin-top: 40vw;
        margin-left: -5vw;
    }

    .main-nav-min {
        column-count: 2;
    }

    .main-nav-min .menu-even {
        margin-top: -50px;
    }

    .main-nav-min a {
        display: block;
        padding: 10px;
    }
    /* menu */

    /* produce */
    .produceHeadingImgMin
    {
        min-width: 20vw;
        margin-top: -10%;
        margin-left: 10%;
    }

    .background-produce {
        height: 130vh;
    }

    .produceText {
        padding-right: 4%;
        padding-left: 4%;
        margin-top: 0vh;
        font-size: 14px;
    }
    /* produce */

    /* eats */
    .eatsHeadingImgMin
    {
        min-width: 20vw;
        margin-left: 10%;
    }

    .background-eats {
        height: 130vh;
    }

    .eatsText {
      padding-left: 4%;
      margin-top: 10vh;
      font-size: 14px;
      padding-right: 4%;
  }
    /* eats */

    /* MTG */
    .mtgHeadingImgMin
    {
        min-width: 20vw;
        margin-top: -10%;
        margin-left: 10%;
        position: absolute;
    }

    .background-mtg {
        height: 130vh;
    }

    .mtgText {
      padding-right: 4%;
      margin-top: 45vh;
      font-size: 14px;
      padding-left: 4%;
  }
    /* MTG */

    /* products */
    .productsHeadingImgMin
    {
        min-width: 20vw;
        margin-left: 10%;
    }

    .background-products {
        height: 230vh;
    }

    .productsText {
        padding-left: 4%;
        padding-right: 4%;
        margin-top: 10vh;
        font-size: 14px;
    }

    .products_menu{
        display: none;
    }

    .products_menu_min
    {
        position: absolute;
        background: #f8f8f8;
        width: 98%;
        bottom: 3%;
        z-index: 1;
        line-height: 20px;
    }

    .products_menu_min td
    {
        vertical-align: top;
    }

    .products_menu_min p
    {
        font-size: 13px;
    }
    /* products */

    /* crub */
    .crubHeadingImgMin
    {
        min-width: 20vw;
        margin-top: -10%;
        margin-left: 10%;
        position: absolute;
    }

    .background-crub {
        height: 130vh;
    }

    .crubText {
        padding-right: 4%;
        padding-left: 4%;
        margin-top: 45vh;
        font-size: 14px;
    }
    /* crub */

    /* AAAAAA */
    .aaaHeadingImgMin
    {
        min-width: 20vw;
        margin-left: 10%;
    }

    .background-aaa {
        height: 140vh;
    }

    .aaaText {
        padding-left: 4%;
        padding-right: 4%;
        margin-top: 10vh;
        font-size: 14px;
    }
    /* AAAAAA */

    /* town */
    .background-town {
        height: 128vh;
    }

    .townText {
      padding-left: 4%;
      font-size: 14px;
      padding-right: 4%;
      line-height: 33px;
    }

    .townImg {
        padding-top: 87vh;
        right: 26px;
        position: absolute;
        z-index: 1;
    }

    .townImg img{
        width: 60vw;
    }
    /* town */

     /* display:none */
    .produceImg,
    .produceTextImg,
    .produceHeadingImg,
    .eatsImg,
    .eatsTextImg,
    .eatsHeadingImg,
    .mtgImg,
    .mtgTextImg,
    .mtgHeadingImg,
    .productsImg,
    .productsTextImg,
    .productsHeadingImg,
    .crubImg,
    .crubTextImg,
    .crubHeadingImg,
    .aaaImg,
    .aaaTextImg,
    .aaaHeadingImg
    {
        display: none;
    }
    /* display:none */

    /* footer */
    .background-footer img {
        width: 90vw;
    }

    .background-footer p {
        font-size: 30px;
        top: 30%;
    }

    .footer-text {
        font-size: 10px;
    }

    .background-footer {
        background-position: right 80% bottom 10%;
        background-repeat: no-repeat;
    }
    /* footer */
}

@media screen and (min-width:480px) {
    /*　画面サイズが480pxからはここを読み込む　*/
    .main-nav-min,
    .produceHeadingImgMin,
    .eatsHeadingImgMin,
    .mtgHeadingImgMin,
    .productsHeadingImgMin,
    .crubHeadingImgMin,
    .aaaHeadingImgMin,
    .products_menu_min
    {
        display: none;
    }
}