@charset "UTF-8";

.layout-search-basudokorenewal {

	header .innr {
		width: 1000px;
		margin: 0 auto;
	}

	#page {
		text-align: left;
	}

	#page #sec001 {
		padding-top: 120px;
		padding-bottom: 80px;
	}

	#page #sec001 .sec_innr {
		position: relative;
		width: 1000px;
	}

	#page #sec001 .sec_innr .dara {
		position: absolute;
		bottom: 0;
		right: 40px;
	}

	#page #sec001 .com_ttl {
		position: relative;
		border-top: 2px solid #00ada0;
		border-bottom: 2px solid #00ada0;
		padding: 30px 0;
	}

	#page #sec001 .com_ttl::before {
		position: absolute;
		content: "";
		top: 20px;
		left: 20px;
		display: block;
		width: 70px;
		height: 70px;
		background-image: url(../assets/img/icon_01.svg);
		background-size: contain;
		background-repeat: no-repeat;
	}

	#page #sec001 .t02::before {
		background-image: url(../assets/img/icon_02.svg);
	}

	#page #sec001 .t03::before {
		background-image: url(../assets/img/icon_04.svg);
	}

	#page #sec001 .t04::before {
		background-image: url(../assets/img/icon_03.svg);
	}

	#page #sec001 .com_ttl h1 {
		position: relative;
		color: #00ada0;
		font-size: 30px;
		font-weight: bold;
		letter-spacing: 2px;
		padding-left: 110px;
	}

	#page #sec001 .com_ttl h1 span.busdoko {
		position: absolute;
		top: -55px;
		left: 260px;
	}


	#page #sec001 h2 {
		position: relative;
		width: 840px;
		margin: 0 auto;
		border-radius: 5px;
		background-color: #00ada0;
		box-sizing: border-box;
		margin-top: 80px;
		padding: .6em 0;
		padding-left: 1.2em;
	}

	#page #sec001 h2.first {
		margin-top: 40px;
	}

	#page #sec001 h2 span {
		display: inline-block;
		color: #fff;
		font-size: 22px;
		font-weight: bold;
		letter-spacing: 1px;
	}

	#page #sec001 h2 span.busdoko {
		position: absolute;
		top: -28px;
		left: 152px;
	}

	#page #sec001 .txt_box {
		width: 780px;
		margin: 0 auto;
		margin-top: 40px;
	}

	#page #sec001 .txt_box p {
		font-size: 16px;
		margin-top: 1.5em;
		padding-left: .5em;
	}

	#page #sec001 .txt_box p.mt {
		margin-top: 4em;
	}

	#page #sec001 .txt_box .img {
		display: block;
		margin-top: 20px;
	}

	#page #sec001 .com_btn {
		text-align: center;
		margin-top: 100px;
	}

	#page #sec001 .com_btn a {
		display: inline-block;
		color: #fff;
		font-size: 22px;
		font-weight: bold;
		border-radius: 40px;
		background-color: #00ada0;
		box-sizing: border-box;
		padding: .6em 2.5em;

		span {
			color: #fff;
		}
	}

	#page #sec001 .com_btn a span::before {
		content: "\f002";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		margin-right: .3em;
	}

	#page #sec001 .com_btn a:hover {
		opacity: .7;
		transition: .3s;
	}

	#page #sec001 .back {
		width: 1000px;
		margin: 0 auto;
		margin-top: 30px;
	}

	#page #sec001 .back a {
		font-size: 18px;
		font-weight: bold;
	}

	#page #sec001 .back a span::before {
		content: "\f060";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		margin-right: .3em;
	}

	@media screen and (max-width: 767px) {
		header .innr {
			width: 86%;
		}

		#page #sec001 {
			padding-top: 20vw;
			padding-bottom: 10vw;
		}

		#page #sec001 .sec_innr {
			width: 86%;
		}

		#page #sec001 .sec_innr .dara {
			display: none;
		}

		#page #sec001 .com_ttl {
			padding: 5vw 0;
		}

		#page #sec001 .com_ttl::before {
			position: absolute;
			content: "";
			top: 2.5vw;
			left: 1vw;
			display: block;
			width: 12vw;
			height: 12vw;
			background-image: url(../assets/img/icon_01.svg);
			background-size: contain;
			background-repeat: no-repeat;
		}

		#page #sec001 .t02::before {
			background-image: url(../assets/img/icon_02.svg);
		}

		#page #sec001 .t03::before {
			background-image: url(../assets/img/icon_04.svg);
		}
	
		#page #sec001 .t04::before {
			background-image: url(../assets/img/icon_03.svg);
		}

		#page #sec001 .com_ttl h1 {
			font-size: 4.5vw;
			padding-left: 3.6em;
			letter-spacing: 0;
		}

		#page #sec001 h2 {
			width: 100%;
			border-radius: 2vw;
			margin-top: 15vw;
			padding: .4em 0;
			padding-left: .6em;
		}

		#page #sec001 .com_ttl h1 span.busdoko {
			top: -9vw;
			left: 36vw;
		}

		#page #sec001 .com_ttl h1 span.busdoko img {
			width: 26vw;
		}

		#page #sec001 h2.first {
			margin-top: 5vw;
		}

		#page #sec001 h2 span {
			display: block;
			font-size: 4vw;
			padding-left: 1.3em;
			text-indent: -1.3em;
		}

		#page #sec001 h2 span.busdoko {
			top: -5.5vw;
			left: 28vw;
		}

		#page #sec001 h2 span.busdoko img {
			width: 27vw;
		}

		#page #sec001 .txt_box {
			width: 100%;
			margin: 0 auto;
			margin-top: 4vw;
		}

		#page #sec001 .txt_box p {
			font-size: 3vw;
			margin-top: 1em;
			padding-left: .5em;
		}

		#page #sec001 .txt_box p.mt {
			margin-top: 3em;
		}

		#page #sec001 .txt_box .img {
			display: block;
			margin-top: 5vw;
		}

		#page #sec001 .com_btn {
			position: relative;
			margin-top: 45vw;
			z-index: 50;
		}

		#page #sec001 .com_btn a {
			font-size: 4vw;
			border-radius: 10vw;
			padding: 1em 2em;
		}

		#page #sec001 .com_btn::before {
			position: absolute;
			content: "";
			bottom: 14.5vw;
			right: 15vw;
			display: block;
			width: 40vw;
			height: 34vw;
			background-image: url(../assets/img/dara.webp);
			background-size: contain;
			background-repeat: no-repeat;
			z-index: -5;
		}

		#page #sec001 .back {
			width: 100%;
			text-align: center;
			margin-top: 10vw;
		}

		#page #sec001 .back a {
			font-size: 4vw;
		}
	}
}

/*========================================

  下層ページ

========================================*/