@charset "utf-8";
/*===次回予告==========================*/
.end {
	background-color: #6DBFBB;
	color: #fff;

	& .flex {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 50px;

		& p {
			font-size: 1.5rem;
			text-align: left;
			font-weight: bold;
		}

		& p.txt02 {
			margin-top: 20px;
		}
	}
}

@media screen and (max-width: 768px) {
	.end {
		& .flex {
			padding: 30px;

			& p {
				font-size: 1rem;
			}

			& p.txt02 {
				margin-top: 10px;
			}
		}
	}
}




/*===フローティングボタン==========================*/
.cta-fix {
	position: fixed;
	right: 60px;
	bottom: 60px;
	z-index: 1000;

	& img {
		width: 230px;
	}
}

.cta-fix img.sp {
	display: none;
}

@media screen and (max-width: 768px) {
	.cta-fix img.sp {
		display: block;
	}

	.cta-fix img.pc {
		display: none;
	}
}

@media screen and (max-width: 768px) {
	.cta-fix {
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 129, 40, .8);
		padding-top: 10px;
	}

	& img {
		width: 100%;
		margin: 0 auto;
		margin-bottom: 5px;
	}
}

/*===fv==========================*/
#fv {
	background-image: url(../img/bg_topimg.png);
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
	height: 700px;
	margin-bottom: 100px;

	& h1 {
		width: 90%;
		padding-top: 70px;
		margin: 0 auto;
	}

	& .jigyou-name {
		position: absolute;
		top: 20px;
		left: 0;
	}
}

@media screen and (max-width: 768px) {
	#fv {
		margin-bottom: 30px;
		height: 450px;

		& h1 {
			margin-bottom: 20px;
		}

		& .jigyou-name {
			left: 20px;
			font-size: .75rem;
		}
	}
}

#fv .points {
	& .points-01 {
		background-color: #E73A35;
	}
	& .points-02 {
		background-color: #30AF60;
	}
	& .points-03 {
		background-color: #6454A0;
	}
}

#fv .points {
	justify-content: center;
	gap: 30px;

	& .circle {
		width: 150px;
		height: 150px;
		border-radius: 50%;

		& p {
			font-size: 2rem;
			text-align: center;
			color: #fff;
			font-weight: bold;

			& .txt-small {
				font-size: 1.25rem;
				display: block;
				margin-bottom: 4px;
			}
		}
	}

	& .flex {
		justify-content: center;
		align-items: center;
	}
}

@media screen and (max-width: 768px) {
	#fv .points {
		justify-content: center;
		gap: 20px;

		& .circle {
			width: 100px;
			height: 100px;

			& p {
				font-size: 1.5rem;
				line-height: 1;

				& .txt-small {
					font-size: 1rem;
					margin-bottom: 8px;
				}
			}
		}

		& .flex {
			justify-content: center;
			align-items: center;
		}
	}
}


/*===about==========================*/
#about .title {
	margin-bottom: 60px;

	& h2 {
		width: min(630px, 90%);
		margin: 0 auto;
		margin-bottom: 14px;
	}

	& p {
		text-align: center;
		font-size: 1.25rem;
		font-weight: bold;
	}
}

@media screen and (max-width: 768px) {
	#about .title {
		& p {
			font-size: 1rem;
			margin-bottom: 460px;
		}
	}
}

#about .subtitle {	
	& h3 {
		width: min(370px, 80%);
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20px;
	}

	& p {
		text-align: center;
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 768px) {
	#about .subtitle {	
		& p {
			width: 100%;
			font-size: 1rem;
			padding-right: 100px;
			margin-left: auto;
			margin-right: auto;
		}
	}
}

#about .list-yokoku {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: 40px;
	grid-row-gap: 12px;
	width: min(560px, 70%);
	margin: 0 auto;
	margin-bottom: 60px;
}

@media screen and (max-width: 768px) {
	#about .list-yokoku {
		grid-template-columns: 1fr;
	}
}

/*===about 装飾===*/
#about {
	& .title {
		position: relative;

		& div.character-fix.left {
			top: -180px;
			left: -50px;
			width: 200px;
		}

		& div.img-fix.left {
			bottom: -70px;
			left: 0;
			width: 220px;
		}

		& div.img-fix.right {
			bottom: -80px;
			right: -50px;
			width: 300px;
		}
	}
}

#about {
	& .subtitle {
		& div.character-fix.right {
			width: 110px;
			right: 40px;
			bottom: 0;
		}
	}
}

@media screen and (max-width: 768px) {
	#about {
		& .title {
			& div.character-fix.left {
				top: auto;
				left: auto;
				bottom: -200px;
				right: 10px;
				width: 100px;
				transform: rotate(0deg);
			}

			& div.img-fix.left {
				bottom: -200px;
				left: 30px;
				width: 220px;
			}

			& div.img-fix.right {
				bottom: -420px;
				right: auto;
				left: 20px;
				width: 300px;
			}
		}
	}

	#about {
		& .subtitle {
			& div.character-fix.right {
				width: 90px;
				right: -5px;
				bottom: 220px;
			}
		}
	}
}

/*===about gaiyou==========================*/
#gaiyou {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 70px;
	padding-bottom: 40px;
	background-color: #FFFCDB;
	border: solid 3px #FFC000;
	text-align: center;
}

#gaiyou > p {
	font-weight: bold;
	margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
	#gaiyou > p {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 40px;
	}
}

#gaiyou dl {
	padding: 40px;
	padding-left: 100px;
	display: flex;
	flex-wrap: wrap;
	width: 100%;

	& dt {
		width: 20%;
		background-color: #078A4B;
		border-radius: 50px;
		color: #fff;
		text-align: center;
		font-size: 1rem;
		margin-bottom: 20px;
	}

	& dd {
		width: 80%;
		padding-left: 30px;
		text-align: left;
		font-weight: bold;
	}
}

@media screen and (max-width: 768px) {
	#gaiyou dl {
		padding: 30px 20px;
		flex-direction: column;
		align-items: center;

		& dt {
			width: 80%;
			margin-bottom: 10px;
		}

		& dd {
			width: 100%;
			margin-bottom: 20px;
			padding-left: 0;
			text-align: center;
		}
	}
}

#gaiyou .cta-form {
	text-align: center;
	font-weight: bold;

	& p.tel {
		font-size: 1.75rem;
		margin-top: -20px;

		& span {
			font-size: 2.75rem;
		}
	}

	& p.tel a {
		color: #000;		
	} 
}

#gaiyou .cta-form a img {
	width: min(380px, 60%);
	margin-bottom: 30px;
}

/*===gaiyou 装飾===*/
#gaiyou {
	position: relative;

	& div.deco-fix {
		width: 80px;
		top: -34px;
		left: 30px;
	}
}

@media screen and (max-width: 768px) {
	#gaiyou {
		& div.deco-fix {
			left: 0;
		}
	}
}

/*===スケジュールu==========================*/
#schedule {
	margin-bottom: 70px;
}

#schedule .title {
	width: min(420px, 80%);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50px;
}

@media screen and (max-width: 768px) {
	#schedule .title {
		margin-bottom: 30px;
	}
}

#schedule div.schedule-list {
	width: min(700px, 80%);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;

	& dl {
		display: flex;
		flex-wrap: wrap;
		width: 100%;

		& dt {
			width: 28%;
			background-color: #078A4B;
			border-radius: 50px;
			color: #fff;
			text-align: center;
			font-size: 1.5rem;
			margin-bottom: 20px;
		}

		& dt.bottom {
			margin-bottom: auto;
		}

		& dd {
			width: 72%;
			padding-left: 30px;
			text-align: left;
			font-weight: bold;
			font-size: 1.75rem;
		}
	}
}

@media screen and (max-width: 768px) {
	#schedule div.schedule-list {
		& dl {
			flex-direction: column;
			align-items: center;

			& dt {
				width: 50%;
				font-size: 1.25rem;
				margin-bottom: 10px;
			}

			& dt.bottom {
				margin-bottom: 10px;
			}

			& dd {
				width: 100%;
				padding-left: 0px;
				text-align: center;
				font-size: 1.3rem;
				margin-bottom: 20px;
			}
		}
	}
}

#schedule ul {
	padding: 0 50px;

	& li {
		font-size: 1.125rem;
		position: relative;
	}

	& li:nth-child(2n-1)::before {
		content: "";
		display: inline-block;
		background-image: url('../img/deco-daiya01.svg');
		background-size: cover;
		background-repeat: no-repeat;
		width: 18px;
		height: 18px;
		position: absolute;
		left: -22px;
		top: 50%;
		transform: translateY(-50%);
	}

	& li:nth-child(3)::before {
		top: 25%;
	}

	& li:nth-child(2n)::before {
		content: "";
		display: inline-block;
		background-image: url('../img/deco-daiya02.svg');
		background-size: cover;
		background-repeat: no-repeat;
		width: 18px;
		height: 18px;
		position: absolute;
		left: -22px;
		top: 50%;
		transform: translateY(-50%);
	}
}

@media screen and (max-width: 768px) {
	#schedule ul {
		padding: 0 20px;

		& li {
			font-size: .875rem;
			margin-bottom: 10px;
		}

		& li:nth-child(2n-1)::before {
			top: 7%;
			transform: translateY(0%);
		}

		& li:nth-child(3)::before {
			top: 4%;
		}

		& li:nth-child(2n)::before {
			top: 7%;
			transform: translateY(0%);
		}
	}
}

/*===スケジュール 装飾===*/
#schedule .schedule-list {
	position: relative;

	& div.deco-fix.left {
		width: 60px;
		top: -80px;
		left: -100px;
	}

	& div.deco-fix.right {
		width: 60px;
		right: -30px;
		bottom: 0;
	}

	& div.img-fix.left {
		width: 120px;
		bottom: 0px;
		left: -180px;
	}

	& div.img-fix.right {
		width: 120px;
		top: -30px;
		right: -10px;
	}
}

@media screen and (max-width: 768px) {
	#schedule .schedule-list {
		& div.deco-fix.left {
			top: -20px;
			left: -30px;
		}

		& div.deco-fix.right {
			right: -50px;
			bottom: -30px;
		}

		& div.img-fix.left {
			width: 90px;
			bottom: 60px;
			left: -40px;
		}

		& div.img-fix.right {
			width: 90px;
			top: 50px;
			right: -60px;
		}
	}
}

/*===参加企業==========================*/
#company {
	background-color: #FDFFE2;
	padding: 30px;
	margin-bottom: 30px;
}

@media screen and (max-width: 768px) {
	#company {
		padding-left: 4%;
		padding-right: 4%;

		& .inner {
			margin: 0;
		}
	}
}

#company .midashi {
	width: min(250px, 50%);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
}

#company .list-company {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-column-gap: 20px;
	grid-row-gap: 14px;
	font-weight: bold;
	font-size: .875rem;
	margin-bottom: 70px;

	& .list::before {
		content: "□";
		font-size: 0.75rem;
	}
}

@media screen and (max-width: 768px) {
	#company .list-company {
		grid-template-columns: 1fr;
		grid-row-gap: 14px;
		font-weight: bold;
		font-size: .875rem;
	}
}

#company .list-company,
#company .detail-company {
	
	& .agriforest {
		color: #008128;
	}

	& .product {
		color: #0090D8;
	}

	& .build {
		color: #8E589C;
	}

	& .retail {
		color: #D7941D;
	}

	& .trafic {
		color: #844D26;
	}

	& .stay {
		color: #B40019;
	}

	& .estate {
		color: #E87989;
	}

	& .medical {
		color: #6DBFBB;
	}

	& .service {
		color: #B69451;
	}

	& .print {
		color: #CB6CE6;
	}

	& .ad {
		color: #004AAD;
	}

	& .agri {
		color: #FF741F;
	}

	& .service-technical {
		color: #004AAB;
	}
}

#company .detail-company {
	flex-wrap: wrap;
	justify-content: space-between;
}

@media screen and (max-width: 768px) {
	#company .detail-company {
		flex-direction: column;
	}
}

#company .detail-company .list {
	width: 31%;
	padding-top: 30px;
	padding-bottom: 30px;
	/*---非表示
	border-bottom: solid 1px #707070;
	---*/

	& p.catch {
		font-size: .75rem;
		margin-bottom: 4px;
	}

	& h3.name {
		font-size: 1rem;
		font-weight: bold;
		margin-bottom: 8px;
	}

	& div.youtube {
		margin-bottom: 20px;

		& .yt {
			width: 100%;
			height: auto;
			aspect-ratio: 16 / 9;
			display: block;
			margin: auto;
		}

		& .junbi {
			width: 100%;
			height: auto;
			aspect-ratio: 16 / 9;
			display: block;
			margin: auto;
			background-color: #dcdcdc;
			position: relative;
		}

		& .junbi::after {
			position: absolute;
			content: "準備中";
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 1.25rem;
		}
	}

	& div.eyecatch {
		position: relative;

		& p.industry {
			position: absolute;
			top: 10px;
			left: 10px;
			color: #fff;
			font-size: .75rem;
			font-weight: bold;
			padding: 4px 20px;
			border-radius: 50px;
		}
	}

	& p.txt {
		margin-bottom: 30px;
	}

	& .detail {
		& p.title {
			font-weight: bold;
			position: relative;
			margin-bottom: 10px;
		}
	}
}

@media screen and (max-width: 768px) {
	#company .detail-company .list {
		width: 100%;

		& h3.name {
			font-size: 1.2rem;
		}

		& p.txt {
			font-size: .875rem;
		}

		& dl {
			font-size: .875rem;
		}
	}
}

#company .detail-company .list {
	& p.title::after {
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		content: "";
		display: block;
		width: calc(100% - 5.5em);
		height: 1px;
		background-color: #008128;
	}
}

#company .detail-company .list .detail {
	& > p.product::after {
		background-color: #0090D8;
	}

	& > p.build::after {
		background-color: #8E589C;
	}

	& > p.retail::after {
		background-color: #D7941D;
	}

	& > p.trafic::after {
		background-color: #844D26;
	}

	& > p.stay::after {
		background-color: #B40019;
	}

	& > p.estate::after {
		background-color: #E87989;
	}

	& > p.medical::after {
		background-color: #6DBFBB;
	}

	& > p.service::after {
		background-color: #B69451;
	}

	& > p.print::after {
		background-color: #CB6CE6;
	}

	& > p.ad::after {
		background-color: #004AAD;
	}

	& > p.agri::after {
		background-color: #FF741F;
	}

	& > p.service-technical::after {
		background-color: #004AAB;
	}
}

#company .detail-company .list:nth-child(1),
#company .detail-company .list:nth-child(2),
#company .detail-company .list:nth-child(3) {
	margin-top: 0;
}

#company .detail-company .list .detail .detail-list {
	& dd {
		margin-bottom: 10px;
		overflow: hidden;

		& a {
			color: #000;
		}
	}
}

#company .detail-company .list div.eyecatch {
	& p.agriforest {
		background-color: #008128;
	}

	& p.product {
		background-color: #0090D8;
	}

	& p.build {
		background-color: #8E589C;
	}

	& p.retail {
		background-color: #D7941D;
	}

	& p.trafic {
		background-color: #844D26;
	}

	& p.stay {
		background-color: #B40019;
	}

	& p.estate {
		background-color: #E87989;
	}

	& p.medical {
		background-color: #6DBFBB;
	}

	& p.service {
		background-color: #B69451;
	}

	& p.print {
		background-color: #CB6CE6;
	}

	& p.ad {
		background-color: #004AAD;
	}

	& p.agri {
		background-color: #FF741F;
	}

	& p.service-technical {
		background-color: #004AAB;
	}
}

/*===参加企業 装飾=======*/
.detail-company {
	position: relative;

	& .character-fix.character05 {
		width: 500px;
		bottom: 100px;
		right: 0;
	}

	& .company01 {
		position: relative;

		& .character-fix {
			width: 160px;
			bottom: 180px;
			left: -100px;
		}
	}

	& .company12 {
		position: relative;

		& .character-fix {
			width: 150px;
			bottom: 20px;
			right: -120px;
		}
	}
}

@media screen and (max-width: 768px) {
	.detail-company {
		& .character-fix.character05 {
			width: 250px;
			bottom: 0px;
			right: auto;
			left: 50%;
			transform: translateX(-50%);
		}

		& .company01 {
			& .character-fix {
				width: 90px;
				bottom: 30px;
				left: auto;
				right: 10px;
			}
		}

		& .company12 {
			& .character-fix {
				width: 90px;
				bottom: 30px;
				right: 0px;
			}
		}

		& .company19 {
			margin-bottom: 300px;
		}
	}
}

/*===よくある質問==========================*/
#question {
	margin-bottom: 60px;
}

#question h2.midashi {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	width: min(270px, 80%);
	margin-bottom: 30px;
}

#question dl.list-qa {
	padding-left: 20px;
	padding-right: 20px;
	font-weight: 600;
	margin-bottom: 20px;

	& dt.question {
		margin-bottom: 8px;
		padding-top: 12px;

		& span {
			color: #30AF60;
		}
	}

	& dd.answer {
		padding-bottom: 16px;
		border-bottom: solid 1px #707070;

		& span {
			color: #E73A35;
		}
	}
}

#question {
	& p {
		text-align: center;
		font-size: 1.25rem;
	}

	p.txt-under {
			font-weight: bold;
			margin-bottom: 6px;

		& span {
			background: linear-gradient(transparent 60%, #FFFE03 60%);
		}
	}
}

@media screen and (max-width: 768px) {
	#question {
		& .qa {
			padding-left: 4%;
			padding-right: 4%;

			& dl.list-qa {
				font-size: .875rem;
				padding-left: 0;
				padding-right: 0;
			}

			& p {
				font-size: .875rem;
			}
		}
	}
}

/*===申込フォーム下部==========================*/
.cta-bottom {
	margin-bottom: 80px;
}

.cta-bottom .cta-form {
	text-align: center;
	font-weight: bold;

	& p.tel {
		font-size: 1.75rem;
		margin-top: -20px;

		& span {
			font-size: 2.75rem;
		}
	}

	& p.tel a {
		color: #000;
	}
}

@media screen and (max-width: 768px) {
	.cta-bottom {
		padding-left: 4%;
		padding-right: 4%;
		font-size: .875rem;

		&.cta-bottom .cta-form {
			text-align: center;
			font-weight: bold;

			& p.tel {
				font-size: 1.25rem;
				margin-top: 0;

				& span {
					font-size: 1.75rem;
				}
			}

			& p.tel a {
				color: #000;
			}
		}
	}
}

.cta-bottom .cta-form a img {
	width: min(380px, 50%);
	margin-bottom: 30px;
}

.js-modal-video {
	position: absolute;
	display: block;
	width: 100%;
	top: 0;
	left: 0;
	bottom: 0;
}