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



/*-
	PC版（769px以上）ここから
------------------------------------------------- */
@media screen and (min-width:769px), print{
	
	.linkButton{
		position: absolute;
		bottom: 15px;
		right: 0;
		margin-bottom: 0 !important;
		width: 300px;
	}
	.linkButton a{
		border: none;
		padding: 16px 5px 16px 0;
	}
	.linkButton.inquiry a{
		background-color: #2E457C;
	}
	
	#title{
		background-image: url("../images/const_bg2_sp.jpg");  /* タイトル背景写真 */
	}
	
	#intro{
		display: block;
		position: relative;
		margin: 55px 0;
		padding-bottom: 15px;
	}
	#intro::after{
		content: "";
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 60%;
		height: 93%;
		background-image:
			linear-gradient(270deg,
				rgba(255, 255, 255, 1.0) 0%,
				rgba(255, 255, 255, 0.5) 20%,
				rgba(255, 255, 255, 0) 60%),
			url("../images/const_intro.jpg");	/* 背景写真 */
		background-repeat: no-repeat;
		background-size: 101%, cover;
		background-position: center;
	}
	#intro dl{
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		position: relative;
		z-index: 100;
	}
	#intro dl dt{
		text-align: right;
		color: #089BCC;
		font-family: "Noto Serif JP";	/* GoogleFonts */
		font-size: 45px;
		font-weight: 500;
		letter-spacing: 0.05em;
		line-height: 1.35;
		margin-bottom: 30px;
	}
	#intro dl dd{
		width: 440px;
		margin-left: 20px;
		line-height: 1.95;
	}
	#intro dl dd .linkButton{
		display: block;
		position: relative;
		margin: 45px 0  0 auto;
		width: 330px;
	}
	
	
	#slide{
		display: block;
		position: relative;
		height: 300px;
	}
	
	
	/* スライド 写真 */
	#splidePhoto{
		width: 100%;
		position: absolute;
		top: 0;
	}
	#splidePhoto ul{
		height: 100%;
	}
	#splidePhoto ul li{
		width: 300px !important;
	}
	#splidePhoto ul li img{
		display: block;
		width: 100%;
		height: auto;
	}

	/* スライド文字 */
	#splideText{
		width: 100%;
		position: absolute;
		bottom: 7px;
	}
	#splideText ul{
		height: 60px;
	}
	#splideText ul li{
		font-family: "Noto Serif JP";	/* GoogleFonts */
		color: #FFFFFF;
		font-weight: 600;
		line-height: 1.0;
		font-size: 60px;
		opacity: 0.7;
	}
	#splideText ul li.textNum4{ width: 5em !important; }
	#splideText ul li.textNum7{ width: 8em !important; }
	
	
	
	
	
	
	
}
/*-
	SP版（768px以下）ここから
------------------------------------------------- */
@media screen and (max-width: 768px) {
	
	.linkButton{}
	.linkButton a{
		border: none;
	}
	.linkButton.inquiry a{
		background-color: #2E457C;
	}
	
	#title{
		background-image: url("../images/const_bg2_sp.jpg");  /* タイトル背景写真 */
	}

	#intro{
		display: block;
		position: relative;
		margin: 8vw 0;
		padding-bottom: 55vw;
	}
	#intro::after{
		content: "";
		display: block;
		position: absolute;
		bottom: 0;
		right: 0;
		z-index: 10;
		width: 100%;
		height: 66.7vw;
		background:
			linear-gradient(180deg,
				rgba(255, 255, 255, 1.0) 0%,
				rgba(255, 255, 255, 0.5) 20%,
				rgba(255, 255, 255, 0) 60%),
			url("../images/const_intro.jpg");  /* 背景写真 */
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	
	#intro dl{
		display: block;
		position: relative;
		z-index: 100;
		width: 92%;
		margin: 0 auto;
	}
	#intro dl dt{
		display: block;
		color: #089BCC;
		font-family: "Noto Serif JP";	/* GoogleFonts */
		font-size: 5.8vw;
		font-weight: 600;
		letter-spacing: 0.05em;
		line-height: 1.25;
		margin-bottom: 3vw;
	}
	#intro dl dd{
		width: 100%;
		line-height: 1.75;
	}
	
	
	#slide{
		display: block;
		position: relative;
		height: 200px;
		margin-bottom: 50px;
	}
	
	
	/* スライド 写真 */
	#splidePhoto{
		width: 100%;
		position: absolute;
		top: 0;
	}
	#splidePhoto ul{
		height: 100%;
	}
	#splidePhoto ul li{
		width: 200px !important;
	}
	#splidePhoto ul li img{
		display: block;
		width: 100%;
		height: auto;
	}

	/* スライド文字 */
	#splideText{
		width: 100%;
		position: absolute;
		bottom: 7px;
	}
	#splideText ul{
		height: 45px;
	}
	#splideText ul li{
		font-family: "Noto Serif JP";	/* GoogleFonts */
		color: #FFFFFF;
		font-weight: 600;
		line-height: 1.0;
		font-size: 45px;
		opacity: 0.7;
	}
	#splideText ul li.textNum4{ width: 5em !important; }
	#splideText ul li.textNum7{ width: 8em !important; }
	
	
	
	
}