/* font �굹�ݵ� �־����*/
.head_phrase { font-family: 'Space Grotesk', 'Pretendard', sans-serif; font-style: normal; font-weight: normal; font-size: 24px; line-height: 130%; color: #211E3D; }
.phrase_comment { font-weight: normal; font-size: 14px; line-height: 130%; color: #8C88A3;}
.content { display: flex; flex-flow: column; align-items: center; background: #FAFAFE;}

/* ���� ��� */
.miriai_top_area { display:flex; flex-flow: column wrap; align-items: center;  width:360px; height: 625px; background: #FFFFFF;}
/* MiriAI �Ͼ� ĵ���� 138x53. height ���� + width:auto �� ��Ⱦ�� �ְ� 0%. */
.header_img { display: block; margin: 21px auto ; height: 35.3px; width: auto;}
.top_phrase { width: 312px; margin-top: 30px; margin-bottom: 24px;}

/* ���� �ϴ� */
.miriai_info_area { width: 360px; display:flex; flex-flow: column wrap; align-items: center; margin-top: 12px; background: #FFFFFF;}
.info_top_phrase { margin: 40px 0 30px 0; width: 312px; color: #211E3D;}
.analysis_count_area { width: 312px; height: 104px; background-size: contain; background-repeat: no-repeat;}
.analysis_count_area > p:first-child { font-size: 26px; line-height: 130%; color: #211E3D; margin-top: 33px; margin-bottom: 4px;}
.miriai_type { margin-top: 50px;}

.type_content { margin-bottom: 40px; width: 310px; display: flex;}
.type_content_phrase { margin-left: 14px; width: 232px; height: 82px; }
.type_content_phrase > p:first-child { font-weight: bold; font-size: 14px; line-height: 130%; color: #565273;}
.type_content_phrase > p:last-child { margin-top: 4px;}

.miriai_flow_area { margin-top: 12px; display: flex; flex-flow: column wrap; align-items: center; width: 360px; background: #FFFFFF;}
.miriai_flow_area > .head_phrase { margin-top:40px; width: 312px;}
.miriai_flow_area > .phrase_comment { width: 312px;}
.miriai_flow_seq { margin-top: 45px; }
.flow_img_area { margin-bottom: 22px; width:312px; display: flex; justify-content: space-around;}
.miriai_flow_seq_phrase {  margin: 30px 0 40px 0; display: flex;  width: 312px; height: 54px; background: rgba(59,46,140,0.1); border-radius: 10px; overflow: hidden; color: #1E1B4B;}
.flow_step { margin-top: 30px; display: flex; flex-flow: column wrap;}
.dot_line { margin:5px 4px;}
.flow_content { margin-bottom: 10px; display: flex; justify-content:space-between; width: 286px; height: 68px; background: #FAFAFE; border-radius: 10px; line-height: 68px; }
.flow_content > p {margin-left: 16px;}

.miriai_center_info { margin-top: 12px; width: 360px; height: 400px; background: #FFFFFF; overflow: hidden;}
.miriai_center_info > div {margin-left: 24px;}
.data_amount_img { margin-top: 30px; width:312px; height: 108px; display: flex; flex-flow: row ; font-weight: bold; font-size: 16px; text-align: center; line-height: 92px; color: #ffffff; background: #FAFAFE; border-radius: 80px;}
.data_amount_img > div { width:88px; height: 88px; border-radius: 50%; transform: translate(10px,10px);;}

.data_amount_phrase { margin-top: 8px;}
.data_amount_phrase > span.phrase_comment { font-weight: bold; color: #1E1B4B; }
.data_amount_phrase > span:not(:last-child) { margin: 0 20px 0 20px;}
.data_amount_phrase > span:last-child { margin-left: 50px;}

.miriai_safety { margin-top: 12px; display: flex; flex-flow: column wrap; align-items: center; width: 360px; background: #FFFFFF; }
.safety_head { margin-top: 40px; width: 312px;}
.safety_comment, .safety_sub_title {width: 312px;}
.safety_comment { margin: 12px 0 50px 0;}
.safety_sub_title { margin-bottom: 24px; font-weight: bold; font-size: 16px; line-height: 130%; color: #211E3D; }
.colleage_verify { margin-bottom: 10px; width: 312px; height: 60px; background: #FAFAFE; border-radius: 10px; text-align: center; color: #565273;}
.colleage_verify > p:first-child { font-weight: bold; padding-top: 13px;}
.ext_agency {margin-bottom: 10px; width: 312px; height: 78px; background: #FAFAFE; border-radius: 10px; text-align: center; color: #565273; }
.ext_agency > p:first-child { font-weight: bold; padding-top: 13px;}

.bottom_logo_area { margin: 12px 0 50px 0; width: 360px; display:flex; flex-flow: column wrap; align-items: center; background: #FFFFFF;}
.logo_phrase { width: 312px; margin-bottom: 40px;}
.logo_phrase > p:first-child { font-size: 20px; padding-bottom: 15px;}
.logo_phrase > p:not(:first-child) { font-weight: normal; font-size: 20px; line-height: 130%; color: #D9D7E4; }

.bottom_phrase {position: fixed; bottom: 0; width: 100%; padding-top: 20px; padding-bottom: 20px; display: flex; flex-flow: column; align-items: center; background: #FFFFFF;}
.bottom_btn {  width: 312px; height: 50px; background: #1E1B4B; color: #ffffff; text-align: center; line-height: 50px; cursor: pointer;}
.ex_result_phrase { margin-top: 10px; width: 312px; height: 50px; text-align: center;  line-height: 50px; font-size: 14px; color: #1E1B4B; cursor: pointer; border: 1px solid #EFEEF6;}