@charset "UTF-8";
.fade0 {
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: .5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fade01 {
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: .5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fade04 {
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 2.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
@keyframes fade0 {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
.fade03 {
	animation-name: fade03;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
@keyframes fade03 {
	0% {
		margin-top: 30px;
		opacity: 0;
	}
	100% {
		margin-top: 0;
		opacity: 1;
	}
}

.fadetxt01 {
	  animation-name: fade-lr;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-delay: 1.5s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    opacity: 0;
    margin-bottom: 10px;
}
.fadetxt02 {
	animation-name: fade-lr;
	animation-duration: 1.5s;
	animation-timing-function: ease-out;
	animation-delay: 2.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fadetxt03 {
	animation-name: fade-lr;
	animation-duration: 2s;
	animation-timing-function: ease-out;
	animation-delay: 3.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fadetxt04 {
	animation-name: fade-lr;
	animation-duration: 2s;
	animation-timing-function: ease-out;
	animation-delay: 3.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
	margin-top: -15px;
}
.fadetxt05 {
	animation-name: fade-lr;
	animation-duration: 2s;
	animation-timing-function: ease-out;
	animation-delay: 3.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.mv-border {
	animation-name: fade-lr;
	animation-duration: 0.5s;
	animation-timing-function: ease-out;
	animation-delay: 5.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fadetxt06 {
	animation-name: fade-lr;
	animation-duration: 1.5s;
	animation-timing-function: ease-out;
	animation-delay: 6s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
	margin-top: 65px;
}

.fadetxt07 {
	animation-name: fade-lr;
	animation-duration: 2s;
	animation-timing-function: ease-out;
	animation-delay: 6.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
	margin-top: 20px;
}
@keyframes fade-lr {
	from {
		clip-path: inset(0 100% 0% 0%);
		opacity: 0;
	}
	to {

		clip-path: inset(0);
		opacity: 1;
	}
}
@keyframes fade-ft {
	from {
		clip-path: inset(0 0 100% 0%);
		opacity: 0;
	}
	to {
		clip-path: inset(0);
		opacity: 1;
	}
}
.mv-fadeinUp {
    animation-name: fadeInUp;
    animation-duration: .7s;
    animation-timing-function: ease-out;
    animation-delay: 2s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    opacity: 0;
}
@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(10%);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}
@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-10%);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}
@keyframes colorchange1 {
	0% {
    color: #505050;
    width: 0;
    text-decoration: none;
	}
	100% {
    color: #70A3F0;
    width: 100%;
    text-decoration: underline;
	}
}
@keyframes colorchange2 {
	0% {
    color: #505050;
    width: 0;
    text-decoration: none;
	}
	100% {
    color: #F0B0BC;
    width: 100%;
    text-decoration: underline;
	}
}
@keyframes border {
	0% {
    width: 0;
	}
	100% {
    width: 100%;
	}
}
.bijou01 .title-area .bijou_title img,
.bijou01 .title-area .title_photo
{
	opacity: 0;
}

.bijou01 .title-area.active .title_photo{
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: .5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.bijou01 .title-area.active .bijou_title img:nth-child(1){
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;	
}
.bijou01 .title-area.active .bijou_title img:nth-child(2){
	animation-name: fade03;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.bijou01 .item-photo-01,
.bijou01 .item-photo-02,
.bijou01 .item-photo-03{
	opacity: 0;
	transition:opacity 0.5s ease-out;
}
.bijou01 .active.item-photo-01,
.bijou01 .active.item-photo-02,
.bijou01 .active.item-photo-03{
	opacity: 1;
}

.bijou01 .item-point-text.active.fade-ft {
  animation-name: fade-ft;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}
.ribbon01 .title-area .ribbon_title img,
.ribbon01 .title-area .title_photo
{
	opacity: 0;
}

.ribbon01 .title-area.active .title_photo{
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: .5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.ribbon01 .title-area.active .ribbon_title img:nth-child(1){
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;	
}
.ribbon01 .title-area.active .ribbon_title img:nth-child(2){
	animation-name: fade03;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.ribbon01 .item-photo-01,
.ribbon01 .item-photo-02,
.ribbon01 .item-photo-03{
	opacity: 0;
	transition:opacity 0.5s ease-out;
}
.ribbon01 .active.item-photo-01,
.ribbon01 .active.item-photo-02,
.ribbon01 .active.item-photo-03{
	opacity: 1;
}

.ribbon01 .item-point-text.active.fade-ft {
  animation-name: fade-ft;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}

.ruffles01 .title-area .ruffles_title img,
.ruffles01 .title-area .title_photo
{
	opacity: 0;
}

.ruffles01 .title-area.active .title_photo{
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: .5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.ruffles01 .title-area.active .ruffles_title img:nth-child(1){
	animation-name: fade0;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.0s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;	
}
.ruffles01 .title-area.active .ruffles_title img:nth-child(2){
	animation-name: fade03;
	animation-duration: .5s;
	animation-timing-function: ease-out;
	animation-delay: 1.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
}

.ruffles01 .item-photo-01,
.ruffles01 .item-photo-02,
.ruffles01 .item-photo-03{
	opacity: 0;
	transition:opacity 0.5s ease-out;
}
.ruffles01 .active.item-photo-01,
.ruffles01 .active.item-photo-02,
.ruffles01 .active.item-photo-03{
	opacity: 1;
}

.ruffles01 .item-point-text.active.fade-ft {
  animation-name: fade-ft;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}
.item-title .title-fade01,
.item-title .title-fade02,
.item-title .title-fade03,
.item-title .title-fade04 {
  opacity: 0;
}

.item-title.active .title-fade01 {
  animation-name: fade-lr;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}
.item-title.active .title-fade02 {
  animation-name: fade-lr;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 1s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}
.item-title.active .title-fade03 {
  animation-name: fade-lr;
  animation-duration: 1.5s;
  animation-timing-function: ease-out;
  animation-delay: 1.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  opacity: 0;
}
.item-title.active .title-fade04 {
	animation-name: fade-lr;
	animation-duration: 1s;
	animation-timing-function: ease-out;
	animation-delay: 2s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: forwards;
	opacity: 0;
  }

.active .fadeInFromTop {
  animation-name: fade-ft;
  animation-duration: 1.5s;
  animation-timing-function: ease-out;
  animation-delay: 1.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.active .fadeInDawn {
    animation-name: fadeInDown;
    animation-duration: 1s;
    animation-timing-function: ease-out;
    animation-delay: 1s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    opacity: 0;
}
.item-point.active.fadeInLeft,
.item-closeup.active .fadeInLeft {
	animation-name: fade-lr;
  animation-duration: 0.5s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.active.fadeInLeft,
.active .fadeInLeft {
  animation-name: fade-lr;
  animation-duration: 0.5s;
  animation-timing-function: ease-out;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.talk-title.active .talk-title01 {
	animation-name: fade-lr;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-delay: 0;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.talk-title.active .talk-title02 {
	animation-name: fade-lr;
  animation-duration: 1.5s;
  animation-timing-function: ease-out;
  animation-delay: 1s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
}