@charset "UTF-8";

@media all {
	.section-offer {
		background-color: #F2F2F2;
	}
	.in-active {
		pointer-events: none;
	}
	.in-active .section-offer-ttl {
		pointer-events: auto;
	}
	.section-offer-inner {
		position: absolute;
		top: 0;
		width: 100%;
	}
	.switch-content {
		visibility: visible;
		opacity: 1;
		transition: .3s;
	}
	.in-active .switch-content {
		visibility: hidden;
		opacity: 0;
	}
	.section-offer-ttl {
		position: absolute;
		display: flex;
		justify-content: center;
		align-items: center;
		border: var(--sp-vw-02px) solid #3B4C85;
		border-bottom: none!important;
		border-radius: .8824em;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
		background-color: #F2F2F2;
	}
	.in-active .section-offer-ttl {
		border-color: #f2f2f2;
		transition: .3s;
	}
	.in-active .section-offer-ttl:hover {
		border-color: #3B4C85;
	}
	.offer-h2 > span {
		display: inline-block;
	}
	.offer-h2 > span.blue {
		margin: 0 .5em;
		padding: .25em .5em .2em .4em;
		background-color: #3B4C85;
		border-radius: 1em;
		color: #fff;
	}
	.in-active .offer-h2 {
		color: #AAA;
	}
	.in-active .offer-h2 > span.blue {
		background-color: #AAA;
	}
	.in-active .offer-switch {
		cursor: pointer;
	}
	.contractor-h3 {
		color: #3B4C85;
	}
	.all-job {
		margin: 5em auto 0;
		max-width: 735px;
		text-align: right;
	}
}
/* sp */
@media only screen and (max-width: 767px) {
	.section-offer {
		margin-top: var(--sp-vw-100px);
	}
	.section-offer-inner {
		padding: var(--sp-vw-75px) 0;
	}
	.section-offer-ttl {
		display: block;
		top: -2.5em;
		padding-top: .5em;
		width: 40.625%;
		height: 3.5em;
		font-size: var(--sp-vw-16px);
		text-align: center;
		line-height: 1.6;
	}
	.offer-h2 > span.blue {
		margin-left: .25em;
		margin-right: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	.dispatch-ttl {
		right: calc(50% + .5em);
	}
	.introduct-ttl {
		left: calc(50% + .5em);
	}
	.offer-lead {
		padding: 0 var(--sp-vw-18px);
	}
	.post-list {
		margin-top: var(--sp-vw-32px);
	}
	.all-job {
		margin-top: 3em;
		padding: 0 1em;
	}

	.contractor-inner {
		margin-top: var(--sp-vw-50px);
	}
	.contractor-text {
		margin-top: var(--sp-vw-20px);
		padding: 0 var(--sp-vw-16px);
		font-feature-settings: "palt";
	}
	.contractor-h3 {
		font-size: var(--sp-vw-20px);
		text-align: center;
	}
	.contractor-p {
		margin-top: var(--sp-vw-14px);
	}
}
/* tab & pc */
@media print,
(min-width: 768px) {
	.main-section.section-offer {
		margin-top: 220px;
	}
	.section-offer-inner {
		padding: 150px 0 86px;
	}
	.section-offer-ttl {
		top: -2.2059em;
		width: 13.97em;
		height: 2.9411em;
		border-width: 2px;
		font-size: 34px;
		line-height: 1;
	}
	.dispatch-ttl {
		right: calc(50% + 25px);
	}
	.introduct-ttl {
		left: calc(50% + 25px);
	}
	.offer-lead {
		text-align: center;
	}
	.job-list {
		margin-top: 100px;
	}
	
	.no-job {
		margin-top: 100px;
		text-align: center;
	}


	.section-contractor {
		margin: 100px auto 0;
		width: 100%;
		max-width: 1300px;
		overflow: hidden;
	}
	.contractor-inner {
		position: relative;
	}
	.contractor-inner img {
		width: 1180px;
	}
	.contractor-text {
		position: absolute;
		top: 0;
		padding: 60px 30px;
		width: 360px;
		height: 100%;
		background: rgba(255,255,255,.9);
		line-height: 2;
	}
	.contractor-h3 {
		font-size: 24px;
	}
	.contractor-h3 + p {
		margin-top: 20px;
	}
	.contractor-right {
		margin-top: 130px;
	}
	.contractor-right img {
		display: block;
		margin-left: auto;
		margin-right: 0;
	}
	.contractor-right .contractor-text {
		right: 120px;
	}
	.contractor-left {
		margin-top: 100px;
	}
	.contractor-left .contractor-text {
		left: 120px;
		padding-top: 70px;
	}
}

/* tab */
@media (min-width: 768px) and (max-width: 1024px) {
	.section-offer-ttl {
		font-size: 3.255vw;
	}
	.dispatch-ttl {
		right: calc(50% + .5em);
	}
	.introduct-ttl {
		left: calc(50% + .5em);
	}
	.section-contractor {
		overflow: visible;
	}
}