/* 画面用 */
@media screen {
#main_print { display: none; }
}

/* 印刷用 */
@media print {
#main_print img { margin: 0 auto;}
}



.main_moji{
	position: absolute;
	/*
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	*/
	left: 3%;
	bottom: 5%;
	width: 100%;
	z-index: 10;
	/*display: none;*/
}
.main_moji img{
	max-width: 920px;
	width: 70%;
	height: auto;
	/*margin: 0 auto;*/
	/*border: 1px solid #fff;*/
	padding: 10px 15px;
	background: url("../images/main_filter.png") repeat;
}
@media print, screen and (min-width: 768px){
	/*.main_moji{display: block;}*/
	.main_moji img{ width: 60%;}
}
@media print, screen and (min-width: 1200px){
	.main_moji{
		left: 0;
		bottom: 10%;
	}
	.main_moji img{
		max-width: 1110px;
		/*width: 40%;*/
		width: 50%;
		padding: 20px 30px;
		margin: 0 auto;
	}
}
/*
.main_moji_sp img{
	max-width: 1110px;
	width: 70%;
	height: auto;
	margin: 0 auto;
	border: 1px solid #000;
	padding: 15px 20px;
}
*/

/*=============
slick
=============*/
#mainimage {
	overflow: hidden;
	/*height: 400px;*/
	position: relative;
}

#mainimage .in{
	display: -webkit-flex;
    display: flex;
    align-items: center;
}
#mainimage .slide_photo{
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  max-width: 1000px;
	/*height: 400px;*/
}
#mainimage .slide_photo:last-child{
  left: auto;
  right: 0;
}

/*上から下へ動く*/
#mainimage .slide_photo:last-child .slick-list {
transform: rotate(180deg)!important;
}
#mainimage .slide_photo:last-child .slick-list img{
transform: rotate(180deg);
}
/**/

#mainimage .sliderArea {
  max-width: 100%;
}
#mainimage .slick-slide img {
  /*width: 100%;
  height: auto;*/
    display: block;
    /*aspect-ratio: 300/500;*/
    width: 100%;
    /*height: 400px;*/
    object-fit: cover;
}
#mainimage .slick-slide {
  transition: all ease-in-out .3s;
  opacity: 0;
}
#mainimage .slick-active {
  opacity: 1;
}
#mainimage .slick-current {
  opacity: 1;
}
.thumb {
  /*margin: 20px 0 0;*/
}
.thumb .slick-slide {
  cursor: pointer;
}
.thumb .slick-slide:hover {
  opacity: .7;
}



#mainimage {
    height: 185px;
    /*margin-top: -50px;*/
}
#mainimage .slide_photo{
    height: 185px;
}
#mainimage .slick-slide img {
    height: 185px;
}
@media print, screen and (min-width: 576px) {
	#mainimage {
		height: 295px;
	}
	#mainimage .slide_photo{
		height: 295px;
	}
	#mainimage .slick-slide img {
		height: 295px;
	}
}
@media print, screen and (min-width: 768px) {
	#mainimage {
		height: 320px;
	}
	#mainimage .slide_photo{
		height: 320px;
	}
	#mainimage .slick-slide img {
		height: 320px;
	}
}
@media print, screen and (min-width: 992px) {
	#mainimage {
		height: 395px;
	}
	#mainimage .slide_photo{
		height: 395px;
	}
	#mainimage .slick-slide img {
		height: 395px;
	}
}
@media print, screen and (min-width: 1200px) {
	#mainimage {
		height: 470px;
	}
	#mainimage .slide_photo{
		height: 470px;
	}
	#mainimage .slick-slide img {
		height: 470px;
	}
}
@media print, screen and (min-width: 1600px) {
	#mainimage {
		height: 800px;
	}
	#mainimage .slide_photo{
		height: 800px;
	}
	#mainimage .slick-slide img {
		height: 800px;
	}
}


/**/

/* scroll */
.scroll_area{
	position: relative;
	width: 55%;
}
.scroll_anime {
  position: absolute;
  bottom: 106px;
  right: min(3.91vw, calc(30px + 16px + 10px));
  writing-mode: vertical-rl;
  white-space: nowrap;
	/*
  font-family: "Oswald", sans-serif;
  font-weight: 500;
	*/
  font-size: 12px;
  color: #fff;
  letter-spacing: 0.1em;
  z-index: 4;
	font-family: "Roboto", sans-serif;
	font-weight: 700;
}

.scroll_anime::before {
  content: "";
  position: absolute;
  bottom: -106px;
  left: calc(16px + 10px);
  width: 1px;
  height: 160px;
  /*background: rgba(29, 32, 135, 0.5);*/
	background: none;
}
.scroll_anime::after {
  content: "";
  position: absolute;
  bottom: -106px;
  left: calc(16px + 10px);
  width: 1px;
  height: 160px;
  background: #fff;
  animation: lineAnime 3s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes lineAnime {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }

  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }

  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }

  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}