@charset "utf-8";
/*--------------------------------------------------
ヘッダー
--------------------------------------------------*/
.lower .ly_lv1Wrapper {
	margin-bottom: 70px;
}
/*--------------------------------------------------
アコーディオン
--------------------------------------------------*/
.el_openArea {
	display: none;
}
*.close + .el_openArea {
	display: block;
}
.el_open {
  cursor: pointer;
  position: relative;
  transition: .3s;
}
.el_open::after {
	position: absolute;
}
/*--------------------------------------------------
詳細ページ
--------------------------------------------------*/
.detail .ly_cont_inner {
	margin-bottom: 100px;
	margin-top: 100px;
}
.detail .el_lv2Header.el_mark_none::before {
	content: none;
}
.detail .bl_card_detail .bl_post_body {
	max-width: 616px;
}
.detail .bl_labelUnit {
	margin-bottom: 15px;
}
.detail .bl_labelUnit .el_label {
	font-size: 12px;
  height: 25px;
  padding: 5px 10px 0;
}
.learn.detail .bl_labelUnit .el_label {
	font-size: 10px;
	padding: 7px 30px 0;
	margin-bottom: 7px;
}
.detail .bl_card_detail {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-bottom: 30px;
	height: auto;
}
.detail .bl_post_header {
	margin-bottom: 30px;
}
.bl_post_date {	
	color: var(--gray);
}
.detail .el_label_cat {
	display: inline-block;
}
.detail .bl_card_detail li {
	width: 202px;
	letter-spacing: 0;
}
.detail .bl_card_detail li + li {
	margin-top: 0;
}
.detail .bl_post_img {
	margin-bottom: 50px;
	position: relative;
}
.detail .bl_post_date {
	font-size: 12px; 
	color: var(--gray);
	margin-bottom: 15px;
	display: block;
}
.detail .bl_post_detail > div a {
	border-bottom: 1px solid var(--black);
	padding-bottom: 3px;
}
.detail .bl_post_detail > div + div {
	margin-top: 40px;
}
.detail .bl_post_detail > div dt {
	margin-bottom: 15px;
	font-size: 16px;
}
.detail .bl_post_detail > div dd {
	line-height: 1.785;
}
/*フッターの検索*/
.detail .bl_footerSearch {
	margin-bottom: 150px;
	padding: 0 30px;
	max-width: 942px;
}
.detail .bl_footerSearch .bl_searchUnit {
	display: block;
}
/*スライダーページネーション*/
.detail .swiper-pagination {
	bottom: 0;
}
.detail .swiper-pagination-bullet {
	width: 7px; 
	height: 7px;
	margin: 0 6px;
}
.detail .swiper-pagination-bullet-active {
	width: 25px;
	background: var(--pink);
	border-radius: 20px;
}
/*--------------------------------------------------
動画で学ぶ詳細
--------------------------------------------------*/
#learn .bl_post_body {
	margin-left: 0;
}
/*--------------------------------------------------
求人を探す詳細
--------------------------------------------------*/
#works.detail .ly_post_inner {
	margin: 0;
}
#works.detail .bl_post_img {
	margin-bottom: 50px;
	position: relative;
}
#works.detail .bl_post_body {
	margin-left: 0;
	position: relative;
}
#works.detail .el_lv2Header {
	margin-top: 100px;
}
#works.detail h1.el_lv2Header {
	margin-top: 0;
}
#works.detail .el_kana {
	display: block; 
	font-size: 12px;
}
/***求人応募ボタン***/
/*追従の応募ボタン*/
#works #bl_cta {
	max-width: min(61vw,850px);
	width: 100%;
	position: relative;
	height: 0;
	margin: auto;
	text-align: right;
}
#works #bl_cta span {
	position: absolute;
	top: 230px;
	z-index: 3;
	text-align: left;
}
#works #bl_cta.fixed span {
	position: fixed;
	top: 80px;
	animation-name:fadeDownAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity:0;
}
@keyframes fadeDownAnime{
	from {
		opacity: 0;
		transform: translateY(-100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
.active #works #bl_cta span {
	animation-name:fadeUpAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	}
	
	@keyframes fadeUpAnime{
		from {
			opacity: 1;
		transform: translateY(0);
		}
	
		to {
			opacity: 0;
		transform: translateY(-100px);
		}
	}
#works #bl_cta .el_btn_more {
	margin: auto;
	width: 200px;
	height: 80px;
  font-family: "Noto Sans JP", sans-serif;
	line-height: 25px;
	text-align: left;
}
#works #bl_cta .el_btn_more::after {
	width: 12px;
	height: 12px;
	top: 35px;
	right: 28px;
}
/*フッターの応募ボタン*/
#works #bl_footerCta {
	background: var(--bg_pink);
	padding: 50px;
	margin-bottom: 70px;
}
#works #bl_footerCta .el_btn_more {
	margin: auto;
	width: 100%;
	max-width: 300px;
  font-family: "Noto Sans JP", sans-serif;
}
/***スライダー***/
#works.detail .slider {
  max-width: 616px;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#works.detail .swiper {
	margin: 0 !important;
	padding-bottom: 30px;
}
/***一枚の時はサムネイル非表示***/
#works.detail .slider:has(.swiper-slide[aria-label="1 / 1"]) .swiper-thumbs {
	display: none;
}
/*メイン*/
#works.detail .swiper[data-main-list] .swiper-wrapper {
	max-width: 480px;
}
#works.detail .swiper[data-main-list] .swiper-slide img {
	object-fit: cover;
	max-height: 350px;
}
/*サムネイル*/
#works.detail .swiper[data-thumbnail-list] .swiper-wrapper {
	width: 103px;
	height: 70px;
	display: block;
}
#works.detail .swiper[data-thumbnail-list] .swiper-slide {
	width: 103px!important;
	height: 70px!important;
	margin-bottom: 10px;
	cursor: pointer;
}
#works.detail .swiper[data-thumbnail-list] .swiper-slide img {
	object-fit: cover;
	height: 70px;
	width: 100%;
}
#works.detail .swiper[data-thumbnail-list] .swiper-slide-thumb-active {
	display: none;
}
#works.detail .swiper-slide {
	text-align: center;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	max-height: 350px;
}
/*ページャー*/
#works.detail .swiper-pagination {
	bottom: 0;
	display: flex;
	transform: none;
	top: initial;
	left: 0!important;
}
/*--------------------------------------------------
特集記事
--------------------------------------------------*/
#feature .bl_card {
	box-shadow: none;
}
#feature .bl_cardUnit .bl_card + .bl_card {
	margin-top: 50px;
}
#feature .bl_cardUnit .bl_card a {
	display: flex;
}
#feature .bl_cardUnit .bl_card_imgWrapper {
	width: 430px;
	height: 320px;
	margin-right: 32px;
	margin-bottom: 0;
}
#feature .bl_cardUnit .bl_card_imgWrapper img {
	object-fit: cover;
	border-radius: 10px;
	height: 320px;
}
#feature .bl_card_ttl {
	padding: 0;
	margin-bottom: 10px;
	text-align: justify;
}
#feature .bl_card_txt {
	font-size: 14px;
	line-height: 1.785;
	letter-spacing: 0.1em;
	text-align: justify;
}
#feature .el_btn.white {
	margin-right: 0;
	margin-top: 25px;
}
#feature .bl_card_header_cat {
	margin-bottom: 15px;
}
/*詳細ページ*/
#feature.detail .bl_newPostUnit {
	margin-top: 100px;
}
#feature.detail .bl_newPostUnit .el_lv2Header::before {
	content: "";
	background: var(--pink);
}
#feature.detail .swiper-feature {
	overflow: hidden;
	max-width: 616px;
	margin: auto;
	padding: 8px 0;
}
#feature.detail .swiper-feature .swiper-wrapper {
	margin-bottom: 47px;
}
#feature.detail .swiper-feature .el_label_cat {
	margin-bottom: 0;
	margin-right: 7px;
	font-size: 10px;
	width: 44px;
	letter-spacing: 0.1em;
	height: 16px;
	padding: 3px 0 0;
}
#feature.detail .swiper-feature .bl_post_img_date {
	margin-bottom: 0;
	font-size: 14px;
}
/*--------------------------------------------------
お知らせ
--------------------------------------------------*/
.bl_newsUnit {
	margin-bottom: 70px;
}
.bl_pagerUnit {
	justify-content: center;
}
/*--------------------------------------------------
プライバシーポリシー・利用規約
--------------------------------------------------*/
.plain .ly_cont__main {
	max-width: 790px;
}
.plain .ly_cont__main p {
	margin-bottom: 30px;
	text-align: justify;
}
.plain .ly_cont__main dt {
	line-height: 25px;
	text-align: justify;
}
.plain .ly_cont__main dd {
	margin-bottom: 40px;
	text-align: justify;
}
.plain .ly_cont__main dd p {
	margin-bottom: 0;
}
.plain .ly_cont__main p + ol,
.plain .ly_cont__main ol > li > ol {
	padding-left: 1em;
}
.plain .ly_cont__main li {
	line-height: 25px;
}
.plain .ly_cont__main ol li {
	padding-left: 1em;
	text-indent: -1em;
	line-height: 25px;
}
/*--------------------------------------------------
会社概要
--------------------------------------------------*/
#company .bl_companyUnit {
	max-width: 648px;
	margin: 50px auto auto;
}
#company dl div {
	display: flex;
	align-items: flex-start;
	border-bottom: 1px solid var(--gray);
	padding-bottom: 25px;
	margin-bottom: 25px;
	padding-left: 60px;
}
#company dl div:last-of-type {
	border: none;
}
#company .bl_companyUnit dt {
	width: 72px; 
	margin-right: 76px;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: 0.1em;
	flex-shrink: 0;
}
#company dl dd {
	margin-bottom: 0;
	line-height: 25px;
}
#company .el_lv2Header   {
	margin-top: 100px;
}
#company .el_lv3Header {
	font-weight: 700;
	font-size: 16px;
	margin-bottom: 25px;
	margin-top: 50px;
}
#company .el_lv3Header + p {
	margin-bottom: 0;
}
#company .bl_historyUnit div {
	padding-left: 30px;
}
#company .bl_historyUnit dt {
	font-size: 16px;
	margin-right: 38px;
	flex-shrink: 0;
	width: 175px;
}
/*--------------------------------------------------
応募する
--------------------------------------------------*/
#entry .bl_entryUnit {
	max-width: 790px; 
	margin: auto;
}
.entry .bl_entryUnit div + div {
	margin-top: 40px;
}
.entry .bl_entryUnit dt {
	font-size: 16px;
	margin-bottom: 20px;
	display: flex;
	align-items: center;
}
#entry input[type="text"],
#entry input[type="email"] ,
#entry input[type="tel"]  {
	background: #fff;
	max-width: 400px;
	padding: 0 10px;
	height: 40px;
}
#entry .income input[type="text"] {
	max-width: 200px;
}
.entry .el_required {
	width: 40px;
	height: 20px;
	background: var(--pink);
	color: #fff;
	border-radius: 5px;
	display: flex; 
	align-items: center; 
	justify-content: center;
	margin-left: 10px;
	font-size: 12px;
}
#entry .el_yen {
	margin-left: 15px;
	display: inline-block;
	padding-bottom: 3px;
	vertical-align: bottom;
}
#entry ul li {
	margin-bottom: 10px;
	display: flex;
	margin-right: 5px;
	line-height: 1.3;
}
/*ラジオボタン*/
#entry .bl_typeUnit input[type="radio"],
#entry textarea {
	border: none;
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4) inset;
	background: #fff;
}
#entry .bl_typeUnit input[type="radio"]:checked  {
	background: #fff;
	border: none;
}
#entry .bl_typeUnit input[type="radio"]:checked:before {
	top: 5px;
	left: 5px;
	width: 9px;
	height: 9px;
	border: none;
	background: var(--black);
	border-radius: 50px;
}
#entry textarea {
	border-radius: 20px;
	width: 100%;
	height: 300px;
	padding: 20px;
}
#entry .el_year {
	width: 100px;
	margin-bottom: 10px;
}
#entry .el_month {
	width: 70px;
	margin-bottom: 10px;
}
#entry .el_ym {
	margin: 0 10px 10px 5px;
	display: inline-block;
	padding-bottom: 3px;
	vertical-align: bottom;
}
#entry .bl_areaUnit {
	display: flex;
	flex-wrap: wrap;
}
#entry .bl_areaUnit > li {
	display: block;
	margin-right: 20px;
}
#entry .bl_area_ttl {
	margin-bottom: 20px;
}
#entry .el_open {
	width: 200px;
  height: 31px;
  font-size: 14px;
  border: 1px solid var(--black);
  background: #fff;
  border-radius: 50px;
  display: flex;
  align-items: center;
  padding-left: 20px;
}
#entry .el_open::after {
	content: url(https://learn-work-prod.s3.ap-northeast-1.amazonaws.com/images/service/lower/plus.svg);
	top: 5px;
	right: 15px;
}
#entry .el_open.close::after {
	content: url(https://learn-work-prod.s3.ap-northeast-1.amazonaws.com/images/service/lower/minus.svg);
	top: 0;
}
#entry .bl_submitArea {
	margin: 100px auto auto;
}
#entry .bl_privacyUnit {
	text-align: center;
	margin-bottom: 45px;
	line-height: 2;
}
#entry .bl_privacyUnit a {
	color: var(--pink);
	border-bottom: 1px solid var(--pink);
	padding-bottom: 5px;
	margin-right: 5px;
}
#entry .bl_privacyUnit input {
	border-radius: 3px;
}
#entry .bl_submitBtn {
	position: relative;
	width: 200px;
	margin: auto;
}
.bl_submitBtn:hover {
	opacity: .5;
	transition: .3s;
}
#entry .bl_submitBtn::after {
	/*content: "";*/
	width: 8px;
	height: 8px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	display: block;
	transform: rotate(45deg);
	position: absolute;
	top: 22px;
	right: 26px;
	z-index: 3;
}
#entry .el_btn_submit {
	border: none;
	background: var(--pink);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	justify-content: center;
	text-align: center;
}
#entry .bl_privacyUnit .sp_400 {
	display: none;
}
#entry .bl_experienceList {
	margin-top: 20px;
}
#entry .bl_experienceList.first {
	margin-top: 40px;
}
#entry .bl_experienceList .el_open {
	height: 46px;
	font-size: 16px; 
	font-weight: 700;
	margin-bottom: 20px;
}
#entry .bl_experienceList .el_open::after {
	top: 9px;
}
#entry .bl_experienceList .el_open.close::after {
	top: 4px;
}
/***応募確認***/
#check .ly_cont_inner {
	margin-top: 100px;
}
#check .bl_entryUnit {
	padding-left: 51px;
}
#check .bl_entryUnit dd + dd {
	margin-top: 10px;
}
#check .bl_submitArea {
	margin-top: 100px;
}
#check .bl_submitBtnUnit {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}
#check .el_btn_submit {
	border: none;
	background: var(--pink);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	padding-left: 58px;
	justify-content: flex-start;
	position: relative;
}
#check .el_btn_return::after {
	left: 16px;
}
#check .bl_submitBtn:last-of-type {
	position: relative;
}
#check .bl_submitBtn:last-of-type::after {
	/*content: "";*/
	width: 8px;
	height: 8px;
	border-right: 1px solid #fff;
	border-top: 1px solid #fff;
	display: block;
	transform: rotate(45deg);
	position: absolute;
	top: 22px;
	right: 26px;
	z-index: 3;
}
/***応募完了***/
#thanks .ly_cont__main {
	max-width: 790px;
}
#thanks .el_btn {
	margin-top: 70px;
}
/*--------------------------------------------------
よくあるご質問
--------------------------------------------------*/
#faq .bl_faq > div {
	box-shadow: 0px 0px 10px 0px #0000001A;
	background: #fff;
	border-radius: 20px;
	position: relative;
	padding: 20px;
	font-size: 16px;
	line-height: 30px;
}
#faq .bl_faq > div + div {
	margin-top: 40px;
}
#faq .bl_faq_icon {
	margin-right: 16px;
	font-size: 24px;	
  font-family: "Lato", sans-serif;
  font-weight: 700;
	color: var(--blue);
}
#faq .bl_faq_a .bl_faq_icon {
	color: var(--pink);
}
#faq .bl_faq_q,
#faq .bl_faq_a_inner {
	padding-right: 38px;
	display: flex; 
	align-items: center;
	position: relative;
}
#faq .bl_faq_q::after {
	content: "";
	width: 12px;
	height: 12px;
	border-right: 1px solid var(--black);
	border-top: 1px solid var(--black);
	display: block;
	transform: rotate(135deg);
	position: absolute;
	margin: auto;
	top: 40%;
	right: 3px;
}
#faq .el_open.close::after {
	transform: rotate(315deg);
}
#faq .bl_faq_a_inner {
	margin-top: 20px;
}
#faq .bl_faq_a_txt {
	line-height: 30px;
}
/*--------------------------------------------------
求人詳細応募ボタン 1130px
--------------------------------------------------*/
@media screen and (max-width : 1130px) {
	#works #bl_cta span {
		position: fixed;
    top: 80px;
    animation-name: fadeDownAnime;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    opacity: 0;
		right: 10px;
	}
}
/*--------------------------------------------------
求人詳細スライダー 900px
--------------------------------------------------*/
@media screen and (max-width : 900px) {
	#works.detail .swiper {
		display: block;
		width: 100%;
		margin-bottom: 30px !important;
		padding-bottom: 0;
	}	
	#works.detail .swiper[data-main-list] .swiper-wrapper {
		max-width: 100%;
	}
	#works.detail .swiper[data-thumbnail-list] .swiper-wrapper {
    height: 70px;
    width: 100%;
    display: flex;
		justify-content: center;
		padding-bottom: 60px;
		gap: 8px;
	}
	#works.detail .swiper[data-thumbnail-list] .swiper-slide {
    width: 24% !important;
    margin-bottom: 0;
	}
	#works.detail .swiper-pagination {
		justify-content: center;
	}
}
/*--------------------------------------------------
スマホ用 750px
--------------------------------------------------*/
@media screen and (max-width : 750px) {
	.detail .ly_cont_inner {
		margin-top: 50px;
	}
	.lower .ly_lv1Wrapper {
		margin-top: 50px;
		height: 250px;
	}
	/*特集記事*/
	#feature.detail .swiper-feature .swiper-wrapper {
		margin-bottom: 57px;
	}
	#feature .bl_cardUnit .bl_card a {
		display: block;
	}
	#feature .bl_card_header_cat {
		padding: 0;
	}
	#feature .bl_cardUnit .bl_card_imgWrapper {
		margin-right: 0;
		margin-bottom: 20px;
		width: 100%;
	}
	#feature .bl_card_ttl {
		height: auto;
	}
	.detail .bl_card_detail {
		gap: 6px;
	}
	.detail .bl_card_detail li {
		max-width: 180px;
    font-size: 10px;
    width: 49%;
    letter-spacing: 0;
		height: auto;
   	min-height: 25px;
    padding: 5px 0;
	}
	/*プラポリ・利用規約*/
	.plain .ly_cont__main li,
	.plain .ly_cont__main dt {
		line-height: 30px!important;
	}
	/*会社概要*/
	#company .el_lv2Header {
    margin-top: 80px;
	}
	#company .bl_companyUnit div {
		display: block;
		padding-left: 0;
	}
	#company .bl_companyUnit dt {
		width: 100%;
		margin-right: 0;
		margin-bottom: 5px;
	}
	#company .el_lv3Header {
		margin-bottom: 20px;
	}
	#company .bl_historyUnit div {
		display: block;
		padding-left: 0;
	}
	/*応募する・確認*/
	#check .bl_entryUnit {
		padding-left: 0;
	}
	#check .bl_submitBtnUnit {
		flex-direction: column-reverse;
	}

	#check .bl_submitBtn:last-of-type {
		width: 200px;
		height: 50px;
		margin: auto;
		text-align: center;
	}
	/*求人詳細*/
	#works.detail .ly_cont_inner {
		padding: 0;
	}
	#works.detail .el_lv2Header,
	#works.detail .bl_post_detail {
		margin-left: 32px;
		margin-right: 32px;
	}
	#works.detail .bl_post_body {
		margin: auto;
	}
	/*追従の応募ボタン*/
	#works #bl_cta span {
		position: fixed;
		top: initial;
		bottom: 0;
		right: 0;
		left: 0;
		background: var(--bg_pink);
    padding: 50px;
		width: 100%;
		opacity: 0;
	}
	#works #bl_cta.fixed span {
		top: initial;
	}
	.active #works #bl_cta {
		opacity: 0!important;
	}
	#works #bl_cta .el_btn_more {
		width: 100%;
		max-width: 300px;
		height: 50px;
		line-height: 1;
		text-align: center;
	}
	#works #bl_cta .el_btn_more::after {
    width: 8px;
    height: 8px;
    top: 22px;
    right: 31px;
	}
	/*動画詳細*/
	.learn.detail .bl_labelUnit .el_label {
		padding: 7px 14px 0;
		min-width: 90px;
	}
	/*iframe*/
	iframe {
		width: 100%;
	}
}
/*--------------------------------------------------
応募する 600px 
--------------------------------------------------*/
@media screen and (max-width : 600px) {
	#entry .bl_experienceList div:nth-of-type(2) {
		margin-right: 5%;
	}
}
/*--------------------------------------------------
応募する 400px 
--------------------------------------------------*/
@media screen and (max-width : 400px) {
	#entry .bl_privacyUnit .sp_400 {
		display: block;
	}
}
/*--------------------------------------------------
スマホ用 360px
--------------------------------------------------*/
@media screen and (max-width : 360px) {
	.detail .bl_card_detail li {
		width: 100%;
		max-width: 100%;
	}
}
.prev_margin {
	margin-right: 200%;
}

.next_margin {
	margin-left: 200%;
}

#feature .bl_card_small_imgWrapper img {
	border-radius: 10px;
}