:root {
	--main-color: #e6001b;
}
:root {
	--sub-color01: #005bac;
}
:root {
	--sub-color02: #1a933b;
}
body {
	background: #fff;
}
.recruit-top-new {
	background: rgb(245, 245, 245);
	background: linear-gradient(0deg, rgba(245, 245, 245, 1) 0%, rgba(235, 235, 235, 1) 100%);
}

.pc02 {
	display: block;
}
.sp02 {
	display: none;
}

.breadcrumb-box {
	background-color: var(--main-color);
	border-bottom: none;
}
.top-navi ul.navi {
	background-color: #fff;
}

#header {
	width: 100%;
	background-color: #ffffff;
	font-size: 14px;
}
#header .header-logo {
	width: 100%;
	max-width: 1280px;
	height: 80px;
	margin: 0 auto;
	position: relative;
	top: 0;
	display: flex;
	justify-content: space-evenly;
	border-top: none;
}
#header h1 {
	font-size: 1.1em;
	position: static;
}
#header .header-logo .logo-box {
	width: 40%;
	color: #fff;
	padding-left: 2rem;
	margin: 0;
}
#header .header-logo .logo-box a {
	position: absolute;
	top: 0;
	display: block;
	width: min(40%,385px);
	height: 0;
	overflow: hidden;
	padding-top: 80px;
	background-image: url(../images/logo.png);
	background-position: 0 center;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
.headermenu {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: end;
	padding-right: 2rem;
}
.header-logo ul {
	display: flex;
	align-items: center;
	justify-content: end;
}
.header-logo li {
	list-style: none;
	border: solid 1px ;
	padding: 0.3rem 1.4rem 0.4rem;
	margin-left: 1rem;
}
.header-logo .top-tobeginwith {
	background-color: #e6001b;
	padding: 0.4rem 1.5rem 0.5rem;
	border: solid 0px;
}
#header .header-logo .top-tobeginwith a {
	color: #fff;
}
#header .header-logo a {
	text-decoration: none;
}

/*-- 採用バー --*/
#job_hunting_menu_box {
	width: 100%;
	background-color: #fff;
}
#job_hunting_menu_box div {
	margin: 0 auto;
	padding: 2rem 0;
	text-align: center;
}
.job_hunting_menu_box- {
	width: 100%;
	max-width: 880px;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
}
.job_hunting_menu_box- div {
	width: 30vw;
	max-width: 250px;
}
#job_hunting_menu_box a {
	display: block;
	width: 100%;
	text-decoration: none;
	padding: 1.5rem 0;
	font-weight: bold;
	letter-spacing: 0.15rem;
}
.job_hunting_menu_box-sankaku {
	position: absolute;
	top: 41%;
	font-size: 0.9rem;
}
.job_hunting_menu1 a {
	position: relative;
	align-items: center;
	color: #e6001b;
	border: solid 2px #e6001b;
}
.job_hunting_menu1 a:hover {
	color: #fff;
	background-color: var(--main-color);
	border: solid 2px #e6001b;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.25);
}
.job_hunting_menu2 a {	
	position: relative;
	color: #fff;
	background-color: #005bac;
	border: solid 2px #005bac;
}
.job_hunting_menu2 a:hover {
	color: #fff;
	background-color: #0071d4;
	border: solid 2px #0071d4;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.25);
}
.job_hunting_menu3 a {
	position: relative;
	color: #fff;
	background-color: #1a933b;
	border: solid 2px #1a933b;
}
.job_hunting_menu3 a:hover {
	background-color: #0ba735;
	border: solid 2px #0ba735;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.25);
}


/*-- RECRUITMENT INFORMATION --*/
.tt-textbox details {
	height: 0;
	transition: 0.5s;
}
.tt-textbox details[open] {
	height: 230px;
}
.tt-textbox summary {
	display: block;
	cursor: pointer;
}
.tt-textbox summary::-webkit-details-marker {
	display: none;
}

.tt-textbox summary::after {
	content: "→Read more";
	color: #e6001b;
	padding-top: 0.5rem;
	float: inline-end;
}
.tt-textbox details[open] summary::after {
	content: "";
	color: #e6001b;
}

#top-tobeginwith {
	display: flex;
	justify-content: end;
	padding: 5rem 0;
}
.tt-box {
	width: 90%;
	background-color: #fff;
}
.tt-container {
	display: flex;
	width: 100%;
	padding: 2rem 0;
	padding-left: 5rem;
	background-color: #fff;
	border-left: solid 25px #e6001b;
}
.tt-textbox {
	width: 95%;
}
.tt-container .white {
	width: 5%;
	color: #fff;
}
.tt-textbox span {
	color: var(--main-color);
	font-size: 36px;
	font-weight: bold;
}
.title-p {
	font-size: 24px;
}
.title-p- {
	font-size: 16px;
	letter-spacing: 0.02em;
	max-width: 1150px;
}

.cpm-box {
	position: relative;
	width: 100%;
	margin: 5rem 0 0;
	padding-bottom: 5rem;
}
.cpm-contents {
	position: relative;
	width: 100%;
	max-width: 1240px;
	padding: 0 5%;
	margin: 0 auto;
}
.cpm {
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 3rem 4rem 2rem;
	background-color: #fff;
}
#slider1 {
	width: 100%!important;
	height: 45.5vw;
	max-height: 559px;
	margin: 0 auto!important;
	padding: 0;
	background-color: #fff;
}
.sp-previous-arrow:before,
.sp-previous-arrow:after,
.sp-next-arrow:before,
.sp-next-arrow:after {
	color: rgba(0, 0, 0, 0.15) !important;
	background-color: #d9d9d925!important;
	font-size: 3.5rem;
	top: 0!important;
}
.sp-image,.sp-grab {
	height: 100%!important;
	margin: 0 auto;
}
.sp-horizontal .sp-arrows {
	top: 50%;
}
.sp-slides-container {
	height: 100%;
}

/* .powerpower-point {
	width: 100%;
	max-width: 1200px;
	height: 45vw;
	background-color: #333;
	margin: 0 auto;
} */
.cpm p {
	font-size: 21px;
	font-weight: bold;
	padding-bottom: 1rem;
	line-height: 1.2;
}

.green {
	position: absolute;
	width: 100%;
	/* height: 32vw; */
	height: 12vw;
	left: 0;
	bottom: 0;
	background-color: #1a933b;
	margin-bottom: 0;
	z-index: 0;
}

.green::before {
	content: "";
	position: absolute;
	left: 0;
	/* bottom: 31.9vw; */
	bottom: 11.9vw;
	clip-path: polygon(100% 0, 0 100%, 100% 100%);
	width: 100vw;
	height: 14rem;
	background-color: #1a933b;
	margin-bottom: 0;
	z-index: -2;
}

#qa {
	width: 100%;
	max-width: 1240px;
	padding: 0 4rem;
	padding-right: 0;
	margin: 5rem auto;
}
#qa a {
	text-decoration: none;
}

.top-qa-box {
	width: 100%;
	padding: 2rem 0;
	padding-left: 5rem;
	padding-right: 4rem;
	margin-bottom: 2rem;
	background-color: #fff;
	border-left: solid 25px #e6001b;
}
.top-qa-box:hover {
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
	transition: .3s;
}
.top-qa-box a {
	text-decoration: none;
}
.tqb-1 {
	font-size: 21px;
	font-weight: bold;
	padding-bottom: 0.5rem;
}
.readmore {
	text-align: right;
	color: #e6001b;
}

/* navi */

.top-navi {
	width: 100%;
	max-width: 1240px;
	height: auto;
	overflow: hidden;
	margin: 20px auto 0;
	margin-bottom: 3rem;
}

.top-navi ul,
.top-navi li {
	list-style: none;
	width: auto;
}

.top-navi li::before {
	content: "　｜　";
}

.top-navi li.start::before {
	content: "";
}

.top-navi ul.navi {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.top-navi ul.navi a {
	text-decoration: none;
	font-size: 1.6rem;
}

.top-navi ul.navi a:hover {
	color: var(--main-color);
}

.top-navi ul.navi2 {
	margin-top: 2rem;
}

/* ---------- コンテンツタイトル ---------- */

.content-title {
	width: 100%;
	height: auto;
	text-align: center;
	color: #333;
	margin-top: 4rem;
}

.content-title h2 {
	font-size: 2.4rem;
	width: 100%;
	height: auto;
	padding: 0 1rem 0.5rem;
}

.content-title p {
	font-size: 1.6rem;
}

/* video */
.video-area {
	position: relative;
	z-index: 0;
	right: 0;
	left: 0;
	bottom: 0;
	overflow: hidden;
	width: 100vw;
	height: 56.25vw;
}

.video-style {
	position: absolute;
	top: -5.2vw;
	width: 100%;
	height: auto;
	filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
	outline: none;
	border: none;
}

.video-area::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: url(images/stripe.png);
	background-size: 4px 4px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	opacity: 0.8;
}

.company-name-logo {
	position: absolute;
	top: 54%;
	left: 50%;
	z-index: 4;
	transform: translate(-50%, -50%);
	width: 30%;
}

.company-logo-img {
	width: 100%;
}

#news {
	position: relative;
	z-index: 1;
	width: 100%;
	padding: 5rem 0 7rem;
	background-color: #fff;
}

.recruit-topics-box {
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 3%;
}

.recruit-topics-title {
	text-align: center;
}

.recruit-topics-title h2 {
	font-weight: normal;
}

.recruit-topics-list {
	margin-top: 5rem;
}

.article-link {
	text-decoration: none;
}

.article-list {
	display: flex;
	align-items: center;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	border-bottom: 1px solid #eeeeee;
}

.article-list:hover {
	transform: scale(1.005);
	transition: .3s;
	color: #003875;
}

.blogger-a {	
	text-decoration: none;
	padding: 1rem 2rem;
	background-color: #fff;
	border: solid 2px #005bac;
	border-radius: 0;
	color: #005bac;
	transition: .3s;
	float: right;
}
.blogger-a:hover {
	background-color: #005bac;
	border-radius: 1rem;
	color: #fff;
}
.logger-a- a {
	color: #005bac;
}


.article-date {
	margin-right: 5%;
}

.category-title {
	width: 10rem;
	margin-right: 5%;
	text-align: center;
	font-size: 1.4rem;
}

.category-box-event {
	width: 100%;
	padding: 0.2rem;
	color: #ffffff;
	background-color: #e6001b;
}

.category-box-recruit {
	width: 100%;
	padding: 0.2rem;
	color: #ffffff;
	background-color: #4D96FF;
}

.category-box-news {
	width: 100%;
	padding: 0.2rem;
	color: #ffffff;
	background-color: #005bac;
}

.article-detail-title {
	font-size: 1.6rem;
	font-weight: normal;
}

.orientation-banner {
	width: 100%;
	max-width: 1280px;
	margin: 1rem auto 0;
	/* margin: 4rem auto 0; */
}

.orientation-banner-{
	padding-bottom: 2rem;
	background-color: #fff;
}

.orientation-banner-img {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	vertical-align: top;
}

.panel-wrap {
	max-width: calc(1240px + 6%);
	margin: 6rem auto 0;
	padding-bottom: 3rem;
}

.panel-flex {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	list-style-type: none;
}

.panel-item {
	width: 32%;
	margin-bottom: 2%;
}

.panel-item-link {
	display: block;
	width: 100%;
	height: 100%;
}

.panel-img {
	width: 100%;
	vertical-align: top;
}

.panel-item:hover {
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
	transition: .3s;
}

.youtube-box {
	display: flex;
	justify-content: center;
	width: 80%;
	max-width: 1240px;
	padding-left: 3%;
	padding-right: 3%;
	margin: 0 auto 5rem;
}

.cm-box{
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 4rem 4rem 1rem;
	text-align: center;
	background-color: #fff;
	box-shadow: 0 2px 20px #d9d9d9;
}

.movie-box{
	position: relative;
	margin: 0 auto;
	width: 100%;
	padding-top: 56.25%;
}

.movie-box iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

.text-box {
	width: 100%;
	height: auto;
	margin: 1rem auto 0;
	text-align: left;
}

#city-sns {
	width: 100%;
	padding: 0.5rem 0 8rem;
	background-color: #fff;
}

.city-sns {
	width: 73%;
	max-width: 1240px;
	height: auto;
	overflow: hidden;
	margin: 0 auto;
	margin-top: 40px;	
}

.sns_insta ul.insta_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 100%;
	max-width: 860px;
	margin: 0 auto;
}

.sns_insta ul.insta_list li {
	list-style: none;
	width: calc(67vw / 3 - 1rem);
	height: calc(83vw / 3 - 1rem);
	max-width: 280px;
	max-height: 350px;
	margin-left: 5px;
	margin-bottom: 5px;
}

.sns_insta ul.insta_list li a p {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
}

.sns_insta ul.insta_list li a p span {
	font-size: 120%;
}

.sns_insta img {
	width: 190px;
	height: auto;
}

#footer {
	margin-top: 0;
}
.fixed-menu {}
#pageTop a {
	display: none;
}

/* ---------- page top ボタン ---------- */

#page-Top {
	position: fixed;
	bottom: 21rem;
	right: 20px;
	z-index: 200;
}

#page-Top a {
	display: block;
	z-index: 999;
	border-radius: 30px;
	width: 60px;
	height: 60px;
	border: solid 1px rgba(0, 0, 0, 0.2);
	color: rgba(0, 0, 0, 0.5);
	font-size: 2em;
	font-weight: bold;
	line-height: 55px;
	text-decoration: none;
	text-align: center;
	background-color: rgba(255, 255, 255, 0.8);
}

/* ---------- nav ボタン ---------- */
#nav-open {
	position: absolute;
	top: 20px;
}
#nav-drawer #nav-content {
	max-width: 40%;
}
#nav-drawer #nav-content {
	-webkit-transform: translateX(250%);
        transform: translateX(250%);
}
#nav-drawer #nav-input:checked~#nav-content {
	-webkit-transform: translateX(150%);
	transform: translateX(150%);
}

#nav-drawer02 {
	position: relative;
}
.nav-unshown {
	display: none;
}
#nav-open02 {
	position: fixed;
	bottom: 28rem;
	right: 20px;
	border-radius: 30px;
	width: 60px;
	height: 60px;
	border: solid 1px #7a7a7ada;
	color: #7a7a7ada;
	font-size: 2em;
	font-weight: bold;
	line-height: 55px;
	text-decoration: none;
	text-align: center;
	background-color: #7a7a7ada;
	z-index: 5;
}
#nav-open02 span,
#nav-open02 span:before,
#nav-open02 span:after {
	position: absolute;
	left: 50%;
	bottom: 65%;
	transform: translateX(-50%) translateY(-65%);
	height: 3px;
	width: 40px;
	border-radius: 5px;
	background: #fff;
	display: block;
	content: '';
	cursor: pointer;
}

#nav-open02 span:before {
	bottom: -14px;
}

#nav-open02 span:after {
	bottom: -27px;
}

#nav-close {
	display: none;
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
}

#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 90%;
	max-width: 25%;
	height: 100%;
	background: #333;
	transition: .3s ease-in-out;
	-webkit-transform: translateX(450%);
	transform: translateX(450%);
	padding: 2rem;
}

#nav-content span.menu-midashi {
	display: block;
	width: 100%;
	height: auto;
	font-size: 2rem;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	margin: 2rem auto;
}

#nav-content ul,
#nav-content li {
	list-style: none;
}

#nav-content li a {
	display: block;
	width: 100%;
	height: auto;
	padding: 2rem 1rem;
	text-decoration: none;
	color: #ffffff;
	font-size: 1.4rem;
	border-bottom: dotted 1px #ffffff;
}

#nav-input:checked~#nav-close {
	display: block;
	opacity: .5;
}

#nav-input:checked~#nav-content {
	-webkit-transform: translateX(300%);
	transform: translateX(300%);
	box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
}

/*-- 1DAYインターシップ --*/
#one-day {
	position: fixed;
	bottom: 7rem;
	right: 0;
	z-index: 198;
}
#one-day a {
	text-decoration: none;
	color: #fff;
}
.one-day- {
	display: flex;
	width: 400px;
	height: 60px;
}
.red_box,
.red_box02 {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 100%;
	background-color: #5B000A;
	border-radius: 10px 0 0 10px;
}
.red_box02 {
	background-color: #002f58;
}
.triangle {
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
	border-right: 0;
	border-left: 12px solid #fff;
}
.red-box- {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 370px;
	height: 100%;
	padding-left: 2rem;
	background-color: #e6001b;
	color: #fff;
}
.red-p1 {
	font-size: 18px;
}
.red-p2 {
	font-size: 24px;
}

.red-box-2 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 370px;
	height: 100%;
	padding-left: 2rem;
	background-color: #005bac;
	color: #fff;
}
.one-day-a {
	margin-top: 1rem;
}

@media screen and (max-width:768px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	#sp {
		display: block;
	}

	#pageTop {
                bottom: 5.7em;
                right: 1em;
        }
	#page-Top {
		bottom: 22rem;
	}

	#nav-open02 {
		bottom: 29rem;
	}
	#nav-content {
                overflow: auto;
                position: fixed;
                top: 0;
                left: 0;
                z-index: 9999;
                width: 90%;
                max-width: 60%;
                height: 100%;
                background: #333;
                transition: .3s ease-in-out;
                -webkit-transform: translateX(175%);
                transform: translateX(175%);
                padding: 2rem;
        }

	#header .header-logo .logo-box a {
		width: 220px;
	}
	#nav-input:checked~#nav-content {
		-webkit-transform: translateX(67%);
		transform: translateX(67%);
	}

	.one-day- {
		width: 260px;
		height: 60px;
	}
	.red_box {
		width: 20px;
	}
	.red-box- {
		width: 240px;
		padding-left: 1rem;
	}
	.red-p1 {
		font-size: 14px;
	}
	
	.red-p2 {
		font-size: 18px;
	}


	#header .header-logo {
		align-items: baseline;
	}
	#header .header-logo .logo-box {
		margin: 0;
	}
	
	.job_hunting_menu1,
	.job_hunting_menu2,
	.job_hunting_menu3 {
		display: flex;
		justify-content: center;
		align-items: center;
		width: calc(100%/3);
	}
	.city-sns {
		width: 100%;
		margin-top: 0;
	}
	.sns_insta {
        width: 100%;
        margin-left: 0;
        margin-top: 1rem;
	}
	.sns_insta ul.insta_list {
        display: flex;
        justify-content: space-around;
	}
	.sns_insta ul.insta_list li {
        list-style: none;
        width: 30vw;
        height: 38vw;
        margin-left: 0px;
	}
	.sns_insta ul.insta_list li a p {
        width: 80%;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
	}
	.sns_insta ul.insta_list li a p span {
        font-size: 120%;
	}

	.youtube-box {
			display: block;
			width: 100%;
			margin-bottom: 3rem;
		}
		
	.video-area {
		width: 100%;
		height: 54.25vw;
	}

	.video-area::after {
		height: 100%;
	}

	.video-area::after {
		display: none;
	}

	.company-name-logo {
		width: 50%;
	}

	.article-detail-title {
		font-size: 1.4rem;
	}

	.panel-wrap {
		margin: 3rem auto 0;
	}

	.panel-flex {
		display: block;
	}

	.panel-item {
		width: 100%;
		margin-bottom: 8%;
	}

	.recruit-topics-list {
		margin-top: 3rem;
	}

	.article-list {
		display: block;
	}

	.article-date,
	.category-title {
		float: left;
		margin-bottom: 0.5rem;
	}

	.article-detail-text {
		clear: both;
	}


	/* footer-navi-menu */

	#tab.top-navi {
		position: relative;
		width: 100%;
		color: #fff;
		/* アコーディオン タブ文字色 */
		overflow: hidden;
	}

	#tab.top-navi input {
		position: absolute;
		opacity: 0;
		z-index: -1;
	}

	#tab.top-navi label {
		position: relative;
		display: block;
		padding: 1em;
		background: var(--main-color);
		/* アコーディオン タブ背景色 */
		font-size: 1.8rem;
		font-weight: bold;
		cursor: pointer;
	}

	#tab.top-navi .tab-content {
		max-height: 0;
		overflow: hidden;
		-webkit-transition: max-height .35s;
		-o-transition: max-height .35s;
		transition: max-height .35s;
	}

	/* :checked */
	#tab.top-navi input:checked~.tab-content {
		max-height: 30em;
		background: var(--main-color);
		border-top: solid 1px rgba(255, 255, 255, 0.5);
	}

	/* Icon */
	#tab.top-navi label::after {
		background: #5B000A;
		content: '+';
		display: block;
		line-height: 60px;
		position: absolute;
		right: 0;
		text-align: center;
		top: 0;
		width: 60px;
		height: 60px;
		font-size: 2.4rem;
		font-weight: bold;
	}

	#tab.top-navi input[type=checkbox]:checked+label::after {
		content: '-';
	}

	#tab.top-navi .menu {
		position: absolute;
		top: 0;
		right: 70px;
		width: auto;
		width: max-content;
		height: 60px;
		line-height: 60px;
		font-size: 1.6rem;
		font-weight: bold;
	}

	/* .top-title {
		width: 100%;
	}

	.top-title-box {
		margin-top: 0;
		margin-bottom: 2rem;
	} */

	.top-navi {
		width: 100%;
		margin-top: 0;
		margin-bottom: 0;
	}

	.top-navi li::before {
		display: none;
	}

	.top-navi ul.navi {
		display: block;
		width: 100%;
		height: auto;
		overflow: hidden;
		background-color: var(--main-color);
	}

	.top-navi li a {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 50%;
		height: 6rem;
		float: left;
		text-align: center;
		padding: 0.5rem;
		color: #ffffff;
		background-color: var(--main-color);
	}

	.top-navi li.navi01 a,
	.top-navi li.navi03 a,
	.top-navi li.navi05 a,
	.top-navi li.navi07 a {
		border-right: solid 1px rgba(255, 255, 255, 0.5);
	}

	.top-navi li.navi01 a,
	.top-navi li.navi02 a,
	.top-navi li.navi03 a,
	.top-navi li.navi04 a,
	.top-navi li.navi05 a,
	.top-navi li.navi06 a {
		border-bottom: solid 1px rgba(255, 255, 255, 0.5);
	}

	.top-navi ul.navi2 {
		margin-top: 0;
	}

	.top-navi ul.navi a:hover {
	color: #fff;
	background-color: #eb6473;
	}

	.video-area::after {
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		background: url(images/dot.png);
		background-size: 2px 2px;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 3;
		opacity: 0.6;
	}

	/*-- RECRUITMENT INFORMATION --*/
	
	#top-tobeginwith {
		padding: 4rem 0;
	}
	.tt-box {
		width: 95%;
	}
	.tt-container {
		padding-left: 1.5rem;
		border-left: solid 15px #e6001b;
	}
	.tt-textbox span {
		font-size: 28px;
		line-height: 1.1;
	}
	.title-p {
		padding: 1rem 0;
	}

	.youtube-box {
		padding: 0 5%;
	}
	.cm-box {
		padding: 2rem;
		padding-bottom: 1rem;
	}

	.top-qa-box {
		padding-right: 5%;
		padding-left: 1.5rem;
		border-left: solid 15px #e6001b;
	}
	.sp-previous-arrow:before,
	.sp-previous-arrow:after,
	.sp-next-arrow:before,
	.sp-next-arrow:after {
		font-size: 2.5rem;
	}
}
@media screen and (max-width: 567px) {
	.pc02 {
			display: none;
		}
	.sp02 {
			display: block;
		}
	#news {
		padding-top: 3rem;
	}
	#job_hunting_menu_box {
		padding: 1rem 0;
	}
	#job_hunting_menu_box div {
		padding: 0.5rem 0;
	}
	.job_hunting_menu_box- div {
		width: 80vw;
		max-width: 500px;
	}
	.job_hunting_menu_box- {
		width: 100%;
		display: block;
	}
	#top-tobeginwith {
		padding: 2rem 0;
	}
	.cpm-box {
		margin-top: 3rem;
		padding-bottom: 3rem;
	}
	.cpm {
		padding: 2rem 2rem 1rem;
	}
	.orientation-banner {
		margin-top: 1rem;
	}
	.orientation-banner- {
		padding-bottom: 1rem;
	}
	#qa {
		margin: 3rem auto;
	}
}
@media screen and (max-width: 450px) {
	.tt-textbox details[open] {
		height: 330px;
	}
}
@media screen and (max-width: 375px) {
	.sp-image,.sp-grab,.sp-image-container {
	width: auto!important;
	height: 41.6vw!important;
}
}