@charset "utf-8";

/*=============================================

	上部タイトル

==============================================*/
.top_title {
	padding: 0;
	position: relative;

}
.top_title .container {
	width: 100%;
	max-width: 100%;
}
.top_title .img {
	position: relative;
	width: 100%;
}
.top_title .img::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.4);
	width: 100%;
	height: 100%;
}
.top_title .title_en {
	position: absolute;
	left: 50%;
	top: 43%;
	transform: translate(-50%, -50%);
    font-size: max(10vw, 24px);
    color: #FFF;
    text-align: center;
    line-height: 1;
}
.top_title .title_jp {
	position: absolute;
	left: 50%;
	top: 58%;
	transform: translate(-50%, -50%);
    font-size: max(4vw, 16px);
    color: #FFF;
    text-align: center;
}
@media print, screen and (min-width: 769px) {

	.top_title {
		padding: 0;
	}
	.top_title .img img {
		width: 100%;
	}
	.top_title .img::after {
	}


	.top_title .title_en {
	    font-size: max(5vw, 32px);
		top: 43%;
	}
	.top_title .title_jp {
	    font-size: max(2vw, 18px);
		top: 63%;
	}

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


/*=============================================

	リード文

==============================================*/
.lead_wrap {
	padding: 3em 0;
}
.lead_wrap .lead {
    font-size: max(4vw, 16px);
    text-align: center;
    margin-bottom: 0.8em;
}
.lead_wrap .attention {
    font-size: max(2vw, 11px);
    text-align: center;
}
@media print, screen and (min-width: 769px) {
	.lead_wrap {
		padding: 50px 0;
	}
	.lead_wrap .lead {
	    font-size: max(2vw, 16px);
	    margin-bottom: 0.8em;
	}
	.lead_wrap .attention {
	    font-size: max(1vw, 11px);
	}

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




/*=============================================

	ポイント

==============================================*/
.point_wrap {
	padding: 2em 0;
}
.point_wrap .main_wrap {
	margin: 0 0 2em;
}
.point_wrap .text_wrap {
	margin: 0 0 2em;
}
.point_wrap .text_wrap .category {
	display: table;
	padding: 0.5em 1.0em;
	color: #FFF;
	background-color: #003461;
	line-height: 1;
	margin: 0 auto 0.8em;
}
.point_wrap .text_wrap .title {
    font-size: max(6vw, 24px);
    color: #003461;
    text-align: center;
    margin-bottom: 1.0em;
} 
.point_wrap .text_wrap .body {
    font-size: max(4vw, 16px);
    text-align: left;
} 
.point_wrap .img_wrap {
	
}
.point_wrap .bottom_wrap {
	position: relative;
}
.point_wrap .bottom_wrap .img01 {

}
.point_wrap .bottom_wrap .text01 {
    font-size: max(3vw, 14px);
    line-height: 2;
}

@media print, screen and (max-width: 768px) {

	/** ポイントごとの指定 **/
	.point_wrap.content01 .bottom_wrap {
		display: flex;
		justify-content: space-between;
	}
	.point_wrap.content01 .bottom_wrap .img01 {
		width: 40%;
		padding-left: 5%;
	}
	.point_wrap.content01 .bottom_wrap .text01 {
		width: 50%;
		padding: 1em 5% 0 0;
	}
	
	.point_wrap.content02 .bottom_wrap {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.point_wrap.content02 .bottom_wrap .img01 {
		width: 60%;
		padding-left: 3%;
	}
	.point_wrap.content02 .bottom_wrap .img02 {
		width: 32%;
		padding-top: 4em;
	}
	.point_wrap.content02 .bottom_wrap .text01 {
		display: block;
		padding: 2em 0 0 0;
	}

	.point_wrap.content03 .bottom_wrap {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.point_wrap.content03 .bottom_wrap .img01 {
		width: 35%;
		padding-left: 5%;
	}
	.point_wrap.content03 .bottom_wrap .text01 {
		width: 55%;
		padding: 2.5em 0 0 0;
	}

	.point_wrap.content04 .bottom_wrap {
	}
	.point_wrap.content04 .bottom_wrap .img01 {
		width: 70%;
		padding-right: 5%;
		margin-left: auto;
	}
	.point_wrap.content04 .bottom_wrap .text01 {
		padding: 1.5em 0 0 0;
	}

	.point_wrap.content05 .bottom_wrap {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.point_wrap.content05 .bottom_wrap .img01 {
		width: 50%;
		padding-left: 3%;
	}
	.point_wrap.content05 .bottom_wrap .img02 {
		width: 43%;
		padding-top: 4em;
	}

}

@media print, screen and (min-width: 769px) {
	.point_wrap {
		padding: 0 0;
	}
	.point_wrap .main_wrap {
		margin: 0 0 70px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.point_wrap .text_wrap {
		margin: 0 0 0;
		width: 35%;
	}
	.point_wrap .text_wrap .category {
		margin: 0 auto 1.2em 0;
	}
	.point_wrap .text_wrap .title {
	    font-size: max(2.5vw, 24px);
	    text-align: left;
	    margin-bottom: 1.0em;
	} 
	.point_wrap .text_wrap .body {
	    font-size: max(1.2vw, 14px);
	} 
	.point_wrap .img_wrap {
		width: 60%;
	}
	.point_wrap .bottom_wrap {
		position: relative;
	}
	.point_wrap .bottom_wrap .img01 {
		position: absolute;
		left: 50%;
		top: 0;
		margin-left: -300px;
	}
	.point_wrap .bottom_wrap .img02 {
		position: absolute;
		left: 50%;
		top: 0;
		margin-left: -300px;
	}
	.point_wrap .bottom_wrap .text01 {
	    font-size: max(1.2vw, 14px);
		position: absolute;
		left: 50%;
		top: 0;
		margin-left: -300px;
	}
	
	
	/** ポイントごとの指定 **/
	.point_wrap.content01 .bottom_wrap {
		height: 35vw;
	}
	.point_wrap.content01 .bottom_wrap .img01 {
		width: 30%;
		margin-left: -36%;
	}
	.point_wrap.content01 .bottom_wrap .text01 {
		width: 30%;
		margin-left: 0%;
		top: 9vw;		
	}
	
	.point_wrap.content02 .main_wrap {
		flex-direction: row-reverse;
	}
	.point_wrap.content02 .bottom_wrap {
		height: 40vw;
	}
	.point_wrap.content02 .bottom_wrap .img01 {
        width: 34%;
        margin-left: 4%;
	}
	.point_wrap.content02 .bottom_wrap .img02 {
        width: 30%;
        margin-left: -36%;
        top: 3vw;
	}
	.point_wrap.content02 .bottom_wrap .text01 {
        width: 40%;
        margin-left: -2%;
        top: 22vw;	
	}

	.point_wrap.content03 .main_wrap {
		align-items: flex-start;
	}
	.point_wrap.content03 .main_wrap .img_wrap {
		width: 50%;
	}
	.point_wrap.content03 .bottom_wrap {
		height: 20vw;
	}
	.point_wrap.content03 .bottom_wrap .img01 {
        width: 34%;
        margin-left: -50%;
        top: -35vw;
	}
	.point_wrap.content03 .bottom_wrap .text01 {
        width: 40%;
        margin-left: 0%;
        top: 0vw;
	}

	.point_wrap.content04 .main_wrap {
		flex-direction: row-reverse;
	}
	.point_wrap.content04 .bottom_wrap {
		height: 28vw;
	}
	.point_wrap.content04 .bottom_wrap .img01 {
		width: 30%;
        margin-left: -40%;
	}
	.point_wrap.content04 .bottom_wrap .text01 {
        width: 35%;
        margin-left: -5%;
        top: 4vw;
	}

	.point_wrap.content05 .bottom_wrap {
		height: 36vw;
	}
	.point_wrap.content05 .bottom_wrap .img01 {
        width: 28%;
        margin-left: 4%;
	}
	.point_wrap.content05 .bottom_wrap .img02 {
        width: 24%;
        margin-left: -26%;
        top: 8vw;
	}
	
}
@media print, screen and (min-width: 1281px) {
}