@charset "utf-8";
/*-------------------------------------------------

	MAIN VISUAL

--------------------------------------------------*/
#fv h2{text-align: center;font-size: 26px;color:#043B95;font-weight:900; margin: 80px auto 12px;}
#fv div.mv{position: relative;}
#fv div.mv::before{
	content:'';
	position: absolute;
	background-image: url("../img/deco/mv.svg");
	background-size: contain;
	background-repeat: no-repeat;
	width: 355px;
	height:262px;
	top:-12px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}
#fv figure{position: relative;margin: 0 0 0 auto;width: 330px;}
#fv figure img{border-radius:30px 0 0 0;}
#fv figure::before{
	content: 'Yell  Recruit Information';
	position: absolute;
	font-family: 'Jost', sans-serif;
	color:#043B95;
	font-size: 14px;
	font-weight: 500;
	left: -100px;
	top: 130px;
	transform: rotate(90deg);
}
#fv figure::after{
	content: '';
	display: block;
	width: 149px;
	height: 149px;
	position: absolute;
	background-image: url("../img/mvtip.svg");
	background-size: contain;
	background-repeat: no-repeat;
	left: -64px;
	bottom: 83px;
}
#fv figure figcaption{text-align: right;font-weight:900;font-size:28px;color:#fff;background:#043B95;padding:20px; border-radius:0 0 0 20px;}
#fv figure figcaption span{font-size:20px; }

@media only screen and ( max-width : 500px ) {
	#fv div.mv::before{width:94.6vw;height:69.8vw;top:-3vw;}
	#fv figure{width: 88%;}
	#fv figure::before{font-size: 4vw;left: -27vw;}
	#fv figure::after{width:39.7vw;height:39.7vw;left:-17%;bottom: 19.85vw;}
}

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

	about

--------------------------------------------------*/
#about{margin-top: 20px;
	padding: 20px;
	position: relative;
	background-image: linear-gradient(0deg, transparent calc(100% - 1px), #eee calc(100% - 1px)),
										linear-gradient(90deg, transparent calc(100% - 1px), #eee calc(100% - 1px));
  background-size: 10px 10px;
  background-repeat: repeat;
  background-position: center center;
}
#about::before,#about::after{
	content: '';
	position: absolute;
	display: block;
	width: 176px;
	height: 7px;
	background-image: url("../img/wave.svg");
	background-size: contain;
	background-repeat: no-repeat;
	left: 50%;
	transform: translateX(-50%);
}
#about::before{top:-3.5px;}
#about::after{bottom:-3.5px;}
#about p{font-weight: 900;font-size: 20px;text-align: center;color:#043B95;margin-bottom: 20px;}
#about div{background: #E9FBFF;padding: 20px 19px 40px;border-radius: 20px;position: relative;margin-bottom: 60px;}
#about div p {margin:0 auto;font-weight: 400;font-size: 15px;text-align: left;color: #222;}
#about div p strong{font-weight:700;}
#about div img{display: block;width:295px;margin:30px auto 0;}
#about div:nth-of-type(1) p{text-align: center;}
#about div:nth-child(odd)::after{
	content:'' ;
	position: absolute;
	width: 326px;
	height: 80px;
	display: block;
	background-image: url("../img/about-r.svg");
	background-size: contain;
	background-repeat: no-repeat;
	bottom: -50px;
	right: -10px;
}
#about div:nth-child(even)::after{
	content:'' ;
	position: absolute;
	width: 326px;
	height: 80px;
	display: block;
	background-image: url("../img/about-l.svg");
	background-size: contain;
	background-repeat: no-repeat;
	bottom: -50px;
	left: -10px;
}
@media only screen and ( max-width : 500px ) {
	#about div{max-width:360px; margin: 0 auto 60px;}
}

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

	point

--------------------------------------------------*/
#point{padding: 20px;margin:50px auto;}
#point div.box{background: #E9FBFF;padding: 40px 15px 30px;margin:0 auto 30px;border-radius: 20px;position: relative;}
#point h3{font-family: 'Jost', sans-serif;font-weight: 700;font-size: 40px;color:#043B95;position: absolute;top:-20px;left: 50%;transform: translateX(-50%);width:max-content;}
#point h4{margin:30px auto 20px;font-weight: 700;font-size: 30px;letter-spacing: 0;}
#point div.box p{line-height: 1.7;}
#point ul{margin-bottom: 25px;line-height: 1.7;}
#point div.box .deco1,#point div.box .deco2,#point div.box .deco3,#point div.box .deco4{position: relative;}
#point div.box .deco1::after{
	content:'' ;
	position: absolute;
	width: 48px;
	height: 57px;
	display: block;
	background-image: url("../img/deco/01.svg");
	background-size: contain;
	background-repeat: no-repeat;
	bottom: 10px;
	right: -10px;
}
#point div.box .deco2::after{
	content:'' ;
	position: absolute;
	width: 48px;
	height: 57px;
	display: block;
	background-image: url("../img/deco/02.svg");
	background-size: contain;
	background-repeat: no-repeat;
	top: 10px;
	left: -10px;
}
#point div.box .deco3::after{
	content:'' ;
	position: absolute;
	width: 48px;
	height: 57px;
	display: block;
	background-image: url("../img/deco/03.svg");
	background-size: contain;
	background-repeat: no-repeat;
	bottom: 10px;
	right: -10px;
}
#point div.box .deco4::after{
	content:'' ;
	position: absolute;
	width: 48px;
	height: 57px;
	display: block;
	background-image: url("../img/deco/04.svg");
	background-size: contain;
	background-repeat: no-repeat;
	top: 10px;
	left: -10px;
}
@media only screen and ( max-width : 500px ) {
	#point div.box .deco1::after,#point div.box .deco2::after,#point div.box .deco3::after,#point div.box .deco4::after{
		width:12.8vw;height:15.2vw;}
}

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

	linklist

--------------------------------------------------*/
#linklist{margin:85px 0 40px;background: #FFF0A4;border-radius: 30px;padding:125px 10px 50px;position: relative;}
#linklist img.pop{position: absolute;top:-85px;left: 0;}
#linklist h3{margin-bottom: 10px;}
#linklist a{display: block;margin:20px auto 0;width: 300px;}
#linklist figure{border-radius: 20px;overflow: hidden;}
#linklist figure figcaption{background: #E65624;color: #fff;font-size: 20px;font-weight: 700;padding:15px 40px 15px 20px;letter-spacing: 0;position: relative;}
#linklist figure figcaption::before{
	content: '';
	position:absolute;
	display: block;
	background-image: url("../img/triangle.svg");
	background-size: contain;
	background-repeat: no-repeat;
	width:10px;
	height:15px;
	right: 10px;
	top:50%;
	transform: translateY(-50%);
}

@media only screen and ( max-width : 500px ) {
	#linklist{padding:33vw 10px 50px}
	#linklist a{width: 80%;top: -22.8vw;}
}

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

	line_btn 

--------------------------------------------------*/
#line_btn {margin: 0px 0 10px; position: relative;}
#line_btn  img.pop{position: absolute;top:-85px;left: 0;}
#line_btn  h3{margin-bottom: 10px;}
#line_btn  a{display: block;margin:0 auto 0;width: 200px;}
#line_btn  figure{border-radius: 20px;overflow: hidden;}
#line_btn  figure figcaption{background: #E65624;color: #fff;font-size: 20px;font-weight: 700;padding:15px 40px 15px 20px;letter-spacing: 0;position: relative;}
#line_btn  figure figcaption::before{
	content: '';
	position:absolute;
	display: block;
	background-image: url("../img/triangle.svg");
	background-size: contain;
	background-repeat: no-repeat;
	width:10px;
	height:15px;
	right: 10px;
	top:50%;
	transform: translateY(-50%);
}

@media only screen and ( max-width : 500px ) {
	/*#line_btn {padding:33vw 10px 50px} */
	#line_btn  a{width: 80%;top: -22.8vw;}
}