
.blocks { position: relative;}
.main_img_area { height: 641px; background-color: var(--color-primary);}
.inner_text_area2 {position: absolute; top: 180px; left: calc(50% - 250px/2 - 271.5px); }
.inner_text_area3 {position: absolute; top: 180px; left: calc(50% - 353px/2 + 273.5px);}
.inner_text_area4 {position: absolute; top: 180px; left: calc(50% - 639px/2 + 0.5px);}

.demo_area { height: 481px; background: var(--color-primary);}
.demo_area_bg { position: absolute; top: 170px; left: calc(50% + 6px); width: 493px; height: 397px;}
#demo_mockup_area { position: absolute; width: 367px; top: 205px; left: calc(50% + 100px);}


/* Mint CTA — the single accent moment on the page, on a dark surface. */
.demo_btn { width: 250px; height: 54px; line-height: 54px; text-align: center; font-family: var(--font-ui); font-size: 16px; font-weight: 600; background: var(--color-accent); border-radius: var(--radius-button); color: var(--color-primary); cursor: pointer;}


.ic_area { display: flex;}
.ic_item { margin-right: 37px;}
.ic_bg { margin-bottom: 6px; display: flex; justify-content: center; align-items: center; width: 80px; height: 80px; background: var(--neutral-100); border-radius: 50%; }
.ic_name { font-size: 14px; line-height: 130%; text-align: center; color: var(--neutral-600);}

.miriai_info_img { position: absolute; top: 270px; left: calc(50% - 300px/2 - 330px); }
.miriai_info_img > .miriai_info_text { margin-top: 25px;}
.miriai_info_text { display: flex;}

.sub_text_normal { font-style: normal; font-weight: 400; font-size: 16px; line-height: 150%; color: var(--neutral-600);}
.sub_text_normal.left_text { margin-left: 100px;}
.sub_text_normal.right_text { margin-left: 287px; text-align: center;}
.sub_text_normal.gb { color: var(--color-primary); font-family: var(--font-ui); font-weight: 600;}


.exp_area { position: absolute; top: 270px; left: calc(50% - 841px / 2 ); }
.img_separator { margin: 0 42px; display:inline-block; height: 212px; border-right: 1px solid var(--color-border); }


.analysis_cert_area { position: absolute; top: 276px; width: 606px; left: calc(50% - 606px/2); }

.img_branch { margin-top: 20px; margin-left: 90px;}
.img_cert { margin-top: 20px; margin-left: 8px;}


.app_download_text { position: absolute; top: 52px; left: calc(50% - 126px/2 - 385px);}
.app_download_text .download_head_text { font-family: var(--font-ui); font-weight: 600; font-size: 18px; line-height: 130%; color: var(--neutral-50);}
.app_download_text .download_sub_text { margin-top: 5px; font-size: 16px; line-height: 130%; color: var(--neutral-50);}
.app_download_btn { position: absolute; top: 56px; left: calc(50% + 200px); width: 230px; height: 50px; line-height: 50px; border: 1px solid var(--neutral-50); border-radius: var(--radius-button); box-sizing: border-box; text-align: center; font-family: var(--font-ui); font-size: 15px; font-weight: 600; color: var(--neutral-50); cursor: pointer;}

.text1 { font-family: var(--font-body); font-style: normal; font-weight: 300; font-size: 22px; line-height: 150%; color: var(--neutral-50);}
.head_text { font-family: var(--font-ui); font-style: normal; font-weight: 600; font-size: 36px; line-height: 130%; letter-spacing: -0.01em; color: var(--color-primary); }



#demo_mockup_area .demo_item img{
    display: block;
    width: 367px;
}


#demo_mockup_area .owl-dots {transform: scale(0.5) translate(-25px,-73px);}

.owl-dots .owl-dot { width: 16px; } 
.owl-dots .owl-dot.active span { background: var(--color-brand) !important; }
/* the mockup carousel sits on the Deep Indigo block — indigo dots would vanish */
#demo_mockup_area .owl-dots .owl-dot.active span { background: var(--neutral-50) !important; }


