@charset "UTF-8";
/* CSS Document */
/* mainArea */
.mainArea {
/*	height: calc( var(--vh) * 100);*/
	width: 100%;
	height: 830px;
}
/*swiper*/
.swiper-container {
	width: 100%;
}
.swiper-slide {
	height: 830px;
}
.swiper-slide .slide-img {
	height: 830px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.slide01 {
	background-image: url("../img/top/main_01.jpg");
}
.slide02 {
	background-image: url("../img/top/main_02.jpg");
}
.slide03 {
	background-image: url("../img/top/main_03.jpg");
}
.slide04 {
	background-image: url("../img/top/main_04.jpg");
}
.slide05 {
	background-image: url("../img/top/main_05.jpg");
}
.swiper-container .swiper-pagination {
	width: 1200px;
	position: relative!important;
	bottom: -20px!important;
	left: 50%!important;
	transform: translateX(-75px)!important;
	z-index: 50!important;
	display: flex;
	justify-content: center;
	align-items: center;
}
.swiper-container .swiper-pagination-bullet {
	background: #FFF!important;
	width: 10px;
	height: 10px;
	border: 1px solid #767D85;
}
.swiper-pagination-bullet {
	opacity: 1;
}
.swiper-container .swiper-pagination-bullet-active {
	background: #767D85!important;
	width: 10px;
	height: 10px;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap,2px);
}
/*Scroll*/
/*.scrolldown1 {
  position: absolute;
  left: 50%;
	transform: translateX(-50%);
  bottom: 0;
	height: 50px;
}
.scrolldown1:after {
  content: "";
  position: absolute;
  top: 0;
	left: 50%;
	transform: translateX(-50%);
  width: 2px;
  height: 30px;
	background-color: #fff;
  animation: pathmove 1.4s ease-in-out infinite;
  opacity: 0;
}
@keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }
  30% {
    height: 30px;
    opacity: 1;
  }
  100% {
    height: 0;
    top: 50px;
    opacity: 0;
  }
}
*/
/* 共通 */
/* h2 */
.newsArea .inner h2,
.worksArea .inner h2 {
	padding-bottom: 55px;
	/*font-family: 'Lato', sans-serif;*/
	font-size: 12px;
	font-weight: bold;
	letter-spacing: .1em;
	color: #595757;
}

/* btn */
.btn02 {
	width: 280px;
	height: 52px;
	position: relative;
	display: block;
	border: 2px solid #fff;
	padding: 10px 30px;
	text-align: center;
	transition: ease .2s;
	background: rgba(255,255,255,.1);
	border-radius: 50px;
	font-family: 'Bebas Neue', cursive;
	font-size: 18px;
}
.btn02 span {
	position: relative;
	z-index: 3;
	color: #fff;
}
.btn02:hover {
	border: 2px solid #000;
}
.btn02:hover span {
	color: #000;
}
.bgcenterx:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	background: rgba(0,0,0,.8);
	width: 100%;
	height: 100%;
	transition: transform .3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
	transform: scale(0, 1);
	transform-origin: top;
	border-radius: 50px;
}
.bgcenterx:hover:before {
	transform: scale(1, 1);
}

/* newsArea */
.newsArea .inner {
	padding: 100px 20px 0;
}
.newsArea .inner .news ul li {
    padding: 0 0 15px;
}
.newsArea .inner .news ul li span {
	display: inline-block;
}
.newsArea .inner .news ul li .date {
	/*font-family: 'Lato', sans-serif;*/
	font-size: 12px;
	letter-spacing: .15em;
	color: #767D85;
}
.newsArea .inner .news ul li .ttl {
	padding-left: 4em;
}
.newsArea .inner .news ul li .ttl a {
	font-size: 12px;
/*	color: #767D85;
*/	font-family: 'Shippori Mincho', serif;
	font-weight: 700;
	color: #333;
}
.newsArea .inner .news ul li .ttl a:hover {
	font-size: 12px;
	color: #CCC;
}
/* worksArea */
.worksArea .inner {
	padding: 100px 20px 0;
}
.worksArea .inner .works ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.worksArea .inner .works ul li {
	width: 25%;
	margin-bottom: 80px;
	overflow: hidden;
    max-width: 248px;
    height: auto;
}
.worksArea .inner .works ul li img {
	aspect-ratio: 248 / 165;
    object-fit: cover;
	width: 100%;
}

@media screen and (max-width: 1200px) {
	.swiper-container .swiper-pagination {
		width: 100%;
		transform: translateX(-75px)!important;
	}
}

@media screen and (max-width: 1000px) {
/* mainArea */
	.mainArea {
		margin-top: 70px;
		height: 300px;
	}
	.mainArea .main_inner {
		height: 300px;
	}
	.scrolldown1 {
		display: none;
	}
/* swiper */
	.swiper-slide {
		height: 300px;
		background-size: cover;
		background-position: center center;
	}
	.swiper-container .swiper-pagination {
		transform: translateX(-55px)!important;
	}

/* 共通 */
/* h2 */
	.newsArea .inner h2,
	.worksArea .inner h2 {
		padding-bottom: 35px;
		font-size: 13px;
	}
/* bnrArea */
	.bnrArea .inner {
		padding: 50px 6vw;
	}
	.bnrArea .inner .bnr {
		height: 200px;
		padding: 20px;
		border: 2px solid #80b91f;
		justify-content: center;
	}
	.bnrArea .inner .bnr .item {
		text-align: center;
	}
	.bnrArea .inner .bnr .item h2 {
		font-size: 26px;
	}
	.bnrArea .inner .bnr .item .btn {
		padding-top: 20px;
		justify-content: center;
	}
	/* newsArea */
	.newsArea .inner {
		padding: 100px 8vw 0;
	}
	.newsArea .inner .news ul li .ttl {
		padding-left: 2em;
		line-height: 1.2;
	}
	/* worksArea */
	.worksArea .inner {
		padding: 100px 8vw 0;
	}
}	


@media screen and (max-width: 767px) {
	/* newsArea */
	.newsArea .inner .news ul li span {
		display: block;
	}
	.newsArea .inner .news ul li .ttl {
		padding-left: 0;
	}
}	

@media screen and (max-width: 600px) {
/* swiper */	
	.swiper-container .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
}
/* btn */	
	.btn02 {
		width: 100%;
	}	
/* bnrArea */	
	.bnrArea .inner .bnr .item h2 {
		font-size: 20px;
	}
	.bnrArea .inner .bnr .item {
		width: 100%;
	}	
	.bnrArea .inner .bnr .item .btn a {
		width: 100%;
	}
/* worksArea */	
	.worksArea .inner .works ul li {
		width: 46%;
		margin-bottom: 30px;
	}
}
