.top-view {
	position: relative;
}

.top-view video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.simple-scroll-motion {
    width: 1px;
    height: 220px;
    position: absolute;
    bottom: 0px;
    left: 18px;
    margin: 0 auto;
    overflow: hidden;
    z-index: 100;
}

.simple-scroll-motion .scroll-line {
    width: 100%;
    height: 100%;
    display: block;
    background: linear-gradient(to bottom, white 50%, rgba(255, 255, 255, 0) 50%);
    background-position: 0 -220px;
    background-size: 100% 200%;
    animation: scrolldown 2.2s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite;
}
@keyframes scrolldown {
 0% {
    background-position: 0 -220px;
}
75% {
    background-position: 0 0;
}
100% {
    background-position: 0 220px;
}
}


.top-section {
    position: relative;
}

.common-title {
    width: fit-content;
    margin: 0 auto;
}

.common-title p {
    font-size: .14rem;
    font-family: minion-pro, serif;
    text-align: center;
    letter-spacing: 0.06em;
}



.common-heading {
    width: 1200px;
    max-width: 100%;
    margin: 0 auto 4px;
    position: relative;
}

/* .common-heading::before {
    content: "";
    position: absolute;
    left: -23px;
    top: 19px;
    height: 3px;
    width: 100vw;
    background-color: #BCA475;
    padding-left: 100vw;
    margin-left: -100vw;
} */

.common-heading h2 {
    width: 348px;
    margin-bottom: 13px;
}

/* .common-heading h3 {
    font-size: .24rem;
    letter-spacing: 0.12em;
} */

/* 原点回顧 */

.top-kaikou {
    padding: 93px 20px 112px;
}

.top-garaku__container {
    width: 1000px;
    max-width: 100%;
    margin: 0 auto;
}

.top-kaikou h1 {
    width: 186px;
    display: block;
    margin: 0 auto -138px;
}

.top-kaikou__img {
    width: 268px;
    display: block;
    margin: 0 auto 43px;
}

.top-kaikou__text p {
    text-align: center;
    font-size: .16rem;
    line-height: 2.6;
}

.main h2 {
    font-size: .26rem;
    color: #fff;
    font-family: minion-pro, serif;
    line-height: 1;
    letter-spacing: 0.1em;
}


/* インフォメーション */
.top-information {
    background-color: #666666;
    padding: 79px 0 200px;
}

.top-information .common-heading h2 {
    margin-bottom: 4px;
}

.top-information__container {
    width: 1240px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}

.top-information__list {
    width: 71%;
    margin: 0 auto;
}

.top-information__list ul {
    margin-left: 130px;
}

.top-information__list li {
    margin-bottom: 17px;
}

.top-information__list a {
    color: #fff;
    font-size: .16rem;
    display: flex;
}

.top-information__list time {
    width: 104px;
    text-align: right;
    margin-right: 11px;
    letter-spacing: 0.1em;
}

.top-information__list p {
    width: 83%;
}

.top-information .common-heading::before {
    top: 10px;
}


/* 共通 */
.top-second-contents {
    width: 915px;
    max-width: 100%;
    margin-left: auto;
}

.top-second-container {
    width: 1240px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}

.top-second-flex {
    display: flex;
    justify-content: space-between;
    margin-bottom: 39px;
}




/* 菓樂 */

.top-garaku {
    background-image: url(../images/top/top-garaku-back.jpg);
    width: 100vw;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 61px 0 22.2%;
	height: 968px;
}

.top-garaku .common-title img {
    /* width: 378px;
    max-width: 100%;
    margin: 0 auto; */
}

.top-garaku .common-title img {
    width: 174px;
    margin: 0 auto 13px;
    display: block;
}

.top-garaku__container > h3 {
    font-size: .24rem;
    writing-mode: vertical-rl;
    margin-left: auto;
    margin-top: -122px;
    letter-spacing: 0.14em;
    line-height: 1;
	white-space: nowrap;
}


.top-garaku__container {
    width: 1140px;
    max-width: 100%;
    padding: 0 20px;
}


.top-garaku2 {
    padding-top: 143px;
    padding-bottom: 114px;
}


.top-garaku2 .common-heading {
    margin-bottom: 163px;
}

.top-garaku2 .common-heading h2 {
    /* width: 667px; */
    max-width: 100%;
}

.top-garaku2__text {
    width: 55.5%;
    margin-top: -4px;
    position: relative;
}

.garaku-slick {
    width: 39.2%;
    margin-top: 8px;
}


.top-common-text p {
    font-size: .16rem;
    line-height: 2.4;
    margin-bottom: 15px;
}

.top-common-text p:nth-of-type(1) {
    margin-bottom: 15px;
}

.top-common-text p:nth-of-type(2) {
    line-height: 2.4;
}

/* 華樂 */
.top-kagura {
    background-image: url(../images/top/top-kagura-back.jpg);
    width: 100vw;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 60px 0 26.2%;
	height: 968px;
}


.top-kagura .common-title img {
    width: 178px;
    margin: 0 auto 13px;
    display: block;
}

.top-kagura__container,
.top-shura__container{
    width: 1140px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}

.top-kagura__container> h3,
.top-shura__container> h3{
    font-size: .24rem;
    writing-mode: vertical-rl;
    margin-top: -122px;
    letter-spacing: 0.14em;
    line-height: 1;
	white-space: nowrap;
}

.top-kagura2 {
    padding-top: 143px;
    padding-bottom: 116px;
}

.top-kagura2 .common-heading {
    margin-bottom: 163px;
}

.top-kagura2 .common-heading h2 {
    width: 349px;
    max-width: 100%;
}

.top-kagura2__text {
    width: 57.5%;
    margin-top: -4px;
    position: relative;
}

.kagura-slick {
    width: 39.2%;
    margin-top: 10px;
}

/* 珠樂*/

.top-shura {
    background-image: url(../images/top/top-shura-back.jpg);
    width: 100vw;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 58px 0 22.2%;
	height: 968px;
}

.top-shura .common-title img {
    width: 182px;
    max-width: 100%;
    display: block;
    margin: 0 auto 13px;
}

.top-shura__container {
    width: 1100px;
    max-width: 100%;
    margin: 0 auto;
	padding: 0 20px;
}

.top-shura__container>h3 {
    width: 24px;
    display: block;
    margin-top: -116px;
}

.top-shura2 {
    padding-top: 143px;
    padding-bottom: 114px;
}


.top-shura2 .common-heading {
    margin-bottom: 165px;
}

.top-shura2 .common-heading h2 {
    width: 371px;
    max-width: 100%;
}

.top-shura2__text {
    width: 55%;
    margin-top: -5px;
    position: relative;
}

.shura-slick {
    width: 40.2%;
    margin-top: 8px;
}



.edokaiki-text {
    position: absolute;
    width: 167px;
    left: 71px;
    bottom: 249px;
    z-index: -1;
}

.meijikaisou-text {
    position: absolute;
    width: 164px;
    left: 70px;
    bottom: 258px;
    z-index: -1;
}

.reiwakaisei-text {
    position: absolute;
    width: 165px;
    left: 70px;
    bottom: 250px;
    z-index: -1;
}


.top-kaikou__text p {
    line-height: 4.5;
}

.fade-con{
	opacity: 0;
	transition: 2s;
}

.fade-con-sp{
	opacity: 0;
	transition: 1.5s;
}

.continuous-fade{
    opacity: 1;
}

@media screen and (min-width:801px) and (max-width:1000px) {
    
	
    .top-garaku2 {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .top-garaku2 .common-heading {
        margin-bottom: 20px;
    }

    .edokaiki-text {
        left: -19px;
        right: 0;
        margin: auto;
    }


    .top-kagura2 {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .top-kagura2 .common-heading {
        margin-bottom: 20px;
    }

    .meijikaisou-text {
        position: absolute;
        width: 164px;
        left: -28px;
        right: 0;
        margin: auto;
        bottom: 164px;
        z-index: -1;
    }


    .top-shura2 {
        padding-top: 70px;
        padding-bottom: 70px;
    }


    .top-shura2 {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .top-shura2 .common-heading {
        margin-bottom: 20px;
    }

    .reiwakaisei-text {
        left: -15px;
        right: 0;
        margin: auto;
    }
}

@media screen and (max-width:800px) {

    .main{
        overflow: hidden;
    }

    .main h2 {
        font-size: .26rem;
    }

    .common-title p {
        font-size: .15rem;
        line-height: 2;
    }

    /* 共通 */
	
	.top-kaikou h1 {
		margin: 0 auto -152px;
	}
    .top-second-flex {
        margin-bottom: 38px;
        flex-direction: column-reverse;
    }

    .top-common-text {
        width: 100%;
    }

    .top-common-text p {
        font-size: .15rem;
        line-height: 2.4;
        margin-bottom: 15px;
        text-align: center;
    }

    .top-common-text p:nth-of-type(2) {
        line-height: 2.35;
    }

    .top-slick {
        width: 100%;
    }

    .link-btn__box {
        flex-direction: column;
        margin-left: 0;
    }

    .link-btn {
        font-size: .14rem;
        width: 55%;
        letter-spacing: 0.1em;
        margin: 0 auto 200px;
    }

    .link-btn::before {
        left: -35px;
    }
	
	.top-information {
		padding: 79px 0 79px;
	}

    /* 原 点 回 顧 */
    .top-kaikou {
        padding: 102px 20px 88px;
    }


    .top-kaikou>h1 {
        margin: 0px auto 73px;
    }
    .top-kaikou__img {
        width: 268px;
        display: block;
        margin: 0 auto 18px;
    }

    .top-kaikou__text p {
        font-size: .15rem;
        line-height: 2.67;
    }


    /* インフォメーション */
    .top-information {
        background-color: #666666;
        padding: 112px 0 94px;
    }

    .top-information .common-heading {
        margin-bottom: 54px;
    }

    .top-information .common-heading h2{
        margin-left: 0;
    }

    .top-information .common-heading::before {
        left: 23px;
    }

    .top-information__list {
        width: 87%;
        margin: 0 auto;
    }

    .top-information__list ul {
        margin-left: 0px;
    }

    .top-information__list li {
        margin-bottom: 49px;
    }

    .top-information__list li:last-of-type {
        margin-bottom: 0;
    }

    .top-information__list a {
        flex-direction: column;
        font-size: .15rem;
    }

    .top-information__list time {
        width: 104px;
        text-align: left;
    }

    .top-information__list p {
        width: 100%;
        line-height: 1.6;
        display: -webkit-box;             
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;   
    }


    /* 菓樂 */
    .top-garaku {
        padding: 60px 0 10%;
        background-image: url(../images/top/top-garaku-back-sp.jpg);
		
    }

    .top-garaku .common-title h2 {
        width: 163px;
        margin: 0 auto 24px;
    }

    .top-garaku__container>h3 {
        font-size: .20rem;
        letter-spacing: 0;
        line-height: 1.85;
        margin: 0 auto;
    }

    .top-garaku2 {
        padding-top: 57px;
        padding-bottom: 35px;
    }

    .top-garaku2 .common-heading h2 {
        width: 196px;
        max-width: 100%;
        margin-bottom: 30px;
    }

    .top-garaku2 .common-heading {
        margin-bottom: 341px;
    }

    .garaku-slick {
        margin-top: 8px;
        margin-bottom: 39px;
    }

    .edokaiki-text {
        width: 142px;
        left: 14px;
        right: 0;
        top: 220px;
        bottom: initial;
        margin: auto;
        z-index: -1;
    }



    /* 華樂  */
    .top-kagura {
        background-image: url(../images/top/top-kagura-back-sp.jpg);
        width: 100vw;
        padding: 59px 0 13.5%;
    }

    .top-kagura .common-title img {
        margin: 0 auto 27px;
		width: 163px;
    }

    .top-kagura__container> h3,
    .top-shura__container> h3 {
        font-size: .20rem;
        line-height: 1.85;
        width: auto;
        margin: 0 auto;
    }
    
    .top-kagura2 {
        padding-top: 60px;
        padding-bottom: 31px;
    }

    .top-kagura2 .common-heading h2 {
        width: 195px;
        margin-bottom: 31px;
    }

    .meijikaisou-text {
        width: 137px;
        left: 2px;
        right: 0;
        margin: auto;
        bottom: initial;
        top: 220px;
        z-index: -1;
    }

    .top-kagura2 .common-heading {
        margin-bottom: 338px;
    }

    .kagura-slick {
        margin-bottom: 41px;
    }

    .top-kagura2 .top-common-text p:nth-of-type(1),
    .top-kagura2 .top-common-text p:nth-of-type(2) {
        margin-bottom: 0px;
    }


    /* 珠樂 */
    .top-shura {
        background-image: url(../images/top/top-shura-back-sp.jpg);
        background-size: 105%;
        background-position: bottom center !important;
        padding: 60px 0 20.5%;
    }

    .top-shura .common-title img {
        margin: 0 auto 26px;
        width: 158px;
    }

    .top-shura2 {
        padding-top: 54px;
        padding-bottom: 0;
    }

    .top-shura2 .common-heading h2 {
        width: 183px;
        margin-bottom: 31px;
    }

    .top-shura2 .common-heading {
        margin-bottom: 308px;
    }

    .reiwakaisei-text {
        width: 135px;
        left: 0;
        right: 0;
        bottom: initial;
        top: 232px;
        margin: auto;
        z-index: -1;
    }

    .shura-slick {
        margin-bottom: 45px;
    }

    .top-shura2 .top-common-text p:nth-of-type(1),
    .top-shura2 .top-common-text p:nth-of-type(2) {
        margin-bottom: 0;
    }
	.top-garaku,
	.top-kagura,
	.top-shura{
		height: auto;
	}
	.top-garaku__container,
	.top-kagura__container,
	.top-shura__container{
		padding: 60px 20px 20px;
		display: flex;
		flex-direction: column;
		position: absolute;
		height: 100%;
		top: 0;
		justify-content: space-between;
	}
	
	.fade-con-sp{
		opacity: 1;
	}

	.fade-con-sp{
		opacity: 0;
		transition: 1.5s;
	}

	.continuous-fade{
		opacity: 1;
	}
}




/*--------------------------------------------------------------------------------
 kv
--------------------------------------------------------------------------------*/
.kv {
  width: 1080px;
	max-width: 100%;
/*   height: 550px; */
  margin: 0 auto 80px;
  position: relative;
}
.kv-inner {
  width: 100%;
  height: 100%;
  position: relative;
}
.kv-inner .kv-sky {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.kv-inner .kv-sky li img {
  width: 100%;
  height: auto;
}
.kv-inner .kv-shop {
  width: 100%;
  height: 100%;
/*   position: absolute; */
	position:relative;
  top: 0;
  left: 0;
  background: url('../images/top/bg_shop.png') center bottom no-repeat;
  background-size: 100% auto;
}
.kv-inner .kv-people {
  width: 217px;
  height: 141px;
  position: absolute;
  left: 50%;
  margin: 0 0 0 -108px;
  bottom: 20px;
  background: url('../images/top/people.gif') no-repeat;
  background-size: 100% 100%;
}

@media screen and (max-width: 768px) {
    .kv {
        width: 100%;
        height: 167vw;
        margin: 0 auto 80px;
    }
  .kv .kv-inner .kv-shop {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url('../images/top/bg_shop_sp.png') center bottom no-repeat;
    background-size: 100% auto;
  }
  .kv .kv-inner .kv-people {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: auto;
    margin: 0;
    background: url('../images/top/people_sp.gif') no-repeat;
    background-size: 100% auto;
  }

}
@-webkit-keyframes skyg {
  0% {
    background-position: 50% 0%;
  }
  50% {
    background-position: 50% 100%;
  }
  100% {
    background-position: 50% 0%;
  }
}
@keyframes skyg {
  0% {
    background-position: 50% 0%;
  }
  50% {
    background-position: 50% 100%;
  }
  100% {
    background-position: 50% 0%;
  }
}
