@charset "utf-8";


/*--------------------------------------------------------------------*/

.price{
	background-image: url("../../images/employer/common/bg_feature.png");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: cover;
	color: #fff;
	padding: 70px 0 40px 0;
}
.price .head{
	margin-bottom: 1em;
}
.price .head .main{
	justify-content: center;
}
.price .head .main .border{
	width: 3.5em;
	height: 3px;
	background-color: #fff;
}
.price .head .main .index{
	padding: 0 .6em;
	font-size: 3.8rem;
}
.price .ico_arrow:before{
	border-color: #fff;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.price{
		padding: 6.667vw 6vw 5.333vw;
	}
	.price .head{
		margin-bottom: 1.5em;
	}
	.price .head .main .border{
		width: 2.5em;
		background-color: #fff;
	}
	.price .head .main .index *{
		font-size: 7.2vw;
		font-weight: 900;
	}
	.price .head .en{
		font-size: 2.667vw;
	}
	.price .ico_arrow:before{
		width: 1.6vw;
		height: 1.6vw;
	}
}

/*--------------------------------------------------------------------*/

.price .body{
	
}
.price .body .banner{
	display: inline-flex;
	border: 1px solid #fff;
	justify-content: center;
}
.price .body .banner .img{
	padding: 1em 0 0 1.5em;
}
.price .body .banner .img img{
	width: 165px;
}
.price .body .banner .right{
	font-size: 4rem;
	line-height: 1.2;
	font-weight: 900;
	padding: .6em;
}
.price .body .banner .right .yellow{
	font-size: 6rem;
}
.price .body .banner .right .dot{
	position: relative;
}
.price .body .banner .right .dot:after{
	width: 5px;
	height: 5px;
	left: 0;
	right: 0;
	margin: auto;
	top: 0;
	border-radius: 4px;
	background-color: #fff;
	content: "";
	display: block;
	position: absolute;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.price .body .banner{
		display: flex;
		justify-content: space-between;
	}
	.price .body .banner .img{
		padding: 0 0 0 1.333vw;
	}
	.price .body .banner .img img{
		width: 24vw;
	}
	.price .body .banner .right{
		font-size: 4.6vw;
		padding: 1.333vw 1.333vw 1.333vw 2.667vw;
	}
	.price .body .banner .right .yellow{
		font-size: 8vw;
	}
	.price .body .banner .right .dot:after{
		width: 1vw;
		height: 1vw;
		min-width: 2px;
		min-height: 2px;
		top: -.3em;
	}
}

/*--------------------------------------------------------------------*/

.price .body .appeal{
	justify-content: center;
	padding: 2em 0 4em 0;
}
.price .body .appeal .text{
	font-size: 2.2rem;
	padding: 0 1em;
	position: relative;
}
.price .body .appeal .text:before,
.price .body .appeal .text:after{
	width: 2px;
	height: 1em;
	background-color: #fff;
	top: 0;
	bottom: 0;
	margin: auto;
}
.price .body .appeal .text:before{
	left: 0;
	transform: rotate(-15deg);
}
.price .body .appeal .text:after{
	right: 0;
	transform: rotate(15deg);
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.price .body .appeal{
		flex-wrap: wrap;
		flex-direction: column;
		padding: 4vw 0;
	}
	.price .body .appeal .text{
		font-size: 3.722vw;
		margin-bottom: 4vw;
	}
}

/*--------------------------------------------------------------------*/

.price .body .appeal .link{
	padding-left: 1.5em;
}
.price .body .appeal .link a{
	padding: .5em 2.5em;
	border-radius: 3em;
	box-shadow: 18px 18px 24px rgba(255,0,76,.17);
	background: rgb(255,120,0);
	background: -moz-linear-gradient(90deg, rgba(255,120,0,1) 0%, rgba(255,46,66,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(255,120,0,1) 0%, rgba(255,46,66,1) 100%);
	background: linear-gradient(90deg, rgba(255,120,0,1) 0%, rgba(255,46,66,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7800",endColorstr="#ff2e42",GradientType=1);
}
.price .body .plan a{
	border-bottom: 1px solid #fff;
	padding-bottom: 5px;
}
@media screen and (max-width: 750px){
	.price .body .appeal .link{
		padding-left: 0;
	}
	.price .body .appeal .link a{
		padding: 0 2.5em;
		font-size: 3.733vw;
		line-height: 9.333vw;
	}
	.price .body .plan a{
		padding-bottom: 0.667vw;
		font-size: 3.733vw;
	}
}

/*--------------------------------------------------------------------*/

.cv{
	padding: 80px 40px;
}
.cv .wrap{
	justify-content: center;
}
.cv .wrap .item{
	position: relative;
	width: 33.3%;
}
.cv .wrap .item:before{
	width: 1px;
	height: 100%;
	left: 0;
	background-color: #828282;
	transform: rotate(15deg)
}
.cv .wrap .item.last:after{
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 100%;
	top: 0;
	right: 0;
	background-color: #828282;
	transform: rotate(15deg);
}
.cv .wrap .item a{
	display: block;
}
.cv .wrap .item a:hover{
	transform: translateY(-.5em);
}
.cv .wrap .item .btn{
	padding: 1em 0;
	justify-content: center;
}
.cv .wrap .item .btn .ico img{
	width: 60px;
}
.cv .wrap .item .btn .text{
	padding-left: 1em;
}
.cv .wrap .item .btn .text .ja{
	font-size: 2.6rem;
	font-weight: 900;
}
.cv .wrap .item .btn .text .en{
	font-size: 1.3rem;
}
@media screen and (min-width: 751px) and (max-width: 959px){
	.cv{
		padding: 80px 0;
	}
	.cv .wrap{
		justify-content: center;
	}
	.cv .wrap .item{
		width: 30%;
	}
	.cv .wrap .item .btn .ico img{
		width: 40px;
	}
	.cv .wrap .item .btn .text{
		padding-left: 0.5em;
	}
	.cv .wrap .item .btn .text .ja{
		font-size: 2rem;
	}
	.cv .wrap .item .btn .text .en{
		font-size: 1.2rem;
	}
}
@media screen and (max-width: 750px){
	.cv{
		padding: 8vw 5.333vw 6.667vw;
	}
	.cv .wrap{
		align-items: stretch;
		gap: 2%;
	}
	.cv .wrap .item{
		width: auto;
		border: 1px solid #A7A7A7;
		padding: 6.667vw 2vw 5.333vw;
		box-sizing: border-box;
		position: relative;
		flex: 1;
	}
	.cv .wrap .item:before,
	.cv .wrap .item.last:after{
		display: none;
	}
	.cv .wrap .item .btn{
		flex-direction: column;
		text-align: center;
	}
	.cv .wrap .item .btn .ico{
		margin-bottom: 2vw;
	}
	.cv .wrap .item .btn .ico img{
		width: auto;
		height: 8vw;
	}
	.cv .wrap .item .btn .text{
		padding-left: 0;
	}
	.cv .wrap .item .btn .text:before{
		display: block;
		content: "";
		width: 1.6vw;
		height: 1.6vw;
		border-top: 2px solid #333;
		border-right: 2px solid #333;
		transform: rotateZ(45deg);
		position: absolute;
		right: 0;
		left: 0;
		bottom: 1.5em;
		margin: auto;
	}
	.cv .wrap .item .btn .text .ja{
		font-size: 3.7vw;
	}
	.cv .wrap .item .btn .text .en{
		font-size: 1.7vw;
	}
}