@charset "utf-8";
.top_mv {
	position: relative;
}
.top__mv_list li {
	position: relative;
}
.top__mv_txt_area01 {
	position: absolute;
	top: 15px;
	left: 25px;
}
.top__mv_txt_area01 .top__mv_txt {
	width: 222px;
}
.top__mv_txt_area02 {
	position: absolute;
	bottom: 15px;
	right: 15px;
}
.top__mv_txt_area02 .top__mv_txt {
	width: 280px;
}
.top__mv_txt_area03 {
	position: absolute;
	top: 15px;
	right: 25px;
}
.top__mv_txt_area03 .top__mv_txt {
	width: 220px;
}

.top_mv .slick-dots {
	bottom: -25px;
}
.main_content {
	background-color: #F2F2F2;
}
.top__lead {
	padding-top: 135px;
	background: url("../img/top/top_lead_bg_sp.png") no-repeat;
	background-size: contain;
	background-position: top;
}
.top__wrap {
	padding: 0 20px;
}
.top__lead_txt01 {
	font-size: 25px;
	font-weight: bolder;
	line-height: calc(30 / 25);
	margin-bottom: 15px;
}
.top__lead_txt02 {
	font-size: 16px;
	line-height: calc(28 / 16);
}
.top__box_img {
	display: block;
	margin-bottom: 15px;
}
.top__box_txt_area {
	display: block;
}
.top__box_ttl {
	font-size: 20px;
	font-weight: normal;
	line-height: calc(22 / 20);
	margin-bottom: 10px;
}
.top__box_ttl>span {
	font-size: 70%;
}
.top__box_txt {
	font-size: 14px;
	line-height: calc(25 / 14);	
}
.top__box_btn {
	display: block;
	max-width: 36px;
	margin-left: auto;
	position: relative;
	width: 100%;
	height: 36px;
}
.top__box_btn::before {
	position: absolute;
	content: "";
	background-repeat: no-repeat;
	background-size: contain;
	width: 36px;
	height: 36px;
	background-image: url(../img/top/top__link_btn_hover.svg);
}
.top__box {
	margin-bottom: 36px;
}
.top__box:last-child {
	margin-bottom: 0;
}
.sect02 {
	margin-top: 25px;
	margin-bottom: 27px;
}
.sect02::before {
	display: block;
	content: "";
	border-top: 1px solid #000;
	width: 90%;
    margin: 0 auto;
}
.sect03 {
	padding-top: 185px;
	background: url("../img/top/top__bg_sp.png") no-repeat;
	background-size: cover;
	padding-bottom: 20px;
}
.sect03 .cmn_ttl {
	color: #fff;
}
.top__sect03_txt01 {
	font-size: 16px;
	line-height: calc(28 / 16);
	color: #fff;
	margin-bottom: 15px;
}
.top__sect03_txt02 {
	font-size: 14px;
	line-height: calc(25 / 14);
	color: #fff;
}
.mv__scroll {
	display: none;
}
@media screen and (max-width:767px) {
	.top__box_img_ttl {
		display: none;
	}
}
@media screen and (min-width:768px) {
	.mv__scroll__wrap {
		z-index: 1;
		position: absolute;
		left: 50%;
		bottom: 1em;
		display: block;
	}
	.mv__scroll {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		transform: translateX(-50%);
		background-color: transparent;
		border-width: 0;
		color: #fff!important;
		font-family: Lato;
		font-size: 12px;
		letter-spacing: .3em;
		text-indent: 0.3em;
		cursor: pointer;
	}
	.mv__scroll-icon {
		position: relative;
		display: block;
		border-radius: 16px;
		width: 18px;
		height: 26px;
		border: 1px solid #fff;
		margin-top: 0.5em;
	}
	.mv__scroll-icon:after {
		content: "";
		position: absolute;
		left: 50%;
		top: 6px;
		width: 2px;
		height: 2px;
		border-radius: 10px;
		background: #fff;
		transform: translateX(-50%);
	}
	.mv__scroll:hover .mv__scroll-icon:after {
		animation: c 1.2s infinite;
	}
	@keyframes c{
		18%{height:2px;top:13px}
		56%{height:11px;top:4px}74%,82%{height:2px;top:4px}
	}
	.top__box_img {
		position: relative;
	}
	.top__box_img::before {
		position: absolute;
		content: "";
		top: 0;
		bottom: 0;
		width: 100%;
		background-color: #4D4D4D;
		opacity: 0.9;
		transition: width .3s ease-in-out;
	}
	.top__box.is_hover .top__box_img::before {
		width: 0;
	}
	.top__box .top__box_txt_area::before {
		position: absolute;
		content: "";
		width: 0;
		left: 0;
		transition: width .7s ease-in-out;
		height: 2px;
		background-color: #000;
		top: -2px;
	}
	.top__box.is_hover .top__box_txt_area::before {
		width: 100%;
	}
	.top__box_img_ttl {
		font-size: 46px;
		text-align: center;
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		top: 0;
		bottom: 0;
		/* transform: translateY(-50%); */
		left: 0;
		right: 0;
		margin: auto;
		color: #fff;
		opacity: 0.5;
		z-index: 2;
	}
	.top__box_txt_area {
		z-index: 3;
	}
	.sect01 {
		overflow: hidden;
	}
	.sect01 .top__box:nth-child(1) .top__box_img {
		max-width: 1058px;
	}
	.sect01 .top__box:nth-child(1) .top__box_txt_area {
		width: 510px;
		background-color: #F2F2F2;
		margin: -40px 0px 0px 225px;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(1) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(1) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	}
	.sect01 .top__box:nth-child(2n) .top__box_img {
		max-width: 705px;
		margin-left: auto;
	}
	.sect01 .top__box:nth-child(2n) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -185px 0px 0px 0;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(2n) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(2n) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	}
	.sect01 .top__box:nth-child(2n + 3) .top__box_img {
		max-width: 705px;
	}
	.sect01 .top__box:nth-child(2n + 3) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0px auto;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(2n + 3) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(2n + 3) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	}
	/* .sect01 .top__box:nth-child(4) .top__box_img {
		max-width: 705px;
		margin-left: auto;
	}
	.sect01 .top__box:nth-child(4) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0 0;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(4) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(4) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	} */
	/* .sect01 .top__box:nth-child(5) .top__box_img {
		max-width: 705px;
	}
	.sect01 .top__box:nth-child(5) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0px auto;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(5) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(5) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	} */
	/* .sect01 .top__box:nth-child(6) .top__box_img {
		max-width: 705px;
		margin-left: auto;
	}
	.sect01 .top__box:nth-child(6) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0 0;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(6) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(6) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	} */
	/* .sect01 .top__box:nth-child(7) .top__box_img {
		max-width: 705px;
	}
	.sect01 .top__box:nth-child(7) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0px auto;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(7) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(7) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	} */
	/* .sect01 .top__box:nth-child(8) .top__box_img {
		max-width: 705px;
		margin-left: auto;
	}
	.sect01 .top__box:nth-child(8) .top__box_txt_area {
		width: 627px;
		background-color: #F2F2F2;
		margin: -160px 0 0 0;
		padding: 30px 35px;
		position: relative;
	}
	.sect01 .top__box:nth-child(8) .top__box_txt {
		padding-right: 100px;
	}
	.sect01 .top__box:nth-child(8) .top__box_btn_area {
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 100%;
	} */
	.sect02 .top__box_img {
		max-width: 920px;
		margin: 0 auto 15px;
	}
}
@media screen and (min-width:1025px) {
	.top__mv_txt_area01 {
		top: 60px;
		left: 55px
	}
	.top__mv_txt_area01 .top__mv_txt {
		width: 500px;
	}
	.top__mv_txt_area02 {
		bottom: 30px;
		right: 30px;
	}
	.top__mv_txt_area02 .top__mv_txt {
		width: 637px;
	}
	.top__mv_txt_area03 {
		top: 60px;
		right: 55px;
	}
	.top__mv_txt_area03 .top__mv_txt {
		width: 500px;
	}
	.top__lead {
		padding: 0 0 23vw;
		background: url("../img/top/top_lead_bg_pc.png") no-repeat;
		background-size: cover;
	}
	.top__wrap {
		padding: 0;
		max-width: 1080px;
		margin: 0 auto;
	}
	.top__lead_txt01 {
		font-size: 35px;
		padding-top: 68px;
	}
	.top__lead_txt02 {
		font-size: 18px;
	}
	.sect01 .top__wrap {
		max-width: 1180px;
	}
	.top__box a:hover {
		opacity: 1;
	}
	.top__box_img {
		margin: 0;
	}
	.top__box_ttl {
		font-size: 25px;
	}
	.top__box_txt {
		font-size: 16px;
	}
	.top__box_btn {
		max-width: 55px;
		height: 55px;
	}
	.top__box_btn::before {
		width: 55px;
		height: 55px;
		background-image: url(../img/top/top__link_btn.svg);
	}
	.top__box.is_hover .top__box_btn::before {
		background: url("../img/top/top__link_btn_hover.svg") no-repeat;
		opacity: 1;
	}
	.top__box.is_hover .top__box_img_ttl {
		display: none;
	}
	.sect01 .top__box:nth-child(1) .top__box_txt_area {
		width: 818px;
	}
	.sect02::before {
		width: 100%;
		max-width: 1300px;
	}
	.sect02 .top__box .top__box_txt_area {
		width: 818px;
		background-color: #F2F2F2;
		margin: -55px auto 0;
		padding: 30px 35px;
		position: relative;
	}
	.sect03 {
		background: url("../img/top/top__bg_pc.png") no-repeat;
		background-size: cover;
		padding: 74px 0;
	}
	.top__sect03_pc_wrap {
		width: 780px;
		margin-left: auto;
		padding-right: 100px;
	}
	.top__sect03_txt01 {
		font-size: 20px;
	}
	.top__sect03_txt02 {
		font-size: 16px;
	}
}
@media screen and (min-width:1280px) {
	.sect01 .top__box {
		transform: translateX(-100px);
	}
	.sect01 .top__box:nth-of-type(2n) {
		transform: translateX(100px);
	}
}