/* --------------- top --------------- */
.main_cont {
	width: 100%;
	height: calc(100vw * (1137 / 720));
	margin: 100px 0 10vw 0;
	padding: 0;
	background-image: url(../img/sp/bg_main1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center top;
	position: relative;
}

@media (max-width: 720px) {
	.main_cont {
		margin: 13.8vw 0 14.8vw 0;
	}
}


.opening_image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(100vw * (1137 / 720));
	z-index: 1000;
	transition: opacity 0.5s ease-out;
	opacity: 1;
	background-color: #000000;
}

.opening_image::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50vw;
	height: 50vw;
	background-image: url(../img/opening_logo.svg);
	background-size: 40vw;
	background-repeat: no-repeat;
	background-position: center;
	z-index: 1;
	animation: logoMove 1s ease-out forwards;
}

@keyframes logoMove {
	0% {
		transform: translate(-50%, -30%);
	}

	100% {
		transform: translate(-50%, -50%);
	}
}

.opening_image.is-hidden {
	opacity: 0;
}


@media (min-width: 991px) {

	.opening_image {
		height: 844px;
	}

	.opening_image::before {
		width: 268px;
		height: 268px;
		background-size:214px ;
	}

	.main_cont {
		background-image: url(../img/sp/bg_main12.jpg);
		background-position: center top;
	}
}

.wrap_topbox1 {
	width: 100%;
	max-width: 650px;
	margin: 14.8vw auto;
	padding: 0;
	position: relative;
}

.wrap_topbox1::before {
	content: '';
	position: absolute;
	bottom: -11.7vw;
	left: 0.8vw;
	width: 5.3vw;
	height: 5.3vw;
	border-top: 2px solid black;
	border-right: 2px solid black;
}

.wrap_topbox1::after {
	content: '';
	position: absolute;
	bottom: -11.7vw;
	right: 0.8vw;
	width: 5.3vw;
	height: 5.3vw;
	border-top: 2px solid black;
	border-left: 2px solid black;
}

.cont_topbox1 {
	width: 85%;
	max-width: 540px;
	margin: 0 auto 24vw;
	position: relative;
}

.cont_topbox1::before {
	content: '';
	position: absolute;
	top: -7.7vw;
	left: -6.6vw;
	width: 5.3vw;
	height: 5.3vw;
	border-bottom: 2px solid black;
	border-right: 2px solid black;
}

.cont_topbox1::after {
	content: '';
	position: absolute;
	top: -7.7vw;
	right: -6.6vw;
	width: 5.3vw;
	height: 5.3vw;
	border-bottom: 2px solid black;
	border-left: 2px solid black;
}

.img_box_icon1 {
	width: 20%;
	max-width: 64px;
	margin: 0 auto 15px;
}

.img_box_icon1 img {
	width: 100%;
}

h2.txt_top1 {
	margin: 0 0 30px;
	font-size: min(5vw, 34px);
	font-weight: 600;
	text-align: center;
	letter-spacing: -0.03em;
	line-height: 1.7;
}

.inner_toptxt1 {
	margin: 0 0 30px;
	font-size: min(4vw, 28px);
}

.img_box_top1 {
	width: 100%;
	max-width: 540px;
	margin: 0 auto;
}

.img_box_top1 img {
	width: 100%;
}

.ttl_category {
	margin: 0 0 18vw;
	font-size: min(5vw, 37px);
	font-weight: 600;
	text-align: center;
	position: relative;
}

.ttl_category:before {
	content: "";
	width: 10%;
	max-width: 64px;
	height: 5px;
	background-color: #000000;
	position: absolute;
	bottom: -35%;
	left: 50%;
	transform: translateX(-50%);
}

.ttl_category .red {
	letter-spacing: 1.5vw;
	padding-left: 1.5vw;
}

.ttl_category2 {
	margin: 1.2vw 0 14.5vw;
	font-size: min(5vw, 37px);
	font-weight: 600;
	letter-spacing: 6px;
	text-align: center;
	position: relative;
}

.ttl_category2:before {
	content: "";
	width: 10%;
	max-width: 64px;
	height: 5px;
	background-color: #000000;
	position: absolute;
	bottom: -48%;
	left: 50%;
	transform: translateX(-50%);
}


/* --------------- top/reasons --------------- */
section.reasons {
	width: 100%;
	margin: 0;
	padding: 11.8vw 0 0;
	background-color: #EEECE8;
	position: relative;
}

section.reasons:before {
	content: "";
	width: 50%;
	max-width: 319px;
	height: 50px;
	background-image: url(../img/top/ttl_reasons.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	position: absolute;
	z-index: 0;
	top: -0.5%;
	left: 50%;
	transform: translateX(-50%);
}


.box_reasons1 {
	width: 100%;
	margin: 0 0 15vw;
	padding: 0;
}

.box_inner_reasons1 {
	width: 100%;
	height: calc(100vw * (935 / 720));
	margin: 0 0 15vw;
	padding: 0;
	background-image: url(../img/top/inner_bg_reasons1.jpg);
	background-size: contain;
	background-position: center bottom;
	background-repeat: no-repeat;
}

.box_inner_reasons1:nth-of-type(2) {
	background-image: url(../img/top/inner_bg_reasons2.jpg);
}

.box_inner_reasons1:nth-of-type(3) {
	height: calc(100vw * (1045 / 720));
	margin: 0;
	background-image: url(../img/top/inner_bg_reasons3.jpg);
}

.cont_inner_reasons1 {
	width: 90.3%;
	max-width: 650px;
	height: 68.9vw;
	margin: 0 auto;
	padding: 0;
	background-image: url(../img/top/bg_reasons1.svg);
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	z-index: 0;
}

.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 {
	background-image: url(../img/top/bg_reasons2.svg);
}

.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 {
	height: 84.4vw;
	background-image: url(../img/top/bg_reasons3.svg);
}

.cont_inner_reasons1:before {
	content: "";
	width: 21%;
	max-width: 131px;
	height: 150px;
	background-image: url(../img/top/icon_num1.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	position: absolute;
	z-index: 0;
	top: -15%;
	left: 6%;
}

.box_inner_reasons1:nth-of-type(2) .cont_inner_reasons1:before {
	background-image: url(../img/top/icon_num2.svg);
}

.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1:before {
	background-image: url(../img/top/icon_num3.svg);
	top: -12.4%;
}



.icon_reasons1 {
	width: 19%;
	max-width: 118px;
	margin: 0 auto 2.1vw;
	padding: 6.7vw 0 0;
}

.box_inner_reasons1:nth-of-type(2) .cont_inner_reasons1 .icon_reasons1 {
	width: 15%;
	max-width: 93px;
	padding: 4vw 0 0;
	margin: 0 auto 1vw;
}

.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 .icon_reasons1 {
	width: 15%;
	max-width: 93px;
	padding: 5.4vw 0 0;
	margin: 0 auto 2.3vw;
}

.icon_reasons1 img {
	width: 100%;
}

.inner_ttl_reasons1 {
	width: 84%;
	max-width: 543px;
	margin: 0 auto 1.5vw;
	padding: 0 0 2.2vw;
	font-size: min(5vw, 38px);
	font-weight: 600;
	text-align: center;
	border-bottom: solid 2px #000000;
}

.box_inner_reasons1:nth-of-type(3) .inner_ttl_reasons1 {
	line-height: 1.6;
	padding: 0 0 1.2vw;
}

.inner_txt_reasons1 {
	width: 90%;
	max-width: 543px;
	margin: 0 auto 4.2vw;
	font-size: min(4vw, 28px);
	text-align: center;
}

.box_inner_reasons1:nth-of-type(2) .inner_txt_reasons1 {
	width: 83%;
	max-width: 539px;
}



.link_reasons {
	margin: 0 auto;
	font-size: min(4vw, 24px);
	text-align: center;

}

.link_reasons a {
	color: #000000;
	text-decoration: none;
	display: inline-block;
	position: relative;
}

.link_reasons a::before {
	content: "";
	width: 26.8%;
	max-width: 50px;
	height: 100%;
	background-image: url(../img/top/icon_arrow.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	position: absolute;
	right: -2vw;
	top: 30%;
}

.link_reasons a span.roboto {
	padding: 0 8.5vw 0 0;
}


/* --------------- top/service --------------- */

section.service {
	width: 100%;
	margin: 0;
	padding: 0 0;
	position: relative;
	z-index: 1;
}

h1.img_ttl_service1 {
	width: 70%;
	max-width: 495px;
	margin: 0 auto 6.3vw;
}

.ttl_category.jigyo {
	letter-spacing: 6px;
}

.ttl_category.jigyo:before {
	bottom: -55%;
}

.box_inner_service1 {
	width: 100%;
	height: calc(100vw * (975 / 720));
	margin: 0px 0 6.8vw;
	padding: 0;
	background-image: url(../img/top/inner_bg_service1.jpg);
	background-size: 96.5%;
	background-position: left bottom;
	background-repeat: no-repeat;
	pointer-events: none;
}

.box_inner_service1:nth-of-type(2) {
	height: calc(100vw * (1055 / 720));
	background-image: url(../img/top/inner_bg_service2.jpg);
	background-position: right 97%;
	background-size: 96%;
	margin: 0px 0 21.9vw;
}

.box_service1{
	pointer-events: none;
}


.wrap_service1 {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
}

.left_service1 {
	width: 27%;
	max-width: 190px;
	margin: 0;
	padding: 6vw 0 0;
	text-align: center;
}

.left_service1 img {
	width: 31%;
	max-width: 58px;
}

.box_inner_service1:nth-of-type(2) .left_service1 {
	padding: 13vw 0 0;
}

.right_service1 {
	width: calc(100% - 27%);
	height: 96.4vw;
	margin: 0;
	padding: 0;
	background-image: url(../img/top/bg_right_service1.png);
	background-size: contain;
	background-position: right top;
	background-repeat: no-repeat;
	z-index: -1;
	position: relative;
}

.right_service1 img {
	content: "";

}

.right_service1:before {
	content: "";
	width: 35%;
	height: 100%;
	max-height: 270px;
	background-image: url(../img/top/bg_righttop_service1.png);
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: -29.2%;
	right: 0;
}

.box_inner_service1:nth-of-type(2) .right_service1 {
	height: 110.4vw;
	background-image: url(../img/top/bg_right_service2.png);
}

.box_inner_service1:nth-of-type(2) .right_service1:before {
	display: none;
}

.right_inner_service1 {
	margin: 0 auto;
	padding: 14.8vw 7vw 0 6.3vw;
}

.box_inner_service1:nth-of-type(2) .right_service1 .right_inner_service1 {
	padding: 8.3vw 5.6vw 0 7vw;
}

.right_ttl_service1 {
	margin: 0 0 20px;
	font-size: min(5.3vw, 38px);
	font-weight: 600;
	line-height: 1.3;
}

.right_txt_service1 {
	margin: 0 0 2.5vw;
	font-size: min(4vw, 28px);
}

.link_service {
	text-align: right;
	padding-right: 6.2em;
}

.link_service a {
	color: #000000;
	text-decoration: none;
	font-size: min(4vw, 24px);
	display: inline-block;
	position: relative;
	pointer-events: auto;
}

.link_service a::before {
	content: "";
	width: 33.8%;
	max-width: 50px;
	height: 100%;
	background-image: url(../img/top/icon_arrow.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	position: absolute;
	right: -2.4em;
	top: 38%;
}

.right_ttl_service2 {
	margin: 0 0 10px;
	font-size: min(5.3vw, 38px);
	font-weight: 600;
	line-height: 1.3;
}



/* --------------- top/works --------------- */
section.works {
	width: 100%;
	margin: 0;
	padding: 8.8vw 0 13vw;
	background-color: #EEECE8;
	position: relative;
}

section.works:before {
	content: "";
	width: 50%;
	max-width: 258px;
	height: 50px;
	background-image: url(../img/top/ttl_works.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	position: absolute;
	z-index: 0;
	top: -3.5%;
	left: 50%;
	transform: translateX(-50%);
}

.box_works1 {
	width: 85%;
	max-width: 606px;
	margin: 0 auto;
}

.slider {
	width: 100%;
	margin: 0 0 9vw;
	overflow: hidden;
	position: relative;
}

.slides {
	margin: 0 0 4vw;
	display: flex;
	transition: transform 0.5s ease-in-out;
}

.slides img {
	width: 100%;
	flex-shrink: 0;
}

.dots {
	text-align: center;
	margin-top: 10px;
}

.dot {
	display: inline-block;
	width: 12px;
	height: 12px;
	background-color: #ccc;
	border-radius: 50%;
	margin: 0 5px;
	cursor: pointer;
}

.dot.active {
	background-color: #333;
}


/*タブレット時*/

@media (min-width: 721px) and (max-width: 990px) {

	.main_cont {
		margin: 100px 0 72px 0;
	}

	.opening_image {
		height: calc(100vw * (1137 / 720));
	}

	.wrap_topbox1 {
		margin: 79px auto;
	}

	.wrap_topbox1::before {
		bottom: -84px;
		width: 38px;
		height: 38px;
	}

	.wrap_topbox1::after {
		bottom: -84px;
		right: 0em;
		width: 38px;
		height: 38px;
	}

	.wrap_topbox1::before {
		bottom: -84px;
		left: 0em;
		width: 38px;
		height: 38px;
	}

	.wrap_topbox1::after {
		bottom: -84px;
		right: 0em;
		width: 38px;
		height: 38px;
	}

	.cont_topbox1 {
		margin: 0 auto 173px;
	}

	h2.txt_top1 {
		font-size: 34px;
	}

	.inner_toptxt1 {
		font-size: 28px;
	}

	.ttl_category {
		margin: 0 0 130px;
		font-size: 36px;
	}

	.ttl_category .red {
		letter-spacing: 11px;
		padding-left: 11px;
	}

	.ttl_category2 {
		margin: 0 0 104px;
		font-size: 36px;
	}

	section.reasons {
		padding: 85px 0 0;
	}

	.box_reasons1{
		max-width: 720px;
		margin: 0 auto 15vw;
	}

	.box_inner_reasons1 {
		height: 935px;
		margin: 0 0 108px;
	}

	.box_inner_reasons1:nth-of-type(3) {
		height: 1045px;
	}

	.cont_inner_reasons1 {
		height: 496px;
	}

	.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 {
		height: 608px;
	}

	.icon_reasons1 {
		margin: 0 auto 15px;
		padding: 48px 0 0;
	}

	.box_inner_reasons1:nth-of-type(2) .cont_inner_reasons1 .icon_reasons1 {
		padding: 29px 0 0;
		margin: 0 auto 7px;
	}

	.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 .icon_reasons1 {
		padding: 33px 0 0;
		margin: 0 auto 17px;
	}

	.inner_ttl_reasons1 {
		margin: 0 auto 11px;
		padding: 0 0 16px;
		font-size: 36px;
	}

	.box_inner_reasons1:nth-of-type(3) .inner_ttl_reasons1 {
		padding: 0 0 9px;
	}

	.inner_txt_reasons1 {
		margin: 0 auto 30px;
		font-size: 28px;
	}

	.link_reasons {
		font-size: 24px;
	}

	.link_reasons a span.roboto {
		padding: 0 83px 0 0;
	}

	h1.img_ttl_service1 {
		margin: 0 auto 43px;
	}

	.box_service1{
		max-width: 720px;
		margin: 0 auto;
	}

	.box_inner_service1 {
		height: 975px;
		margin: 0px 0 49px;
	}

	.box_inner_service1:nth-of-type(2) {
		height: 1055px;
		margin: 0px 0 172px;
	}

	.left_service1 {
		padding: 43px 0 0;
	}

	.box_inner_service1:nth-of-type(2) .left_service1 {
		padding: 94px 0 0;
	}

	.right_service1 {
		height: 694px;
	}

	.box_inner_service1:nth-of-type(2) .right_service1 {
		height: 795px;
	}

	.right_inner_service1 {
		padding: 107px 50px 0 45px;
	}

	.box_inner_service1:nth-of-type(2) .right_service1 .right_inner_service1 {
		padding: 60px 40px 0 50px;
	}

	.right_ttl_service1,
	.right_ttl_service2 {
		font-size: 38px;
	}

	.right_txt_service1 {
		margin: 0 0 18px;
		font-size: 28px;
	}

	.link_service a {
		font-size: 24px;
	}

	section.works {
		padding: 63px 0 94px;
	}

	.slider {
		margin: 0 0 65px;
	}

	.slides {
		margin: 0 0 29px;
	}


}




/*PC時　スマホ固定化*/

@media (min-width: 991px) {
	.wrap_topbox1 {
	margin: 79px auto;
	}

	.main_cont {
		height: 844px;
		margin: 0 0 95px;
	}

	h2.txt_top1 {
		font-size: 27px;
	}

	.inner_toptxt1 {
		font-size: 21px;
	}

	.cont_topbox1::before {
		top: -84px;
		left: -12px;
		width: 38px;
		height: 38px;
	}

	.cont_topbox1::after {
		top: -84px;
		right: -12px;
		width: 38px;
		height: 38px;
	}


	.wrap_topbox1::before {
		bottom: -84px;
		left: 0em;
		width: 38px;
		height: 38px;
	}

	.wrap_topbox1::after {
		bottom: -84px;
		right: 0em;
		width: 38px;
		height: 38px;
	}


	.cont_topbox1 {
		margin: 0 auto 128px;
	}

	section.reasons {
		padding: 63px 0 0;
	}

	.ttl_category {
		margin: 0 0 96px;
		font-size: 27px;
	}

.ttl_category .red {
	letter-spacing: 8px;
	padding-left: 8px;
}

	.box_reasons1 {
		margin: 0 0 80px;
	}

	.box_inner_reasons1 {
		height: 695px;
		margin: 0 0 80px;
	}

	.cont_inner_reasons1 {
		height: 369px;
	}

	.icon_reasons1 {
		margin: 0 auto 11px;
		padding: 36px 0 0;
	}

	.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 .icon_reasons1 {
		padding: 25px 0 0;
		margin: 0 auto 12px;
	}

	.inner_ttl_reasons1 {
		margin: 0 auto 8px;
		padding: 0 0 8px;
		font-size: 27px;
	}

	.inner_txt_reasons1 {
		margin: 0 auto 22px;
		font-size: 21px;
	}

	.link_reasons {
		font-size: 21px;
	}

	.link_reasons a span.roboto {
		padding: 0 62px 0 0;
	}


	.box_inner_reasons1:nth-of-type(2) .cont_inner_reasons1 .icon_reasons1 {
		padding: 21px 0 0;
		margin: 0 auto 5px;
	}

	.box_inner_reasons1:nth-of-type(3) {
		height: 775px;
	}

	.box_inner_reasons1:nth-of-type(3) .cont_inner_reasons1 {
		height: 451px;
	}


	/* --------------- top/service --------------- */


	h1.img_ttl_service1 {
		margin: 0 auto 37px;
	}

	.box_inner_service1 {
		height: 723px;
		margin: 0px 0 36px;
	}

	.box_inner_service1:nth-of-type(2) {
		height: 782px;
		margin: 0px 0 128px;
	}

	.left_service1 {
		padding: 37px 0 0;
	}


	.box_inner_service1:nth-of-type(2) .left_service1 {
		padding: 85px 0 0;
	}

	.right_service1 {
		height: 515px;
	}

	.box_inner_service1:nth-of-type(2) .right_service1 {
		height: 590px;
	}

	.right_inner_service1 {
		padding: 79px 37px 0;
	}

	.box_inner_service1:nth-of-type(2) .right_service1 .right_inner_service1 {
		padding: 36px 37px 0;
	}

	.right_ttl_service1,
	.right_ttl_service2 {
		font-size: 28px;
	}

	.right_txt_service1 {
		margin: 0 0 13px;
		font-size: 21px;
	}


	.link_service a {
		font-size: 21px;
	}


	/* --------------- top/works --------------- */
	section.works {
		padding: 47px 0 69px;
	}

	.slider {
		margin: 0 0 48px;
	}

	.slides {
		margin: 0 0 21px;
	}

	.ttl_category2 {
		margin: 0 0 77px;
		font-size: 27px;
	}






























}