@charset "UTF-8";

/* PC */
@media only screen and (min-width: 768px) {
	.coverImgWrap {
		position: relative;
		width: 100%;
		height: 442px;
		background-image: url(/platinum/service/membersselection/images/kv_pc.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}

	.coverImgWrap .coverInner {
		position: relative;
		max-width: 1920px;
		height: 100%;
		margin: 0 auto;
	}

	.coverImgWrap .coverTxtBox {
		position: absolute;
		width: 708px;
		top: 131px;
		left: 16.6%;
		padding: 27px 0 21px;
		text-align: center;
		background-color: rgba(255, 255, 255, 0.6);
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(1) {
		font-size: 32px;
		font-weight: 700;
		line-height: 33px;
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(1)::after {
		content: '';
		display: block;
		width: 414px;
		height: 2px;
		margin: 11px auto 0;
		background-color: #000000;
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(2) {
		margin-top: 30px;
		font-size: 18px;
		font-weight: 700;
		line-height: 30px;
		word-break: keep-all;
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(2) br:nth-of-type(2) {
		display: none;
	}

	.anchorWrap .blockInner {
		padding: 28px 0 20px;
	}

	.anchorWrap .glyphArrowCircleBottom,
	.anchorWrap .glyphArrowCircleBottom > span:before {
		color: #ffffff;
	}

	.choiceWrap {
		background-color: #242424;
	}

	.choiceWrap .blockInner.ttlBlock {
		padding: 72px 0 29px;
	}

	.choiceWrap .hStyle01 {
		margin-bottom: 0;
		font-size: 32px;
		font-weight: 700;
		line-height: 46px;
		color: #ffffff;
	}

	.choiceWrap .hStyle01 + .listMemo01 li {
		margin-bottom: 0;
		text-align: right;
		color: #ffffff;
	}

	.choiceWrap .blockInner.flexBlock {
		padding: 0 0 40px;
	}

	.choiceWrap .flexWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 40px;
	}

	.choiceWrap .flexWrap .flexBox {
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		width: 100%;
		max-width: 373px;
		color: #000000;
		user-select: none;
	}

	.choiceWrap .flexWrap .flexBox .imgWrap {
		position: relative;
		display: block;
		width: 100%;
	}

	.choiceWrap .flexWrap .flexBox .imgWrap .img_sp,
	.choiceWrap .flexWrap .flexBox .imgWrap .br_sp {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .tagTxt {
		position: absolute;
		min-width: 186px;
		padding: 7px 10px 6px;
		top: 0;
		left: 0;
		font-size: 24px;
		font-weight: 700;
		line-height: 25px;
		text-align: center;
		color: #ffffff;
		background-color: #CBA436;
	}

	.choiceWrap .flexWrap .flexBox:nth-of-type(4) .tagTxt br {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt {
		position: absolute;
		display: flex;
		align-items: center;
		width: 100%;
		padding: 8px 0 8px 20px;
		bottom: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.6);
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt::before {
		content: '';
		display: inline-flex;
		width: 8px;
		height: 13px;
		margin-right: -20px;
		background-image: url(/platinum/service/membersselection/images/img_flexbox_arrow.png);
		background-repeat: no-repeat;
		background-size: cover;
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap .flexBox:nth-of-type(3) .ttlTxt br,
	.choiceWrap .flexWrap .flexBox:nth-of-type(4) .ttlTxt br,
	.choiceWrap .flexWrap .flexBox:nth-of-type(7) .ttlTxt br {
		display: none;
	}

	.choiceWrap .flexWrap div.flexBox .ttlTxt {
		padding-left: 0;
	}

	.choiceWrap .flexWrap div.flexBox .ttlTxt::before {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt span {
		display: inline-flex;
		justify-content: center;
		width: 100%;
		font-size: 24px;
		font-weight: 700;
		line-height: 25px;
		text-align: center;
		color: #ffffff;
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap a.flexBox:hover .ttlTxt {
		background-color: rgba(255, 255, 255, 0.6);
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap a.flexBox:hover .ttlTxt::before {
		background-image: url(/platinum/service/membersselection/images/img_flexbox_arrow_black.png);
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap a.flexBox:hover .ttlTxt span {
		color: #000000;
		transition: ease-in-out 0.2s;
	}

	.choiceWrap .flexWrap .flexBox .txtWrap {
		padding: 10px;
		min-height: 110px;
		font-size: 18px;
		font-weight: 500;
		line-height: 30px;
		background-color: #ffffff;
	}
}

/* SP */
@media only screen and (max-width: 767px) {
	.coverImgWrap {
		padding: 10px 18px 80px;
		background-image: url(/platinum/service/membersselection/images/kv_sp.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}

	.coverImgWrap .coverTxtBox {
		width: 100%;
		margin: 0 auto;
		padding: 10px 15px;
		text-align: center;
		background-color: rgba(255, 255, 255, 0.6);
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(1) {
		font-size: 22px;
		font-weight: 700;
		line-height: 33px;
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(1)::after {
		content: '';
		display: block;
		width: 100%;
		height: 1px;
		margin-top: 5px;
		background-color: #000000;
	}

	.coverImgWrap .coverTxtBox p:nth-of-type(2) {
		margin-top: 10px;
		font-size: 14px;
		font-weight: 700;
		line-height: 22px;
		word-break: keep-all;
	}

	.anchorWrap .blockInner {
		padding: 20px 10px;
	}

	.anchorWrap .glyphArrowCircleBottom,
	.anchorWrap .glyphArrowCircleBottom > span:before {
		color: #ffffff;
	}

	.choiceWrap {
		background-color: #242424;
	}

	.choiceWrap .blockInner.ttlBlock {
		padding: 36px 10px 30px;
	}

	.choiceWrap .hStyle01 {
		margin-bottom: 10px;
		font-size: 22px;
		font-weight: 700;
		line-height: 33px;
		color: #ffffff;
	}

	.choiceWrap .hStyle01 + .listMemo01 li {
		margin-bottom: 0;
		text-align: right;
		color: #ffffff;
	}

	.choiceWrap .blockInner.flexBlock {
		padding: 0 10px 40px;
	}

	.choiceWrap .flexWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 50px 15px;
	}

	.choiceWrap .flexWrap .flexBox {
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		width: 100%;
		max-width: 170px;
		color: #000000;
	}

	.choiceWrap .flexWrap .flexBox .imgWrap {
		position: relative;
		display: block;
		width: 100%;
	}

	.choiceWrap .flexWrap .flexBox .imgWrap .img_pc,
	.choiceWrap .flexWrap .flexBox .imgWrap .br_pc {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .tagTxt {
		position: absolute;
		padding: 3px 10px 2px;
		top: 0;
		left: 0;
		font-size: 16px;
		font-weight: 700;
		line-height: 25px;
		color: #ffffff;
		background-color: #CBA436;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt {
		position: absolute;
		display: flex;
		align-items: center;
		width: 100%;
		padding: 8px 0 8px 8px;
		bottom: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.6);
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt::before {
		content: '';
		display: inline-flex;
		width: 8px;
		height: 13px;
		background-image: url(/platinum/service/membersselection/images/img_flexbox_arrow.png);
		background-repeat: no-repeat;
		background-size: cover;
	}

	.choiceWrap .flexWrap div.flexBox .ttlTxt::before {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt span {
		display: inline-flex;
		justify-content: center;
		width: 154px;
		font-size: 16px;
		font-weight: 700;
		line-height: 25px;
		text-align: center;
		color: #ffffff;
	}

	.choiceWrap .flexWrap .flexBox .txtWrap {
		padding: 10px 6px;
		min-height: 145px;
		font-size: 16px;
		font-weight: 500;
		line-height: 25px;
		background-color: #ffffff;
	}
}

@media only screen and (max-width: 374px) {	
	.choiceWrap .flexWrap {
		gap: 15px;
	}

	.choiceWrap .flexWrap .flexBox {
		max-width: 340px;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt span {
		width: 100%;
	}

	.choiceWrap .flexWrap .flexBox .ttlTxt span br {
		display: none;
	}

	.choiceWrap .flexWrap .flexBox .txtWrap {
		min-height: unset;
	}
}