@charset "UTF-8";
/* CSS Document */
/*
background: linear-gradient(90deg, rgba(220,28,28,1) 0%, rgba(235,44,44,1) 38%, rgba(255,106,0,1) 100%);
*/



.l-container .main-movie{
	height: 100vh;
	width: 100%;
	position: relative;
}

.l-container .main-movie .movie{
	width: 100%;
	height: 100vh;
	object-fit: cover;
}

.l-container .main-movie .movie img{
	width: 100%;
	height: 100vh;
	object-fit: cover;
	position: relative;
}

.l-container .main-movie .mark{

	position: absolute;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.l-container .main-movie .mark img{
	max-width: 130px;
}


/* ******************************************* */
@media screen and (max-width: 768px) {
	/* ---------------------------------- */
	.l-container .main-movie .mark{
		padding: 0 0px 0 0;
		position: absolute;
		bottom: 0px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		display: none;
	}
	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
	/* ---------------------------------- */
	.l-container .main-movie .mark img{
		max-width: 110px;
	}

	/* ******************************************* */
}



/* ******************************************* */
/* ******************News-box************************* */

.news-box{
	margin: 20% auto 0;
	width: 100%;
	text-align: left;
	padding: 0 10%;
}


.news-box ul{
	margin: 10% auto;
}
.news-box ul a {
	color: unset;
}

.news-box ul li{
	margin: 5% auto 0;
	padding: 0 0 2%;
	border-bottom: solid 1px #cbcbc7;
}

.news-box ul li p{
	padding: 0 0 0 2%;
	line-height: 1.8em;
	width: 100%;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.news-box ul li .category{
	background: #bebeb8;
	color: #fff;
	padding: 0.5% 5px;
	font-size: 11px;
	margin-left: 10px;
}

.news-box ul li .category.open-day { background: #5b1b3b; }
.news-box ul li .category.post-staff { background: #141c27; }


/* ******************************************* */
@media screen and (max-width: 480px) {
	/* ---------------------------------- */
	.news-box{
		padding: 0 7%;
	}

	/* ******************************************* */
}



/* ******************************************* */
/* *****************about-box************************* */

.about-box{
	margin: 25% auto 0;
	width: 100%;
	height: 1900px;
	z-index: -1;
	position: relative;
}

.about-box::before{
	content: "";
	position: absolute;
	top: 0vh;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	background: #5b1b3b;
	width: 1px;
	height: 10vh;
	animation: pathmove 1.8s ease-in-out infinite;
	opacity:0;
}

.about-box .cloth{
	margin: 0 auto;
	width: 100%;
	background: url("../img/top/cloth@2x.jpg");
	height:1900px;
	background-size: cover;
}

.about-box .cloth .photo-cotainer,
.about-box .cloth .photo-cotainer2{
	margin: 0 auto;
	position: relative;
	width: 100%;
}

.about-box .cloth .photo-cotainer li,
.about-box .cloth .photo-cotainer2 li{
	position: absolute;
}


.about-box .cloth .photo-cotainer li:nth-child(1){
	top:120px;
	right: 30px;
}
.about-box .cloth .photo-cotainer li:nth-child(1) img{
	max-width: 221px;
}


.about-box .cloth .photo-cotainer li:nth-child(2){
	top:190px;
	left: 0vw;
}

.about-box .cloth .photo-cotainer li:nth-child(2) img{
	max-width: 175px;
}


.about-box .cloth .photo-cotainer li:nth-child(3){
	top:335px;
	right: 0vw;
}

.about-box .cloth .photo-cotainer li:nth-child(3) img{
	max-width: 166px;
}

.about-box .cloth .photo-cotainer li:nth-child(4){
	top:496px;
	left: 2.5vw;
}

.about-box .cloth .photo-cotainer li:nth-child(4) img{
	max-width: 211px;
}

.about-box .cloth .about-copy{
	width: 100%;
	position: absolute;
	top: 732px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	text-align: center;
	color: #fff;
}


.about-box .cloth .about-copy p{
	margin: 4vh auto;
	line-height: 2.3em;
}

.about-box .cloth .photo-cotainer2 li:nth-child(1){
	top:1200px;
	left: 0vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(1) img{
	max-width: 199px;
}

.about-box .cloth .photo-cotainer2 li:nth-child(2){
	top:1320px;
	right: 1vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(2) img{
	max-width: 202px;
}

.about-box .cloth .photo-cotainer2 li:nth-child(3){
	top:1540px;
	left: 2vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(3) img{
	max-width: 233px;
}


/* ******************************************* */
@media screen and (max-width: 768px) {
	/* ---------------------------------- */

	.about-box{
		height: calc((2400/768)*100vw);
	}

	.about-box .cloth{
		margin: 0 auto;
		width: 100%;
		background: url("../img/top/cloth@2x.jpg");
		height:calc((2400/768)*100vw);
		background-size: cover;
	}

	.about-box .cloth .photo-cotainer li:nth-child(1) img,
	.about-box .cloth .photo-cotainer li:nth-child(4) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(1) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(2) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(3) img{
		max-width: none;
		width: 38vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(2) img,
	.about-box .cloth .photo-cotainer li:nth-child(3) img{
		max-width: none;
		width: 35vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(1){
		top:15vw;
		right: 8vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(2) {
		top: 25vw;
		left: 0;
	}

	.about-box .cloth .photo-cotainer li:nth-child(3){
		top:51vw;
		right: 0vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(4){
		top:82vw;
		left: 7vw;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(1){
		top:1400px;
		left: 0vw;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(2){
		top:1470px;
		right: 30px;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(3){
		top:1840px;
		left: 70px;
	}

	.about-box .cloth .about-copy{
		width: 100%;
		position: absolute;
		top: calc((900/768)*100vw);
	}

	/* ******************************************* */
}


/* ******************************************* */
@media screen and (max-width: 500px) {
	/* ---------------------------------- */

	.about-box{
		height: 1800px;
	}
	.about-box .cloth{
		background: url("../img/top/cloth@2x.jpg");
		height:1900px;
		background-size: cover;
	}

	.about-box .cloth .photo-cotainer li:nth-child(1){
		top:120px;
		right: 3vh;
	}

	.about-box .cloth .photo-cotainer li:nth-child(2){
		top:45vw;
		left: 0vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(3){
		top:70vw;
		right: 0vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(4){
		top:105vw;
		left: 3.5vw;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(1){
		top:235vw;
		left: 0vw;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(2){
		top:265vw;
		right: 3vw;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(3){
		top:310vw;
		left: 5vw;
	}

	.about-box .cloth .about-copy{
		top: 40%;
	}

	.about-box .cloth .photo-cotainer li:nth-child(1) img,
	.about-box .cloth .photo-cotainer li:nth-child(4) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(1) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(2) img,
	.about-box .cloth .photo-cotainer2 li:nth-child(3) img{
		max-width: none;
		width: 47vw;
	}

	.about-box .cloth .photo-cotainer li:nth-child(2) img,
	.about-box .cloth .photo-cotainer li:nth-child(3) img{
		max-width: none;
		width: 37vw;
	}



	/* ******************************************* */
}


/* ******************************************* */
@media screen and (max-width: 480px) {
	/* ---------------------------------- */

	.about-box .cloth{
		background: url("../img/top/cloth@2x.jpg");
		height:100%;
		background-size: cover;
	}
	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 450px) {
	/* ---------------------------------- */
	.about-box{
		height: 1700px;
	}

	.about-box .cloth .about-copy{
		top: 41%;
	}

	.about-box .cloth .photo-cotainer2 li:nth-child(1){ top:245vw; }

	.about-box .cloth .photo-cotainer2 li:nth-child(2){ top:275vw; }

	.about-box .cloth .photo-cotainer2 li:nth-child(3){ top:320vw; }

	/* ******************************************* */
}



/* ******************************************* */
@media screen and (max-width: 420px) {
	/* ---------------------------------- */
	.about-box{
		height: 1500px;
	}

	.about-box .cloth .about-copy{
		top: 41%;
	}

	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 400px) {
	/* ---------------------------------- */

	.about-box .cloth .about-copy{
		top: 41%;
	}

	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
	/* ---------------------------------- */

	.about-box{
		height: 1400px;
	}

	/* ******************************************* */
}
/* ******************************************* */
/* *****************cuisine-box************************* */

.cuisine-box{
	margin: 0 auto;
	padding: 20% 0 0%;
	background: #1a2433;
	position: relative;
}

.cuisine-box h2{
	padding: 0 0 0 10%;
	color: #fff;
}

.cuisine-box .sub-title{
	padding: 0 0 0 11%;
	color: #fff;
	letter-spacing: 0.08em;
}

.cuisine-box .text{
	margin: 10% auto 0;
	padding: 0 0 0 11%;
	color: #fff;
	line-height: 2.0em;
}

.cuisine-box p{
	text-align: left;
}


.cuisine-box .cuisine-img{
	position: absolute;
	top:300px;
	right: 0px;
}

.cuisine-box .cuisine-img img{
	max-width: 255px;
}

.cuisine-box .more-btn{
	position: absolute;
	top:500px;
	right: 67%;
}

/* *******************-- 修正 --******************** */
ul.slider {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	overflow: hidden;
}

.slider li{
	width: calc((100% - 3%)/3);
}


/* ******************************************* */
@media screen and (max-width: 768px) {
	/* ---------------------------------- */
	.cuisine-box .more-btn{
		padding: 0 0 0 19%;
		position: absolute;
		top:50%;
		right: 0vw;
		left: -135%;
	}

	.cuisine-box .cuisine-img{
		position: absolute;
		top:300px;
		right: 0px;
		max-width: 50vw;
	}

	.cuisine-box .cuisine-img img{
		max-width: none;
		width: 100%;
	}

	.cuisine-box .slider{
		margin: 350px auto 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
	}


	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 500px) {
	/* ---------------------------------- */
	.cuisine-box .slider{
		margin: 250px auto 0;
	}
	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 420px) {
	/* ---------------------------------- */
	.cuisine-box .more-btn{
		left: -125%;
	}
	/* ******************************************* */
}


/* ******************************************* */
/* ****************restaurant-box************************* */
.restaurant-box{
	margin: 25% auto 0;
	position: relative;
	text-align: center;
}

.restaurant-box h2{
	padding: 100px 0 0;
	position: relative;
}
.restaurant-box .sub-title {
	color: #1a2433;
}

.restaurant-box h2::before{
	content: "";
	position: absolute;
	top: 0vh;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	background: #5b1b3b;
	width: 1px;
	height: 10vh;
	animation: pathmove 2.5s ease-in-out infinite;
	opacity:0;
}

@keyframes pathmove{
	0%{
		height:0vh;
		top:-5vh;
		opacity: 0;
	}
	30%{
		height:10vh;
		opacity: 1;
	}
	100%{
		height:0vh;
		top:5vh;
		opacity: 0;
	}
}



.restaurant-box .text{
	margin: 40px auto 60px;
	line-height: 1.7em;
}

.restaurant-box div{
	margin: 0 auto;
	width: 80%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-flow: row nowrap;
}

.restaurant-box div p{
	width: 47%;
}

.restaurant-box div p:hover{
	opacity: 0.4;
	transition: 0.5s;
}

.restaurant-bottom{
	margin: -100px auto 0;
	background: #cbcbc7;
	padding: 3% 0 4%;
	z-index: -1;
}

.restaurant-bottom ul{
	margin: 150px auto 0;
}

/* ******************************************* */
@media screen and (max-width: 420px) {
	/* ---------------------------------- */
	.restaurant-box div{
		margin: 0 auto;
		width: 90%;
	}

	/* ******************************************* */
}

/* ******************************************* */
/* ****************scene-box************************* */

.scene{
	margin: 25% auto 0;
	width: 100%;
	position: relative;
}

.scene h2{
	text-align: center;
}


.scene .sub-title{
	color: #1a2433;
	text-align: center;
	letter-spacing: 0.08em;
}

.scene .box01{
	margin: 17% auto 0;
	position: relative;
}

.scene .box01 .photo,
.scene .box03 .photo{
	width: 90%;
	text-align: left;
}

.scene .box01 .pic{
	position: absolute;
	right: 0%;
	top:1vw;
	width: 30%;
}

.scene .box01 .text-box,
.scene .box03 .text-box{
	margin: 10% auto 0;
	padding: 0 19% 0 19%;
}

.scene .box02 .text-box{
	margin: 10% auto 0;
	padding: 0 13% 0 16%;
	color:#fff;
}

.scene .text-box h4{
	margin: 0 auto 6%;
	text-align: left;
}

.scene .text-box h4 span{
	border-bottom: #cbcbc7 solid 2px;
}

.scene .box02 .text-box h4 span{
	border-bottom: #fff solid 2px;
}


.scene .text-box .text{
	line-height: 1.7em;
}

.scene .text-box .more-btn{
	margin: 55px auto 0;
}

.scene .box02{
	margin: 10% auto 0;
	position: relative;
	background: linear-gradient(-180deg,  #fff 0%, #fff 25%, #cbcbc7 25%, #cbcbc7 100%);
	padding: 0 0 30% 0;
}

.scene .box02 .photo{
	width: 100%;
	padding: 0 0 0 10%;
	position: relative;
}

.scene .box02 .pic{
	position: absolute;
	left:15%;
	top:-5%;
	width: 24%;
}

.scene .box03{
	margin: -25% auto 0;
	padding: 0 0 30% 0;
	position: relative;
}


.scene .box03 .pic{
	position: absolute;
	bottom:10px;
	left: -40px;
	width: 60%;
}


/* ******************************************* */
@media screen and (max-width: 768px) {
	/* ---------------------------------- */
	.scene .sub-title{
		padding: 2% 0% 0 0%;
		text-align: center;
	}

	/* ******************************************* */
}


/* ******************************************* */
@media screen and (max-width: 500px) {
	/* ---------------------------------- */
	.scene .box02 .text-box{
		margin: 10% auto 0;
		padding: 0 10% 0 15%;
		color:#fff;
	}

	.scene .box01 .text-box,
	.scene .box03 .text-box{
		margin: 10% auto 0;
		padding: 0 14% 0 14%;
	}
	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 420px) {
	/* ---------------------------------- */

	.scene .box01 .photo,
	.scene .box03 .photo{
		width: 95%;
		text-align: left;
	}

	.scene .box02 .photo{
		width: 100%;
		padding: 0 0 0 5%;
		position: relative;
	}

	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
	/* ---------------------------------- */
	.scene .box02 .text-box{
		margin: 10% auto 0;
		padding: 0 9% 0 12%;
		color:#fff;
	}

	.scene .box01 .text-box,
	.scene .box03 .text-box{
		margin: 10% auto 0;
		padding: 0 10% 0 10%;
	}
	/* ******************************************* */
}


/* ******************************************* */
/* ****************fair&event************************* */
.fair-box{
	margin: -10% auto 0;
	width: 100%;
	background: url("../img/top/fair-back.jpg") no-repeat;
	height: 576px;
	background-size: cover;
	position: relative;
}

.fair-box .sub-title {
	margin: 0 auto;
}

.fair-box .text-box{
	padding: 100px 5% 0 35%;
}


.fair-box h2{
	color: #fff;
}

.fair-box p{
	margin: 10% auto 0;
	color: #fff;
	line-height: 1.8em;
	padding: 0 0 0 1%;
}

.fair-box .more-btn{
	padding: 25% 11% 0 0;
}

/* ******************************************* */
@media screen and (max-width: 500px) {
	/* ---------------------------------- */
	.fair-box .text-box{
		padding: 100px 5% 0 30%;
	}

	.fair-box h2{
		font-size:58px;
	}
	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width:450px) {
	/* ---------------------------------- */
	.fair-box .text-box{
		padding: 100px 5% 0 18%;
	}

	.fair-box p{
		margin: 10% auto 0;
		color: #fff;
		line-height: 1.8em;
		padding: 5% 0 0 25%;
	}

	/* ******************************************* */
}

/* ******************************************* */
@media screen and (max-width:380px) {
	/* ---------------------------------- */
	.fair-box .text-box{
		padding: 100px 5% 0 16%;
	}
	/* ******************************************* */
}

/* ******************************************* */
/* ****************access************************* */
.access{
	margin: 0 auto;
	background: #cbcbc7;
	padding: 10% 10%;
	position: relative;
}


.access h2{
	color: #fff;
}

.access .map{
	margin: 2% auto;
}

.access .map iframe {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}

.access .adress{
	margin: 3% auto;
	color: #fff;

}

.access .adress .line{
	padding: 0 0 5px 0;
	border-bottom: 1.5px #fff solid;
}

.access .adress .parking{
	line-height: 3.0em;
}


.access .more-btn{
	margin: 10px auto;
	text-align: left;
}

.bottom-line{
	margin: 10px auto;
	border-bottom: solid #cbcbc7 1.5px;
}

/* -------------- 動画部分のcss --------------------*/
video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: relative;
	z-index: 0;
}
.sp-visual { display: none; }
.movie .img-bg { display: none; }

@media (max-width: 768px) {
	.l-container .main-movie {
		height: calc(100vh - ((347/768)*100vw));
		width: 100%;
	}
	.l-container .main-movie .movie { height: 100%; }
	.sp-visual {
		display: inline-block;
		background: url("../img/top/cloth@2x.jpg") no-repeat;
		background-size: cover;
		width: 100%;
		padding-top: 5px;
		margin-top: -5px;
		color: #fff;
	}
	.sp-visual h2 {
		margin: 70px auto 25px;
		text-align: center;
		font-size: 15px;
		line-height: 1.7;
		letter-spacing: 0.05em;
		color: #fff;
		font-weight: normal;
	}
	.sp-visual p {
		font-size: 17px;
		text-align: center;
		line-height: 1.4;
		margin-bottom: 39px;
	}
	.sp-visual div {
		font-size: calc((160/768)*100vw);
		text-align: center;
		margin-bottom: calc((29/768)* -100vw);
		line-height: 1;
	}
}

@media (max-width: 768px) and (max-height: 1024px) {
	.l-container .main-movie { height: calc(100vh - ((347/768)*100vw)); }
}
@media (max-width: 480px) {
	.l-container .main-movie { height: calc(100vh - ((369/480)*100vw)); }
}
@media (max-width: 390px) {
	.l-container .main-movie { height: calc(100vh - ((322/390)*100vw)); }
}

/* ------ 　photo-cotainer2 ４枚パターン　---------- */
/*
* 下記を消せば３枚パターン
*/
.about-box .cloth .photo-cotainer2 li:nth-child(1) img {
	max-width: 221px;
}
.about-box .cloth .photo-cotainer2 li:nth-child(2) img {
	max-width: 175px;
}
.about-box .cloth .photo-cotainer2 li:nth-child(3) img {
	max-width: 166px;
}
.about-box .cloth .photo-cotainer2 li:nth-child(4) img {
	max-width: 211px;
}
.about-box .cloth .photo-cotainer2 li:nth-child(1) {
	top: 1200px;
	left: 3vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(2) {
	top: 1293px;
	right: 0vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(3) {
	top: 1447px;
	left: 0.5vw;
}
.about-box .cloth .photo-cotainer2 li:nth-child(4) {
	top: 1630px;
	right: 2vw;
}
@media (max-width:768px) {
	.about-box .cloth .photo-cotainer2 li:nth-child(1) {
		top: 178vw;
		left: 5vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(2) {
		top: 198vw;
		right: -1vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(3) {
		top: 222vw;
		left: 0vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(4) {
		top: 260vw;
		right: 3vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(1) img {
		max-width: unset;
		width: calc((300/768)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(2) img {
		max-width: unset;
		width: calc((270/768)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(3) img {
		max-width: unset;
		width: calc((240/768)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(4) img {
		max-width: unset;
		width: calc((330/768)*100vw);
	}
	.movie .img-bg {
		position: absolute;
		background: url(../img/top/main-videoimg.jpg) no-repeat;
		background-size: cover;
		top: 0;
		left: 0;
		width: 100vw;
		aspect-ratio: 390/341;
		z-index: -1;
	}
}
@media (max-width: 500px) {
	.about-box .cloth .photo-cotainer2 li:nth-child(1) {
		top: 235vw;
		left: 9vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(2) {
		top: 254vw;
		right: -3vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(3) {
		top: 286vw;
		left: 0vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(4) {
		top: 324vw;
		right: 3vw;
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(1) img {
		max-width: unset;
		width: calc((221/480)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(2) img {
		max-width: unset;
		width: calc((175/480)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(3) img {
		max-width: unset;
		width: calc((166/480)*100vw);
	}
	.about-box .cloth .photo-cotainer2 li:nth-child(4) img {
		max-width: unset;
		width: calc((211/480)*100vw);
	}
}
@media (max-width: 390px) {
	.about-box .cloth .photo-cotainer2 li:nth-child(1) { top: 250vw; }
	.about-box .cloth .photo-cotainer2 li:nth-child(2) { top: 271vw; }
	.about-box .cloth .photo-cotainer2 li:nth-child(3) { top: 296vw; }
	.about-box .cloth .photo-cotainer2 li:nth-child(4) { top: 340vw; }
}