/* お仕事詳細 */

.job-detail {
	margin:100px 0 ;
	padding:0px 0 ;
}
@media screen and (min-width: 960px) {
	.job-detail {
		margin:30px 0 100px;
		padding:0px 0 ;
	}
}

.job-detail__list {
	margin:0 5% 30px;
}
.job-detail__list h2 {
	margin-top:40px;
	font-size:130%;
	font-weight:bold;
	color:#009D96;
}
.job-detail__list--category {
	display:flex;
	flex-wrap: wrap;
	margin-top:20px;
}
.job-detail__list--category li {
	margin:0 2% 10px 0;
	padding:0.5em 5px;
	width: calc(31% - 10px);
	font-size:12px;
	color:#009D96;
	text-align:center;
	border:1px solid #009D96;
	word-wrap: break-word;
}
.job-detail__list--category li:nth-child(3n) {
	margin-right:0;
}
.job-detail__list--contents {
	margin-top:10px;
}
.job-detail__list--contents-txt {
	margin-top:10px;
}
.job-detail__list--contents-txt dl {
	display:flex;
	flex-wrap: wrap;
	font-size:80%;
	border-top:1px solid #009D96;
}
.job-detail__list--contents-txt dl dt {
	display:flex;
	align-items: center;
	justify-content: center;
	padding:1em 0;
	width:20%;
	text-align:center;
	border-bottom:1px solid #009D96;
	background:#bfe6e4;
}
.job-detail__list--contents-txt dl dd {
	display:flex;
	align-items: center;
	padding:1em 10px;
	width:calc(80% - 20px);
	border-bottom:1px solid #009D96;
}
.slide-arrow {
  bottom: 0;
  cursor: pointer;
  margin: auto;
  position: absolute;
  top: 0;
  width: 30px;
}
.prev-arrow {
  left: 10px;
  width:15px;
  z-index:3;
}
.next-arrow {
  right: 10px;
  width:15px;
  z-index:2;
}
@media screen and (min-width: 960px) {
	.job-detail__list {
		margin:0 auto 30px;
		padding:30px;
		width:900px;
	}
	.job-detail__list h2 {
		font-size:24px;
	}
	.job-detail__list--category li {
		margin:0 10px 10px 0;
		padding:0 5px;
		width: calc(15% - 10px);
		word-wrap: break-word;
	}
	.job-detail__list--category li:nth-child(3n) {
		margin-right:10px;
	}
	.job-detail__list--contents {
		display:flex;
		margin-top:10px;
	}
	.job-detail__list--contents-img {
		margin-right:3%;
		width:40%;
		height: 250px;
	}
	.job-detail__list--contents-txt {
		margin-top:0;
		width:57%;
	}
	.job-detail__list--contents-txt dl {
		height:100%;
		font-size:90%;
	}
	.job-detail__list--contents-txt dl dd {
		padding:1em 20px;
		width:calc(80% - 40px);
	}
}

@media screen and (max-width: 959px) {
    .job-detail__list--contents-img {
        height: 300px; /* Adjust the height as per your requirement */
    }
}

.job-detail__point {
	margin:0 5%;
	padding:30px 0;
	border:5px solid #fed400;
	text-align:center;
}
.job-detail__point--ttl {
	font-size:120%;
	font-weight:bold;
	color:#009D96;
}
.job-detail__point--txt {
	margin:0 5%;
}
.job-detail__point--txt ul {
	display:inline-block;
	margin:20px 0 0 1em;
	list-style-type: none;
	font-size:100%;
	text-align:left;
}
.job-detail__point--txt ul li {
	margin-bottom:15px;
}
.job-detail__point--txt ul li:before {
	/* content: '■'; */
	margin-left:-1em;
}
@media screen and (min-width: 960px) {
	.job-detail__point {
		margin:0 auto;
		padding:50px 0 ;
		width:900px;
	}
	.job-detail__point--ttl {
		font-size:26px;
	}
	.job-detail__point--txt ul {
		margin-top:30px;
		font-size:120%;
	}
}

.job-detail__gaiyou {
	margin:0 5%;
}
.job-detail__gaiyou dl {
	margin-top:40px;
	font-size:90%;
}
.job-detail__gaiyou dl dt {
	margin-bottom:10px;
}
.job-detail__gaiyou dl dt span {
	display:block;
	padding:1px 0;
	width:10em;
	text-align:center;
	color:#ffffff;
	background:#009d96;
	border-radius: 7px;
}
.job-detail__gaiyou dl dd {
	margin-bottom:20px;
}
@media screen and (min-width: 960px) {
	.job-detail__gaiyou {
		margin:0 auto;
		width:900px;
	}
	.job-detail__gaiyou dl {
		margin-top:70px;
		display:flex;
		flex-wrap: wrap;
	}
	.job-detail__gaiyou dl dt {
		margin-bottom:10px;
		width:11em;
	}
	.job-detail__gaiyou dl dd {
		margin-bottom:10px;
		width: calc(100% - 11em);
	}
}

.contact__formWrap {
	margin:0 5% ;
	padding:100px 0 150px;
}
.contact__formWrap h2 {
	margin:0 0 40px;
	padding-bottom:0.2em;
	font-size:26px;
	font-weight:700;
	color:#009d96;
	text-align:center;
	border-bottom:1px solid #009d96;
}
.contact__formWrap dl {
	display:flex;
	flex-wrap: wrap;
	flex-direction: column;
}
.contact__formWrap dl dt {
	width:100%;
	margin-bottom:10px;
}
.contact__formWrap dl dd {
	width:100%;
	margin-bottom:20px;
}
@media screen and (min-width: 960px) {
	.contact__formWrap {
		margin:0 auto ;
		padding:100px 0 150px;
		width:900px;
	}
	.contact__formWrap h2 {
		margin:0 0 40px;
		font-size:30px;
	}
	.contact__formWrap dl {
		flex-direction: row;
		justify-content: center;
		margin:0 50px;
	}
	.contact__formWrap dl dt {
		width:28%;
		margin-bottom:20px;
	}
	.contact__formWrap dl dd {
		width:65%;
		margin-bottom:20px;
	}
}

.contact__formWrap input ,
.contact__formWrap textarea {
	padding:7px;
}
.contact__formWrap .width_age {
	width: 4em;
}
.contact__formWrap .width100 {
	width: calc(100% - 14px);
}

/* チェックボックス01 */
input[type=checkbox] {
    display: none;
}
.checkbox01 {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 5px 30px;
    position: relative;
    width: auto;
}
.checkbox01::before {
    background: #fff;
    border: 1px solid #231815;
    content: '';
    display: block;
    height: 16px;
    left: 5px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 16px;
}
.checkbox01::after {
    border-right: 3px solid #000000;
    border-bottom: 3px solid #000000;
    content: '';
    display: block;
    height: 9px;
    left: 10px;
    margin-top: -7px;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 5px;
}
input[type=checkbox]:checked + .checkbox01::after {
    opacity: 1;
}

/* ラジオボタン01 */
input[type=radio] {
    display: none;
}
.radio01 {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 5px 30px;
    position: relative;
    width: auto;
}
.radio01::before {
    background: #fff;
    border: 1px solid #231815;
    border-radius: 50%;
    content: '';
    display: block;
    height: 16px;
    left: 5px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 16px;
}
.radio01::after {
    background: #000000;
    border-radius: 50%;
    content: '';
    display: block;
    height: 10px;
    left: 9px;
    margin-top: -4px;
    opacity: 0;
    position: absolute;
    top: 50%;
    width: 10px;
}
input[type=radio]:checked + .radio01::after {
    opacity: 1;
}

.contact__formWrap-btn {
	display:flex;
	justify-content: center;
	margin-top:30px;
}
.contact__formWrap-btn--submit {
    margin:0 10px;
    width: 10em;
    padding: 8px;
    border: none;
    border-radius: 40px;
    background-color: #009d96;
    color: #fff;
    font-weight: bold;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    border: 2px solid transparent;
}

.contact__formWrap-btn--submit:hover {
    background-color: #00c6b7;
}

.contact__formWrap-btn--submit:focus {
    outline: 0;
    background-color: #00c6b7;
    border: 2px solid rgb(33, 150, 243);
}
.contact__formWrap-btn--reset {
    margin:0 10px;
    width: 10em;
    padding: 8px;
    border: none;
    border-radius: 40px;
    background-color: #fff;
    color: #666;
    font-weight: bold;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    border: 2px solid #ccc;
}

.contact__formWrap-btn--reset:hover {
    background-color: #eee;
}

.contact__formWrap-btn--reset:focus {
    outline: 0;
    background-color: #eee;
    border: 2px solid rgb(33, 150, 243);
}

@media screen and (min-width: 960px) {
	.contact__formWrap input ,
	.contact__formWrap textarea {
		padding:7px;
	}
	.contact__formWrap .width100 {
		width:100%;
	}

}

.contact__check-read {
	margin-bottom:50px;
	font-size:120%;
	text-align:center;
}
.contact__error-txt {
	margin:100px 0;
	font-size:120%;
	text-align:center;
}
.contact__thanks-txt {
	margin:100px 0;
	font-size:120%;
	text-align:center;
}
.contact__return-txt {
	text-align:center;
}
.contact__return-txt a {
	color:#009D96;
	text-decoration: none;
}
.contact__return-txt a:hover {
	text-decoration: underline;
}


.contact__ttl {
	margin:0 5%;
	padding-bottom:0.2em;
	font-size:30px;
	font-weight:700;
	color:#009d96;
	text-align:center;
	border-bottom:1px solid #009d96;
}
.contact__content {
	margin:40px 5% 0;
	font-size:90%;
}
.contact__content p {
	margin-bottom:2em;
}