@charset "utf-8";


@media screen and (max-width: 639px){
	html {
		font-size: 87.5% !important;	 /* add 2024 May */
	}
}

img.icon_window {
	padding-left: 0.3em;
}
.red {
	color: #ee0000;
}


/***************************
H1タイトル　　add 2024 May
****************************/
@media screen and (max-width: 640px) {
	.s5h1Ex {
		margin-top: 1em;
		text-align: center;
	}
}

/***************************
スライダー下コピー　　add 2024 May
****************************/

#sect_copy p {
	font-weight: normal!important;
	text-align: center;
}
#sect_copy p span {
	display: inline-block;
}
@media screen and (max-width: 639px) {
	#sect_copy p {
		font-size: 1.1rem !important;
	}	
}


/***************************
ピックアップ　　add 2024 May
****************************/

.bnr_area2 {
	overflow: hidden;
	padding-left: 0;
	text-align: left;	
	margin: 0 auto;
/*	max-width: 1200px;*/
	max-width: 1000px;
	display: flex;
	flex-wrap: wrap;
/*	justify-content: center;*/
	justify-content: flex-start;

}
.bnr_area2 .bnr_single a {
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
}
.bnr_area2 .bnr_single {
	margin: 10px 15px 30px 15px !important;
	max-width: 220px;
}
.bnr_area2 .bnr_single .bnr_img {
	width: 100%;
	max-width: 220px;
	height: auto;
}
.bnr_area2 em {
	font-style: normal !important;
	font-weight: bold;
    color: #fff;
    background-color: #ee0000;
    padding: 0.2em 0.3em 0;
    margin-right: 0.5em;
	line-height: 1.2em !important;
	display: inline-block;
}
.bnr_area2 .bnr_single:hover {
	opacity: 0.6;
	transition: .3s;
}
.bnr_area2 .bnr_text {
	line-height: 1.7em;
	margin-top: 1em;	
}

@media screen and (max-width: 800px) {
	.bnr_area2 {
		flex-direction: column;
	}
	.bnr_area2 .bnr_single a {
		flex-direction: row;
		align-items: flex-start;
	}
	.bnr_area2 .bnr_single {
		max-width: 100%;
		margin: 10px 0 !important;
	}
	.bnr_area2 .bnr_single .bnr_img {
		width: 50%;
	}	
	.bnr_area2 .bnr_text {
		margin-left: 1em;
		margin-top: 0 !important;
	}
}


/***************************
あなたにオススメ　　add 2024 May
****************************/
#sect_etc {
	max-width: 1200px;
	width: 100%;
}
#sect_etc section {
	width: 47%;
	display: inline-block;
	vertical-align: top;
	margin: 0 1%;
}

.bordered_ex {
	text-align: center;
	color: #fff;
	padding: 12px 0 9px;
	margin: 50px 0 30px 0;
	background: linear-gradient(to right,  rgba(142,236,144,1) 0%,rgba(10,130,70,1) 35%,rgba(9,131,70,1) 50%,rgba(10,130,70,1) 66%,rgba(142,236,144,1) 100%);
}
h3.g_title {
	border-left: 8px solid #70AD47;
	line-height: 1.3;
	padding: 0.5em 0.5em;
	margin: 0;
}

.listArea {
	background-color: #F7FBF3;
	padding: 1.5em 2em;
	list-style: none;
}
.listArea li {
	padding: 0.4em 0;
	border-bottom: 1px dashed #000;
}
.listArea li:first-child {
	padding: 0 0 0.4em;
}
.listArea li:last-child {
	padding: 0.4em 0 0;
	border-bottom: none;
}

.annotation {
	text-indent: -1em;
	padding-left: 1em;
	margin: 1em;
}

@media (max-width: 640px) {
	.listArea {
		padding: 1em;
	}
	.annotation {
		margin: 0.5em;
	}
}

@media screen and (max-width: 800px) {
	#sect_etc section {
		display: block;
		width: 97%;
	}
}