@charset "utf-8";

* {

	/*	color: #fff; */

	text-decoration: none;

	margin: 0 auto;

	font-family: "Kozuka Mincho Pro", "Yu Mincho", "sans self";

}

html,
body {

	width: 100%;

}

body {

	position: sticky;

	z-index: -2;

}

a {

	cursor: pointer;

}

.background::before {

	content: "";

	display: block;

	position: fixed;

	top: 0;

	left: 0;

	z-index: -1;

	width: 100%;

	height: 100vh;

	background-repeat: repeat, no-repeat;

	background-position: center;

	background-image: url(../images/dot.png), url(../images/fv.jpg);

	background-size: auto, cover;

}



.ui-widget-header {

	background: #ccc;

}



/* loading */

@-webkit-keyframes ball-scale-multiple {

	0% {

		-webkit-transform: scale(0);

		transform: scale(0);

		opacity: 0;
	}

	5% {

		opacity: 1;
	}

	100% {

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0;
	}
}



@keyframes ball-scale-multiple {

	0% {

		-webkit-transform: scale(0);

		transform: scale(0);

		opacity: 0;
	}

	5% {

		opacity: 1;
	}

	100% {

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0;
	}
}



.loader {

	display: none;

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: #000;

	z-index: 998;

}

.ball-scale-multiple {

	position: fixed;

	top: 50%;

	left: 50%;

	-webkit-transform: translateY(-30px);

	transform: translateY(-30px);
}

.ball-scale-multiple>div:nth-child(2) {

	-webkit-animation-delay: -0.4s;

	animation-delay: -0.4s;
}

.ball-scale-multiple>div:nth-child(3) {

	-webkit-animation-delay: -0.2s;

	animation-delay: -0.2s;
}

.ball-scale-multiple>div {

	background-color: #fff;

	width: 15px;

	height: 15px;

	border-radius: 100%;

	margin: 2px;

	-webkit-animation-fill-mode: both;

	animation-fill-mode: both;

	position: absolute;

	left: -30px;

	top: 0px;

	opacity: 0;

	margin: 0;

	width: 60px;

	height: 60px;

	-webkit-animation: ball-scale-multiple 1s 0s linear infinite;

	animation: ball-scale-multiple 1s 0s linear infinite;
}


/* mobile scroll */

/* mobile scroll */
/*スクロールダウン全体の場所*/
.scrolldown2 {
	display: none;
	position: absolute;
	left: 50%;
	top: 480px;
}

/*Scrollテキストの描写*/
.scrolldown2 span {
	/*描画位置*/
	position: absolute;
	left: 10px;
	bottom: 10px;
	/*テキストの形状*/
	width: 10px;
	height: 40px;
	color: #eee;
	font-size: 0.7rem;
	letter-spacing: 0.05em;
	/*縦書き設定*/
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
}

/* 丸の描写 */
.scrolldown2:before {
	content: "";
	/*描画位置*/
	position: absolute;
	bottom: 0;
	left: -4px;
	/*丸の形状*/
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #eee;
	/*丸の動き1.6秒かけて透過し、永遠にループ*/
	animation:
		circlemove 1.6s ease-in-out infinite,
		cirlemovehide 1.6s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove {
	0% {
		bottom: 45px;
	}

	100% {
		bottom: -5px;
	}
}

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide {
	0% {
		opacity: 0
	}

	50% {
		opacity: 1;
	}

	80% {
		opacity: 0.9;
	}

	100% {
		opacity: 0;
	}
}

/* 線の描写 */
.scrolldown2:after {
	content: "";
	/*描画位置*/
	position: absolute;
	bottom: 0;
	left: 0;
	/*線の形状*/
	width: 2px;
	height: 50px;
	background: #eee;
}

/* 共通titleスタイル */

.title {

	border-bottom: 1px solid #fff;

}

.title h2 {

	text-align: center;

	font-size: 21px;

	font-weight: 100;

	padding-bottom: 25px;

}

.hr {

	display: block;

	text-align: center;

	width: 125px;

	border-bottom: 1px solid #fff;

	margin-bottom: 80px;

}

/* hamburger */

.humburger {

	display: none;

}



#top {

	z-index: -1;

	text-align: center;

	position: sticky;

	top: 45%;

	left: 38%;

}

#top-inner {

	width: 350px;

	margin: 0 auto;

}

.top-logo {

	position: relative;

}

.top-logo .plus1 {

	position: absolute;

	top: -8px;

	right: 13px;

	text-shadow: #ffffbe 0 0 5px;

	font-weight: 800;

	font-size: 18px;

}

.top-logo h1 {

	font-family: Candara, "sans self";

	font-weight: 400;

	font-size: 46px;

	letter-spacing: 2.8px;

	position: relative;

}

.top-logo h1 span {

	line-height: 0;

	position: absolute;

	top: 18px;

}

.top-logo-sub span {

	display: block;

	border-top: 1px solid #fff;

	margin: 0 45px;

}

.top-logo-sub p:nth-child(2) {

	display: block;

	font-size: 12px;

	letter-spacing: 1px;

	padding: 8px 8px 0 8px;

}

.top-logo-sub p:nth-child(3) {

	font-size: 16px;

	letter-spacing: 1px;

	padding-top: 8px;

}

#top-inner a {

	font-size: 12px;

	display: inline-block;

	padding: 10px 55px;

	border-radius: 20px;

	background: rgba(244, 152, 0, 0.6);

	margin-top: 135px;

}





nav {

	transition: all 0.8s;

	position: fixed;

	top: 0;

	left: 0;

	width: 270px;

	font-size: 13px;

	height: 100%;

	background: rgba(0, 0, 0, 0.32);

	z-index: 997;

	overflow-y: scroll;

	/*IE(Internet Explorer)・Microsoft Edgeへの対応*/

	-ms-overflow-style: none;

	/*Firefoxへの対応*/

	scrollbar-width: none;

}

/*Google Chrome、Safariへの対応*/

nav::-webkit-scrollbar {

	display: none;

}

nav:hover {

	background: rgba(0, 0, 0, 0.6);

}

#nav-inner ul li {

	border-bottom: 1px solid rgba(255, 255, 255, 0.3);

	opacity: 0.8;

}

#nav-img {

	text-align: center;

	padding: 60px 30px 24px;

}

#nav-img img {

	width: 95%;

}

#nav-inner ul li:nth-child(1) {

	border-top: 1px solid rgba(255, 255, 255, 0.3);

}

#nav-inner ul li:nth-child(5),
#nav-inner ul li:nth-child(8) {

	height: 44.95px;

}

.nav-list {

	position: relative;

	z-index: 0;

	overflow-x: hidden;

}

.nav-list::before {

	content: "";

	display: block;

	position: absolute;

	top: 0;

	left: 0;

	width: 0%;

	height: 100%;

	background: rgba(255, 255, 255, 0.1);

	-webkit-transition: 0.3s;

	transition: 0.3s;

	z-index: -2;

}

.nav-list:hover::before {

	width: 100%;

}

#nav-inner ul li a,
.curriculum {

	display: block;

	padding: 11.5px 11px 11.5px 34px;

}

.curriculum2 {

	display: block;

	text-align: center;

	padding: 11.5px 0;

}

.gaiyou2 {

	display: block;

	text-align: center;

	padding-right: 26px;

}

.curriculum span {

	display: inline-block;

	width: 9px;

	height: 9px;

	border-top: 1px solid #fff;

	border-right: 1px solid #fff;

	transform: rotate(45deg);

	margin-left: 87px;

}

.curriculum2 span {

	display: inline-block;

	width: 9px;

	height: 9px;

	border-top: 1px solid #fff;

	border-left: 1px solid #fff;

	transform: rotate(-45deg);

	position: absolute;

	top: 17px;

	left: 33px;

}

.curriculum:hover,
.curriculum2:hover {

	cursor: pointer;

}



.jukouseilogin {

	background-image: url(../images/new_loginicon.png);
	background-size: 10%;
	background-position: 140px 8px;
	background-repeat: no-repeat;
}



/* 職業訓練校リンク */

.kunrenkou-link {

	display: flex;

	text-align: center;

	margin: 0 10px;

}

.kunrenkou-link a,
.kunrenkou-link p {

	transition: all .3s;

	padding: 6px 17px;

	display: block;

	background: #797979;

	color: #fff;

	margin-top: 50px;

	border-radius: 6px;

	font-family: "Kozuka Mincho Pro", "Yu Mincho", "sans self";

}

.kunrenkou-link a:hover {

	background: #ea68a2;

}



.kunrenkousita-logo {

	color: #fff;

	font-size: 20px;

	font-family: "Kozuka Mincho Pro", "Yu Mincho", "sans self";

	text-align: center;

	margin-top: 7px;

}



.hamburger:hover {

	cursor: pointer
}



/* カリキュラム一覧押したときに出てくる */

#nav-lists {

	position: relative;

	overflow: hidden;

	height: 100vh;

}

.nav2 {

	position: absolute;

	top: 0;

	left: 270px;

	width: 100%;

}

.nav-move {

	transition: all 0.3s;

	transform: translateX(-270px);

}

.nav-move-retrun {

	transition: all 0.3s;

	transform: translateX(0);

}




/*
#content {

	background: rgba(106, 106, 106, 0.9);

	margin: 110vh 2% 0 285px;

	padding: 65px 0 50px 0;

}
*/

.content-inner {

	max-width: 873px;

	margin: 0 auto;

}

#content section {

	width: 100%;

	padding-top: 25px;

}

#content section .inner {

	width: 96%;

	margin: 0 auto;

}

#concept {

	text-align: center;

}

.concept-title h2 {

	font-size: 21px;

	font-weight: 100;

}

.concept-title p {

	font-size: 29px;

	text-shadow: #ffffbe 0 0 7px;

	position: relative;

}

.concept-title p span {

	position: absolute;

	top: -57px;

	font-size: 65px;

}

#concept-discription {

	width: 90%;

	margin: 20px auto 0 auto;

	font-size: 16px;

	display: flex;

}

#concept-discription img {

	width: 50%;

}



/* news */

.news-more {

	text-align: right;

	margin-top: 40px;

	font-size: 15px;

}

.news-more span {

	padding-left: 15px;

}

#news-discription {

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	margin-top: 30px;

	font-size: 14px;

}

.news-block {

	margin: 10px;

}

.news-img {

	width: 100%;

}

.news-img img {

	width: 100%;

}

.news-cat {

	transition: all .3s;

	margin: 6px 0 25px 0;

	padding: 3px 0;

	text-align: center;

	border: 1px solid;

}

.cat1 {

	color: #ea68a2;

}

.cat2 {

	color: #22ac38;

}

.news-date {

	width: 164px;

	border-top: 1px solid;

	font-size: 12.88px;

	text-align: center;

	margin: 15px auto 20px auto;

	padding-top: 11px;

}

.news-date,
.news-title,
.news-text {

	cursor: text;

}

/* news hover */

.news-link:hover .news-img {

	outline: 8px solid rgba(255, 255, 255, .5);

	outline-offset: -8px;

}

.news-link:hover .cat1 {

	color: #fff;

	border-color: rgba(255, 255, 255, .5);

	background: #ea68a2;

}

.news-link:hover .cat2 {

	color: #fff;

	border-color: rgba(255, 255, 255, .5);

	background: #22ac38;

}



/* 旧サイトnews */

.old_news_discription {

	display: flex;

	flex-wrap: wrap;

	/*	grid-template-columns: repeat(3,1fr); */

	margin-top: 30px;

	font-size: 14px;

}



.three-column_items {

	margin: 5px !important;

	display: flex;

	flex-direction: column;

	width: 30%;

}

.three-column_items a {
	margin: 0;
}

.three-column_items a img {

	width: 100%;

	height: auto;

}



.blog_list_title {

	display: flex !important;

	flex-direction: column;

}



.three-column_items_title {

	order: 2;

}



.blogCat {

	transition: all .3s;

	margin: 6px 0 25px 0;

	padding: 3px 0;

	text-align: center;

	border: 1px solid;

	color: #ea68a2;

	order: 1;

}

.blogTime {

	width: 164px;

	border-top: 1px solid;

	font-size: 12.88px;

	text-align: center;

	margin: 5px auto 0px auto;

	padding-top: 11px;

	order: 3;

}

.blog_list_outline {

	order: 4;

}





/* hover */

.three-column_items:hover a img {

	outline: 8px solid rgba(255, 255, 255, .5);

	outline-offset: -8px;

	cursor: pointer;

}

.three-column_items:hover .blogCat {

	color: #fff;

	border-color: rgba(255, 255, 255, .5);

	background: #ea68a2;

	cursor: pointer;

}





.support-discription-inner {

	display: flex;

	margin-top: 50px;

}

.support-discription-img {

	width: 90%;

	margin-right: 20px;

}

.support-discription-img img {

	width: 100%;

}

.support-discription-text {

	width: 100%;

	padding: 0 20px;

}

.support-discription-title {

	font-size: 18px;

	padding-bottom: 20px;

}

.support-discription-sub {

	font-size: 14px;

	line-height: 1.7em;

}