@charset "utf-8";
/* PC ================================================== */
@media all and (min-width:960px){
#career {
	width: 100%;
	border-top: solid 1px #DEDEDE;
}
	.career--topimage {
		width: 100%;
		height: 500px;
		background-image: url(../image/employee_new_mid/career-topimage.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}

	.career--contents {
		width: 90%;
		max-width: 1000px;
		padding: 60px 0px 130px;
		margin: auto auto;
		display: flex;
		justify-content: space-between;
		position: relative;
	}
			.section-heading {
				width: 100%;
				margin: auto auto 80px 0px;
				font-size: 14px;
				font-weight: 500;
				line-height: 1.0;
				letter-spacing: 0.0em;
				position: relative;
			}
				.section-heading .section-heading_en {
					display: inline-block;
					margin-top: 25px;
					font-family: din-condensed, sans-serif;
					font-size: 1.4rem;
				    font-weight: 600;
				    color: #DF610F;
				    letter-spacing: 0.1em;
				}
				.section-heading:after {
					content: '';
					display: block;
					width: 50px;
					height: 2px;
					background-color: #DF610F;
					position: absolute;
					bottom: -20px;
					left: 0;
				}

		.contents--main_container {
			width: 63%;
		}
			.career--contents_inner {
				width: 100%;
				padding: 0px 0px 50px;
				margin: auto auto;
				position: relative;
			}
			.career_caution{font-size: 14px; margin-top: 15px; line-height: 1.6em; display: block}
			.career--contents_inner img{width: 100%; margin-top: 40px;}
				.career--contents_inner .section-heading {
					margin-bottom: 60px !important;
				}
				.career-info_list {
					width: 100%;
				}
					.career-info_item {
						width: 100%;
						padding: 18px 0px;
						border-bottom: solid 1px #DEDEDE;
						display: flex;
						justify-content: flex-start;
						align-items: flex-start;
					}
						.career-info_name {
							width: 135px;
							font-size: 16px;
							font-weight: 500;
							line-height: 2.0;
							letter-spacing: 0.08em;
						}
						.career-info_details {
							width: calc(100% -135px);
							font-size: 16px;
							font-weight: 400;
							line-height: 2.0;
							letter-spacing: 0.08em;
						}
		.career_role_wrap{margin-top:60px;}
			.career_role_wrap h3{margin-bottom:20px; border-bottom: 1px solid #DF610F;color: #DF610F; font-size: 1.4rem; padding-bottom: 8px;}
			.career_role_box{margin-bottom: 48px;}
			.career_role_box p{border-left: 3px solid #DF610F; line-height: 1.2rem; font-weight: 600; margin-bottom: 22px; font-size: 1.2rem}
			.career_role_box span{padding-left: 12px;}
			.career_role_box a{color:#000; font-weight: 400; text-decoration: underline}
				.career_role_box ul{padding-left: 0;}
					.career_role_box ul{
					    display: flex;
					    justify-content: space-between;
					    flex-wrap: wrap;
					}
					.career_role_box ul li{width: 48%}
					.career_role_box ul li img{width: 100%; margin-top: 0; margin-bottom: 2px}

		.contents--sidebar {
			width: 27%;
		}
			.sidebar-heading {
				width: 100%;
				padding-bottom: 18px;
				margin-bottom: 15px;
				border-bottom: solid 1px #DEDEDE;
				font-size: 24px;
				font-weight: 700;
				line-height: 1.0;
				letter-spacing: 0.06em;
				position: relative;
			}
			.sidebar-heading:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -1px;
				left: 0;
			}
			.sidebar-cp_cat-list {
				width: 100%;
				margin-bottom: 80px !important;
				position: relative;	
			}
			.sidebar-cp_cat-list:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -40px;
				left: 0;
			}
				.cp_cat-item {
					width: 100%;
					margin-bottom: 5px;
					font-size: 16px;
					font-weight: 400;
					position: relative;
				}
				.cp_cat-item:last-of-type {
					margin-bottom: 0px;
				}
				.cp_cat-item.cp_cat-item_active {
					padding-left: 20px;
					font-weight: 700;
				}
				.cp_cat-item.cp_cat-item_active:before {
					content: '';
					display: block;
					width: 3px;
					height: 23px;
					background-color: #DF610F;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translate(0%, -50%);
					-webkit-transform: translate(0%, -50%);
				}
					.cp_cat-item a {
						display: block;
						padding: 8px 0px;
						color: #000000;
						transition: .2s;
						-webkit-transition: .2s;
						position: relative;
					}
					.cp_cat-item a:hover {
						color: #DF610F;
					}
					.cp_cat-item span {
						display: block;
						padding: 8px 0px;
						position: relative;
					}
					.cp_cat-arrow {
						width: 20px;
						height: auto;
						position: absolute;
						top: 50%;
						right: 0;
						transform: translate(0%, -50%);
						-webkit-transform: translate(0%, -50%);
						pointer-events: none;
						transition: .1s;
						-webkit-transition: .1s;
					}
					.arrow_noactive {
						opacity: 1.0;
					}
					.cp_cat-item a:hover .arrow_noactive {
						opacity: 0.0;
					}
					.arrow_active {
						opacity: 0.0;
					}
					.cp_cat-item a:hover .arrow_active {
						opacity: 1.0;
					}

			.sidebar-video_message {
				width: 100%;
				margin-bottom: 90px;
				position: relative;
			}
			.sidebar-video_message:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -50px;
				left: 0;
			}
				.video_message-btn {
					display: block;
					width: 100%;
					color: #000000;
					transition: .1s;
					-webkit-transition: .1s;
				}
				.video_message-btn:hover {
					color: #DF610F;
				}
					.video_message-image {
						width: 100%;
						height: auto;
						margin-bottom: 5px;
					}
						.video_message-image img {
							width: 100%;
							height: auto;
						}

					.video_message-title {
						width: 100%;
						height: 45px;
						margin-bottom: 10px;
						border-bottom: solid 1px #DEDEDE;
						font-size: 18px;
						font-weight: 700;
						line-height: 45px;
					}
					.video_message-txt {
						display: flex;
						justify-content: flex-start;
						align-items: center;
						width: 100%;
						height: 24px;
						font-size: 12px;
						line-height: 24px;
					}
						.video_message-txt img {
							width: 24px;
							height: auto;
							margin-left: 12px;
						}

			.sidebar-recruitment {
				width: 100%;
			}
				.career-heading {
					width: 100%;
					margin-bottom: 15px;
					font-family: din-condensed, sans-serif;
					font-size: 32px;
					text-align: left;
					color: #DF610F;
					line-height: 1.0;
					letter-spacing:0.016em;
					text-indent: 0.06em;
				}
				.career-container {
					width: 100%;
				}
					.career-btn {
						display: block;
						width: 100%;
						height: 60px;
						padding-left: 10px;
						font-size: 16px;
						font-weight: 700;
						text-align: left;
						line-height: 60px;
						letter-spacing: 0.06em;
						color: #ffffff;
						position: relative;
					}
					.career-btn-contact {
						margin-bottom: 3px;
						background-color: #DF610F;
					}
					.career-btn-essential_point {
						background-color: #000000;
					}
						.career-btn-arrow {
							width: 20px;
							height: auto;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%, -50%);
							-webkit-transform: translate(0%, -50%);
							transition: .1s;
							-webkit-transition: .1s;
						}
						.career-btn:hover > .career-btn-arrow {
							right: 10px;
						}
}

/* Tablet ================================================== */
@media all and (min-width:560px) and (max-width:959px){
#career {
	width: 100%;
	border-top: solid 1px #DEDEDE;
}
	.career--topimage {
		width: 100%;
		height: 500px;
		background-image: url(../image/employee_new_mid/career-topimage.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}

			.section-heading {
				width: 100%;
				margin: auto auto 55px;
				font-size: 14px;
				font-weight: 500;
				line-height: 1.0;
				letter-spacing: 0.0em;
				text-align: left;
				position: relative;
			}
				.section-heading .section-heading_en {
					display: inline-block;
					margin-top: 15px;
					font-family: din-condensed, sans-serif;
					font-size: 1.4rem;
				    font-weight: 600;
				    color: #DF610F;
				    letter-spacing: 0.1em;
				}
				.section-heading:after {
					content: '';
					display: block;
					width: 50px;
					height: 2px;
					background-color: #DF610F;
					position: absolute;
					bottom: -20px;
					left: 0;
				}
		.career_role_wrap{margin-top:60px;}
			.career_role_wrap h3{margin-bottom:20px; border-bottom: 1px solid #DF610F;color: #DF610F; font-size: 1.4rem; padding-bottom: 8px;}
			.career_role_box{margin-bottom: 48px;}
			.career_role_box p{border-left: 3px solid #DF610F; line-height: 1.2rem; font-weight: 600; margin-bottom: 22px; font-size: 1.2rem}
			.career_role_box span{padding-left: 12px;}
			.career_role_box a{color:#000; font-weight: 400; text-decoration: underline}
				.career_role_box ul{padding-left: 0;}
					.career_role_box ul{
					    display: flex;
					    justify-content: space-between;
					    flex-wrap: wrap;
					}
					.career_role_box ul li{width: 48%}
					.career_role_box ul li img{width: 100%; margin-top: 0; margin-bottom: 2px}

	.career--contents {
		width: 90%;
		padding: 50px 0px 100px;
		margin: auto auto;
		position: relative;
	}
				.career--contents_inner img{width: 100%; margin-top: 40px;}

		.contents--main_container {
			width: 100%;
			padding: 0px 0px 50px;
		}
			.career--contents_inner {
				width: 100%;
				padding: 0px 0px 30px;
				margin: auto auto;
				position: relative;
			}
			.career_caution{font-size: 14px; margin-top: 15px; line-height: 1.6em; display: block}
				.career--contents_inner .section-heading {
					margin-bottom: 60px !important;
				}
				.career-info_list {
					width: 100%;
				}
					.career-info_item {
						width: 100%;
						padding: 15px 0px;
						border-bottom: solid 1px #DEDEDE;
						display: flex;
						justify-content: flex-start;
						align-items: flex-start;
					}
						.career-info_name {
							width: 110px;
							font-size: 16px;
							font-weight: 500;
							line-height: 1.5;
							letter-spacing: 0.03em;
						}
						.career-info_details {
							width: calc(100% - 110px);
							font-size: 16px;
							font-weight: 400;
							line-height: 1.5;
							letter-spacing: 0.03em;
						}

			.flow--contents_inner {
				width: 100%;
				padding: 30px 0px 60px;
				margin: auto auto;
				position: relative;
			}
			.flow--contents_inner img{
				width: 100%;
			}


		.contents--sidebar {
			display: none;
			width: 100%;
		}
			.sidebar-heading {
				width: 100%;
				padding-bottom: 18px;
				margin-bottom: 15px;
				border-bottom: solid 1px #DEDEDE;
				font-size: 26px;
				font-weight: 700;
				line-height: 1.0;
				letter-spacing: 0.06em;
				position: relative;
			}
			.sidebar-heading:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -1px;
				left: 0;
			}
			.sidebar-cp_cat-list {
				width: 100%;
				margin-bottom: 80px !important;
				position: relative;	
			}
			.sidebar-cp_cat-list:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -40px;
				left: 0;
			}
				.cp_cat-item {
					width: 100%;
					margin-bottom: 5px;
					font-size: 18px;
					font-weight: 400;
					position: relative;
				}
				.cp_cat-item:last-of-type {
					margin-bottom: 0px;
				}
				.cp_cat-item.cp_cat-item_active {
					padding-left: 20px;
					font-weight: 700;
				}
				.cp_cat-item.cp_cat-item_active:before {
					content: '';
					display: block;
					width: 3px;
					height: 23px;
					background-color: #DF610F;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translate(0%, -50%);
					-webkit-transform: translate(0%, -50%);
				}
					.cp_cat-item a {
						display: block;
						padding: 8px 0px;
						color: #000000;
						text-decoration: underline;
						transition: .2s;
						-webkit-transition: .2s;
						position: relative;
					}
					.cp_cat-item span {
						display: block;
						padding: 8px 0px;
						position: relative;
					}
					.cp_cat-arrow {
						width: 20px;
						height: auto;
						position: absolute;
						top: 50%;
						right: 0;
						transform: translate(0%, -50%);
						-webkit-transform: translate(0%, -50%);
						pointer-events: none;
						transition: .1s;
						-webkit-transition: .1s;
					}
					.arrow_noactive {
						opacity: 0.0;
					}
					.arrow_active {
						opacity: 1.0;
					}

			.sidebar-video_message {
				width: 100%;
				margin-bottom: 90px;
				position: relative;
			}
			.sidebar-video_message:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -50px;
				left: 0;
			}
				.video_message-btn {
					display: block;
					width: 100%;
					color: #000000;
					transition: .1s;
					-webkit-transition: .1s;
				}
					.video_message-image {
						width: 100%;
						height: auto;
						margin-bottom: 5px;
					}
						.video_message-image img {
							width: 100%;
							height: auto;
						}

					.video_message-title {
						width: 100%;
						height: 45px;
						margin-bottom: 10px;
						border-bottom: solid 1px #DEDEDE;
						font-size: 18px;
						font-weight: 700;
						line-height: 45px;
					}
					.video_message-txt {
						display: flex;
						justify-content: flex-start;
						align-items: center;
						width: 100%;
						height: 24px;
						font-size: 12px;
						line-height: 24px;
					}
						.video_message-txt img {
							width: 24px;
							height: auto;
							margin-left: 12px;
						}

			.sidebar-recruitment {
				width: 100%;
			}
				.career-heading {
					width: 100%;
					margin-bottom: 15px;
					font-family: din-condensed, sans-serif;
					font-size: 32px;
					text-align: left;
					color: #DF610F;
					line-height: 1.0;
					letter-spacing: 0.016em;
					text-indent: 0.06em;
				}
				.career-container {
					width: 100%;
				}
					.career-btn {
						display: block;
						width: 100%;
						height: 60px;
						padding-left: 10px;
						font-size: 16px;
						font-weight: 700;
						text-align: left;
						line-height: 60px;
						letter-spacing: 0.06em;
						color: #ffffff;
						position: relative;
					}
					.career-btn-contact {
						margin-bottom: 5px;
						background-color: #DF610F;
					}
					.career-btn-essential_point {
						background-color: #000000;
					}
						.career-btn-arrow {
							width: 20px;
							height: auto;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%, -50%);
							-webkit-transform: translate(0%, -50%);
							transition: .1s;
							-webkit-transition: .1s;
						}
						.career-btn:hover > .career-btn-arrow {
							right: 10px;
						}
}

/* SP ================================================== */
@media all and (max-width:559px){
#career {
	width: 100%;
	border-top: solid 1px #DEDEDE;
}
	.career--topimage {
		width: 100%;
		height: 400px;
		background-image: url(../image/employee_new_mid/career-topimage@sp.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
			.section-heading {
				width: 100%;
				margin: auto auto 40px;
				font-size: 14px;
				font-weight: 500;
				line-height: 1.0;
				letter-spacing: 0.0em;
				text-align: left;
				position: relative;
			}
				.section-heading .section-heading_en {
					display: inline-block;
					margin-top: 15px;
					font-size: 1.4rem;
				    font-weight: bold;
				    color: #DF610F;
				    letter-spacing: 0.1em;
				}
				.section-heading:after {
					content: '';
					display: block;
					width:50px;
					height: 2px;
					background-color: #DF610F;
					position: absolute;
					bottom: -20px;
					left: 0;
				}
		.career_role_wrap{margin-top:60px;}
			.career_role_wrap h3{margin-bottom:20px; border-bottom: 1px solid #DF610F;color: #DF610F; font-size: 1.2rem; padding-bottom: 8px; line-height: 1.6rem}
			.career_role_box{margin-bottom: 48px;}
			.career_role_box p{border-left: 3px solid #DF610F; line-height: 1.2rem; font-weight: 600; margin-bottom: 14px; font-size: 1rem}
			.career_role_box span{padding-left: 12px;}
			.career_role_box a{color:#000; font-weight: 400; text-decoration: underline}
				.career_role_box ul{padding-left: 0;}
					.career_role_box ul{
					    display: flex;
					    justify-content: space-between;
					    flex-wrap: wrap;
					}
					.career_role_box ul li{width: 48%}
					.career_role_box ul li img{width: 100%; margin-top: 0; margin-bottom: 2px}

	.career--contents {
		width: 90%;
		padding: 50px 0px 100px;
		margin: auto auto;
		position: relative;
	}
		.career--contents_inner img{width: 100%; margin-top: 40px;}
		.contents--main_container {
			width: 100%;
			padding: 0px 0px 50px;
		}
			.career--contents_inner {
				width: 100%;
				padding: 0px 0px 30px;
				margin: auto auto;
				position: relative;
			}
			.career_caution{font-size: 12px; margin-top: 15px; line-height: 1.6em; display: block}
				.career--contents_inner .section-heading {
					margin-bottom: 60px !important;
				}
				.career-info_list {
					width: 100%;
				}
					.career-info_item {
						width: 100%;
						padding: 15px 0px;
						border-bottom: solid 1px #DEDEDE;
						display: flex;
						justify-content: flex-start;
						align-items: flex-start;
					}
						.career-info_name {
							width: 100px;
							font-size: 16px;
							font-weight: 500;
							line-height: 1.5;
							letter-spacing: 0.03em;
						}
						.career-info_details {
							width: calc(100% - 100px);
							font-size: 16px;
							font-weight: 400;
							line-height: 1.5;
							letter-spacing: 0.03em;
						}

			.flow--contents_inner {
				width: 100%;
				padding: 30px 0px 60px;
				margin: auto auto;
				position: relative;
			}
			.flow--contents_inner img{
				width: 100%;
			}

		.contents--sidebar {
			display: none;
			width: 100%;
		}
			.sidebar-heading {
				width: 100%;
				padding-bottom: 18px;
				margin-bottom: 15px;
				border-bottom: solid 1px #DEDEDE;
				font-size: 26px;
				font-weight: 700;
				line-height: 1.0;
				letter-spacing: 0.06em;
				position: relative;
			}
			.sidebar-heading:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -1px;
				left: 0;
			}
			.sidebar-cp_cat-list {
				width: 100%;
				margin-bottom: 80px !important;
				position: relative;	
			}
			.sidebar-cp_cat-list:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -40px;
				left: 0;
			}
				.cp_cat-item {
					width: 100%;
					margin-bottom: 5px;
					font-size: 18px;
					font-weight: 400;
					position: relative;
				}
				.cp_cat-item:last-of-type {
					margin-bottom: 0px;
				}
				.cp_cat-item.cp_cat-item_active {
					padding-left: 20px;
					font-weight: 700;
				}
				.cp_cat-item.cp_cat-item_active:before {
					content: '';
					display: block;
					width: 3px;
					height: 23px;
					background-color: #DF610F;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translate(0%, -50%);
					-webkit-transform: translate(0%, -50%);
				}
					.cp_cat-item a {
						display: block;
						padding: 8px 0px;
						color: #000000;
						text-decoration: underline;
						transition: .2s;
						-webkit-transition: .2s;
						position: relative;
					}
					.cp_cat-item span {
						display: block;
						padding: 8px 0px;
						position: relative;
					}
					.cp_cat-arrow {
						width: 20px;
						height: auto;
						position: absolute;
						top: 50%;
						right: 0;
						transform: translate(0%, -50%);
						-webkit-transform: translate(0%, -50%);
						pointer-events: none;
						transition: .1s;
						-webkit-transition: .1s;
					}
					.arrow_noactive {
						opacity: 0.0;
					}
					.arrow_active {
						opacity: 1.0;
					}

			.sidebar-video_message {
				width: 100%;
				margin-bottom: 90px;
				position: relative;
			}
			.sidebar-video_message:after {
				content: '';
				display: block;
				width: 60px;
				height: 1px;
				background-color: #DF610F;
				position: absolute;
				bottom: -50px;
				left: 0;
			}
				.video_message-btn {
					display: block;
					width: 100%;
					color: #000000;
					transition: .1s;
					-webkit-transition: .1s;
				}
					.video_message-image {
						width: 100%;
						height: auto;
						margin-bottom: 5px;
					}
						.video_message-image img {
							width: 100%;
							height: auto;
						}

					.video_message-title {
						width: 100%;
						height: 45px;
						margin-bottom: 10px;
						border-bottom: solid 1px #DEDEDE;
						font-size: 18px;
						font-weight: 700;
						line-height: 45px;
					}
					.video_message-txt {
						display: flex;
						justify-content: flex-start;
						align-items: center;
						width: 100%;
						height: 24px;
						font-size: 12px;
						line-height: 24px;
					}
						.video_message-txt img {
							width: 24px;
							height: auto;
							margin-left: 12px;
						}

			.sidebar-recruitment {
				width: 100%;
			}
				.career-heading {
					width: 100%;
					margin-bottom: 15px;
					font-family: din-condensed, sans-serif;
					font-size: 32px;
					text-align: left;
					color: #DF610F;
					line-height: 1.0;
					letter-spacing: 0.016em;
					text-indent: 0.06em;
				}
				.career-container {
					width: 100%;
				}
					.career-btn {
						display: block;
						width: 100%;
						height: 60px;
						padding-left: 10px;
						font-size: 16px;
						font-weight: 700;
						text-align: left;
						line-height: 60px;
						letter-spacing: 0.06em;
						color: #ffffff;
						position: relative;
					}
					.career-btn-contact {
						margin-bottom: 3px;
						background-color: #DF610F;
					}
					.career-btn-essential_point {
						background-color: #000000;
					}
						.career-btn-arrow {
							width: 20px;
							height: auto;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%, -50%);
							-webkit-transform: translate(0%, -50%);
							transition: .1s;
							-webkit-transition: .1s;
						}
						.career-btn:hover > .career-btn-arrow {
							right: 10px;
						}
}