@charset "UTF-8";

/* common
-----------------------------------------*/

#lsfContents {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#lsfContents * {
	margin: 0;
	padding: 0;
	list-style: none;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
#lsfContents img {
	vertical-align: bottom;
}
#lsfContents em {
	font-style: normal;
}

@media print, screen and (min-width:641px), (min-device-width:1281px){

#lsfContents {
	text-align: center;
}
.pcOnly { display: inline;}
.spOnly { display: none;}

#lsfContents .anchor {
	margin-top: -80px !important;
	padding-top: 80px !important;
}
#lsfContents a.imgover:hover img {
	margin: 2px -2px -2px 2px;
	opacity: 0.75;
}



#lsfContents #main {
	position: relative;
	height: 500px;
	margin-bottom: 100px;
	background-image: url(../img/lsf_main_pc.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#lsfContents #main h2 {
	position: absolute;
	bottom: 0px;
	left: 50%;
	width: 520px;
	background-color: #FFF;
	margin-left: -260px;
	padding-top: 30px;
}

#lsfContents #intro {
	margin-bottom: 50px;
}
#lsfContents #intro h2 {
	font-size: 30px;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 30px;
}
#lsfContents #intro p {
	font-size: 16px;
	line-height: 2;
}

#lsfContents #movie {
	background: linear-gradient(180deg, #FFF 0%, #FFF 50%, #F0F0F0 50%, #F0F0F0 100%);
	padding-bottom: 100px;
}
#lsfContents #movie iframe {
	box-shadow:0 0 20px #CCC;
}

#lsfContents #about {
	font-size: 18px;
	line-height: 2;
}
#lsfContents #about #about_whats {
	background-color: #504642;
	color: #FFC000;
	padding: 65px 0;
}
#lsfContents #about #about_whats .title {
	width: 640px;
	color: #000;
	font-size: 22px;
	font-weight: bold;
	background-color: #FFF;
	margin: 0 auto 30px;
	padding: 8px 0 5px;
	border-radius: 40px;
	letter-spacing: 3px;
}
#lsfContents #about #about_whats .title img {
	width: 220px;
	margin-right: 5px;
}
#lsfContents #about #about_whats .title em {
	font-size: 28px;
}
#lsfContents #about #about_whats2 {
	margin-top: -60px;
	margin-bottom: 40px;
}
#lsfContents #about #about_whats2 img {
	margin-bottom: 30px;
}

#lsfContents #about #about_keyword {
	margin-bottom: 80px;
}
#lsfContents #about #about_keyword .title {
	font-size: 18px;
	font-weight: bold;
}
#lsfContents #about #about_keyword .title em {
	font-size: 25px;
	margin: 0 5px;
}
#lsfContents #about #about_keyword .title strong {
	font-size: 32px;
}
#lsfContents #about #about_keyword .title:before {
	content: '';
	display: inline-block;
	width: 70px;
	height: 70px;
	background-image: url(../img/icon_check01.png);
	background-size: contain;
	vertical-align: bottom;
	margin-right: 15px;
}
#lsfContents #about #about_keyword .title span {
	position: relative;
	z-index: 1;
}
#lsfContents #about #about_keyword .title span:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 18px;
	display: block;
	transform: skewX(-28deg);
	background: #FFED4A;
	z-index: -1;
}

#lsfContents #about #about_board {
	margin-bottom: 80px;
}
#lsfContents #about #about_board .title {
	display: flex;
	align-items: center;

	font-size: 24px;
	font-weight: bold;
	margin-bottom: 15px;
}
#lsfContents #about #about_board .title:before,
#lsfContents #about #about_board .title:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background: #000;
}
#lsfContents #about #about_board .title:before { margin-right: 2em;}
#lsfContents #about #about_board .title:after { margin-left: 2em;}

#lsfContents #about #about_board .title img {
	width: 200px;
	vertical-align: middle;
	margin-right: 10px;
}
#lsfContents #about #about_board .title em {
	font-size: 35px;
	margin: 0 5px;
}

#lsfContents #about #about_useful {
	width: 976px;
	overflow: hidden;
	margin: 0 auto 50px;
}
#lsfContents #about #about_useful .title {
	float: left;
	display: inline-block;
	width: 170px;
	height: 170px;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.4;
	background-color: #FFC000;
	border-radius: 85px;
	padding-top: 35px;	
}
#lsfContents #about #about_useful .title em {
	display: inline-block;
	font-size: 30px;
	margin-top: 5px;
}
#lsfContents #about #about_useful .point {
	float: right;
	width: 750px;
	text-align: left;
	font-size: 25px;
	font-weight: bold;
	line-height: 1;
}
#lsfContents #about #about_useful .point li {
	text-indent: -60px;
	padding-left: 60px;
	margin: 10px 0;
	line-height: 1;
}
#lsfContents #about #about_useful .point li:before {
	content: '';
	display: inline-block;
	width: 50px;
	height: 50px;
	background-image: url(../img/icon_check02.png);
	background-size: contain;
	vertical-align: middle;
	margin-right: 10px;
}
#lsfContents #about #about_useful .point .note {
	font-size: 12px;
	font-weight: normal;
	line-height: 1;
}
#lsfContents #about #about_useful .point li em {
	position: relative;
	z-index: 1;
}
#lsfContents #about #about_useful .point li em:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 18px;
	display: block;
	transform: skewX(-28deg);
	background: #FFED4A;
	z-index: -1;
}


#lsfContents #contact {
	font-size: 25px;
	line-height: 2;
	background-color: #FFC000;
	padding: 45px 0 40px;
}
#lsfContents #contact img {
	width: 200px;
	vertical-align: middle;
}

}


@media only screen and (max-width:640px) and (max-device-width:1280px){

	#lsfContents {
		font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size: 15px;
		line-height: 2.2;
	}
	#lsfContents * {
		margin: 0;
		padding: 0;
		list-style: none;
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	#lsfContents img {
		width: 100%;
		border: none;
		vertical-align: bottom;
		height: auto;
	}

	.pcOnly { display: none;}
	.spOnly { display: inline;}


	#lsfContents #main {}
	#lsfContents #main h2 {
		margin-bottom: 40px;
	}

	#lsfContents #intro {
		text-align: center;
		margin: 0 15px 40px;
	}
	#lsfContents #intro h2 {
		font-size: 5vw;
		font-weight: bold;
		line-height: 1.6;
		margin-bottom: 20px;
	}

	#lsfContents #movie {
		background: linear-gradient(180deg, #FFF 0%, #FFF 50%, #F0F0F0 50%, #F0F0F0 100%);
		padding: 0 15px 40px;
	}
	#lsfContents #movie #moviearea {
		position: relative;
		padding-bottom: 56.25%;
	}
	#lsfContents #movie iframe {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		box-shadow:0 0 20px #CCC;
	}

	#lsfContents #about {}
	#lsfContents #about #about_whats {
		background-color: #504642;
		color: #FFC000;
		padding: 35px 15px;
	}
	#lsfContents #about #about_whats .title {
		display: inline-block;
		color: #000;
		text-align: center;
		font-weight: bold;
		background-color: #FFF;
		margin: 0 auto 20px;
		padding: 5px 10px 3px;
		border-radius: 40px;
		letter-spacing: 3px;
	}
	#lsfContents #about #about_whats .title img {
		width: 40%;
		margin-right: 5px;
		vertical-align: middle;
	}
	#lsfContents #about #about_whats .title em {
		font-size: 20px;
	}

	#lsfContents #about #about_whats2 {
		margin: -8% 15px 40px;
	}
	#lsfContents #about #about_whats2 img {
		margin-bottom: 30px;
	}

	#lsfContents #about #about_keyword {
		margin: 0 15px 60px;
	}
	#lsfContents #about #about_keyword .title {
		font-weight: bold;
		margin-bottom: 10px;
	}
	#lsfContents #about #about_keyword .title em {
		font-size: 4.5vw;
		margin: 0 5px;
	}
	#lsfContents #about #about_keyword .title strong {
		font-size: 5vw;
	}
	#lsfContents #about #about_keyword .title:before {
		content: '';
		display: block;
		float: left;
		width: 50px;
		height: 50px;
		background-image: url(../img/icon_check01.png);
		background-size: contain;
		vertical-align: bottom;
		margin: 15px 10px 0 0;
	}
	#lsfContents #about #about_keyword .title span {
		position: relative;
		z-index: 1;
	}
	#lsfContents #about #about_keyword .title span:after {
		content: '';
		position: absolute;
		left: 0;
		bottom: -4px;
		width: 100%;
		height: 18px;
		display: block;
		transform: skewX(-28deg);
		background: #FFED4A;
		z-index: -1;
	}

	#lsfContents #about #about_board {
		margin: 0 15px 40px;
	}
	#lsfContents #about #about_board .title {
		text-align: center;
		font-size: 4vw;
		font-weight: bold;
		margin-bottom: 15px;
	}
	#lsfContents #about #about_board .title img {
		width: 40%;
		vertical-align: middle;
		margin-right: 10px;
	}
	#lsfContents #about #about_board .title em {
		font-size: 5.5vw;
		margin: 0 5px;
	}

	#lsfContents #about #about_useful {
		margin: 0 15px 60px;
	}
	#lsfContents #about #about_useful .title {
		display: inline-block;
		font-size: 4vw;
		font-weight: bold;
		line-height: 1;
		background-color: #FFC000;
		border-radius: 40px;
		margin-bottom: 15px;
		padding: 8px 30px 5px;	
	}
	#lsfContents #about #about_useful .title em {
		font-size: 5.5vw;
	}
	#lsfContents #about #about_useful .point {
		font-size: 4vw;
		font-weight: bold;
	}
	#lsfContents #about #about_useful .point li {
		text-indent: -50px;
		padding-left: 50px;
		margin: 0 0 20px 0;
		line-height: 1;
	}
	#lsfContents #about #about_useful .point li:before {
		content: '';
		display: inline-block;
		width: 40px;
		height: 40px;
		background-image: url(../img/icon_check02.png);
		background-size: contain;
		vertical-align: middle;
		margin-right: 10px;
	}
	#lsfContents #about #about_useful .point .note {
		display: inline-block;
		font-size: 12px;
		font-weight: normal;
		margin: 12px 0 0 50px;
	}
	#lsfContents #about #about_useful .point li em {
		position: relative;
		z-index: 1;
		font-size: 5vw;
		margin: 0 5px;
	}
	#lsfContents #about #about_useful .point li em:after {
		content: '';
		position: absolute;
		left: 0;
		bottom: -2px;
		width: 100%;
		height: 16px;
		display: block;
		transform: skewX(-28deg);
		background: #FFED4A;
		z-index: -1;
	}


	#lsfContents #contact {
		font-size: 4vw;
		line-height: 2;
		background-color: #FFC000;
		padding: 20px 15px;
	}
	#lsfContents #contact img {
		width:40%;
		vertical-align: middle;
	}

}