/* layout sp
--------------------------------------------------*/
@media screen and (max-width: 768px) {




/* メインビジュアル */
.top_main_visual{
	position:relative;
	width:100%;
	height:74vw;
	background-color:#007f41;
	overflow:hidden;
}

.top_main_visual::before{
	content:"";

	position:absolute;
	inset:0;

	background-image:url("../images/top/main_sp.jpg");
	background-position:center center;
	background-size:cover;

	opacity:0;
	transform:scale(1.1);

	transition:
		opacity 2s ease,
		transform 8s cubic-bezier(0.22, 1, 0.36, 1);
}


/* 背景表示 */

.top_main_visual.active::before{
	opacity:1;
	transform:scale(1);
}


.top_main_visual_title_set{
	position:absolute;
	top:16vw;
	left:5vw;
	margin-left:0;
	z-index:1;
}

.top_main_visual_title{
	position:absolute;
	top:0;
	
	width:57vw;
	height:auto;
	display:block;

	opacity:0;
	transform:translateX(-2vw);

	transition:
		opacity 0.6s ease,
		transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.top_main_visual_read_set{
	position:absolute;
	top:14vw;
	display:block;
}

.top_main_visual_read01{
	position:relative;
	width:60vw;
	height:auto;
	margin-top:2vw;
	display:block;

	opacity:0;
	transform:translateX(-2vw);

	transition:
		opacity 0.6s ease,
		transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.top_main_visual_read02{
	position:relative;
	width:46vw;
	height:auto;
	margin-top:4vw;
	display:block;

	opacity:0;
	transform:translateX(-2vw);

	transition:
		opacity 0.6s ease,
		transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}



/* =========================
	表示
========================= */

.top_main_visual_title.active,
.top_main_visual_read01.active,
.top_main_visual_read02.active{
	opacity:1;
	transform:translateX(0);
}


/* =========================
	位置
========================= */

.top_main_visual_illust01{
	position:absolute;
	top:160px;
	left:50%;
	margin-left:290px;
}

.top_main_visual_illust02{
	position:absolute;
	top:140px;
	left:50%;
	margin-left:290px;
}

.top_main_visual_illust03{
	position:absolute;
	top:-20px;
	left:50%;
	margin-left:250px;
}

.top_main_visual_illust04{
	position:absolute;
	top:-113px;
	left:50%;
	margin-left:260px;
}


.top_main_visual_illust01,
.top_main_visual_illust02,
.top_main_visual_illust03,
.top_main_visual_illust04{
	opacity:0;
	transform-origin:center center;
}


/* =========================
	active
========================= */

.top_main_visual_illust01.active,
.top_main_visual_illust02.active,
.top_main_visual_illust03.active{
	animation:illust_fade 2.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.top_main_visual_illust04.active{
	animation:illust_fade04 2.2s cubic-bezier(0.22, 1, 0.36, 1) forwards,
	illust_zoom04 36s linear forwards 1.2s;
}

/* circle01 */
.main_visual_circle01{
	width:53vw;
	height:53vw;

	top:-35vw;
	left:0;
	margin-left:-25vw;
	
	background:rgba(232,201,46,0.4);
	animation:floatCircle01 12s ease-in-out infinite;
}

/* circle02 */
.main_visual_circle02{
	width:21vw;
	height:21vw;

	bottom:-8vw;
	left:0;
	margin-left:8vw;

	animation-duration:15s;
	animation-delay:2s;
	background:rgba(232,201,46,0.3);
	animation:floatCircle02 12s ease-in-out infinite;
}

/* circle03 */
.main_visual_circle03{
	width:8vw;
	height:8vw;

	top:5vw;
	left:50%;
	margin-left:-8vw;

	animation-duration:10s;
	animation-delay:1s;
	background:rgba(232,201,46,0.2);
	animation:floatCircle03 12s ease-in-out infinite;
}


/* =========================
	位置
========================= */

.top_main_visual_illust01{
	position:absolute;
	width:48vw;
	
	top:43vw;
	left:50%;
	margin-left:20vw;
}

.top_main_visual_illust02{
	position:absolute;
	width:48vw;
	
	top:40vw;
	left:50%;
	margin-left:20vw;
}

.top_main_visual_illust03{
	position:absolute;
	width:60vw;
	
	top:auto;
	bottom:-5vw;
	left:50%;
	margin-left:25vw;
}

.top_main_visual_illust04{
	position:absolute;
	width:103vw;
	
	top:-21vw;
	left:50%;
	margin-left:18vw;
}










/* リード */
.top_read_bg{
	position:absolute;
	left:0;
	margin-left:0;
	opacity:0;
	width:100%;
	height:auto;
}

.top_read_bg.active{
	opacity:1;
	transition:opacity 0.6s ease;
}

.top_read_text{
	position:relative;
	padding-top:12vw;
	padding-bottom:12vw;
	text-align:center;
	line-height:2;
	color:#666666;
	z-index:1;
}




/* DXリンク */
.top_dx_link{
	position:relative;
	width:100%;
	margin-bottom:12vw;
}


.top_dx_link_box{
	position:relative;
	width:90%;
	margin:auto;
	box-shadow: 0 0 8px 0 rgba(64,128,128,0.4);
	box-sizing:border-box;
	padding:10vw 0;
	border-radius:16px;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:8vw;
}

.top_dx_link_img{
	position:relative;
	width:31vw;
	height:auto;
	display:block;
	flex:none;
}

.top_dx_link_right_set{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
}


.top_dx_link_caption01{
	font-weight:500;
	line-height:1;
	margin-bottom:3vw;
	text-align:center;
}

.top_dx_link_caption02{
	font-weight:500;
	line-height:1.5;
	margin-bottom:3vw;
	text-indent:-0.5em;
	text-align:center;
}

.top_dx_link_text {
	color:#666666;
	line-height:1.5;
	margin-bottom:6vw;
	text-align:center;
}




/* ニュース */
.top_news{
	position:relative;
	width:100%;
	background:#fffff2;
	padding-top:12vw;
	padding-bottom:12vw;
}


.top_news_title{
	position:relative;
	margin:auto;
	width:100%;
	height:auto;
}

.top_news_list{
	position:relative;
	width:90%;
	margin:0 auto 7vw;
}

.top_news_list li{
	position:relative;
	margin-top:7vw;
}

.top_news_list li a{
	display:flex;
	flex-direction: column;
	align-items:flex-start;
	gap:1vw;
}

.top_news_list time{
	position:relative;
	color:#007f41;
	font-weight:500;
	line-height:1.6;
}

.top_news_text{
	color:#000000;
	line-height:1.6;
}


.top_news_more_link{
	position:relative;
	width:90%;
	text-align:right;
	margin:auto;
}

.top_news_more_link_text{
	color:#000000;
}




/* コンテンツ */
.top_contents{
	position:relative;
	width:100%;
	background:
	linear-gradient(
		135deg,
		rgba(0,127,65,0.4) 0%,
		rgba(9,86,125,0.4) 100%
	),
	#007f41;
	padding-top:12vw;
	padding-bottom:12vw;
}


/* 共通 */
.top_contents_circle01,
.top_contents_circle02,
.top_contents_circle03{
	position:absolute;
	border-radius:50%;
	z-index:0;

	animation:floatCircle 12s ease-in-out infinite;
}

/* circle01 */
.top_contents_circle01{
	width:53vw;
	height:53vw;

	top:-20vw;
	left:0;
	margin-left:-28vw;
	background:rgba(232,201,46,0.4);
}

/* circle02 */
.top_contents_circle02{
	width:24vw;
	height:24vw;

	top:150vw;
	bottom:auto;
	left:auto;
	right:0;
	margin-left:auto;
	margin-right:-14vw;

	animation-duration:15s;
	animation-delay:2s;
	background:rgba(232,201,46,0.3);
}

/* circle03 */
.top_contents_circle03{
	width:16vw;
	height:16vw;

	top:auto;
	bottom:-5vw;
	left:50%;
	margin-left:-14vw;

	animation-duration:10s;
	animation-delay:1s;
	background:rgba(232,201,46,0.2);
}



.top_contents_title{
	position:relative;
	z-index:1;
	margin:auto;
	width:100%;
	height:auto;
}

.top_contents_list{
	position:relative;
	z-index:1;

	width:90%;
	margin:10vw auto 0;

	display:flex;
	flex-wrap:wrap;
	gap:5vw;
}


.top_contents_list li{
	opacity:0;
	transform:translateY(-2vw);
	transition:opacity 0.6s ease, transform 0.6s ease;
}

.top_contents_list li.show{
	opacity:1;
	transform:translateY(0);
}



/* 3列 */
.top_contents_list li{
	width:100%;
	list-style:none;

	display:flex;
}

/* ボックス */
.top_contents_list li a{
	position:relative;
	display:flex;
	flex-direction:column;
	box-sizing:border-box;
	width:100%;
	height:100%;
	padding:8vw 5vw;
	border-radius:16px;
	text-decoration:none;
	color:#fff;
	background:rgba(255,255,255,0.15);
	backdrop-filter:blur(1px);
	-webkit-backdrop-filter:blur(1px);
	box-shadow: 0 0 8px 0 rgba(0,104,67,0.4);
	transition:
		transform 0.2s,
		background 0.2s,
		box-shadow 0.2s;
}

/* hover */
.top_contents_list li a:hover{
	transform:translateY(0);
	box-shadow: 0 0 8px 0 rgba(0,104,67,0.4);
	background:rgba(255,255,255,0.15);
}

/* アイコン */
.top_contents_icon{
	position:absolute;
	top:3vw;
	right:5vw;
	height:auto;
	display:block;
	width:16vw;
	height:auto;
}

/* タイトル */
.top_contents_caption{
	position:relative;
	font-weight:500;
	line-height:1;
}

/* テキスト */
.top_contents_text{
	position:relative;
	margin-top:7vw;
	line-height:2;
	color:#9be7c9;
}

/* 白丸 */
.top_contents_list li a::after{
	content:"";
	position:absolute;

	right:4vw;
	bottom:4vw;

	width:5vw;
	height:5vw;

	border-radius:50%;
	background:#fff;
}

/* 三角 */
.top_contents_list li a::before{
	content:"";
	position:absolute;

	right:5.75vw;
	bottom:5.75vw;

	width:0;
	height:0;

	border-top:3.5px solid transparent;
	border-bottom:3.5px solid transparent;
	border-left:6px solid #046f59;

	z-index:1;
	transition:transform 0.2s ease;
}

/* hover */
.top_contents_list li a:hover::before{
	transform:translateX(0) scale(1);
}




/* リクルートリンク */
.top_recruit_link{
	position:relative;
	width:100%;
	margin-top:12vw;
}

.top_recruit_link_box{
	position:relative;
	width:90%;
	margin:auto;
	box-shadow: 0 0 8px 0 rgba(64,128,128,0.4);
	box-sizing:border-box;
	padding:7vw 0;
	border-radius:16px;
	display:flex;
	flex-direction: column;
	align-items:center;
	justify-content:center;
	gap:5vw;
	background:
	url("../images/top/recruit_link_img01.png")
	calc(105%)
	calc(130%)
	no-repeat,
	linear-gradient(
		135deg,
		rgba(0,127,65,0.4) 0%,
		rgba(9,86,125,0.4) 80%
	),
	#007f41;
	
	background-size:
	45% auto,
	auto,
	auto;
}


.top_recruit_link_img01{
	position:absolute;
	top:-8vw;
	left:-8vw;
	margin-top:0;
	margin-left:0;
	width:22vw;
	height:auto;
}


.top_recruit_link_img02{
	position:absolute;
	top:21vw;
	left:auto;
	right:-3vw;
	margin-top:0;
	margin-left:0;
	width:17vw;
	height:auto;
}


.top_recruit_link_img03{
	position:absolute;
	top:54vw;
	left:3vw;
	margin-top:0;
	margin-left:0;
	width:15vw;
	height:auto;
}

.top_recruit_link_right_set{
	position:relative;
	margin-left:0;
}

.top_recruit_link_caption{
	color:#ffffff;
	font-weight:500;
	line-height:1.6;
	margin-bottom:7vw;
	text-align:center;
}

.top_recruit_link_text{
	color:#ffffff;
	line-height:1.8;
	margin-bottom:7vw;
	text-align:center;
}

.top_recruit_link_right_set .btn02{
	margin:auto;
}

























/* SP/PC用 */
.rps_del{
	display:none;
}
.rps_visible{
	display:block;
}




}