@charset "UTF-8";
/* CSS Document */

.mv__title_s {
	margin-bottom: 0;
}
.result__title {
	margin-bottom: 2em;
	padding: 0.25em 1em;
	line-height: 1.5;
	font-size: 1.25em;
	background-color: rgba(255,255,255,0.7);
	background-image: url("../img/result/bg_result1.png"), url("../img/result/bg_result2.png"), url("../img/result/bg_result3.png"), url("../img/result/bg_result4.png");
	background-position: 0 0, 0 100%, 100% 100%, 100% 0;
	background-size: 30px;
	background-repeat: no-repeat;
}
.result__title span {
	font-family: "こぶりなゴシック W6 JIS2004", "Koburina Gothic W6 JIS2004", "中ゴシックBBB", "Gothic Medium BBB";
	font-size: 4em;
	font-style: italic;
	font-weight: bold;
}
.result__type {
	display: flex;
	justify-content: space-between;
	gap: 0.5em;
	margin: 0 1em 1em;
}
.result__type-each {
	width: 7em;
	flex-shrink: 0;
	font-size: 0.75em;
	color: #dfdfdf;
}
.result__type-each span {
	display: block;
	font-family: "こぶりなゴシック W6 JIS2004", "Koburina Gothic W6 JIS2004", "中ゴシックBBB", "Gothic Medium BBB";
	font-size: 3.5em;
	font-style: italic;
	font-weight: bold;
}
.result__type-each.on {
	color: inherit;
}
/*.color */
.type__INTJ .on span {color: #6d5a8d;}
.type__INTP .on span {color: #5a7d9a;}
.type__ENTJ .on span {color: #8c1e3f;}
.type__ENTP .on span {color: #8ac926;}
.type__INFJ .on span {color: #a6a1d6;}
.type__INFP .on span {color: #d9a5b3;}
.type__ENFJ .on span {color: #a64253;}
.type__ENFP .on span {color: #f4c542;}
.type__ISTJ .on span {color: #6b7280;}
.type__ISFJ .on span {color: #bfa58a;}
.type__ESTJ .on span {color: #b5472a;}
.type__ESFJ .on span {color: #e6728e;}
.type__ISTP .on span {color: #568ea6;}
.type__ISFP .on span {color: #88a67d;}
.type__ESTP .on span {color: #00b2a9;}
.type__ESFP .on span {color: #ff6b4a;}

.result__type-text {
	position: relative;
	flex: 1;
	line-height: 1.3;
}
.result__type-text::before, 
.result__type-text::after {
	content: '';
	position: absolute;
	display: block;
}
.result__type-text::before {
	bottom: 2.25em;
	left: -0.5em;
	width: calc(100% + 1em);
	height: 1px;
	background: #bfbfbf;
}
.result__type-text::after {
	bottom: calc(1.75em + 1px);
	width: 1em;
	height: 1em;
	border-radius: 50%;
	background: #bfbfbf;
}
.result__type-text.is-left::after {
	left: -1em;
}
.result__type-text.is-right::after {
	right: -1em;
}
/*.color */
.type__INTJ .result__type-text::after {background: #6d5a8d;}
.type__INTP .result__type-text::after {background: #5a7d9a;}
.type__ENTJ .result__type-text::after {background: #8c1e3f;}
.type__ENTP .result__type-text::after {background: #8ac926;}
.type__INFJ .result__type-text::after {background: #a6a1d6;}
.type__INFP .result__type-text::after {background: #d9a5b3;}
.type__ENFJ .result__type-text::after {background: #a64253;}
.type__ENFP .result__type-text::after {background: #f4c542;}
.type__ISTJ .result__type-text::after {background: #6b7280;}
.type__ISFJ .result__type-text::after {background: #bfa58a;}
.type__ESTJ .result__type-text::after {background: #b5472a;}
.type__ESFJ .result__type-text::after {background: #e6728e;}
.type__ISTP .result__type-text::after {background: #568ea6;}
.type__ISFP .result__type-text::after {background: #88a67d;}
.type__ESTP .result__type-text::after {background: #00b2a9;}
.type__ESFP .result__type-text::after {background: #ff6b4a;}

.result__text {
	margin-bottom: 6em;
}
.result__recommend {
	z-index: 1;
	position: relative;
	margin-bottom: 4em;
}
.result__recommend::before {
	z-index: -1;
	content: '';
	position: absolute;
	display: block;
	top: -30px;
	left: 0;
	width: 100%;
	height: 20%;
	background: #f5f2e8;
}
.result__recommendlist {
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
}
.result__recommendlist li {
	width: calc(50% - 1em);
}
.result__recommendlist li > div {
	font-family: "こぶりなゴシック W6 JIS2004", "Koburina Gothic W6 JIS2004", "中ゴシックBBB", "Gothic Medium BBB";
	font-size: 2.5em;
	font-style: italic;
	font-weight: bold;
}
.result__recommendlist li > figure {
	max-width: 120px;
	margin: 0 auto 1.5em;
}
.result__recommendlist li > h3 {
	margin-bottom: 0.5em;
}
.result__recommendlist li > p {
	text-align: left;
}
.result__sns {
	margin-bottom: 3.5em;
	padding-top: 2em;
	padding-bottom: 2em;
	background: #f5f2e8;
}
.result__snsinner {
	margin-bottom: 1em;
	padding: 1em;
	border: solid 1px #aabcb0;
	background: #fff;
}
.result__snslogo {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2em;
}
img.ex_insta {
	position: relative;
	top: -2px;
	width: 1.5em;
	margin-right: 0.75em;
	vertical-align: middle;
}
.btn.btn_check {
	background-color: #ebebeb;
}
.btn.btn_check::after {
	content: none;
}
.btn.btn_workshop {
	font-size: 0.95em;
}

@media screen and (max-width: 767px) {

	.result__type {
		gap: 0.5em;
		margin: 0 -1.5em 1em;

	}
	.result__type-each {
		width: 7em;
	}
	.result__recommend::before {
		height: 11em;
	}

}