@charset "UTF-8";
/* CSS Document */

/*-----------------------------------------------------------
*
*　pc
-------------------------------------------------------------*/

/*------------------------------------------------
*
*　hero
--------------------------------------------------*/
.hero{
	background-image: url("../images/hero.jpg");
	background-image: linear-gradient(to right,rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),url("../images/hero.jpg");
	background-size: cover;
	background-position: bottom;
	height: 100vh;
	position:relative;
}

.hero-content{
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
}

.hero-content h1{
	padding: 0 30px 10px;
	margin-bottom: 30px;
	border-bottom: 2px solid;
    border-image: linear-gradient(to right, #DF5695 0%, #9DBF21 33%,#38B8EF 66%,#F89A27 100%) 1/0 0 2px 0;
    border-image-slice: 1;
}

.hero-content p{
	color: #fff;
	letter-spacing: 0.4em;
}

/*------------------------------------------------
*
*　top-news
--------------------------------------------------*/
.top-news h2{
	margin-bottom: 20px;
}

.top-news ul li{
	height: 120px;
	line-height: 120px;
	margin: 0 30px;
	border-bottom: 1px solid #D3D3D3;
}
.top-news ul li:last-of-type{
	border-bottom: none;
}

.top-news ul li a{
	display: block;
	width: 100%;
	height: 100%;
}

.top-news ul li p{
	display: inline-block;
	margin-left: 50px;
	color: #00894F;
}

/*------------------------------------------------
*
*　top-greeting
--------------------------------------------------*/
.top-greeting h2{
	margin-bottom: 70px;
}

.top-greeting p{
	line-height: 3;
	margin-bottom: 70px;
}

/*------------------------------------------------
*
*　top-footer-link
--------------------------------------------------*/
.top-footer-link h2{
	margin-bottom: 50px;
}

.top-footer-link p{
	font-size: 2rem;
	height: auto;
	margin-bottom: 20px;
}

/*----------------------------------------------------------
*
*　sp
------------------------------------------------------------*/
@media screen and (max-width:768px){
	/*------------------------------------------------
	*
	*　hero
	--------------------------------------------------*/
	.hero-content{
		width: 90%;
	}
	/*------------------------------------------------
	*
	*　top-news
	--------------------------------------------------*/
	.top-news ul li{
		height: auto;
		padding: 10px 0;
		line-height: 0;
	}
	.top-news ul li a{
		display: flex;
		line-height: 1.5;
	}
	.top-news ul li p{
		margin-left: 10px;
	}
	/*------------------------------------------------
	*
	*　top-footer-link
	--------------------------------------------------*/
	.top-footer-link.flex{
		display: block;
	}
	
	.top-footer-link.flex .w-49{
		width: 100%;
	}
	
	.top-footer-link.flex .w-49:first-of-type{
		margin-bottom: 80px;
	}
}