@charset "UTF-8";

/* -------------------------------------------------

slide（画像スライドショー）

------------------------------------------------- */
.main_photo {
	/*padding: 0 20px;*/
	padding: 0 2%;
 position: relative;
}

.slider {
 /*width: 100%;*/
 max-width: 1860px;
	width: 100%;
 /*height: 880px;*/
 height: 750px;
 /*margin-inline: auto;*/
	/*margin: auto;*/
 overflow: hidden; /* 画像がはみ出ないようにする */
	background-color: #eee; /* 画像下の背景色 */
	border-radius: 30px;
	position: relative;
}

/* 画像の上に透過 */
/*.slider::before {	
	content: "";
	z-index: 1;
	background-color:rgba(0,0,0,0.2);
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}*/
.slider::after {		/* 画像の上に赤線 */
	content: "";
	z-index: 2;
	background-color:#c50018;
	width: 10px;
	/*height: 225px;*/
	height: 200px;
	position: absolute;
	bottom: 20%;
	left: 0;
}
.slick-img img {
 width: 100%;
 /*height: 880px;*/
 height: 750px;
	object-fit: cover;
	image-rendering: -webkit-optimize-contrast;
}
@media screen and (min-width: 899px) and (max-width: 1366px) {
.slider {
 height: 580px;
}
.slider::after {		/* 画像の上に赤線 */
	/*width: 15px;
	height: 165px;
	bottom: 20%;*/
}
.slick-img img {
	/*height: 600px;*/
 height: 580px;
}
}
@media all and (max-width: 898px) {
.slider {
	/*height: 600px;*/
 height: 580px;
}
.slider::after {		/* 画像の上に赤線 */
	width: 10px;
	height: 165px;
	bottom: 20%;
}
.slick-img img {
	/*height: 600px;*/
 height: 580px;
}
}
@media all and (max-width: 768px) {
.slider {
 /*height: 500px;*/
 height: 500px;
	border-radius: 20px;
}
.slider::after {		/* 画像の上に赤線 */
	width: 10px;
	height: 145px;
	bottom: 20%;
}
.slick-img img {
	height: 500px;
}
}
@media all and (max-width: 568px) {
.slider {
 height: 400px;
}
.slider::after {		/* 画像の上に赤線 */
	width: 10px;
	height: 125px;
	bottom: 20%;
}
.slick-img img {
	height: 400px;
}
}
@media all and (max-width: 480px) {
.slider {
 height: 400px;
}
.slider::after {		/* 画像の上に赤線 */
	width: 7px;
	height: 100px;
	bottom: 20%;
}
.slick-img img {
	height: 400px;
}
}
@media all and (max-width: 360px) {
.slider::after {		/* 画像の上に赤線 */
	width: 7px;
	height: 80px;
	bottom: 20%;
}
}

/* 画像の配置
================================================== */
.ob_position__01 {
 object-position: center top;
}
.ob_position__02 {
 /*object-position: right 0px top 15%;*/
 object-position: right 0px top 35%;
}
.ob_position__03 {
 /*object-position: center top 25%;*/
 object-position: center center;
}
.ob_position__04 {
 object-position: right bottom;
}
.ob_position__05 {
 /*object-position: left center;*/
 object-position: center 0px top 45%;
}
.ob_position__06 {
 object-position: center center;
}
.ob_position__07 {
 object-position: center center;
}

@media all and (max-width: 414px) {
.ob_position__04 {
 object-position: left bottom;
}
}
@media all and (max-width: 375px) {
.ob_position__06 {
 object-position: 30%;
}
}


/* ズーム設定
================================================== */
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15); /* 拡大率 */
  }
}
.add-animation {
 animation: zoomUp 10s linear 0s normal both;
}
.slick-track {
 display: flex;
}
.slick-slide {
 height: auto !important;
}


/* -------------------------------------------------

catch copy

------------------------------------------------- */
.anime_box	{
	position: absolute;
	top:70%;
	left: 20%;
	transform: translate(-20%, -70%);
	z-index: 2;
	image-rendering: -webkit-optimize-contrast;		/*　拡大・縮小する画像のぼかし等を調整　*/
	visibility: hidden;
}
@media screen and (min-width: 899px) and (max-width: 1140px) {
.anime_box	{
	top:70%;
	left: 20%;
	transform: translate(-20%, -70%);
}
}
@media all and (max-width: 898px) {
.anime_box	{
	top:70%;
	left: 20%;
	transform: translate(-20%, -70%);
}
}
@media all and (max-width: 568px) {
.anime_box	{
	top:70%;
	left: 30%;
	transform: translate(-30%, -70%);
}
}
@media all and (max-width: 480px) {
.anime_box	{
	top:70%;
	left: 40%;
	transform: translate(-40%, -70%);
}
}