/*メインビジュアル*/
#mainvisi-section {
	margin-bottom: 80px;
}
#first-view {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100vh;
	.vegas-slide {
		//height: 101vh;
	}
	&:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		display: block;
		background: linear-gradient(45deg, #4BC0C8, #C779D0, #FEAC5E);
		opacity: 0.4;
		z-index: 1;
	}
	#main-copy {
		position: absolute;
		//@include fullcenter();
		@include verticalcenter();
		z-index: 2;
		h2 {
			font-family: fot-udkakugo-large-pr6n,sans-serif;
			opacity:0;
			padding: 0px 40px 0px 40px;
			text-shadow: 0px 0px 10px #fff;
			span {
				opacity:0;
			}
		}
	}
	.sp-1rem {
    	letter-spacing: 1rem;		
	}
}

/*スクロールボタン*/
.go-contents {
	position: absolute;
	cursor: pointer;
	font-size: 70%;
    left: 50%;
    bottom: 0;
    margin-left: -38px;
    z-index: 2;
    width: 76px;
    height: 78.5px;
    //color: $baseCL;
	text-align: center;
	color: #FFF;
}
.go-contents2 {
	position: absolute;
	font-size: 70%;
    right: 0px;
    bottom: 0;
    margin-left: -38px;
    z-index: 2;
    width: 76px;
    height: 78.5px;
	text-align: center;
	color: #FFF;
}
/*スクロールサインアニメ*/
.anime-line {
  overflow: hidden;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 50px;
}
.anime-line:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  //background-color: currentColor;
	background-color: $keyCL;
}
.anime-line:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background-color: $baseCL;
  animation: scroll 2000ms cubic-bezier(0.19, 1, 0.22, 1) infinite both;
}
@keyframes scroll {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(100%);
  }
}


/*---------------------------------------------*/
/* ポリゴン                                    */
/*---------------------------------------------*/
canvas {
  display: block;
  vertical-align: bottom;
}

#particles-js {
    width: 100%;
    height: 100vh;
	/*background:linear-gradient(135deg, #cfd9df 0%,#e2ebf0 100%);*/
	background: #f2f5f6;
	background: -moz-linear-gradient(top,  #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%);
	background: -webkit-linear-gradient(top,  #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%);
	background: linear-gradient(to bottom,  #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 );
    
}

/*---------------------------------------------*/
/* お知らせ                                    */
/*---------------------------------------------*/
#news-div {
	z-index: 2;
	.news-title-div {
		background-color: #000;
	}
	h6 {	
		color: #FFF;
	}
	a {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: block;
		&:hover {
			color: red;
		}
	}
}
.news-cont-div {
	> .table-list {
		> li {
			div {
				display: flex;
			}
		}
	}
}
.table-list {
	list-style: none;
	margin: 0px;
	padding: 0px;
	> li {
		display: flex;
		div {
			&:last-child {
				> ul {
					display: table;
					padding: 0;
					list-style: none;
					font-size: 14px;
					li {
						display: table-cell;
						span {							
							a {
							background-color: #CCC;
							padding: 2px 5px;
							display: inherit!important;
							}
						}
						&:nth-of-type(n+2) {
							padding-left: 10px;
						}	
					}							
				}
			}
		}
	}
}
.list-backnumber {
	> li {
		border-bottom: 1px solid #CCC;
		padding-bottom: 10px;
		margin-bottom: 10px;
		div {
			&:last-child {
				> ul {
					display: table;
					margin-bottom: 5px;
					padding: 0;
					list-style: none;
					font-size: 14px;
					li {
						display: table-cell;
						&:nth-of-type(n+2) {
							padding-left: 10px;
						}	
					}							
				}
			}
		}
		a {
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			display: block;
		}
	}
}
@media only screen and (min-width: 992px) {
	#news-div {
		position: absolute;
		left: 0;
		bottom: 0;
		background: #FFFFFF59;
		width: calc(100% - 15%);
		.container {
			margin-left: 0;
		}
		a {
			//color: #FFF;
		}
		.news-title-div {
			height: 100%;
			margin-left: -15px;
			padding-left: 10px;
			padding-top: 20px;
			padding-bottom: 20px;
		}
		.table-list {
			padding-left: 10px;
			 > li > div:first-child {
				width: 15rem;
			}
			> li > div:last-child {
				width: 80%;
			}
		}
	}
	.table-list > li {
		flex-wrap: nowrap;
		> div:first-child {
			width: 20%;
			padding-left: 0px;
			flex-shrink: 0;
		}
		> div:last-child {
			width: 80%;
		}
	}
}
@media only screen and (max-width: 991px) {
	#news-div {
		margin-bottom: 40px;
		//padding: 0px 15px 0px 15px;
		.news-title-div {
			padding: 1.5rem;
		}
		.news-cont-div {
			padding-left: 15px;
			> .table-list {
				> li {
					div {
						a {
							padding-left: 10px;
						}
					}
				}
			}
		}
	}
	.table-list > li {
		flex-wrap: wrap;
		> div {
			padding: 0px!important;
			&:first-child {
				margin-bottom: 5px;
			}
			&:last-child {
				width: 100%;
			}
		}
	}
}

@media only screen and (min-width: 768px) {
	#news-div {
		.news-cont-div {
			> .table-list {
				> li {
					div {
						> a {
							padding-left: 10px;
						}
					}
				}
			}
		}
	}
}

@media only screen and (max-width: 767px) {
	#news-div {
		.news-title-div {
			padding: 10px;
			margin-bottom: 5px;
		}
		.news-cont-div {
			padding-left: 0;
			> .table-list {
				> li {
					div {
						display: block;
						> a {
							padding-left: 0;
							margin-top: 5px;
						}
					}
				}
			}
		}
	}
}

/*---------------------------------------------*/
/* swiper                                      */
/*---------------------------------------------*/
@mixin arrow(){
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
	left: 3px;
	width: 40px;
	height: 40px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
}
.my-40 {
	margin-top: 40px;
	margin-bottom: 40px;
}
.swiper-button-nt {
	position: absolute;
	left: -40px;
	top: 50%;
	cursor: pointer;
	&:before {
		@include arrow();
		-webkit-transform: rotate(-135deg);
		transform: rotate(-135deg);
	}
}
.swiper-button-pv {
	position: absolute;
	right: 0;
	top: 50%;
	cursor: pointer;
	&:before {
		@include arrow();
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
.swiper-wrapper {
	.swiper-slide {
		position: relative;
		figure {
			margin-bottom: 10px;
		}
		h5 {
			margin-bottom: 10px;
		}
		a {
			position: absolute;
			display: block;
			top: 0;
			left: 0;
			width: 100%;
			padding-top: 100%;
			&:hover {
				background-color: #FFFFFF30;
			}
		}
	}
}
.swiper-pagination {
	position: static!important;
	span {
		margin-left: 2px;
		margin-right: 2px;
	}
}
.swiper-pagination-bullet-active {
	background: rgba(255,0,0,1.00)!important;
}


/*---------------------------------------------*/
/* コンテンツブロック                          */
/*---------------------------------------------*/
.contents-grid {
	> .row > div {
		&:nth-child(even) figure:before  {
			//background-color: rgba(174,137,204,0.70);
			background: -moz-linear-gradient(-45deg,  rgba(174,137,204,0.7) 0%, rgba(209,133,185,0.7) 100%);
			background: -webkit-linear-gradient(-45deg,  rgba(174,137,204,0.7) 0%,rgba(209,133,185,0.7) 100%);
			background: linear-gradient(135deg,  rgba(174,137,204,0.7) 0%,rgba(209,133,185,0.7) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ae89cc', endColorstr='#b3d185b9',GradientType=1 );

		}
		&:nth-child(odd) figure:before  {
			//background-color: rgba(209,133,185,0.70);
			background: -moz-linear-gradient(45deg,  rgba(174,137,204,0.7) 0%, rgba(209,133,185,0.7) 100%);
			background: -webkit-linear-gradient(45deg,  rgba(174,137,204,0.7) 0%,rgba(209,133,185,0.7) 100%);
			background: linear-gradient(45deg,  rgba(174,137,204,0.7) 0%,rgba(209,133,185,0.7) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ae89cc', endColorstr='#b3d185b9',GradientType=1 );
		}
		&:hover figure:before {
			background: rgba(0,0,0,0);
			-webkit-backdrop-filter: blur(5px);
			backdrop-filter: blur(5px);
		}
		&:hover figure img {
			height: 200%;
			opacity: 0.7;
			width: auto;
		}
		&:hover figcaption {
			color: #000;
		}
	}
	figure {
		overflow: hidden;
		position: relative;
		margin-bottom: 0px;
		&:before {
			content: "";
			width: 100%;
			padding-top: 100%;
			display: block;
			-webkit-backdrop-filter: blur(0px);
			backdrop-filter: blur(0px);
		}
		img {
			height: 103%;
			width: auto;
			z-index: -1;
			transition: 1s;
			-webkit-transition: 1s;
			@include fullcenter();
		}
		figcaption {
			display: block;
			text-align: center;
			color: #FFF;
			width: 100%;
			z-index: 2;
			@include verticalcenter();
		}
	}
	a {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 3;
		width: 100%;
		height: 100%;
		display: block;
		&:hover {
			background-color: rgba(255,255,255,0.00);
		}
	}
}
@media only screen and (max-width: 991px) {
	.contents-grid {
		figure {
			&:before {
				padding-top: 50%;
			}
			img {
				height: auto;
				width: 100%;
			}
		}
	}
}
/*---------------------------------------------*/
/* 3つの強み                                   */
/*---------------------------------------------*/
#strong-div {
	position: relative;
	display: flex;
	align-items: center;
	background-image: url("../img/bg-tsuyomi.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	figure {
		margin: 0px;
	}
}
.bg-white {
	background-color: rgba(255,255,255,0.60);
}
/*@media only screen and (max-width: 991px) {
	#strong-div {
		&:before {
			content: "";
			display: block;
			width: 100%;
			padding-top: 50%;
		}
	}
}*/

/*---------------------------------------------*/
/* other                                       */
/*---------------------------------------------*/
#other-div {
	figure {
		position: relative;
		overflow: hidden;
		&:before {
			content: "";
			display: block;
			width: 100%;
			padding-top: 56%;
		}
		img,
		div {
			width: 100%;
			height: auto;
			position: absolute;
			top: 0;
			left: 0;
			display: block;
		}
	}
}
.info-box {
	color: #fff;
    background: rgba(0,0,0,.7);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
	position: relative;
}
@media only screen and (min-width: 992px) {
	.corp-box figure,
	.sdgs-box figure {
		margin-left: 9.6%;
	}
	.info-box {
		margin: -190px 0 0;
		width: 62.3%;
		height: 300px;
		overflow: hidden;
		article {
			@include fullcenter();
		}
	}
}
@media only screen and (max-width: 991px) {
	.info-box {
		margin-top: -90px;
		margin-left: auto;
		margin-right: auto;
		width: 90%;
		padding: 40px 30px 40px;
	}
}