/*index page*/
#personality_types_index #page_main .title_section{ padding: 20px 0; }
#personality_types_index #page_main .title_section .title_inner{ display: flex; align-items: center; justify-content: center; }
#personality_types_index #page_main .title_section .title_inner .title{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); color: #343c4b; font-size: var(--font-h1-size-bp-sm); line-height: var(--font-h1-line-height-bp-sm); letter-spacing: var(--font-h1-spacing-bp-sm); }
@media (min-width: 768px) {
	#personality_types_index #page_main .title_section{ padding: 30px 0; }
	#personality_types_index #page_main .title_section .title_inner .title{ font-size: var(--font-h1-size-bp-md); line-height: var(--font-h1-line-height-bp-md); letter-spacing: var(--font-h1-spacing-bp-md); }
}
@media (min-width: 1200px) {
	#personality_types_index #page_main .title_section{ padding: 45px 0; }
}

#personality_types_index #page_main .type_section{margin-bottom: 60px;}
#personality_types_index #page_main .type_section .type_group { padding: 30px 15px 40px; position: relative;scroll-margin-top: 60px; }
#personality_types_index #page_main .type_section .type_group.analysts{scroll-margin-top: 0;}
#personality_types_index #page_main .type_section .type_group .type_list { display: flex; align-items: flex-start; justify-content: center; flex-wrap: wrap; position: relative; z-index: 3; }
#personality_types_index #page_main .type_section .type_group .type_list .type_item { display: flex; align-items: center; justify-content: center; flex-direction: column; text-decoration: none; outline: 0; transition: all .1s ease-in-out; margin-bottom: 30px; width: 100%; }
#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_image img { display: block; max-width: unset; height: 350px; }
#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_title{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); line-height: var(--font-h4-line-height-bp-sm); letter-spacing: var(--font-h4-spacing-bp-sm); font-size: 1.4em; margin: 15px 0 3px; text-align: center; }
#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_code{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); line-height: var(--font-h5-line-height-bp-sm); letter-spacing: var(--font-h5-spacing-bp-sm); margin: 0 0 5px; color: #343c4b; font-size: .9em; }
#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_description{ color: rgb(var(--rgb-gray-10)); line-height: 1.7; text-align: center; font-size: .8em; max-width: 500px; text-wrap: balance; }
#personality_types_index #page_main .type_section .type_group.analysts { background-color: #e7dfea; margin-top: 30px; }
#personality_types_index #page_main .type_section .type_group.analysts:after { content: ""; position: absolute; left: 0; right: 0; bottom: -40px; height: 60px; background-color: #d6ece3; transform: skewY(2deg); z-index: 1; }
#personality_types_index #page_main .type_section .type_group.analysts .background { height: 40px; width: 100%; position: absolute; top: -38px; left: 0; right: 0; }
#personality_types_index #page_main .type_section .type_group.analysts .background polygon { fill: #e7dfea; }
#personality_types_index #page_main .type_section .type_group.analysts .type_list .type_item .type_title { color: #88619a; }
#personality_types_index #page_main .type_section .type_group.diplomats { background-color: #d6ece3; }
#personality_types_index #page_main .type_section .type_group.diplomats:after { content: ""; position: absolute; left: 0; right: 0; bottom: -45px; height: 80px; background-color: #d9eaf0; z-index: 1; transform: skewY(-2deg); }
#personality_types_index #page_main .type_section .type_group.diplomats .type_list .type_item .type_title { color: rgb(var(--rgb-green)); }
#personality_types_index #page_main .type_section .type_group.sentinels { background-color: #d9eaf0; }
#personality_types_index #page_main .type_section .type_group.sentinels:after { content: ""; position: absolute; left: 0; right: 0; bottom: -30px; height: 50px; background-color: #f9eed7; transform: skewY(2deg); z-index: 1; }
#personality_types_index #page_main .type_section .type_group.sentinels .type_list .type_item .type_title { color: rgb(var(--rgb-blue)); }
#personality_types_index #page_main .type_section .type_group.explorers { background-color: #f9eed7; padding-bottom: 0; }
#personality_types_index #page_main .type_section .type_group.explorers:after { content: ""; position: absolute; left: 0; right: 0; bottom: -30px; height: 50px; background-color: #f9eed7; transform: skewY(-2deg); z-index: 1; }
#personality_types_index #page_main .type_section .type_group.explorers .type_list .type_item .type_title { color: rgb(var(--rgb-yellow)); }
@media (min-width: 768px) {
	#personality_types_index #page_main .type_section{margin-bottom: 85px;}
	#personality_types_index #page_main .type_section .type_group { scroll-margin-top: 80px; }
	#personality_types_index #page_main .type_section .type_group .type_list { justify-content: space-between; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item { flex: 0 0 45%; width: auto; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_image img { height: 250px; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_title{ line-height: var(--font-h4-line-height-bp-md); }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_code{ font-size: 1.1em; line-height: var(--font-h5-line-height-bp-md); letter-spacing: var(--font-h5-spacing-bp-md); margin: 0 0 8px; }
	#personality_types_index #page_main .type_section .type_group.analysts{padding-bottom: 60px;}
    #personality_types_index #page_main .type_section .type_group.analysts:after {bottom: -35px; height: 70px; }
	#personality_types_index #page_main .type_section .type_group.diplomats{ padding-bottom: 80px; }
	#personality_types_index #page_main .type_section .type_group.diplomats:after { transform: skewY(-3deg);bottom: -55px; height: 100px; }
	#personality_types_index #page_main .type_section .type_group.sentinels{padding-bottom: 60px;}
	#personality_types_index #page_main .type_section .type_group.sentinels:after {bottom: -35px; height: 70px; }
	#personality_types_index #page_main .type_section .type_group.explorers{padding-bottom: 0;}
	#personality_types_index #page_main .type_section .type_group.explorers:after{ bottom: -40px; height: 75px; }
}
@media (min-width: 1200px) {
	#personality_types_index #page_main .type_section{margin-bottom: 100px;}
	#personality_types_index #page_main .type_section .type_group { scroll-margin-top: 70px; }
    #personality_types_index #page_main .type_section .type_group .type_list .type_item { flex: 0 0 23%; width: 23%; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_image img { height: 450px; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_title{ font-size: 1.4em; margin-top: 20px; }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_code{ line-height: var(--font-h5-line-height-bp-lg); }
	#personality_types_index #page_main .type_section .type_group .type_list .type_item .type_description{ font-size: .9em; padding: 0 15px; }
}

/*detail page*/
/*title_section*/
#personality_types_detail #page_main .title_section{margin-bottom: 50px;position: relative;}
#personality_types_detail #page_main .title_section .title_inner{ max-width: unset; text-align: center; padding: 25px 0 20px; margin: 0 auto; color: #fff; }
#personality_types_detail #page_main .title_section .title_inner .title{ font-size: var(--font-h2-size-bp-sm); line-height: var(--font-h2-line-height-bp-sm); letter-spacing: var(--font-h2-spacing-bp-sm); margin-bottom: 10px; }
#personality_types_detail #page_main .title_section .title_inner .subtitle{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-size: var(--font-h6-size-bp-sm); line-height: var(--font-h6-line-height-bp-sm); letter-spacing: var(--font-h6-spacing-bp-sm); margin-bottom: 10px; color: #36263d; opacity: .7; }
#personality_types_detail #page_main .title_section .title_inner .desc{ font-size: var(--font-p-lg-size-bp-sm); line-height: var(--font-p-lg-line-height-bp-sm); letter-spacing: var(--font-p-lg-spacing-bp-sm); }
#personality_types_detail #page_main .title_section .background { height: 20px; width: 100%; position: absolute; left: 0; right: 0; bottom: -20px;}
#personality_types_detail #page_main .title_section.analysts { background-color: rgb(var(--rgb-purple)); }
#personality_types_detail #page_main .title_section.analysts .background polygon { fill: rgb(var(--rgb-purple)); }
#personality_types_detail #page_main .title_section.diplomats { background-color: rgb(var(--rgb-green)); }
#personality_types_detail #page_main .title_section.diplomats .background polygon { fill: rgb(var(--rgb-green)); }
#personality_types_detail #page_main .title_section.sentinels { background-color: rgb(var(--rgb-blue)); }
#personality_types_detail #page_main .title_section.sentinels .background polygon { fill: rgb(var(--rgb-blue)); }
#personality_types_detail #page_main .title_section.explorers { background-color: rgb(var(--rgb-yellow)); }
#personality_types_detail #page_main .title_section.explorers .background polygon { fill: rgb(var(--rgb-yellow)); }
@media (min-width: 768px) {
	#personality_types_detail #page_main .title_section{margin-bottom: 90px;}
	#personality_types_detail #page_main .title_section .title_inner{ max-width: 768px; padding: 35px 0 15px; }
	#personality_types_detail #page_main .title_section .background { height: 35px;bottom: -35px;}
	#personality_types_detail #page_main .title_section .title_inner .title{ font-size: var(--font-h2-size-bp-md); line-height: var(--font-h2-line-height-bp-md); letter-spacing: var(--font-h2-spacing-bp-md); }
	#personality_types_detail #page_main .title_section .title_inner .subtitle{ font-size: var(--font-h6-size-bp-sm); line-height: var(--font-h6-line-height-bp-sm); letter-spacing: var(--font-h6-spacing-bp-sm); }
	#personality_types_detail #page_main .title_section .title_inner .desc{ font-size: var(--font-p-lg-size-bp-md); line-height: var(--font-p-lg-line-height-bp-md); letter-spacing: var(--font-p-lg-spacing-bp-md); }
}
@media (min-width: 1200px) {
	#personality_types_detail #page_main .title_section{margin-bottom: 120px;}
	#personality_types_detail #page_main .title_section .background { height: 65px;bottom: -65px;}
	#personality_types_detail #page_main .title_section .title_inner .title{ font-size: var(--font-h2-size-bp-lg); line-height: var(--font-h2-line-height-bp-lg); letter-spacing: var(--font-h2-spacing-bp-lg); }
	#personality_types_detail #page_main .title_section .title_inner .subtitle{ font-size: var(--font-h6-size-bp-lg); line-height: var(--font-h6-line-height-bp-lg); letter-spacing: var(--font-h6-spacing-bp-lg); }
	#personality_types_detail #page_main .title_section .title_inner .desc{ line-height: var(--font-p-lg-line-height-bp-lg); }
}
/*type_section*/
#personality_types_detail #page_main .type_section .type_inner{ display: flex;justify-content: center;flex-direction: row;gap: 20px;margin-bottom: 40px; }
#personality_types_detail #page_main .type_section .type_left{display: none;}
#personality_types_detail #page_main .type_section .type_right{display: none;}

#personality_types_detail #page_main .type_section .type_middle .middle_title{ padding-bottom: 10px;margin-bottom: 10px;font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); color: #343c4b; font-size: var(--font-h1-size-bp-sm); line-height: var(--font-h1-line-height-bp-sm); letter-spacing: var(--font-h1-spacing-bp-sm); border-bottom: 1px solid rgb(238 239 241); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_title{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); color: #343c4b; font-size: var(--font-h2-size-bp-sm); line-height: var(--font-h2-line-height-bp-sm); letter-spacing: var(--font-h2-spacing-bp-sm); margin-top: 20px; margin-bottom: 10px; }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_desc{ font-size: var(--font-p-lg-size-bp-sm); line-height: var(--font-p-lg-line-height-bp-sm); letter-spacing: var(--font-p-lg-spacing-bp-sm); margin-bottom: 15px; }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary { margin: 20px 0; padding: 10px 20px; display: flex;gap: 15px;flex-direction: column; border-inline-start: 3px solid #333; }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_desc{ font-size: var(--font-p-lg-size-bp-sm); line-height: var(--font-p-lg-line-height-bp-sm); letter-spacing: var(--font-p-lg-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_title { font-family: var(--font-family-text); color: rgb(var(--rgb-gray-10)); font-size: var(--font-p-md-size-bp-sm); line-height: var(--font-p-md-line-height-bp-sm); letter-spacing: var(--font-p-md-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blue{ background-color: #ecf4f7;border-color: rgb(var(--rgb-blue)); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.green{ background-color: #ebf6f1; border-color: rgb(var(--rgb-green)); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.purple{ background-color: #f3eff5; border-color: rgb(var(--rgb-purple)); }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.yellow{ background-color: #fcf7eb; border-color: rgb(var(--rgb-yellow)) }
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote{ padding: 5px 0 5px 10px;border-color: rgb(var(--rgb-blue));}
#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote .item_summary_desc { font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-size: var(--font-h5-size-bp-sm); line-height: var(--font-h5-line-height-bp-sm); letter-spacing: var(--font-h5-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item{ border-radius: 10px; padding: 20px; width: 100%;box-sizing: border-box; margin-top: 20px; background-color: rgb(243 239 245); display: flex; flex-direction: column; align-items: flex-start; position: relative; overflow: hidden; }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_subtitle{ background-color: rgb(231 223 234); border-radius: 40px; text-transform: uppercase; color: rgba(136, 97, 154, 1); padding: 5px 10px; font-size: var(--font-p-sst-size); line-height: var(--font-p-sst-line-height); letter-spacing: var(--font-p-sst-spacing); font-weight: var(--font-text-bold-weight); margin-bottom: 5px; }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_title{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); color: #343c4b; font-size: var(--font-h5-size-bp-sm); line-height: var(--font-h5-line-height-bp-sm); letter-spacing: var(--font-h5-spacing-bp-sm); margin-bottom: 10px; }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_desc{ font-size: var(--font-p-lg-size-bp-sm); line-height: var(--font-p-lg-line-height-bp-sm); letter-spacing: var(--font-p-lg-spacing-bp-sm); margin-bottom: 10px; }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item .access_button{ vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-family-text); font-weight: var(--font-btn-font-weight); text-decoration: none; text-wrap: balance; color: #fff; cursor: pointer; font-size: var(--font-btn-40-size); line-height: var(--font-btn-40-line-height); letter-spacing: var(--font-btn-40-spacing); height: 40px; padding: 6px 20px; gap: 6px; border-radius: 40px; background-color: #88619a; border-color: #88619a; box-sizing: border-box; }
#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_image{display: none;}

#personality_types_detail #page_main .type_section .type_right .user_personality_results{ width: 100%; position: relative; border-radius: 10px; background-color: #fff; box-shadow: 0 10px 40px rgba(29, 36, 50, .1); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_line { margin: 0; border: none; transform: rotate(360deg); position: absolute; top: 0; left: 0; right: 0; clip-path: polygon(0 0, 100% 0, 100% 40%, 0 40%); height: 10px; width: auto; border-radius: 10px 10px 0 0; }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_line.analysts{ background-color: rgb(var(--rgb-purple)); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_line.diplomats{ background-color: rgb(var(--rgb-green)); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_line.sentinels{ background-color: rgb(var(--rgb-blue)); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_line.explorers{ background-color: rgb(var(--rgb-yellow)); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar{ display: flex;align-items: flex-start; padding: 0 30px 20px; border-bottom: 1px solid rgb(238 239 241); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_img{ display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; border-radius: 80px; background: #ececeb; } 
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail{ margin-inline-start: 20px; }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .detail_title{ font-size: var(--font-p-tn-size-bp-sm); line-height: var(--font-p-tn-line-height-bp-sm); letter-spacing: var(--font-p-tn-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .detail_type{ font-family: var(--font-family-titles); font-weight: var(--font-titles-weight); font-stretch: var(--font-titles-stretch); color: #343c4b; font-size: var(--font-h6-size-bp-sm); line-height: var(--font-h6-line-height-bp-sm); letter-spacing: var(--font-h6-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .type_code{ display: block; color: rgb(var(--rgb-gray-10)); font-weight: var(--font-text-regular-weight); font-family: var(--font-family-text); font-size: var(--font-p-sm-size-bp-sm); line-height: var(--font-p-sm-line-height-bp-sm); letter-spacing: var(--font-p-sm-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits{display:flex;flex-direction:column;gap:0;padding: 20px 30px; border-bottom: 1px solid rgb(238 239 241); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item{margin-bottom: 10px;cursor:pointer;transition:all 0.2s ease;position:relative;}
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item:last-child{margin-bottom: 0;}
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .traits_labels{ display:flex;justify-content:space-between;align-items:center; }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .label_inactive{ font-size: var(--font-p-tn-size-bp-sm); line-height: var(--font-p-tn-line-height-bp-sm); letter-spacing: var(--font-p-tn-spacing-bp-sm); color: rgb(var(--rgb-gray-10)); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .traits_progressbar{position:relative}
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progressbar_text{position: relative;font-weight: var(--font-text-bold-weight); font-family: var(--font-family-text); font-size: var(--font-p-sm-size-bp-sm); line-height: var(--font-p-sm-line-height-bp-sm); letter-spacing: var(--font-p-sm-spacing-bp-sm); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progressbar_text strong{ font-weight: var(--font-text-bold-weight); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progressbar_progress{ margin:6px 0;height:12px;border-radius:12px;overflow:hidden; position:relative;background-color:rgb(238 239 241); }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progress_track{ height:100%;border-radius:12px;transition:width 0.3s ease }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progress_indicator{ position:absolute;top:-2px;width:10px;height:10px;border-radius:50%;border:3px solid #FFFFFF;box-shadow:0px 4px 10px 0px rgba(29,36,50,0.15);transform:translateX(-50%);transition:left 0.3s ease }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_action{ padding: 20px 30px 0; text-align: center; }
#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_action .result_button { font-size: var(--font-p-sm-size-bp-md); line-height: var(--font-p-sm-line-height-bp-md); letter-spacing: var(--font-p-sm-spacing-bp-md); color: rgb(var(--rgb-blue)); }
@media (min-width: 768px) {
	#personality_types_detail #page_main .type_section .type_inner{margin-bottom: 60px;}
	#personality_types_detail #page_main .type_section .type_middle .middle_title{ padding-bottom: 20px;margin-bottom: 20px; font-size: var(--font-h1-size-bp-md); line-height: var(--font-h1-line-height-bp-md); letter-spacing: var(--font-h1-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_middle{ max-width: 760px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_title{ font-size: var(--font-h2-size-bp-md); line-height: var(--font-h2-line-height-bp-md); letter-spacing: var(--font-h2-spacing-bp-md); margin-top: 30px; margin-bottom: 20px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_desc{ font-size: var(--font-p-lg-size-bp-md); line-height: var(--font-p-lg-line-height-bp-md); letter-spacing: var(--font-p-lg-spacing-bp-md); margin-bottom: 20px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary { padding-top: 20px; padding-bottom: 20px; margin-top: 40px; margin-bottom: 40px; gap: 20px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_desc{ font-size: var(--font-p-lg-size-bp-md); line-height: var(--font-p-lg-line-height-bp-md); letter-spacing: var(--font-p-lg-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_title { font-size: var(--font-p-md-size-bp-md); line-height: var(--font-p-md-line-height-bp-md); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote{ padding: 10px 0 10px 20px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote .item_summary_desc { font-size: var(--font-h5-size-bp-md); line-height: var(--font-h5-line-height-bp-md); letter-spacing: var(--font-h5-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item{margin-top: 40px;padding: 30px;}
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_title{ font-size: var(--font-h5-size-bp-md); line-height: var(--font-h5-line-height-bp-md); letter-spacing: var(--font-h5-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_desc{ font-size: var(--font-p-lg-size-bp-md); line-height: var(--font-p-lg-line-height-bp-md); letter-spacing: var(--font-p-lg-spacing-bp-md); margin-bottom: 20px; }

	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .detail_title{ font-size: var(--font-p-tn-size-bp-md); line-height: var(--font-p-tn-line-height-bp-md); }
	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .detail_type{ font-size: var(--font-h6-size-bp-md); line-height: var(--font-h6-line-height-bp-md); letter-spacing: var(--font-h6-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .type_code{ font-size: var(--font-p-sm-size-bp-md); line-height: var(--font-p-sm-line-height-bp-md); letter-spacing: var(--font-p-sm-spacing-bp-md); }
	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .label_inactive{ font-size: var(--font-p-tn-size-bp-md); line-height: var(--font-p-tn-line-height-bp-md); }
	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_traits .traits_item .progressbar_text{ font-size: var(--font-p-sm-size-bp-md); line-height: var(--font-p-sm-line-height-bp-md); letter-spacing: var(--font-p-sm-spacing-bp-md); }
}

@media (min-width: 1200px) {
	#personality_types_detail #page_main .type_section .type_inner{gap: 30px;margin-bottom: 80px;}
	#personality_types_detail #page_main .type_section .type_middle{ max-width: 1000px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_title{ margin-bottom: 40px; font-size: var(--font-h1-size-bp-lg); line-height: var(--font-h1-line-height-bp-lg); letter-spacing: var(--font-h1-spacing-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_title{ font-size: var(--font-h2-size-bp-lg); line-height: var(--font-h2-line-height-bp-lg); letter-spacing: var(--font-h2-spacing-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_desc{ line-height: var(--font-p-lg-line-height-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary { padding-left: 40px; padding-right: 40px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_desc{ line-height: var(--font-p-lg-line-height-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary .item_summary_title { font-size: var(--font-p-md-size-bp-lg); line-height: var(--font-p-md-line-height-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote{ padding: 10px 0 10px 40px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_item .item_summary.blockquote .item_summary_desc { font-size: var(--font-h5-size-bp-lg); line-height: var(--font-h5-line-height-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_title{ font-size: var(--font-h5-size-bp-lg); line-height: var(--font-h5-line-height-bp-lg); margin-bottom: 20px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_desc{ line-height: var(--font-p-lg-line-height-bp-lg); }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .access_button{ font-size: var(--font-btn-50-size); line-height: var(--font-btn-50-line-height); letter-spacing: var(--font-btn-50-spacing); height: 50px; padding: 10px 25px; gap: 8px; }
	#personality_types_detail #page_main .type_section .type_middle .middle_card_item .card_image{position: absolute; opacity: .5; bottom: -80px; inset-inline-end: -80px; inset-inline-start: auto; display: block; }

	#personality_types_detail #page_main .type_section .type_right .user_personality_results{ padding: 34px 0 20px; flex-basis: auto; }
	#personality_types_detail #page_main .type_section .type_right .user_personality_results .results_avatar .avatar_detail .detail_type{ font-size: var(--font-h6-size-bp-lg); line-height: var(--font-h6-line-height-bp-lg); }
}
@media (min-width: 1400px) {
	#personality_types_detail #page_main .type_section .type_left{display: block;max-width: 320px;flex-basis: 20.7792%; }
	#personality_types_detail #page_main .type_section .type_right{max-width: 320px;flex-basis: 20.7792%; display: flex;flex-direction: column;gap: 10px; }
	#personality_types_detail #page_main .type_section .type_middle{ flex-basis: 55%; }
}