/*
Theme Name: top
Version: 1.0
Author: wave
*/

@charset "UTF-8";

/* indexLayout
------------------------------------*/
.indexLayout .contentsBox01 .mainImg {
	background: url(/img/main01.jpg)no-repeat center center;
	height: 500px;
	background-size: cover;
}

.indexLayout .contentsBox01 p,
.indexLayout .contentsBox01 #c06 .inner .flex01 .box01 {
	text-align: center;
}

.indexLayout .contentsBox01 #main .nonText {
	display: block;
	margin: 0 auto;
}

.indexLayout #main .concept::before {
	display: none;
}

.indexLayout #main h2 {
	width: 100%;
	font-size: 250%;
	position: relative;
	display: inline-block;
	color: #212964;
	margin-bottom: 45px;
	text-align: center;
	height: auto;
	background-position: 0 0;
	background-size: auto auto;
}

.indexLayout #main .cassette:first-of-type h2 {
	margin-bottom: 25px;
}

.indexLayout #main h2::before,
.indexLayout .contentsBox01 #c02 .box01 .box05::before {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -15px;
	display: inline-block;
	width: 70px;
	height: 5px;
	-moz-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #212964;
}

.indexLayout .contentsBox01 #c02.cassette {
	background: url(/img/top_bg01.webp);
}

.indexLayout .contentsBox01 #c04.cassette {
	background: url(/img/top_bg02.webp)no-repeat center;
	background-size: cover;
}

.indexLayout .contentsBox01 #c02 .inner .flex01 li {
	width: 31%;
}

.indexLayout .contentsBox01 #c02.cassette .inner .flex01 .box01,
.indexLayout .contentsBox01 #main #c04 .inner h2::before,
.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .box03 .btn01 {
	background-color: #fff;
}

.indexLayout .contentsBox01 #c02.cassette .inner .flex01 .box01,
.indexLayout .contentsBox01 #c05 .inner .flex03 .box01,
.indexLayout .contentsBox01 #c06 .inner .flex01 .box01 a img {
	margin-bottom: 40px;
}

.indexLayout .contentsBox01 #c02 .box01 .box05 {
	margin-bottom: 30px;
}


.indexLayout .contentsBox01 #c02.cassette .inner .flex01 .box01 {
	width: auto;
	padding: 20px 30px 10px;
	height: 75%;
}

/* .indexLayout .contentsBox01 #c02 .inner .flex01 .box01 .title{
	height: 50px;
} */

.indexLayout .contentsBox01 #c02 .box01 .box05 {
	position: relative;
	height: 50px;
}

.indexLayout .contentsBox01 #c02 .box01 .box05 .info,
.indexLayout .contentsBox01 #c02 .box01 .box05 .recruit {
	position: absolute;
	left: 0;
}

.indexLayout .contentsBox01 #c02 .box01 .box05 time {
	position: absolute;
	/* right: 0; */
	top: 25px;
}

.indexLayout .contentsBox01 #c02 .box01 .box05::before {
	left: 35px;
	bottom: -10px;
}

.indexLayout .contentsBox01 #main #c04 .inner h2,
.indexLayout .contentsBox01 #main #c04 .inner p,
.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .title {
	color: #fff;
}

.indexLayout .contentsBox01 .cassette .flex01 .box01 .title,
.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .blogBox01 p {
	text-align: left;
}

.indexLayout .contentsBox01 .cassette .box01 .title {
	font-weight: bold;
}

.indexLayout .contentsBox01 .cassette .flex01 .box01 time {
	color: #666;
}

.indexLayout .contentsBox01 #main .cassette .btn01,
.indexLayout .contentsBox01 #c03 .banner {
	margin: 0 auto 20px;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 {
	background-color: #fcf6de;

}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .title {
	background-color: #212964;
	font-size: 150%;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .title,
#container .indexLayout .contentsBox01 #contents #main #c06.cassette {
	margin: 0;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .title,
.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .box03 {
	padding: 20px;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .blogBox01 time {
	margin-bottom: 10px;
	color: #2e2e2e;
	font-weight: bold;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .box03 .btn01 {
	border: 2px solid #ec6941;
}

.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .box03 .btn01 a {
	color: #ec6941;
}

.indexLayout .contentsBox01 #c05 .flex03 .box01 {
	margin-right: 30px;
}

.indexLayout .contentsBox01 #c05 .flex03 .box01:last-child {
	margin-right: 0;
}

.indexLayout .contentsBox01 #c05 .flex03 .box01 {
	width: 30%;
}

.indexLayout .contentsBox01 #c05 .flex03 .box01 .box03 .btn01 {
	width: 90%;
}

#container .indexLayout .contentsBox01 #contents #main #c06.cassette {
	background-color: transparent;
	padding: 0px;
}

#slider {
	width: 100%;
	height: 600px;
	/*スライダー全体の縦幅*/
}

#slider>div.vegas-wrapper>h2 {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	letter-spacing: 0.1em;
	color: #fff;
	text-shadow: 0 0 1px #8080ed, 0 0 3px #8080ed, 0px 0px 6px #8080ed, 0 0 10px #8080ed, 0 0 30px #8080ed, 0 0 50px #8080ed;
	filter: drop-shadow(2px 4px 6px black);
	font-size: 2em;
	height: auto;
}

.wrapper {
	position: relative;
}

.text {
	display: inline-block;
}

/* 【タブレット用のスタイル記述】 */
@media screen and (max-width: 959px) {
	.indexLayout #main h2 {
		font-size: 200%;
	}

	.indexLayout #main h2::before {
		width: 60px;
	}

	.indexLayout .contentsBox01 .mainImg {
		height: 310px;
	}

	.indexLayout .contentsBox01 #c05 .inner .flex03 .box01 .title {
		font-size: 130%;
	}
}

/* 【スマートフォン用のスタイル記述】 */
@media screen and (max-width: 760px) {
	.indexLayout #main h2::before {
		width: 50px;
	}

	.indexLayout .contentsBox01 #c02.cassette .inner .flex01 .box01,
	.indexLayout .contentsBox01 #c02 .inner .flex01 li,
	.indexLayout .contentsBox01 #c05 .flex03 .box01 {
		width: auto;
	}

	.indexLayout .contentsBox01 #c02 .inner .flex01 .box01 .box05 {
		display: flex;
	}

	.indexLayout #c05 .flex03 {
		display: block;
	}

	.indexLayout .contentsBox01 #c05 .flex03 .box01 {
		margin-right: 0;
	}

	.indexLayout .contentsBox01 #c05 .flex03 .box01 .box03 .btn01 {
		max-width: 190px;
	}

	#slider>div.vegas-wrapper>h2 {
		font-size: 20px;
	}

	#slider {
		width: 100%;
		height: 416px;
		/*スライダー全体の縦幅*/
	}
}

@media screen and (max-width: 620px) {
	.indexLayout .contentsBox01 .mainImg {
		background-image: url(/img/main_sp01.jpg);
		height: 194px;
		background-color: #f5f5f5;
		background-size: auto 194px;
	}

	.indexLayout .contentsBox01 #c01 .inner h2.concept img {
		width: 100%;
	}

	.indexLayout .contentsBox01 .cassette .flex01 .box01 time {
		font-size: 90%;
	}
}
