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

		トップページ PC

================================================== */

@media screen and (min-width:781px) {

	/* --------------------------------------------------
		.vi
-------------------------------------------------- */
	.vi {
		min-width: 1086px;
	}

	.vi .vi-inner {
		height: 100vh;
		border-top: 116px solid transparent;
		background: url(/img/vi-bg01_pc.jpg) no-repeat center / cover;
		position: relative;
		box-sizing: border-box;
	}

	.vi .vi-box {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: -10px;
		/* position: relative; */
	}

	.vi .vi-wrapper h2 {
		font-size: 40px;
		font-weight: 300;
		text-align: center;
		color: #056a9c;
		text-shadow: 2px 2px 8px #ffffff, 0 0 1px #ffffff, 0 0 5px #ffffff;
	}

	.vi .vi-wrapper .vi-wrapper-txt01 {
		font-size: 16px;
		text-align: center;
		color: #056a9c;
		margin-top: 18px;
		text-shadow: 2px 2px 8px #ffffff, 0 0 1px #ffffff, 0 0 5px #ffffff;
	}

	.vi .vi-wrapper .blue-btn {
		margin-top: 40px;
	}

	.vi .vi-wrapper .btn {
		position: absolute;
		z-index: 2;
		width: 43px;
		display: block;
		bottom: 15px;
		left: 50%;
		margin-left: -22px;
	}

	.vi .vi-wrapper .btn a {
		position: relative;
		display: block;
		width: 43px;
		height: 43px;
		background-color: #056a9c;
		border-radius: 50%;
		color: #fff;
		text-decoration: none;
		text-align: center;
	}

	.vi .vi-wrapper .btn-arrow-bottom a::after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 2px;
		right: 35%;
		width: 12px;
		height: 12px;
		margin: auto;
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		transform: translateY(-2px) rotate(135deg);
		box-sizing: border-box;
	}

	/* --------------------------------------------------
		.notice
-------------------------------------------------- */
	.vi .notice {
		width: 100%;
		padding: 30px 0;
		background: rgba(0, 0, 0, 0.5);
		position: absolute;
		bottom: 0;
		display: flex;
		justify-content: center;
	}

	.vi .notice .notice-inner {
		width: 1086px;
		display: flex;
		justify-content: center;
	}

	.vi .notice .notice-inner>div:nth-child(odd) {
		width: 515px;
	}

	.vi .notice .notice-inner>div:nth-child(even) {
		width: 515px;
		padding-left: 28px;
		border-left: 1px solid #8a8e8a;
		margin-left: 27px;
		margin-bottom: 43px;
	}

	.vi .notice .notice-box {
		display: flex;
	}

	.vi .notice dl dt {
		font-size: 18px;
		color: #ffffff;
	}

	.vi .notice dl dt a:link,
	.vi .notice dl dt a:visited {
		text-decoration: none;
		color: #ffffff;
	}

	.vi .notice dl dt a:hover {
		text-decoration: underline;
		color: #ffffff;
	}

	.vi .notice dl dd {
		font-size: 12px;
		color: #ffffff;
		margin-top: 12px;
	}

	.vi .notice p img {
		padding-left: 15px;
		width: 66px;
		height: 90px;
	}

	/* --------------------------------------------------
		.recruit
-------------------------------------------------- */
	.main .recruit {
		padding-top: 130px;
		margin-bottom: -120px;
	}

	.main .recruit .recruit-inner {
		background: url(/img/recruit-bg01_pc.jpg) no-repeat center / cover;
		position: relative;
	}

	.main .recruit .recruit-inner:before {
		padding-top: 53.86%;
		display: block;
		content: "";
	}

	.main .recruit .recruit-box {
		width: 100%;
		position: absolute;
		top: 0;
	}

	.main .recruit .recruit-wrapper {
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .recruit .recruit-area h2 {
		font-size: 40px;
		font-weight: 300;
		text-align: center;
		color: #ffffff;
	}

	.main .recruit .recruit-block p {
		font-size: 16px;
		text-align: center;
		color: #ffffff;
		margin-top: 25px;
	}

	.main .recruit .recruit-area .white-btn {
		margin-top: 40px;
	}

	/* --------------------------------------------------
		.seminar-news
-------------------------------------------------- */
	.main .seminar-news {
		padding-top: 110px;
		display: flex;
		justify-content: center;
	}

	.main .seminar-news .seminar-news-inner {
		width: 904px;
	}

	.main .seminar-news h2 {
		font-size: 40px;
		font-weight: 300;
		text-align: center;
		color: #00679a;
	}

	.main .seminar-news h2 span {
		font-size: 13px;
		color: #666666;
		margin-top: 12px;
		display: block;
	}

	.main .seminar-news .seminar-news-box {
		margin-top: 50px;
	}

	.main .seminar-news dl {
		padding: 24px 20px;
		border-top: 1px solid #e6e6e6;
		display: flex;
	}

	.main .seminar-news dl:last-child {
		border-bottom: 1px solid #e6e6e6;
	}

	.main .seminar-news .news dt {
		font-size: 12px;
		color: #ffffff;
		width: 58px;
		height: 27px;
		background: #fd8c07;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .seminar-news .seminar dt {
		font-size: 12px;
		color: #ffffff;
		width: 58px;
		height: 27px;
		background: #0f84ba;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .seminar-news dl dd {
		color: #555555;
		font-size: 14px;
		margin: 2px 0 0 50px;
		flex: 1;
	}

	.main .seminar-news dl dd a:link,
	.main .seminar-news dl dd a:visited {
		text-decoration: none;
		color: #555555;
	}

	.main .seminar-news dl dd a:hover {
		text-decoration: underline;
		color: #555555;
	}

	.main .seminar-news .blue-btn {
		margin-top: 40px;
	}

	/* --------------------------------------------------
		.youtubemovie
-------------------------------------------------- */
	.main .youtubemovie {
		padding-top: 100px;
		display: flex;
		justify-content: center;
	}

	.main .youtubemovie .youtubemovie-inner {
		width: 904px;
	}

	.main .youtubemovie .youtubemovie-inner h2 {
		font-size: 40px;
		font-weight: 300;
		text-align: center;
		color: #00679a;
	}

	.main .youtubemovie .youtubemovie-inner h2 span {
		font-size: 13px;
		color: #666666;
		margin-top: 12px;
		display: block;
	}

	.main .youtubemovie .youtubemovie-inner .youtubemovie-box {
		margin-top: 50px;
	}

	.main .youtubemovie .youtubemovie-inner .youtubemovie-box iframe {
		width: 100%;
		aspect-ratio: 16 / 9;
	}

}

/* ==================================================

		トップページ SP

================================================== */

@media screen and (max-width:780px) {

	/* --------------------------------------------------
		.vi
-------------------------------------------------- */
	.vi .vi-inner {
		height: 100vh;
		border-top: 50px solid transparent;
		background: url(/img/vi-bg01_sp.jpg) no-repeat center / cover;
		position: relative;
		box-sizing: border-box;
	}

	.vi .vi-box {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0 12px;
		/* position: relative; */
		/* margin-top: -15px; */
	}

	.vi .vi-wrapper h2 {
		font-size: 20px;
		font-weight: 300;
		text-align: center;
		color: #056a9c;
		width: 100%;
		line-height: 1.3;
		text-shadow: 2px 2px 8px #ffffff, 0 0 1px #ffffff, 0 0 5px #ffffff;
	}

	.vi .vi-wrapper .vi-wrapper-txt01 {
		font-size: 12px;
		text-align: center;
		color: #056a9c;
		width: 100%;
		margin-top: 15px;
		text-shadow: 2px 2px 8px #ffffff, 0 0 1px #ffffff, 0 0 5px #ffffff;
	}

	.vi .vi-wrapper .blue-btn {
		margin-top: 25px;
	}

	.vi .vi-wrapper .btn {
		position: absolute;
		z-index: 2;
		width: 40px;
		display: block;
		bottom: 10px;
		left: 50%;
		margin-left: -20px;
	}

	.vi .vi-wrapper .btn a {
		position: relative;
		display: block;
		width: 40px;
		height: 40px;
		background-color: #056a9c;
		border-radius: 50%;
		color: #fff;
		text-decoration: none;
		text-align: center;
	}

	.vi .vi-wrapper .btn-arrow-bottom a::after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 2px;
		right: 35%;
		width: 12px;
		height: 12px;
		margin: auto;
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		transform: translateY(-2px) rotate(135deg);
		box-sizing: border-box;
	}

	/* --------------------------------------------------
		.notice
-------------------------------------------------- */
	.vi .notice {
		width: 100%;
		background: rgba(0, 0, 0, 0.5);
		position: absolute;
		bottom: 0;
	}

	.vi .notice dl dt {
		font-size: 14px;
	}

	.vi .notice dl dt .empty {
		padding: 18px 24px;
		border-top: 1px solid #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 12px;
		color: #ffffff;
	}

	.vi .notice dl dt a {
		padding: 18px 24px;
		border-top: 1px solid #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.vi .notice .notice-inner .notice-box:last-of-type dl dt a {
		margin-bottom: 61px;
		border-bottom: 1px solid #ffffff;
	}

	.vi .notice dl dt a:link,
	.vi .notice dl dt a:visited,
	.vi .notice dl dt a:hover {
		font-size: 12px;
		text-decoration: none;
		color: #ffffff;
	}

	.vi .notice dl dt a span:before {
		content: "\f105";
		font-family: 'Font Awesome\ 5 Free';
		padding-left: 5px;
		font-weight: bold;
		/* 表示のために必須 */
	}

	/* --------------------------------------------------
		.recruit
-------------------------------------------------- */
	.main .recruit {
		padding-top: 20px;
		margin-bottom: -60px;
	}

	.main .recruit .recruit-inner {
		background: url(/img/recruit-bg01_sp.jpg) no-repeat center / cover;
		position: relative;
	}

	.main .recruit .recruit-inner:before {
		padding-top: 140.44%;
		padding-bottom: 126px;
		display: block;
		content: "";
	}

	.main .recruit .recruit-box {
		width: 100%;
		position: absolute;
		top: 0;
	}

	.main .recruit .recruit-wrapper {
		padding: 0 12px;
		/* overflow: hidden; */
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .recruit .recruit-area h2 {
		font-size: 20px;
		font-weight: 300;
		text-align: center;
		color: #ffffff;
		line-height: 1.3;
	}

	.main .recruit .recruit-block p {
		font-size: 12px;
		color: #ffffff;
		margin-top: 12px;
	}

	.main .recruit .recruit-block p:first-child {
		margin-top: 15px;
	}

	.main .recruit .recruit-area .white-btn {
		margin-top: 25px;
	}

	/* --------------------------------------------------
		.seminar-news
-------------------------------------------------- */
	.main .seminar-news {
		padding: 50px 0 40px;
	}

	.main .seminar-news .seminar-news-inner {
		padding: 0 12px;
	}

	.main .seminar-news h2 {
		font-size: 20px;
		font-weight: 300;
		text-align: center;
		color: #00679a;
		line-height: 1.3;
	}

	.main .seminar-news h2 span {
		font-size: 13px;
		color: #666666;
		margin-top: 12px;
		display: block;
	}

	.main .seminar-news .seminar-news-box {
		margin-top: 20px;
	}

	.main .seminar-news dl {
		padding: 10px 0;
		border-top: 1px solid #e6e6e6;
		display: flex;
	}

	.main .seminar-news dl:last-child {
		border-bottom: 1px solid #e6e6e6;
	}

	.main .seminar-news .news dt {
		font-size: 12px;
		color: #ffffff;
		width: 58px;
		height: 27px;
		background: #fd8c07;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .seminar-news .seminar dt {
		font-size: 12px;
		color: #ffffff;
		width: 58px;
		height: 27px;
		background: #0f84ba;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.main .seminar-news dl dd {
		color: #555555;
		font-size: 12px;
		margin: 5px 0 0 12px;
		flex: 1;
	}

	.main .seminar-news dl dd a:link,
	.main .seminar-news dl dd a:visited {
		text-decoration: none;
		color: #555555;
	}

	.main .seminar-news dl dd a:hover {
		text-decoration: underline;
		color: #555555;
	}

	.main .seminar-news .blue-btn {
		margin-top: 25px;
	}

	/* --------------------------------------------------
		.youtubemovie
-------------------------------------------------- */
	.main .youtubemovie {
		padding: 50px 0 40px;
	}

	.main .youtubemovie .youtubemovie-inner {
		padding: 0 12px;
	}

	.main .youtubemovie .youtubemovie-inner h2 {
		font-size: 20px;
		font-weight: 300;
		text-align: center;
		color: #00679a;
		line-height: 1.3;
	}

	.main .youtubemovie .youtubemovie-inner h2 span {
		font-size: 13px;
		color: #666666;
		margin-top: 12px;
		display: block;
	}

	.main .youtubemovie .youtubemovie-inner .youtubemovie-box {
		margin-top: 20px;
	}

	.main .youtubemovie .youtubemovie-inner .youtubemovie-box iframe {
		width: 100%;
		aspect-ratio: 16 / 9;
	}

}