@charset "UTF-8";

/* ---------------------------------------------------------
 　■ KV
--------------------------------------------------------- */
.heading-wh {
	background-image: url(../images/programs/h1_bg1_pc.webp);
}

@media (width < 768px) {
	.heading-wh {
		background-image: url(../images/programs/h1_bg1_sp.webp);
	}
}

/* === 共通 === */
main{ overflow: hidden; }

.topHeading{
	position: relative;
	padding-top: 35px;
	font-size: 48px;
	font-weight: 600;
	color: var(--DBL);
	font-family: "Noto Serif JP", serif;
	margin: 0 0 35px;
	letter-spacing: 0.2em;
	@media (1250px >= width >= 768px) {
		font-size:36px;
		}
	@media (width < 768px) {
		padding-top:20rem;
		font-size: 28px;
		text-align:center;
		letter-spacing: 0.1em;
	}
}
.topHeading::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 8px;
	background: linear-gradient(90deg, var(--DBL) 0%, var(--BL) 100%);
	@media (width < 768px) {
		width: 40px;
		height: 4px;
		left: 50%;
        transform: translatex(-50%);
	}
}
.topTxt {
	font-size: 20px;
	line-height: 2;
	margin: 0;
	@media (width < 768px) {
		font-size: 18px;
		line-height: 1.556;
		letter-spacing: 0em;
	}
}
.lead{
	font-size: 20px;
	line-height:2;
	margin-top:60px;
	@media (1250px >= width >= 768px) {
		margin-top:60rem;
	}
	@media (width < 768px) {
			font-size: 18px;
			margin-top:40rem;
		}
	}

/* === 3つの制度、事業 === */
.programs{
	margin-top:120px;
	@media (1250px >= width >= 768px) {
			margin-top:120rem;
		}
	@media (width < 768px) {
			margin-top:40rem;
	}


}
.programs-box{
	display: flex;
	gap: 6.6667%;
	@media (width < 768px) {
		display: block;
	}
}
.programs-txt{
	width: 43.3333%;
	@media (width < 768px) {
		width:100%;
		+.programs-img{
			margin-top:40rem;
		}
	}
}
.programs-img{
	width:50%;
	margin: 0;
	@media (width < 768px) {
		width:100%;
		margin:  0 auto;
	}
}
.reverse{
flex-direction: row-reverse;
}

.job-features-list{
	font-size: 16px;
	line-height: 1.6;
	padding-left: 0;
    list-style-position: inside;
}
.link-external{
	width:300px;
	@media (width < 768px) {
		margin:0 auto;
	}
}
.link-external .btnDBL {
	@media (width < 768px) {
		padding:37px 0;
		font-size:20px;
	}
    &::after {
        background-image: url(../images/programs/ico_link-external.svg);
        width: 18px;
        height: 16px;
    }
		&:hover::after {
        background-image: url(../images/programs/ico_link-external_on.svg);
		}
}
.small-dot{
	position: relative;
	list-style: none;
  	padding-left: 1em;
}
.small-dot li:before{
	position: absolute;
	content: "･"; 
  	margin-left: -1em;
}
.programs-02 .topTxt{
	margin-bottom:51px;
	@media (1250px >= width >= 768px) {
			margin-bottom: 51rem;
		}
	@media (width < 768px) {
			margin-bottom:40rem;
	}
}

.for-box{
	margin:160px auto 0;
	@media (1250px >= width >= 768px) {
		margin:160rem auto 0;
	}
	@media (width < 768px) {
	    margin: 40rem auto 0;
	}
}

.for-box-flex{
	display: flex;
	justify-content: space-between;
	background-color:#EEF4FA;
	border-radius: 16px;
	padding:60px;
	padding-top:0;
	@media (1250px >= width >= 768px) {
		padding:60rem;
		padding-top:0;
	}
	@media (width < 768px) {
		flex-direction: column;
		padding:26rem 20rem 40rem;
	}
}
.for-company{
	width:480px;
	@media (1250px >= width >= 768px) {
		width:480rem;
	}
	@media (width < 768px) {
		width:100%;
	}
	.heading-medium{
			@media (width < 768px) {
				margin-top:20px;
			}
	}
}
.for-jobseeker{
	width:480px;
	@media (1250px >= width >= 768px) {
		width:480rem;
	}
	@media (width < 768px) {
		width:100%;
	}
	.link-external{
		margin: 34px auto 0;
		@media (1250px >= width >= 768px) {
			margin: 34rem auto 0;
		}
	}
}
.for-txt{
	font-size:16px;
	line-height: 1.6;

}

/*common.css*/

.heading-medium {
	@media (1250px >= width >= 768px) {
    margin: 60rem 0 30rem;
    padding-bottom: 13rem;
	}
	@media (width < 768px) {
		letter-spacing:0;
	}
}