@charset "utf-8";

/***************************************************************************
*
* INDEX STYLE
*
***************************************************************************/
#content {
	background: #ffffff;
	padding: 82px 0 24px;
}
.main {
	height: calc(100vh - 194px);
	position: relative;
}
.main .mainPhoto {
	height: 100%;
}
.main .mainPhoto img {
	width: 100%;
	height: 100%;
    aspect-ratio: 1920 / 883;
    object-fit: cover;
    object-position: bottom;
}
.main .numberMainTop {
	position: absolute;
	bottom: 0;
	width: clamp(180px, 23.3vw, 477px);
	right: clamp(20px, 10vw, 192px);
}

.main .numberMainTop a {
	display: block;
}
.main .numberMainTop a img {
    aspect-ratio: 447/386;
    width: 100%;
    object-fit: contain;
    object-position: center;
}
.areaNewsTop {
    margin-bottom: 75px;
}
.areaNewsTop .inner {
    max-width: 945px;
}
.areaNewsTop .wrapNewsTop {}
.areaNewsTop .wrapNewsTop .listNewsTop {
    margin-top: 18px;
}
.areaNewsTop .wrapNewsTop .listNewsTop li {}
.areaNewsTop .wrapNewsTop .listNewsTop li:last-child {}
.areaNewsTop .wrapNewsTop .listNewsTop li a {
	display: flex;
	padding: 22px 0 14px;
	border-bottom: 1px solid #696969;
}

.areaNewsTop .wrapNewsTop .listNewsTop li:first-child a {
	padding-top: 0;
}
.areaNewsTop .wrapNewsTop .listNewsTop li a .timeNewsTop {
	font-size: 16px;
	font-weight: bold;
	color: #50B482;
	width: 90px;
	padding-right: 10px;
}
.areaNewsTop .wrapNewsTop .listNewsTop li a .titleNewsTop {
	font-size: 16px;
	font-weight: bold;
	width: calc(100% - 90px);
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-align: justify;
}

/*areaLicenceTop*/
.areaLicenceTop {
    margin-bottom: 80px;
}
.areaLicenceTop .inner {
    max-width: initial;
    padding: 0;
}
.areaLicenceTop .wrapLicenceTop {}
.areaLicenceTop .wrapLicenceTop .listLicenceTop {
	display: flex;
	justify-content: space-between;
	margin-top: 41px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li {
	width: 50%;
	position: relative;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) {}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .licenceTopPhoto {
	width: 100%;
	position: relative;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .licenceTopPhoto img {
	width: 100%;
	aspect-ratio: 964 / 410;
	object-fit: cover;
	object-position: center;
	min-height: 411px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence {
	position: absolute;
	width: 38%;
	min-width: 240px;
	top: 50%;
	transform: translateY(-50%);
	right: 27px;
	background: rgba(80, 180, 130, 0.7);
	padding: 53px 10px 64px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence {
	background: rgba(239, 83, 80, 0.6);
	right: initial;
	left: 26px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence:after {
	content: "";
	position: absolute;
	background: transparent;
	border: 1px solid #ffffff;
	width: 88.5%;
	height: 88.5%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence:before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-left: 63px solid transparent;
	border-right: 0px solid transparent;
	border-bottom: 63px solid #ffffff;
	right: 20px;
	bottom: 21px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .titleItemLicenTop {
	font-size: clamp(40px, 4.6vw, 87px);
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	margin-bottom: 14px;
	line-height: 1.1;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop {
	width: 180px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a {
	display: block;
	width: 100%;
	background: #ffffff;
	border-radius: 33px;
	padding: 10px 10px;
	font-size: 15px;
	font-weight: bold;
	color: #50B482;
	text-align: center;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence .linkLicenceTop a {
	color: #EF5350;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a .txtLinkLicenceTop {
	position: relative;
	padding-right: 30px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a .txtLinkLicenceTop:after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 11px solid #50B482;
	top: 56%;
	transform: translateY(-50%);
	right: 1px;
}
.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence .linkLicenceTop a .txtLinkLicenceTop:after {
    border-left-color: #EF5350;
}
/*areaCourseTop*/
.areaCourseTop {
    margin-bottom: 119px;
}
.areaCourseTop .inner {
    max-width: 1392px;
}
.areaCourseTop .wrapCourseTop {}
.areaCourseTop .wrapCourseTop .listCourseTop {
	display: flex;
	flex-wrap: wrap;
	margin-top: 24px;
}
.areaCourseTop .wrapCourseTop .listCourseTop li {
	width: calc((100%/4) - 14px);
	margin-right: 18px;
}
.areaCourseTop .wrapCourseTop .listCourseTop li:nth-child(4n),
.areaCourseTop .wrapCourseTop .listCourseTop li:last-child {
	margin-right: 0;
}
.areaCourseTop .wrapCourseTop .listCourseTop li a {
	display: block;
	position: relative;
	border-radius: 20px;
	overflow: hidden;
}

.areaCourseTop .wrapCourseTop .listCourseTop li a .boxCourseTop {
	position: relative;
}

.areaCourseTop .wrapCourseTop .listCourseTop li a .boxCourseTop:after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-left: clamp(60px, 7vw, 134px) solid transparent;
	border-right: 0px solid transparent;
	border-bottom: clamp(60px, 7vw, 134px) solid #FFD800;
	right: 0;
	bottom: 0;
	z-index: 1;
}
.areaCourseTop .wrapCourseTop .listCourseTop li a:before {
	content: "";
	position: absolute;
	background: url('../images/index/icon-triangle.svg') no-repeat;
	background-size: 100%;
	width: clamp(20px, 1.8vw, 34px);
	height: clamp(23px, 2vw, 37px);
	bottom: clamp(7px, 0.8vw, 16px);
	right: clamp(7px, 0.8vw, 16px);
	z-index: 2;
}
.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto {}

.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto:before {
	content: "";
	position: absolute;
	background: rgba(0, 0, 0, 0.42);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
}
.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto img {
	width: 100%;
	aspect-ratio: 319 / 185;
	object-fit: cover;
	object-position: center;
	transition: transform .36s;
}
.areaCourseTop .wrapCourseTop .listCourseTop li a .titleCourseTop {
	font-size: clamp(20px, 1.6vw, 29px);
	font-weight: bold;
	text-align: center;
	color: #ffffff;
	position: absolute;
	top: 51%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
	z-index: 1;
}

.areaCourseTop .wrapCourseTop .listCourseTop li:first-child a .titleCourseTop {
    left: 42%;
}

.areaCourseTop .wrapCourseTop .listCourseTop li a .titleCourseTop .numberCourseTop {
	font-size: clamp(16px, 1.2vw, 23px);
	font-weight: bold;
	display: inline-block;
	background: #ffffff;
	padding: 4px 20px;
	border-radius: 25px;
	color: #000000;
	margin-top: 6px;
}

/*areaPlanTop*/
.areaPlanTop {
	margin-bottom: 83px;
}
.areaPlanTop .inner {
    max-width: 100%;
    padding: 0;
}
.areaPlanTop .wrapPlanTop {}
.areaPlanTop .wrapPlanTop .iframePlanTop {
    background: #50B482;
    margin-top: 18px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop {
	display: flex;
    justify-content: space-between;
    padding: 42px 30px 46px;
    max-width: 845px;
    margin: 0 auto;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .planPhoto {
	width: 300px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .planPhoto img {
	width: 100%;
	aspect-ratio: 300 / 300;
	object-fit: cover;
	object-position: center;
	border-radius: 20px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop {
	width: calc(100% - 372px);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 30px 0 23px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .txtPlanTop {
	font-size: 16px;
	font-weight: 500;
	text-align: justify;
	color: #ffffff;
	margin-bottom: 30px;
	line-height: 1.75;
	letter-spacing: 0;
	padding: 0 0 0 3px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop {
	width: 200px;	
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a {
	display: block;
	width: 100%;
	padding: 9px 10px 10px;
	font-size: 18px;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	border-radius: 25px;
	background: linear-gradient(90deg,rgba(255, 216, 0, 1) 0%, rgba(250, 170, 28, 1) 30%, rgba(240, 83, 79, 1) 70%, rgba(240, 83, 79, 1) 100%);
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a .txtLinkPlanTop {
	position: relative;
	padding-right: 35px;
}
.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a .txtLinkPlanTop:after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	border-left: 12px solid #ffffff;
	top: 56%;
	transform: translateY(-50%);
	right: 4px;
}

/*areaBannerTop*/
.areaBannerTop {}
.areaBannerTop .inner {
    max-width: 1462px;
}
.areaBannerTop .listBannerTop {
	display: flex;
	align-items: center;
}
.areaBannerTop .listBannerTop li {
	width: calc((100%/3) - 27px);
	margin-right: 40px;
}

.areaBannerTop .listBannerTop li:first-child {
	margin-top: -36px;
}
.areaBannerTop .listBannerTop li:nth-child(3n),
.areaBannerTop .listBannerTop li:last-child {
	margin-right: 0;
}
.areaBannerTop .listBannerTop li a {
	display: block;
}
.areaBannerTop .listBannerTop li a img {
	width: 100%;
	aspect-ratio: 439/235;
	object-fit: contain;
	object-position: center;
	border-radius: 20px;
}
@media (max-width: 1050px) and (min-width: 769px) {
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop {
		width: calc(100% - 332px);
	}

	.areaBannerTop .listBannerTop li {
		width: calc((100% / 3) - 0.3vw);
        margin-right: 1vw;
	}
}
@media (max-width: 1000px) and (min-width: 769px) {
	.main {
	    height: calc(100vh - clamp(99.5px, 11.9vw, 119px) - clamp(67px, 7.1vw, 71.5px));
	}
}
@media (max-width: 940px) and (min-width: 769px) {
	.areaLicenceTop .wrapLicenceTop .listLicenceTop {
		flex-direction: column;
	}

	.areaLicenceTop .wrapLicenceTop .listLicenceTop li {
		width: 100%;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop {
		justify-content: space-between;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li {
		width: 48%;
		margin-right: 0;
		margin-bottom: 4%;
	}

	.areaBannerTop .listBannerTop {
		flex-direction: column;
	}

	.areaBannerTop .listBannerTop li {
		width: 440px;
		margin-right: 0;
		margin-bottom: 30px;

	}

	.areaBannerTop .listBannerTop li a img {
		aspect-ratio: inherit;
	}
}

@media(min-width: 769px) {

	.numberMainTop a:hover {
		opacity: 0.8;
	}
	.areaNewsTop .wrapNewsTop .listNewsTop li a:hover .timeNewsTop {
		color: #EF5350;
	}
	.areaNewsTop .wrapNewsTop .listNewsTop li a:hover .titleNewsTop {
		color: #EF5350;
	}

	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a:hover {
		background: #50B482;
		color: #ffffff;
	}

	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a:hover .txtLinkLicenceTop:after {
		filter: brightness(0) invert(1);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2) .boxLicence .linkLicenceTop a:hover {
		background: #EF5350;
		color: #ffffff;
	}

	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2) .boxLicence .linkLicenceTop a:hover .txtLinkLicenceTop:after {
		filter: brightness(0) invert(1);
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a:hover .courseTopPhoto img {
        transform: scale(1.08);
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li a:hover .boxCourseTop:after {
		border-bottom-color: #50B482;
	}

	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a:hover {
		background: rgba(255, 216, 0, 1);
		color: #000000;
	}

	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a:hover .txtLinkPlanTop:after {
		filter: brightness(0%);
	}
}

@media (max-width: 768px) {
	.main {
	    /* height: calc(100vh - clamp(49.5px, 12.2vw, 93px)); */
		height: inherit;
	}

	.main .mainPhoto img {
		aspect-ratio: 375 / 220;
	}

	.main .numberMainTop {
		width: clamp(101px, 26.9vw, 210px);
	    right: clamp(40px, 10.6vw, 60px);
	}

	#content {
	    padding: 5.3vw 0 6.2vw;
	}

	.areaNewsTop {
	    margin-bottom: 7.7vw;
	}


	.areaNewsTop .inner {
		padding: 0 10.6%;
	}
	.areaNewsTop .wrapNewsTop .listNewsTop {
	    margin-top: 2.7vw;
	}
	.areaNewsTop .wrapNewsTop .listNewsTop li {}
	.areaNewsTop .wrapNewsTop .listNewsTop li a {
		flex-direction: column;
		padding: 3.3vw 0 0.4vw;
	}

	.areaNewsTop .wrapNewsTop .listNewsTop li a .timeNewsTop {
		width: 100%;
		font-size: clamp(14px, 3.7vw, 18px);
		padding-right: 0;
		margin-bottom: 0.1vw;
	}

	.areaNewsTop .wrapNewsTop .listNewsTop li a .titleNewsTop {
		width: 100%;
		font-size: clamp(15px, 3.8vw, 20px);
		-webkit-line-clamp: 2;
		line-height: 1.4;
	}
/*areaLicenceTop*/
	.areaLicenceTop {
	    margin-bottom: 38px;
	}
	.areaLicenceTop .inner {
	    max-width: initial;
	    padding: 0;
	}
	.areaLicenceTop .wrapLicenceTop {}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop {
		flex-direction: column;
		margin-top: 5vw;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li {
		width: 100%;
		margin-bottom: 4.6vw;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: rgba(80, 180, 130, 0.7);
		padding: 2.4vw 0;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) {
		margin-bottom: 0;
		background: rgba(239, 83, 80, 0.6);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .licenceTopPhoto {
		width: 46%;
		z-index: 1;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .licenceTopPhoto img {
		aspect-ratio: 172/90;
		border-radius: 0 20px 20px 0;
		min-height: initial;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence {
		position: initial;
		width: 52.5%;
		background: transparent;
		transform: none;
		padding: 0;
		z-index: 1;
		padding: 11px 11px 0 0;
		min-width: initial;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence {
		background: transparent;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence:after {
		display: none;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence:before {
		display: none;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .titleItemLicenTop {
		margin-bottom: 8px;
		line-height: 1.1;
		font-size: clamp(28px, 7.4vw, 40px);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop {
		width: clamp(128px, 34vw, 180px);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a {
		border-radius: 33px;
		padding: 0.9vw 1vw 1.1vw 1vw;
		font-size: clamp(14px, 3.7vw, 18px);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence .linkLicenceTop a {
		color: #EF5350;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a .txtLinkLicenceTop {
		padding-right: clamp(15px, 4.2vw, 20px);
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .boxLicence .linkLicenceTop a .txtLinkLicenceTop:after {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-top: 6px solid transparent;
		border-bottom: 6px solid transparent;
		border-left: 11px solid #50B482;
		top: 56%;
		transform: translateY(-50%);
		right: 1px;
	}
	.areaLicenceTop .wrapLicenceTop .listLicenceTop li:nth-child(2n) .boxLicence .linkLicenceTop a .txtLinkLicenceTop:after {
	    border-left-color: #EF5350;
	}

	.areaLicenceTop .wrapLicenceTop .listLicenceTop li .txtLicence {
		font-size: clamp(76px, 20.2vw, 124px);
		font-weight: 800;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		-webkit-text-stroke: 1px #fff;
		color: transparent;
		position: absolute;
		bottom: -12px;
		bottom: -3.3vw;
		bottom: clamp(-12px, -3.3vw, 0px);
		left: 50%;
		transform: translateX(-50%);
		line-height: 1;
		z-index: 0;
	}

	/*areaCourseTop*/
	.areaCourseTop {
	    margin-bottom: 40px;
	}
	.areaCourseTop .inner {
	    max-width: 1392px;
	}
	.areaCourseTop .wrapCourseTop {}
	.areaCourseTop .wrapCourseTop .listCourseTop {
		margin-top: 1vw;
		justify-content: space-between;
		width: 77%;
		margin: 1vw auto 0;
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li {
		width: 46.8%;
		margin-right: 0;
		margin-bottom: 21px;
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li:nth-child(4n),
	.areaCourseTop .wrapCourseTop .listCourseTop li:last-child {
		margin-right: 0;
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a {
		overflow: hidden;
		border-radius: 50% 50% 17% 50%;
		aspect-ratio: 1/1;
		background: #FFD800;
		padding: 10px 10px;
		padding: 2.7vw 2.7vw;
		display: block;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li a .boxCourseTop:after {
		display: none;	
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a:before {
		width: clamp(16px, 4.2vw, 34px);
		height: clamp(19px, 5vw, 37px);
		right: clamp(5px, 1.3vw, 16px);
		bottom: clamp(5px, 1.3vw, 15px);
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto {
	    aspect-ratio: 1/1;
	    border-radius: 50%;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto:before {
		content: "";
		position: absolute;
		background: rgba(0, 0, 0, 0.42);
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		border-radius: 50%;
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a .courseTopPhoto img {
		width: 100%;
		aspect-ratio: 1/1;
		object-fit: cover;
		object-position: center;
		border-radius: 50%;
	}
	.areaCourseTop .wrapCourseTop .listCourseTop li a .titleCourseTop {
		font-size: clamp(14px, 3.7vw, 22px);
		top: 47%;
		width: 94%;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li:first-child a .titleCourseTop {
		left: 50%;
	}

	.areaCourseTop .wrapCourseTop .listCourseTop li a .titleCourseTop .numberCourseTop {
		font-size: clamp(14px, 3.7vw, 18px);
		padding: 1px 14px;
		border-radius: 25px;
		margin-top: 4px;
	}

	/*areaPlanTop*/
	.areaPlanTop {
		margin-bottom: 0.5vw;
	}
	.areaPlanTop .inner {
	    max-width: 100%;
	    padding: 0;
	}
	.areaPlanTop .wrapPlanTop {}
	.areaPlanTop .wrapPlanTop .iframePlanTop {
	    margin-top: 1.6vw;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop {
		flex-direction: column;
		padding: 5.5vw 10.1vw 9.6vw;
		max-width: 785px;
		margin: 0 auto;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .planPhoto {
		width: clamp(194px, 51.6vw, 280px);
		margin: 0 auto 13px;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .planPhoto img {
		width: 100%;
		aspect-ratio: 300 / 300;
		object-fit: cover;
		object-position: center;
		border-radius: 20px;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop {
		width: 100%;
		justify-content: initial;
		padding: 0;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .txtPlanTop {
		font-size: clamp(14px, 3.7vw, 18px);
		margin-bottom: 4vw;
		line-height: 2.35;
		letter-spacing: 0;
		padding: 0 0 0 3px;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop {
		width: clamp(147px, 39.4vw, 220px);
		margin: 0 auto;
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a {
		padding: clamp(9px, 2.3vw, 12px) clamp(10px, 2vw, 15px) clamp(9px, 2.5vw, 13px);
		font-size: clamp(14px, 3.7vw, 18px);
		border-radius: 25px;
		background: linear-gradient(90deg,rgba(255, 216, 0, 1) 0%, rgba(250, 170, 28, 1) 30%, rgba(240, 83, 79, 1) 70%, rgba(240, 83, 79, 1) 100%);
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a .txtLinkPlanTop {
		position: relative;
		padding-right: clamp(22.5px, 6vw, 35px);
	}
	.areaPlanTop .wrapPlanTop .boxPlanTop .contentPlanTop .linkPlanTop a .txtLinkPlanTop:after {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-top: 1.4vw solid transparent;
		border-bottom: 1.4vw solid transparent;
		border-left: 2.4vw solid #ffffff;
		top: 56%;
		transform: translateY(-50%);
		right: 0.3vw;
	}

	/*areaBannerTop*/
	.areaBannerTop {}
	.areaBannerTop .inner {
	padding: 0 10.8%;
	}
	.areaBannerTop .listBannerTop {
		flex-direction: column;
	}
	.areaBannerTop .listBannerTop li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 6.2vw;
	}

	.areaBannerTop .listBannerTop li:first-child {
		margin-top: 0;
	}
	.areaBannerTop .listBannerTop li:last-child {
		margin-bottom: 0;
	}
	.areaBannerTop .listBannerTop li a {
		display: block;
	}
	.areaBannerTop .listBannerTop li a img {
		aspect-ratio: inherit;
		border-radius: 0;
	}
}