/*****************************************************************
  공통
*****************************************************************/
.arrow_line, .arrow_line:before, .arrow_line:after{position:absolute;height:2px;border-radius:2px}
.arrow_line{width:63px;background-color:#697cd7}
.arrow_line:before, .arrow_line:after{content:'';right:-2px;width:9px;background-color:#445bcd}
.arrow_line:before{top:-3px;transform:rotate(45deg)}
.arrow_line:after{top:3px;transform:rotate(-45deg)}
.arrow_box{display:block;position:relative;line-height:11px;padding:3px 5px;background:#fff;border:1px solid #222;color:#444;border-radius:5px;font-size:11px;font-weight:400;text-align:right}
.arrow_box:before{content:'';position:absolute;top:50%;right:-5px;width:5px;height:7px;margin-top:-4px;background:url(../images/figure/ico_arrow.png) no-repeat;background-size:100% 100%}
.arrow_box strong{font-size:11px;font-weight:700;color:#444;line-height: 16px;}
.arrow_box.top:after,.arrow_box.top:before{left:11px;top:-1px;width:10px;height:5px;background:url(../images/figure/ico_arrow_top.png) no-repeat;background-size:100% 100%}
.figure_area *, .figure_area *:before, .figure_area *:after{transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.figure_area .tbl table th, .figure_area .tbl table td{padding:3px 8px 3px;font-size:12px}
.figure_area .tbl table th span{font-weight:400}
.figure_area .tbl table tbody th{background-color:#fff}
.figure_area .tbl table td.accent{background-color:#fff7dc}
/*****************************************************************
  암보험 - 특징 1 , 어린이보험 - 특징 1 , 정기보험 - 특징 1 
*****************************************************************/
.figure1:before{content:'';position:absolute;top:126px;left:0;width:100%;height:1px;background-color:#444}
.figure1 .premium{position:relative;height:145px;background:url(../images/figure/bg_premium.png) 50% 0 no-repeat;background-size:70%;word-break: keep-all}
.figure1 .premium:before{content:'';position:absolute;top:-5px;right:12px;width:10px;height:10px;background:url(../images/figure/ico_minus.png) no-repeat;opacity:0;background-size: 10px 10px;;transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000);transform:translate(20px, 0) rotate(360deg)}
.figure1 .premium.f1:before{display:none}
.figure1 .premium ul{position:absolute;bottom:18px;left:50%;width:70px;margin-left:-35px;border:1px solid #444;border-radius:4px;overflow:hidden}
.figure1 .premium ul li{height:25px;line-height:24px;border-bottom:1px dashed #444;font-size:10px;color:#fff;text-align:center}
.figure1 .premium ul li:last-child{border:none}
.figure1 .premium ul li.c1{background-color:#ffefb8;color:#444}
.figure1 .premium ul li.c2{background-color:#ffefb8;color:#444}
.figure1 .premium ul li.c3{background-color:#ffefb8;color:#444}
.figure1 .premium ul li.c4{background-color:#3eb8c7}
.figure1 .premium ul li.c5{background-color:#3d5fc0}
.figure1 .premium .lb{display:block;position:relative;margin-top:125px;padding-top:7px;font-size:11px;font-weight:bold;color:#444;text-align:center}
.figure1 .premium .lb:before{content:'';position:absolute;top:-1px;left:50%;width:4px;height:4px;margin-left:-3px;border:1px solid #444;background-color:#fff;border-radius:100%}
.figure1 .premium .arrow_line{top:30px;right:-29px;transform:rotate(90deg);opacity:0}
.figure1 .premium.f2 .arrow_line{top:36 px;right:-16px;width:38px}
.animated .figure1 .premium:before{opacity:1;transform:translate(0, 0) rotate(0deg)}
.animated .figure1 .premium.f2 ul li.c1, .animated .figure1 .premium.f2 ul li.c2, .animated .figure1 .premium.f2 ul li.c3, .animated .figure1 .premium.f3 ul li.c1, .animated .figure1 .premium.f3 ul li.c2, .animated .figure1 .premium.f3 ul li.c3, .animated .figure1 .premium.f3 ul li.c4{height:0;border-width:0;opacity:0}
.animated .figure1 .premium.f2 ul li.c2{transition-delay:1s}
.animated .figure1 .premium.f2 ul li.c3{transition-delay:2s}
.animated .figure1 .premium.f3 ul li.c2{transition-delay:1s}
.animated .figure1 .premium.f3 ul li.c3{transition-delay:2s}
.animated .figure1 .premium.f3 ul li.c4{transition-delay:3s}
.animated .figure1 .premium .arrow_line{top:50px;opacity:1;transition-duration:3s}
.animated .figure1 .premium.f2 .arrow_line{top:38px;opacity:1;transition-duration:4s}
/*****************************************************************
  정기보험 - 특징 2
*****************************************************************/
.figure2 .guarantee{position:relative;width:280px;height:270px;text-align:center}
.figure2 .guarantee h4{height:30px;line-height:28px;background-color:#e8edf3;font-size:13px;color:#777;text-align:center;border-radius:5px}
.figure2 .guarantee .b1{position:absolute;bottom:0;left:75px}
.figure2 .guarantee .b2{position:absolute;bottom:0;left:140px;transform:translate(-219px, 0) scale(0, 0)}
.figure2 .guarantee .box{display:inline-block;width:120px;height:77px;line-height:28px;padding-top:8px;border:2px solid #ccc;font-size:14px;color:#777;border-radius:5px}
.figure2 .guarantee .b2 .box{height:137px;border-color:#444;background-color:#445bcd;color:#fff}
.figure2 .guarantee .b2 .purse{position:absolute;right:-21px;bottom:29px;width:69px;height:64px;background:url(../images/figure/ico_purse.png) no-repeat;transform:scale(0, 0)}
.figure2 .guarantee .b2 .em{position:absolute;top:-25px;left:0;width:120px;font-size:13px;font-weight:700;color:#3d5fc0;text-align:center;transform:scale(0, 0);opacity:0}
.figure2 .guarantee .lb{display:block;margin-top:15px;font-size:14px;font-weight:700;color:#444;opacity:0;transform:translate(0, 10px)}
.figure2 .guarantee.g1{height:180px}
.figure2 .guarantee.g1 .b1{transform:translate(165px, 0)}
.figure2 .guarantee.g2 .b1{left:10px;transform:translate(-89px, 0);opacity:0}
.figure2 .guarantee.g2 h4{background-color:#445bcd;color:#fff}
.figure2 .line{position:relative;width:40px;height:40px;opacity:0}
.figure2 .line:after{content:'';position:absolute;top:0;left:20px;height:100%;border-right:2px dashed #b4b4b4}
.animated .figure2 .guarantee.g1 .b1{transform:translate(0, 0)}
.animated .figure2 .guarantee.g2 .b1{animation:box1 4s forwards}
.animated .figure2 .line{transition-delay:2s;height:285px;opacity:1}
.animated .figure2 .guarantee .lb{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure2 .guarantee .b2{animation:box2 4s forwards}
@keyframes box1{
40%{transform:translate(70px, 0);opacity:1}
60%{transform:translate(70px, 0);opacity:1}
100%{transform:translate(0, 0);opacity:1}
}
@keyframes box2{
30%{transform:translate(-219px, 0) scale(0, 0)}
60%{transform:translate(-219px, 0) scale(1, 1)}
100%{transform:translate(0, 0) scale(1, 1)}
}
.animated .figure2 .guarantee.g2 .b1{transition-delay:1s;transform:translate(0, 0)}
.animated .figure2 .guarantee .b2 .purse{transition-delay:4s;transition-duration:0.3s;transform:scale(1, 1)}
.animated .figure2 .guarantee .b2 .em{transition-delay:4s;transition-duration:0.5s;transform:scale(1, 1);opacity:1}
/*****************************************************************
  암보험 - 특징2
*****************************************************************/
.figure3 .g_bar_area{height:180px;margin:0 15px}
.figure3:before{content:'';position:absolute;top:129px;left:0;width:100%;height:1px;background-color:#444}
.figure3 .g_bar{position:relative;height:130px}
.figure3 .g_bar .bar{display:block;position:absolute;bottom:0;left:3px;width:60px;padding-top:0;border:1px solid #444;border-radius:4px 4px 0 0;text-align:center;opacity:0}
.figure3 .g_bar .lb{display:block;position:relative;margin-top:130px;padding-top:8px;font-size:11px;font-weight:bold;color:#444;text-align:center;line-height: 14px;}
.figure3 .g_bar .lb:before{content:'';position:absolute;top:-2px;left:50%;width:4px;height:4px;margin-left:-4px;border:1px solid #444;background-color:#fff;border-radius:100%}
.figure3 .g_bar .arrow_box{position:absolute;left:-63px;width:110px;opacity:0;font-size: 10px;}
.figure3 .g_bar.g1 .bar{height:0;background-color:#dadeed}
.figure3 .g_bar.g2 .bar{height:0;background-color:#3eb8c7;font-size:12px;font-weight:500;color:#fff}
.figure3 .g_bar.g2 .arrow_box{top:20px}
.figure3 .g_bar.g2 .arrow_line{position:absolute;top:80px;left:20px;width:38px;transform:rotate(-45deg);opacity:0}
.figure3 .g_bar.g3 .bar{height:0;background-color:#3d5fc0;font-size:12px;font-weight:500;color:#fff}
.figure3 .g_bar.g3 .arrow_box{top:-30px}
.figure3 .g_bar.g3 .arrow_line{position:absolute;top:43px;left:10px;width:50px;transform:rotate(-45deg);opacity:0}
.figure3 .g_bar.g4 .bar{height:0;background-color:#fcd110;font-size:12px;font-weight:500;color:#222}
.figure3 .ga{position:relative;margin-top:20px}
.figure3 .ga{position:relative;margin-top:20px;color:#444;text-align:right}
.animated .figure3 .g_bar.g1 .bar{height:38px;padding-top:6px;opacity:1}
.animated .figure3 .g_bar.g2 .bar{transition-delay:1s;height:60px;padding-top:6px;opacity:1}
.animated .figure3 .g_bar.g2 .arrow_line{transition-delay:2.5s;transition-duration:0.5s;top:50px;left:30px;opacity:1}
.animated .figure3 .g_bar.g2 .arrow_box{transition-delay:2.7s;transition-duration:0.5s;left:-75px;opacity:1}
.animated .figure3 .g_bar.g3 .bar{transition-delay:2s;height:93px;padding-top:6px;opacity:1}
.animated .figure3 .g_bar.g3 .arrow_line{transition-delay:3.5s;transition-duration:0.5s;top:13px;left:20px;opacity:1}
.animated .figure3 .g_bar.g3 .arrow_box{transition-delay:3.7s;transition-duration:0.5s;left:-75px;opacity:1}
.animated .figure3 .g_bar.g4 .bar{transition-delay:3s;height:150px;padding-top:6px;opacity:1}

/*20190408추가*/
.figure3 .g_bar .bar1{display:block;position:absolute;bottom:0;left:6px;width:60px;padding-top:0;border:1px solid #444;border-radius:4px 4px 0 0;text-align:center;opacity:0}
.figure3 .g_bar .bar2{display:block;position:absolute;bottom:0;left:6px;width:60px;padding-top:0;border:1px solid #444;border-radius:4px 4px 0 0;text-align:center;opacity:0}
.figure3 .g_bar .bar3{display:block;position:absolute;bottom:0;left:6px;width:60px;padding-top:0;border:1px solid #444;border-radius:4px 4px 0 0;text-align:center;opacity:0}
.figure3 .g_bar.g3 .bar1{height:0;background-color:#3eb8c7;font-size:11px;font-weight:500;color:#fff}
.figure3 .g_bar.g4 .bar1{height:0;background-color:#3eb8c7;font-size:11px;font-weight:500;color:#fff}
.figure3 .g_bar.g3 .bar2{height:0;background-color:#3d5fc0;font-size:11px;font-weight:500;color:#fff; margin-bottom:60px;}
.figure3 .g_bar.g4 .bar2{height:0;background-color:#3d5fc0;font-size:11px;font-weight:500;color:#fff; margin-bottom:60px;}
.figure3 .g_bar.g4 .bar3{height:0;background-color:#fcd110;font-size:11px;font-weight:500;color:#222; margin-bottom:120px;}
.animated .figure3 .g_bar.g3 .bar1{transition-delay:1s;height:64px;padding-top:12px;opacity:1}
.animated .figure3 .g_bar.g4 .bar1{transition-delay:1s;height:64px;padding-top:12px;opacity:1}
.animated .figure3 .g_bar.g3 .bar2{transition-delay:2s;height:64px;padding-top:12px;opacity:1}
.animated .figure3 .g_bar.g4 .bar2{transition-delay:2s;height:64px;padding-top:12px;opacity:1}
.animated .figure3 .g_bar.g4 .bar3{transition-delay:3s;height:64px;padding-top:12px;opacity:1}
.figure3 .plus{position:absolute;top:165px;left:50%;width:20px;height:20px;margin-left:-10px;background:url(../images/figure/ico_plus.png) no-repeat;z-index:10;transform:scale(0,0) rotate(360deg);opacity:0}
.animated .figure3 .plus{transition-delay:2s;transform:scale(1,1) rotate(0deg);opacity:1}
.figure3 .plus2{position:absolute;top:78px;left:50%;width:20px;height:20px;margin-left:-10px;background:url(../images/figure/ico_plus.png) no-repeat;z-index:10;transform:scale(0,0) rotate(360deg);opacity:0}
.animated .figure3 .plus2{transition-delay:3s;transform:scale(1,1) rotate(0deg);opacity:1}
/*****************************************************************
  암보험 - 특징 3 , 2대성인병보험 - 특징 2 , 정기보험 - 특징 3
*****************************************************************/
.figure4 .g_bar_area{position:relative;height:105px;border-width:0 2px;border-style:solid;border-color:#444}
.figure4 .g_bar_area:before{content:'';position:absolute;top:0;left:27%;width:1px;height:100%;border-left:1px dashed #b4b4b4;z-index:1}
.figure4 .g_bar_area .g_bar{position:absolute;width:0;height:25px;line-height:24px;padding:0 10px;background-color:#dadeed;color:#444;opacity:0}
.figure4 .g_bar_area .g_bar:before{content:'';position:absolute;top:0;right:-13px;width:0px;height:0px;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:13px solid #dadeed}
.figure4 .g_bar_area .g_bar:after{content:'';position:absolute;width:21px;background:url(../images/figure/spr_figure4.png) no-repeat;background-size:100%}
.figure4 .g_bar_area .g_bar.g1{top:20px;left:0}
.figure4 .g_bar_area .g_bar.g1:after{top:-46px;left:-11px;height:23px;background-position:50% 0} 
.figure4 .g_bar_area .g_bar.g2{top:20px;left:27%;width:0;background-color:#fcd110}
.figure4 .g_bar_area .g_bar.g2:before{border-left-color:#fcd110}
.figure4 .g_bar_area .g_bar.g2:after{top:-48px;left:-11px;height:27px;background-position:50% -24px} 
.figure4 .g_bar_area .g_bar.g2 span{position:absolute;top:-20px;left:6px;width:100%;background:url(../images/figure/arrow_line.png) 0 50% no-repeat;font-size:10px;font-weight:bold;text-align:center;transform:translate(0, 10px);opacity:0;background-size:50px;line-height: 14px;}
.figure4 .g_bar_area .g_bar.g2 span.row2{top: -43px;}
.figure4 .g_bar_area .g_bar.g2 span.row2:before{top: 18px;}
.figure4 .g_bar_area .g_bar.g2 span:before{content:''; position:absolute;top:5px;right:0;width:48px;height:6px; background:url(../images/figure/arrow_line.png) no-repeat;transform:rotate(180deg);    background-size: 100%;}
.figure4 .g_bar_area .g_bar.g3{top:60px;left:0;width:0;background-color:#3d5fc0;color:#fff}
.figure4 .g_bar_area .g_bar.g3:before{border-left-color:#3d5fc0}
.figure4 .g_bar_area .g_bar.g3:after{top:-83px;left:285px;height:19px;background-position:50% -52px}
.figure4 .g_bar_area .g_bar em{transform:translate(-5px, 0);opacity:0;transition-duration:0.5s}
.animated .figure4 .g_bar_area .g_bar.g1{width:calc(27% - 14px);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g1 em{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g2{transition-delay:1sf;width:calc(73% - 13px);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g2 em{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g3{transition-delay:2s;width:calc(100% - 13px);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g3 em{transition-delay:2.5s;transform:translate(0, 0);opacity:1}
.animated .figure4 .g_bar_area .g_bar.g2 span{transition-delay:3s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
.figure4.t2 .g_bar_area:before{left:65px}
.figure4.t2 .g_bar_area:after{content:'';position:absolute;top:0;left:203px;width:1px;height:100%;border-left:1px dashed #b4b4b4;z-index:10}
.figure4.t2 .g_bar_area .g_bar.g1:before{display:none}
.figure4.t2 .g_bar_area .g_bar.g2{left:65px;text-align:center}
.figure4.t2 .g_bar_area .g_bar.g2 span strong{display:inline-block;background-color:#fff;text-align:center;z-index:10;position: relative;}
.animated .figure4.t2 .g_bar_area .g_bar.g1{width:65px}
.animated .figure4.t2 .g_bar_area .g_bar.g2{width:125px}
.figure4.t2 .g_bar_area .lb{position:absolute;top:108px;left:-10px;font-size:12px;font-weight:700;color:#444}
.figure4.t2 .g_bar_area .lb>div{position:absolute;top:0;left:0;width:50px}
.figure4.t2 .g_bar_area .lb .lb1{left:0}
.figure4.t2 .g_bar_area .lb .lb2{left:65px;width: 110px;}
.figure4.t2 .g_bar_area .lb .lb2 p{position: relative;left: -20px;width:145px;line-height:13px;margin-top:8px;font-size:11px;font-weight:400;line-height: 16px}
.figure4.t2 .g_bar_area .lb .lb3{left:203px;width: 85px;}
.figure4.t2 .g_bar_area .lb .lb3 .arrow_box{width:100px;margin-top:10px;text-align:left;left: -10px;line-height: 16px}
.figure4.t2 .g_bar_area .lb .lb4{left:297px;width: 40px;}
.figure4.t2 .ex{position:relative;margin-top:110px;padding:10px 15px 10px 42px; border:1px solid #ccc;color:#777;border-radius:4px;line-height: 16px;}
.figure4.t2 .ex .lb{position:absolute;top:10px;left:16px;font-weight:500}
/*****************************************************************
  암보험 - 특징 4
*****************************************************************/
.figure5{height:135px}
.figure5 .g_bar_area{position:relative;width:300px;height:115px;border-width:0 0 1px 1px;margin-left:0;border-style:solid;border-color:#444}
.figure5 .g_bar_area .g_bar{position:relative;width:65px;height:100%;border-right:1px dashed #b4b4b4;z-index:10}
.figure5 .g_bar_area .g_bar em{position:absolute;bottom:-21px;left:50%;width:40px;margin-left:-48px;font-size:11px;font-weight:bold;color:#444;text-align:center}
.figure5 .g_bar_area .bar_line{position:absolute;left:-4px;z-index:10}
.figure5 .g_bar_area .bar_line:before{content:'';display:block;width:7px;height:7px;border-radius:100%;transform:scale(0, 0)}
.figure5 .g_bar_area .bar_line span{position:absolute;height:1px;z-index:10}
.figure5 .g_bar_area .bar_line .lb{position:absolute;top:-2px;left:255px;width:75px;font-size:11px}
.figure5 .g_bar_area .bar_line.bl1{top:95px}
.figure5 .g_bar_area .bar_line.bl1:before{background-color:#6e7484}
.figure5 .g_bar_area .bar_line.bl1 span{width:0;background-color:#6e7484}
.figure5 .g_bar_area .bar_line.bl1 span:before{content:'';position:absolute;bottom:-30px;left:0;width:1px;height:0;background-color:#6e7484}
.figure5 .g_bar_area .bar_line.bl1 span:after{content:'';position:absolute;top:-2px;left:-2px;width:6px;height:6px;border:1px solid #6e7484;background-color:#fff;border-radius:100%}
.figure5 .g_bar_area .bar_line.bl1 .b1{top:3px;left:3px}
.figure5 .g_bar_area .bar_line.bl1 .b1:before{display:none}
.figure5 .g_bar_area .bar_line.bl1 .b1:after{left:62px}
.figure5 .g_bar_area .bar_line.bl1 .b2{top:-27px;left:68px;z-index:9}
.figure5 .g_bar_area .bar_line.bl1 .b3{top:-57px;left:133px}
.figure5 .g_bar_area .bar_line.bl1 .b4{top:-87px;left:198px}
.figure5 .g_bar_area .bar_line.bl1 .b4 .arrow{position:absolute;padding:0;border:0;top:-4px;right:-3px;width:0px;height:0px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid #6e7484}
.figure5 .g_bar_area .bar_line.bl1 .lb{top:-92px;color:#6e7484;transform:translate(5px, 0);opacity:0}
.figure5 .g_bar_area .bar_line.bl2{top:79px}
.figure5 .g_bar_area .bar_line.bl2:before{background-color:#3d5fc0}
.figure5 .g_bar_area .bar_line.bl2 span{top:3px;left:3px;width:0;background-color:#3d5fc0}
.figure5 .g_bar_area .bar_line.bl2 span:after{content:'';position:absolute;top:-4px;right:-3px;width:0px;height:0px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid #3d5fc0;opacity:0}
.figure5 .g_bar_area .bar_line.bl2 span strong{position:absolute;top:-8px;left:135px;width:100px;height:16px;line-height:12px;background-color:#fff;border:1px solid #3d5fc0;font-size:11px;font-weight:bold;color:#3d5fc0;text-align:center;border-radius:3px;transform:scale(0, 0);opacity:0}
.figure5 .g_bar_area .bar_line.bl2 .lb{top:-29px;color:#3eb8c7;transform:translate(5px, 0);opacity:0}
.figure5 .g_bar_area .bar_line.bl3{top:52px}
.figure5 .g_bar_area .bar_line.bl3:before{background-color:#3eb8c7}
.figure5 .g_bar_area .bar_line.bl3 span{top:6px;left:3px;width:0;background-color:#3eb8c7}
.figure5 .g_bar_area .bar_line.bl3 span:after{content:'';position:absolute;top:-4px;right:-3px;width:0px;height:0px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid #3eb8c7;opacity:0}
.figure5 .g_bar_area .bar_line.bl3 .lb{top:26px;line-height:14px;font-weight:bold;color:#3d5fc0;transform:translate(5px, 0);opacity:0}
.figure5 .g_bar_area .bar_line.bl3 .lb em{font-size:11px}
.figure5 .g_bar_area .g_bar.g4{border:none}
.figure5 .g_bar_area .rm{position:absolute;top:-20px;left:-15px;font-size:11px;font-weight:bold;color:#444}
.figure5 .g_bar_area .box{position:absolute;bottom:0;left:0;width:243px;height:0;background:url('../images/figure/pattern1.jpg') repeat;background-size: 4px 4px;}
.animated .figure5 .g_bar_area .bar_line.bl1:before{transition-duration:0.5s;transform:scale(1, 1)}
.animated .figure5 .g_bar_area .bar_line.bl1 .b1{transition-duration:0.5s;width:65px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b2:before{transition-delay:0.5s;transition-duration:0.3s;height:32px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b2{transition-delay:0.8s;transition-duration:0.5s;width:65px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b3:before{transition-delay:1.3s;transition-duration:0.3s;height:32px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b3{transition-delay:1.6s;transition-duration:0.5s;width:65px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b4:before{transition-delay:2.1s;transition-duration:0.3s;height:32px}
.animated .figure5 .g_bar_area .bar_line.bl1 .b4{transition-delay:2.4s;transition-duration:0.3s;width:50px}
.animated .figure5 .g_bar_area .bar_line.bl1 .lb{transition-delay:2.4s;transform:translate(0, 0);transition-duration:0.5s;opacity:1}
.animated .figure5 .g_bar_area .bar_line.bl2:before{transition-delay:2.5s;transition-duration:0.5s;transform:scale(1, 1)}
.animated .figure5 .g_bar_area .bar_line.bl2 span{transition-delay:2.5s;width:243px}
.animated .figure5 .g_bar_area .bar_line.bl2 span:after{transition-delay:2.5s;opacity:1}
.animated .figure5 .g_bar_area .bar_line.bl2 .lb{transition-delay:4.5s;transform:translate(0, 0);transition-duration:0.5s;opacity:1}
.animated .figure5 .g_bar_area .bar_line.bl3:before{transition-delay:4.5s;transition-duration:0.5s;transform:scale(1, 1)}
.animated .figure5 .g_bar_area .bar_line.bl3 span{transition-delay:3.5s;width:243px}
.animated .figure5 .g_bar_area .bar_line.bl3 span:after{transition-delay:3.5s;opacity:1}
.animated .figure5 .g_bar_area .bar_line.bl3 .lb{transition-delay:3.5s;transform:translate(0, 0);transition-duration:0.5s;opacity:1}
.animated .figure5 .g_bar_area .bar_line.bl2 span strong{transition-delay:5s;transform:scale(1, 1);opacity:1}
.animated .figure5 .g_bar_area .box{transition-delay:5s;height:31px}
/*****************************************************************
  암보험 - 필요성 1
*****************************************************************/
.figure6:before{content:'';position:absolute;top:56px;left:50%;width:54px;height:37px;background:url(../images/figure/spr_figure6.png) -136px 0 no-repeat;transform:translate(-95%, 0);opacity:0;transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); background-size: 300px 167px;}
.figure6 h5{margin:0!important;padding-bottom:20px;font-size:14px;font-weight:500}
.figure6 .box{position:relative;width:78px;height:78px;margin-left:15px;background:url(../images/figure/spr_figure6.png) 0 12px no-repeat; background-size: 300px 167px;}
.figure6 .box:before{content:'';position:absolute;top:0;width:15px;height:72px;background:url(../images/figure/spr_figure6.png) -191px 0 no-repeat; background-size: 300px 167px;}
.figure6 .box .patient{position:absolute;width:53px;height:76px;background:url(../images/figure/spr_figure6.png) -81px 0 no-repeat; background-size: 300px 167px;}
.figure6 .box.b1{transform:translate(-10px, 0);opacity:0}
.figure6 .box.b1:before{left:0}
.figure6 .box.b1 .patient.p1{bottom:0;left:13px}
.figure6 .box.b2{position:absolute;top:43px;right:23px;width:90px;background-position:-209px 12px;transform:translate(-10px, 0);opacity:0}
.figure6 .box.b2:before{left:-15px;transform:translate(13px, 0)}
.figure6 .box.b2 .patient.p1{bottom:0;left:7px;transform:translate(13px, 0)}
.figure6 .box.b2 .patient.p2{bottom:0;left:33px;transform:translate(-14px, 0)}
.figure6 .box.b2 .counter{position:absolute;bottom:0;right:-23px;width:52px;height:25px;line-height:24px;border:1px solid #3d5fc0;background-color:#fff;border-radius:3px;font-family:'Roboto';font-size:20px;font-weight:bold;color:#3d5fc0;text-align:center;transform:scale(0, 0)}
.figure6 .box.b2 .counter_s4{position:absolute;bottom:0;right:-23px;width:52px;height:25px;line-height:22px;border:1px solid #3d5fc0;background-color:#fff;border-radius:5px;font-family:'Roboto';font-size:20px;font-weight:700;color:#3d5fc0;text-align:center;transform:scale(0, 0)}
.figure6 .info{position: relative;width:300px;height:87px;margin: 0;margin-top:15px;background:url(../images/figure/spr_figure6.png) 0 -80px; background-size: 300px 167px;}

.animated .figure6 .box.b1{transform:translate(0, 0);opacity:1}
.animated .figure6:before{transition-delay:1s;transform:translate(-85%, 0);opacity:1}
.animated .figure6 .box.b2{transition-delay:2.0s;transform:translate(0, 0);opacity:1}
.animated .figure6 .box.b2:before{transition-delay:3.0s;transform:translate(0, 0)}
.animated .figure6 .box.b2 .patient.p1{transition-delay:3.0s;transform:translate(0, 0)}
.animated .figure6 .box.b2 .patient.p2{transition-delay:3.0s;transform:translate(0, 0)}
.animated .figure6 .box.b2 .counter{transition-delay:4.0s;transform:scale(1, 1)}
.animated .figure6 .box.b2 .counter_s4{transition-delay:4.0s;transform:scale(1, 1)}
/*****************************************************************
  암보험 - 필요성 2
*****************************************************************/
.figure7 .info h4{height:20px;line-height:18px;background-color:#e8edf3;font-size:12px;text-align:center;border-radius:4px}
.figure7 .info .chart1{position:relative;width:100%;height:112px;margin:20px 0 0 0;background:url(../images/figure/spr_figure7.png) 0 0 no-repeat; background-size: 264px 319px}
.figure7 .info .chart1:after{content:''; position:absolute;bottom:16px;left:60px;width:200px;height:0;background:url(../images/figure/spr_figure7.png) 0 -214px no-repeat;z-index:-1; background-size: 264px 319px}
.figure7 .info .chart1 span{position:absolute}
.figure7 .info .chart1 span:before{content:'';position:absolute;top:0;left:0;width:6px;height:6px;border:1px solid #3d5fc0;background-color:#fff;border-radius:100%;z-index:10;transform:scale(0, 0)}
.figure7 .info .chart1 span:after{content:'';position:absolute;top:0;left:3px;width:0;height:2px;background-color:#3d5fc0;z-index: 1;}
.figure7 .info .chart1 span.g1{top:51px;left:59px}
.figure7 .info .chart1 span.g1:before{top:1px}
.figure7 .info .chart1 span.g1:after{top:3px;transform:rotate(-8deg)}
.figure7 .info .chart1 span.g2{top:43px;left:122px}
.figure7 .info .chart1 span.g2:after{top:3px;transform:rotate(-10deg)}
.figure7 .info .chart1 span.g3{top:31px;left:185px}
.figure7 .info .chart1 span.g3:after{top:3px;transform:rotate(-4deg)}
.figure7 .info .chart1 span.g4{top:27px;left:235px}
.figure7 .info .chart1 span.g4:after{display:none}
.figure7 .info .chart1 span em{position:absolute;top:-14px;left:50%;width:35px;margin-left:-13px;font-size:12px;font-weight:500;color:#3d5fc0;text-align:center;transform:translate(0, -10px);opacity:0}
.figure7 .info .chart1 .per{position:absolute;top:-15px;left:0;font-size:10px}
.figure7 .info .chart1 .term{position:absolute;bottom:0;right:10px;font-size:10px}
.figure7 .info .chart2{position:relative}
.figure7 .info .chart2 span{position:absolute;left:80px;width:0;height:12px;background-color:#3d5fc0}
.figure7 .info .chart2 span em{position:absolute;top:-1px;right:-55px;width:50px;font-size:13px;font-weight:500;color:#444;transform:translate(-5px, 0);opacity:0}
.figure7 .info .chart2 span.g1{top:19px}
.figure7 .info .chart2 span.g2{top:45px}
.figure7 .info .chart2 span.g3{top:68px}
.figure7 .info .chart2 span.g4{top:95px;background:url(../images/figure/pattern2.jpg) repeat}
.figure7 .info .chart2 span.g4 em{top:-5px;width:52px;height:19px;line-height:17px;padding-left:2px;background:url(../images/figure/bubble1.png) no-repeat;font-size:12px;font-weight:700;text-align:center;background-size: 47px 19px;}
.figure7 .info .chart2{height:124px;background:url(../images/figure/spr_figure7.png) 0 -138px no-repeat;background-size: 326px 390px}

.animated .figure7 .info .chart1 span.g1:before{transform:scale(1, 1)}
.animated .figure7 .info .chart1 span.g1:after{transition-delay:0.5s;width:65px;top: -2px;}
.animated .figure7 .info .chart1 span.g2:before{transition-delay:0.5s;transform:scale(1, 1)}
.animated .figure7 .info .chart1 span.g2:after{transition-delay:1.3s;width:65px;top: -4px;transform: rotate(-10deg);}
.animated .figure7 .info .chart1 span.g3:before{transition-delay:1s;transform:scale(1, 1)}
.animated .figure7 .info .chart1 span.g3:after{transition-delay:2s;width:50px;top:0;transform:rotate(-4deg)}
.animated .figure7 .info .chart1 span.g4:before{transition-delay:1.5s;transform:scale(1, 1)}
.animated .figure7 .info .chart1 span em{transition-delay:2.0s;transform:translate(0, 0);opacity:1}
.animated .figure7 .info .chart1:after{transition-delay:2.0s;height:65px}
.animated .figure7 .info .chart2 span.g1{width:12px}
.animated .figure7 .info .chart2 span.g2{transition-delay:0.2s;width:27px}
.animated .figure7 .info .chart2 span.g3{transition-delay:0.4s;width:30px}
.animated .figure7 .info .chart2 span.g4{transition-delay:0.5s;width:156px}
.animated .figure7 .info .chart2 span em{transition-delay:1.5s;transform:translate(0, 0);opacity:1}

.p_figure1{position:relative;width:384px;margin-top:25px}
.p_figure1 .g_bar_area{height:150px;margin:0 15px}
.p_figure1:before{content:'';position:absolute;top:108px;left:0;width:100%;height:2px;background-color:#fff}
.p_figure1 .g_bar{position:relative;height:108px}
.p_figure1 .g_bar .bar{position:absolute;bottom:0;left:6px;width:80px;height:0;padding-top:0;border-radius:4px 4px 0 0;background-color:#fff;color:#444;text-align:center;opacity:0}
.p_figure1 .g_bar .bar:before{position:absolute;top:-50px;left:-23px;width:95px;height:45px;background:url(../images/figure/spr_p_figure1.png) no-repeat;z-index:10;transform:translate(-10px, -10px);opacity:0}
.p_figure1 .g_bar .lb{position:absolute;top:116px;left:6px;width:80px;line-height:18px;font-size:12px;color:#fff;text-align:center}
.p_figure1 .g_bar .txt{position:absolute;top:60px;left:6px;width:80px;line-height:16px;font-size:12px;color:#fff;text-align:center;transform:translate(0, -10px);opacity:0}
.p_figure1 .g_bar.g2 .bar:before{content:'';}
.p_figure1 .g_bar.g3 .bar:before{content:'';}
.swiper-slide-active .p_figure1 .g_bar.g1 .bar{height:23px;opacity:1}
.swiper-slide-active .p_figure1 .g_bar.g2 .bar{transition-delay:1s;height:38px;padding-top:3px;opacity:1}
.swiper-slide-active .p_figure1 .g_bar .txt{transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure1 .g_bar.g2 .bar:before{transition-delay:1.5s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure1 .g_bar.g3 .bar{transition-delay:2s;height:58px;padding-top:3px;opacity:1}
.swiper-slide-active .p_figure1 .g_bar.g3 .bar:before{transition-delay:2.5s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure1 .g_bar.g4 .bar{transition-delay:3s;height:108px;padding-top:3px;opacity:1}

.p_figure2{position:relative;width:390px;margin-top:25px}
.p_figure2 ul li{position:relative;margin:0 10px;text-align:center}
.p_figure2 ul li:before{content:'';display:block;width:110px;height:110px;background:url(../images/figure/spr_p_figure2.png) no-repeat;transform:scale(0, 0);opacity:0}
.p_figure2 ul li.p1:before{background-position:0 0}
.p_figure2 ul li.p2:before{background-position:-110px 0}
.p_figure2 ul li.p3:before{background-position:-220px 0}
.p_figure2 ul li .lb{display:block;margin-top:5px;font-size:12px;color:#fff;transform:translate(0, -10px);opacity:0}
.p_figure2 ul li .chk{position:absolute;top:0;right:0;width:28px;height:28px;background-color:#445bcd;border-radius:100%;transform:scale(0, 0);opacity:0}
.p_figure2 ul li .chk:before{content:'';position:absolute;top:14px;left:5px;width:0;height:3px;background-color:#fff;transform:rotate(45deg)}
.p_figure2 ul li .chk:after{content:'';position:absolute;top:12px;left:9px;width:0;height:3px;background-color:#fff;transform:rotate(-45deg)}

.swiper-slide-active .p_figure2 ul li.p1:before{transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p1 .lb{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure2 ul li.p1 .chk{transition-delay:1s;transition-duration:0.5s;transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p1 .chk:before{width:10px;transition-duration:0.3s;transition-delay:1.3s}
.swiper-slide-active .p_figure2 ul li.p1 .chk:after{width:15px;transition-duration:0.3s;transition-delay:1.6s}
.swiper-slide-active .p_figure2 ul li.p2:before{transition-delay:0.5s;transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p2 .lb{transition-delay:1s;transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure2 ul li.p2 .chk{transition-delay:1.5s;transition-duration:0.5s;transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p2 .chk:before{width:10px;transition-duration:0.3s;transition-delay:1.8s}
.swiper-slide-active .p_figure2 ul li.p2 .chk:after{width:15px;transition-duration:0.3s;transition-delay:2.1s}
.swiper-slide-active .p_figure2 ul li.p3:before{transition-delay:1s;transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p3 .lb{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.swiper-slide-active .p_figure2 ul li.p3 .chk{transition-delay:2s;transition-duration:0.5s;transform:scale(1, 1);opacity:1}
.swiper-slide-active .p_figure2 ul li.p3 .chk:before{width:10px;transition-duration:0.3s;transition-delay:2.3s}
.swiper-slide-active .p_figure2 ul li.p3 .chk:after{width:15px;transition-duration:0.3s;transition-delay:2.6s}
/*****************************************************************
  2대성인병보험 - 특징 1
*****************************************************************/
.figure8 .info .inner{position:relative;height: 238px;}
.figure8 .info1 .inner{height: 238px;}
.figure8 .info h4{height:40px;line-height:38px;background-color:#e8edf3;font-size:16px;text-align:center;border-radius:7px}
.figure8 .info .chart{position: absolute;top:80px;left:15px;width:45%;height: 190px;}
.figure8 .info .chart .value{position:absolute;bottom:60px;left:0;width:100%;height:0;padding-top:15px;border:1px solid #444;background-color:#445bcd;font-size:14px;color:#fff;text-align:center;border-radius:5px;overflow:hidden;opacity:0}
.figure8 .info .chart .lb{position: absolute;display:block;font-size:14px;font-weight:700;color:#444;text-align:center;bottom: 35px;width: 100%;}
.figure8 .info .chart.c2{left:55%}
.figure8 .info .chart.c2 .value{height:0;padding-top:9px}
.figure8 .info .chart.c3{left:80px}
.figure8 .info .chart.c3 .value{background-color:#3eb8c7}
.figure8 .info .tbl{position: absolute;width:100%;top: 265px;left: 0;}
.figure8 .info .tbl table th, .figure8 .info .tbl table td{line-height:20px;padding:7px 0 7px;border-width:0 0 1px 0;font-size:12px}
.figure8 .info .rm{display:block;padding-right:5px;text-align:right}
.animated .figure8 .info .chart.c1 .value{height:127px;opacity:1}
.animated .figure8 .info .chart.c2 .value{height:47px;opacity:1}
.animated .figure8 .info .chart.c3 .value{height:127px;opacity:1}
/*****************************************************************
  2대성인병보험 - 필요성 1
*****************************************************************/
.figure9 .info h4{height:20px;line-height:19px;background-color:#e8edf3;font-size:12px;text-align:center;border-radius:4px}
.figure9 .chart1{position:relative;height:138px;margin-top:25px;background:url(../images/figure/spr_figure9.png) no-repeat;background-size: 100% 100%}
.figure9 .chart1 .rm{position:absolute;top:-17px;left:3px;font-size:11px}
.figure9 .chart1>div{position:absolute;bottom:18px}
.figure9 .chart1>div>span{position:absolute;bottom:0;width:25px;border:1px solid #444;border-radius:3px 3px 0 0}
.figure9 .chart1>div>span em{position:absolute;top:-16px;left:0;width:23px;font-size:12px;font-weight:500;text-align:center;transform:translate(0, 10px);opacity:0}
.figure9 .chart1 .g1{left:56px}
.figure9 .chart1 .g2{left:137px}
.figure9 .chart1 .g3{left:218px}
.figure9 .chart1 .b1{height:0;background:url(../images/figure/pattern3.jpg) repeat}
.figure9 .chart1 .b2{left:28px;height:0;background:url(../images/figure/pattern4.jpg) repeat}
.figure9 .chart2{position:relative;height:150px;margin-top:15px}
.figure9 .chart2:before{content:'';position:absolute;bottom:18px;left:0;width:100%;height:1px;background-color:#444}
.figure9 .chart2 p{font-size:12px;color:#444;font-weight:500;text-align:center}
.figure9 .chart2>div{position:absolute;bottom:0;width:70px}
.figure9 .chart2 .bar{position:absolute;bottom:18px;left:0;width:70px;height:0;border:1px solid #444;padding-top:4px;font-size:13px;color:#fff;text-align:center;border-radius:4px}
.figure9 .chart2 .value{position:absolute;top:-16px;left:0;width:68px;font-size:12px;font-weight:700;color:#444;text-align:center;transform:translate(0, 5px);opacity:0}
.figure9 .chart2 .lb{display:block;position:relative;font-size:11px;font-weight:700;color:#444;text-align:center}
.figure9 .chart2 .lb:before{content:'';position:absolute;top:-10px;left:50%;width:4px;height:4px;margin-left:-3px;border:1px solid #444;background-color:#fff;border-radius:100%;z-index:10}
.figure9 .chart2 .g1{left:26px}
.figure9 .chart2 .g2{left:111px}
.figure9 .chart2 .g3{left:195px;width: 80px;}
.figure9 .chart2 .g1 .bar{background-color:#3eb8c7}
.figure9 .chart2 .g2 .bar{background-color:#3d5fc0}
.figure9 .chart2 .g3 .bar{background-color:#dadeed;color:#444}
.animated .figure9 .chart1 .g1 .b1{height:41px}
.animated .figure9 .chart1 .g1 .b2{height:66px}
.animated .figure9 .chart1 .g2 .b1{height:56px}
.animated .figure9 .chart1 .g2 .b2{height:101px}
.animated .figure9 .chart1 .g3 .b1{height:56px}
.animated .figure9 .chart1 .g3 .b2{height:101px}
.animated .figure9 .chart2 .g1 .bar{height:24px}
.animated .figure9 .chart2 .g2 .bar{height:31px}
.animated .figure9 .chart2 .g3 .bar{height:68px}
.animated .figure9 .chart1>div>span em{transition-delay:1.0s;transform:translate(0, 0);opacity:1}
.animated .figure9 .chart2 .value{transition-delay:1.0s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  2대성인병보험 - 필요성 2
*****************************************************************/
.figure10 .info h4{height:30px;line-height:28px;background-color:#e8edf3;font-size:13px;text-align:center;border-radius:5px}
.figure10 .info p{margin-top:15px 0;font-size:12px;font-weight:500;color:#444;text-align:center}
.figure10 .chart1{position:relative;height:157px;background:url(../images/figure/spr_figure10.png) no-repeat;background-size: 300px}
.figure10 .chart1>div{position:absolute;bottom:18px}
.figure10 .chart1>div>span{position:absolute;bottom:0;width:45px;height:0;border:1px solid #444;background-color:#3d5fc0;padding-top:10px;font-size:12px;font-weight:500;color:#fff;text-align:center;border-radius:5px 5px 0 0;line-height: 16px;}
.figure10 .chart1 .value{position:absolute;top:-20px;left:0;width:43px;font-size:12px;font-weight:700;color:#444;text-align:center;transform:translate(0, 10px);opacity:0}
.figure10 .chart1 .g1{left:59px}
.figure10 .chart1 .g2{left:116px}
.figure10 .chart1 .g3{left:173px}
.figure10 .chart1 .g4{left:231px}
.figure10 .chart2{position:relative;height:156px;margin-top:27px;background:url(../images/figure/spr_figure10.png) 0 -157px no-repeat;background-size: 300px}
.figure10 .chart2 .rm{position:absolute;top:-16px;left:21px;font-size:12px}
.figure10 .chart2>div{position:absolute;bottom:32px}
.figure10 .chart2>div>span{position:absolute;bottom:0;left:0;width:15px;height:0;border:1px solid #444;border-radius:5px 5px 0 0}
.figure10 .chart2>div>span em{position:absolute;top:-16px;left:50%;width:25px;margin-left:-13px;font-size:10px;font-weight:500;text-align:center;transform:translate(0, 5px);opacity:0}
.figure10 .chart2 .g1{left:47px}
.figure10 .chart2 .g2{left:92px}
.figure10 .chart2 .g3{left:131px}
.figure10 .chart2 .g4{left:175px}
.figure10 .chart2 .g5{left:216px}
.figure10 .chart2 .g6{left:259px}
.figure10 .chart2 .b1{background:url(../images/figure/pattern3.jpg) repeat}
.figure10 .chart2 .b2{left:18px;background:url(../images/figure/pattern4.jpg) repeat}
.figure10 .chart2 .arrow_box{position:absolute;top:15px;left:80px;width:130px;transform:translate(5px, 0);opacity:0}
.figure10 .chart2 .arrow_line{position:absolute;top:60px;left:75px;width:0;transform:rotate(-25deg);opacity:0}

.animated .figure10 .chart1 .value{transition-delay:1.0s;transform:translate(0, 0);opacity:1}
.animated .figure10 .chart1 .g1 .bar{height:57px}
.animated .figure10 .chart1 .g2 .bar{height:70px}
.animated .figure10 .chart1 .g3 .bar{height:80px}
.animated .figure10 .chart1 .g4 .bar{height:92px}
.animated .figure10 .chart2>div>span em{transition-delay:1.0s;transform:translate(0, 0);opacity:1}
.animated .figure10 .chart2 .g1 .b1{height:5px}
.animated .figure10 .chart2 .g1 .b2{height:3px}
.animated .figure10 .chart2 .g2 .b1{height:11px}
.animated .figure10 .chart2 .g2 .b2{height:8px}
.animated .figure10 .chart2 .g3 .b1{height:16px}
.animated .figure10 .chart2 .g3 .b2{height:9px}
.animated .figure10 .chart2 .g4 .b1{height:33px}
.animated .figure10 .chart2 .g4 .b2{height:21px}
.animated .figure10 .chart2 .g5 .b1{height:66px}
.animated .figure10 .chart2 .g5 .b2{height:51px}
.animated .figure10 .chart2 .g6 .b1{height:101px}
.animated .figure10 .chart2 .g6 .b2{height:81px}
.animated .figure10 .chart2 .arrow_box{transition-delay:2.0s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure10 .chart2 .arrow_line{width:180px;transition-delay:1.0s;opacity:1}
/*****************************************************************
  어린이보험 - 특징 2
*****************************************************************/
.figure11{position:relative;width:226px;height:113px;margin:0 auto}
.figure11:before{content:'';position:absolute;bottom:0;left:43px;width:152px;height:75px;background:url(../images/figure/spr_figure11.png) no-repeat;transform:scale(0,0);transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000);background-size: 172px 135px}
.figure11 span{position:absolute;width:43px;height:43px;background:url(../images/figure/spr_figure11.png) no-repeat;opacity:0;background-size: 172px 135px}
.figure11 em{position:absolute;width:7px;height:7px;background:url(../images/figure/spr_figure11.png) -70px -118px no-repeat;background-size: 172px 135px}
.figure11 strong{position:absolute;width:12px;height:12px;background:url(../images/figure/spr_figure11.png) -77px -118px no-repeat;background-size: 172px 135px}
.figure11 .b1{top:56px;left:15px;background-position:0 -75px}
.figure11 .b2{top:15px;left:57px;background-position:-43px -75px}
.figure11 .b3{top:15px;left:130px;background-position:-86px -75px}
.figure11 .b4{top:56px;left:168px;background-position:-129px -75px}
.figure11 .e1{top:99px;left:43px}
.figure11 .e2{top:43px;left:42px}
.figure11 .e3{top:21px;left:94px}
.figure11 .e4{top:47px;left:150px}
.figure11 .e5{top:55px;left:168px}
.figure11 .e6{top:100px;left:185px}
.figure11 .s1{top:54px;left:54px}
.figure11 .s2{top:3px;left:122px}
.figure11 .s3{top:42px;left:182px}
.figure11_info_txt{margin:10px -5px -5px}
.figure11_info_txt .item{width:145px;margin:5px;padding:13px 15px 15px;background-color:#f6f8fa;border-radius:5px;transform:translate(0, 50px);opacity:0;transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.figure11_info_txt .item h4{position:relative;padding-left:25px;margin: 0;margin-bottom: 10px;font-size:14px;font-weight:700;color:#444;line-height: 17px;}
.figure11_info_txt .item h4:after{content:'';position:absolute;left:0;background:url(../images/figure/spr_figure11.png) no-repeat;background-size: 172px 135px}
.figure11_info_txt .item.t1 h4:after{top:0;width:18px;height:18px;background-position:0 -118px}
.figure11_info_txt .item.t2 h4:after{top:0;width:14px;height:18px;background-position:-18px -118px}
.figure11_info_txt .item.t3 h4:after{top:1px;width:19px;height:14px;background-position:-32px -118px}
.figure11_info_txt .item.t4 h4:after{top:0;width:19px;height:16px;background-position:-51px -118px}
.figure11_info_txt .item p{min-height:25px;margin-top:5px;color:#444}
.figure11_info_txt .item span{display:block;margin-top:8px;line-height: 14px;}

.animated .figure11 em{animation:dust 2s infinite}
.animated .figure11 strong{animation:hMetal 2s infinite}
@keyframes dust{
  0%{transform:scale(0,0)}
  50%{transform:scale(1,1)}
  100%{transform:scale(0,0)}
}
@keyframes hMetal{
  0%{transform:scale(1,1)}
  50%{transform:scale(0,0)}
  100%{transform:scale(1,1)}
}
.animated .figure11:before{transition-delay:0.5s;transform:scale(1,1)}
.animated .figure11 .b1{transition-delay:1.5s;left:0;opacity:1}
.animated .figure11 .b2{transition-delay:2s;top:0;left:42px;opacity:1}
.animated .figure11 .b3{transition-delay:2.5s;top:0;left:145px;opacity:1}
.animated .figure11 .b4{transition-delay:3s;left:183px;opacity:1}
.animated .figure11_info_txt .item.t1{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.animated .figure11_info_txt .item.t2{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure11_info_txt .item.t3{transition-delay:2.5s;transform:translate(0, 0);opacity:1}
.animated .figure11_info_txt .item.t4{transition-delay:3s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  어린이보험 - 특징 3
*****************************************************************/
.figure12{position:relative;width:100%;height:134px;margin:0 auto}
.figure12:before{content:'';position:absolute;bottom:0;left:100px;width:120px;height:134px;background:url(../images/figure/spr_figure12.png) no-repeat;transform:scale(0,0);transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000);background-size:120px 152px}
.figure12 span{position:absolute;width:8px;height:8px;background:url(../images/figure/spr_figure12.png) 0 -134px no-repeat;background-size:120px 152px}
.figure12 em{position:absolute;width:10px;height:10px;background:url(../images/figure/spr_figure12.png) -11px -134px no-repeat;background-size:120px 152px}
.figure12 .s1{top:99px;left:72px}
.figure12 .s2{top:3px;left:88px}
.figure12 .s3{top:2px;left:223px}
.figure12 .s4{top:51px;left:245px}
.figure12 .s5{top:109px;left:225px}
.figure12 .e1{top:43px;left:70px}
.figure12 .e2{top:0;left:103px}
.figure12 .e3{top:33px;left:230px}
.figure12 .e4{top:64px;left:240px}
.figure12_info_txt .item{position:relative;margin:8px 0;width: 100%;border:1px solid #e1e1e1;padding-left:65px;border-radius:8px;transform:translate(0, 50px);opacity:0;transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.figure12_info_txt .item.t5{height:90px}
.figure12_info_txt .item h4{position:absolute;top:0;left:0;width:65px;height:100%;border-right:1px solid #e1e1e1;margin: 0;}
.figure12_info_txt .item h4 span{display:block;position:relative;top:50%;font-size:14px;font-weight:700;color:#444;text-align:center;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);}
.figure12_info_txt .item h4 span:before{content:'';display:block;height:40px;margin:0 auto;background:url(../images/figure/spr_figure12.png) no-repeat}
.figure12_info_txt .item.t1 h4 span:before{width:26px;background-position:-46px -268px}
.figure12_info_txt .item.t2 h4 span:before{width:23px;background-position:-77px -268px}
.figure12_info_txt .item.t3 h4 span:before{width:32px;background-position:-105px -268px}
.figure12_info_txt .item.t4 h4 span:before{width:28px;background-position:-142px -268px}
.figure12_info_txt .item.t5 h4 span:before{width:28px;background-position:-175px -268px}
.figure12_info_txt .item ul{padding:15px 0 15px 25px;line-height: 14px;}
.figure12_info_txt .item ul li{position:relative;width:110px;padding:1px 0 1px 7px;color:#444}
.figure12_info_txt .item ul li:before{content:'';position:absolute;top:6px;left:0;width:3px;height:3px;background-color:#fff;border-radius:100%}
.figure12_info_txt .item ul li.blue{color:#3d5fc0; padding-top:10px;}
.figure12_info_txt .item ul li.cb{width:100%}

.animated .figure12:before{transition-delay:0.5s;transform:scale(1,1)}
.animated .figure12 span{animation:plus1 2s infinite}
.animated .figure12 em{animation:plus2 2s infinite}
@keyframes plus1{
0%{transform:scale(0,0)}
50%{transform:scale(1,1)}
100%{transform:scale(0,0)}
}
@keyframes plus2{
0%{transform:scale(1,1)}
50%{transform:scale(0,0)}
100%{transform:scale(1,1)}
}
.figure12_info_txt.animated .item.t1{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.figure12_info_txt.animated .item.t2{transition-delay:1s;transform:translate(0, 0);opacity:1}
.figure12_info_txt.animated .item.t3{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.figure12_info_txt.animated .item.t4{transition-delay:2s;transform:translate(0, 0);opacity:1}
.figure12_info_txt.animated .item.t5{transition-delay:2.5s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  어린이보험 - 특징 4
*****************************************************************/
.figure13 .info li{width:90px;height:90px;margin:0 5px;padding-top:20px;background-color:#dadeed;font-size:12px;color:#444;text-align:center;border-radius:100%;transform:translate(0, 20px);opacity:0}
.figure13 .info li.c2{background-color:#ffefb8}
.figure13 .info li.c3{background-color:#e6ebff}
.figure13 .info li strong{display:block;padding-bottom:3px;font-weight:700}
.figure13 .people{position:relative;height:92px} 
.figure13 .people:before{content:'';position:absolute;bottom:0;left:0;width:300px;height:62px;background-color:#ffefb8;border-radius:62px}
.figure13 .people span{position:absolute;bottom:0;height:77px;background:url(../images/figure/spr_figure13.png) no-repeat;background-size:225px 77px;transition-duration:0.5s;transform:scale(0,0);opacity:0}
.figure13 .people .p1{left:10px;width:37px;background-position:0 0}
.figure13 .people .p2{left:63px;width:49px;background-position:-42px 0}
.figure13 .people .p3{left:124px;width:44px;background-position:-96px 0}
.figure13 .people .p4{left:192px;width:39px;background-position:-145px 0}
.figure13 .people .p5{left:250px;width:37px;background-position:-188px 0}

.figure13 .g_bar_area{position:relative;height:100px;margin:10px 0 0 0;border-width:0 1px;border-style:solid;border-color:#444}
.figure13 .g_bar_area .g_bar{position:absolute;width:0;height:25px;line-height:24px;padding:0;background-color:#dadeed;font-size:13px;text-align:right;opacity:0}
.figure13 .g_bar_area .g_bar:before{content:'';position:absolute;top:0;right:-13px;width:0px;height:0px;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:13px solid #dadeed}
.figure13 .g_bar_area .g_bar.g1{top:10px;left:0;background-color:#dadeed;color:#444}
.figure13 .g_bar_area .g_bar.g1:after{top:-52px;left:-11px;height:22px;background-position:50% 0} 
.figure13 .g_bar_area .g_bar.g2{top:50px;left:0;background:url(../images/figure/pattern4.jpg) repeat;color:#fff}
.figure13 .g_bar_area .g_bar.g2:before{display:none}
.figure13 .g_bar_area .g_bar.g3{top:50px;left:126px;background-color:#fcd110;color:#fff;color:#222}
.figure13 .g_bar_area .g_bar.g3:before{border-left-color:#fcd110}
.figure13 .g_bar_area .g_bar em{opacity:0}
.figure13 .g_bar_area .g_bar .lb{position:absolute;top:0px;left:-31px;font-size:14px;font-weight:700;color:#444}

.animated .figure13 .info li.c1{transform:translate(0, 0);opacity:1}
.animated .figure13 .info li.c2{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure13 .info li.c3{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure13 .people .p1{transform:scale(1,1);opacity:1}
.animated .figure13 .people .p2{transition-delay:1s;transform:scale(1,1);opacity:1}
.animated .figure13 .people .p3{transition-delay:1.5s;transform:scale(1,1);opacity:1}
.animated .figure13 .people .p4{transition-delay:2s;transform:scale(1,1);opacity:1}
.animated .figure13 .people .p5{transition-delay:2.5s;transform:scale(1,1);opacity:1}
.animated .figure13 .g_bar_area .g_bar.g1{transition-delay:1s;width:52px;padding:0 4px;opacity:1}
.animated .figure13 .g_bar_area .g_bar.g2{transition-delay:1s;width:126px;padding:0 15px;opacity:1}
.animated .figure13 .g_bar_area .g_bar.g3{transition-delay:2s;width:158px;padding:0 8px;opacity:1}
.animated .figure13 .g_bar_area .g_bar em{transition-delay:2s;opacity:1}
/*****************************************************************
  어린이보험 - 필요성 1
*****************************************************************/
.figure14 .info h4{font-size:14px;font-weight:700}
.figure14 .info .pie{position:relative;width:172px;height:172px;margin:30px auto 0;background:url(../images/figure/spr_figure14.png) 50% 2px no-repeat;background-size: 170px 182px;}
.figure14 .info .pie .mask{position:absolute;top:0;left:0}
.figure14 .info .pie .mask:before{content:'';position:absolute;top:0;left:86px;width:86px;height:172px;border-radius:0 85px 85px 0;background-color:#fff;transform-origin:center left}
.figure14 .info .pie .mask:after{content:'';position:absolute;top:0;left:0;width:86px;height:172px;border-radius:86px 0 0 86px;background-color:#fff;transition:all 1s 1s linear;transform:rotate(0deg);transform-origin:center right}
.figure14 .info .pie .mask span{position:absolute;top:2px;left:86px;width:86px;height:170px;background:url(../images/figure/spr_figure14.png) -85px 0 no-repeat;transition:all 0s 1s linear;opacity:0;z-index:10;background-size: 170px 182px;}
.figure14 .info .pie em{position:absolute;width:43px;line-height: 16px;color:#444;text-align:center;z-index:20;transform:scale(0,0);opacity:0}
.figure14 .info .pie em strong{font-size:15px}
.figure14 .info .pie .lb1{top:30px;left:97px}
.figure14 .info .pie .lb2{top:88px;left:120px}
.figure14 .info .pie .lb3{top:125px;left:52px;color:#fff}
.figure14 .info .pie .lb4{top:42px;left:22px;color:#fff}
.figure14 .info ul.rm{margin-top:13px;text-align:center}
.figure14 .info ul.rm li{display:inline-block;position:relative;margin:0 5px;padding-left:11px;font-size:12px;color:#444}
.figure14 .info ul.rm li:before{content:'';position:absolute;top:3px;left:0;width:7px;height:7px;background:url(../images/figure/spr_figure14.png) 0 -85px no-repeat;background-size: 170px 182px;}
.figure14 .info ul.rm li.r2:before{background-position:-12px -175px}
.figure14 .info ul.rm li.r3:before{background-position:-24px -175px}
.figure14 .info ul.rm li.r4:before{background-position:-36px -175px}
.figure14 .info .tbl{transform:translate(0, 25px);opacity:0}

.animated .figure14 .info .pie .mask:before{animation:pieBig 1s forwards linear}
.animated .figure14 .info .pie .mask:after{transform:rotate(180deg)}
.animated .figure14 .info .pie .mask span{opacity:1}
.animated .figure14 .info .pie em{transition-delay:2s;transform:scale(1,1);opacity:1}
.animated .figure14 .info .tbl{transform:translate(0, 0);opacity:1}
@keyframes pieBig {
  0%{opacity:1;transform:rotate(0deg)}
  99%{opacity:1;transform:rotate(180deg)}
  100%{opacity:0;transform:rotate(180deg)}
}
/*****************************************************************
  어린이보험 - 필요성 2
*****************************************************************/
.figure15 h4{height:30px;line-height:28px !important;background-color:#e8edf3;font-size:13px !important;text-align:center;border-radius:7px;margin:0 !important}
.figure15 .chart{position:relative;margin-top:13px;padding-left:30px}
.figure15 .chart:before{content:'';display:block;width:1px;height:120px;background-color:#444}
.figure15 .chart:after{content:'';position:absolute;top:120px;left:30px;right:0;height:1px;background-color:#444}
.figure15 .chart em{position:absolute;left:-6px;width:30px;line-height:16px;font-size:14px;font-weight:700;color:#444;text-align:right}
.figure15 .chart .e1{top:0}
.figure15 .chart .e2{top:50%;margin-top:-4px}
.figure15 .chart .e3{bottom:0}
.figure15 .chart div{position:absolute;bottom:-1px;width:65px}
.figure15 .chart div .bar{position:absolute;bottom:0;left:0;width:100%;height:0;border:0 solid #444;border-radius:4px 4px 0 0}
.figure15 .chart div .bar .value{display:block;padding-top:4px;font-size:14px;font-weight:500;color:#fff;text-align:center;transform:scale(0,0);opacity:0}
.figure15 .chart div .bar .p{position:absolute;top:-31px;left:50%;width:28px;margin-left:-14px;background:url(../images/figure/spr_figure15.png) no-repeat;transform:scale(0,0);opacity:0;background-size: 28px 103px;}
.figure15 .chart div .lb{position:absolute;bottom:-33px;left:0;width:100%;font-size:12px;font-weight:700;color:#444;text-align:center}
.figure15 .chart .g3 .lb{bottom: -22px;}
.figure15 .chart div .lb:before{content:'';position:absolute;top:-12px;left:50%;width:4px;height:4px;margin-left:-2px;border:1px solid #444;background-color:#fff;border-radius:100%;z-index:10}
.figure15 .chart .g1{left:55px}
.figure15 .chart .g2{left:128px}
.figure15 .chart .g3{left:200px}
.figure15 .chart .g1 .bar{background-color:#ffefb8}
.figure15 .chart .g2 .bar{background-color:#3d5fc0}
.figure15 .chart .g3 .bar{background-color:#3eb8c7}
.figure15 .chart .g1 .bar .p{height:31px;background-position:0 0}
.figure15 .chart .g1 .bar .value{position:absolute;top:-45px;left:0;width:65px;padding:0;color:#444}
.figure15 .chart .g2 .bar .p{height:31px;background-position:0 -34px}
.figure15 .chart .g3 .bar .p{top:-36px;height:36px;background-position:0 -67px}
.figure15 .chart .g3 .bar .value{position:absolute;top:-50px;left:0;width:65px;padding:0;color:#444}
.figure15 .list_guide{margin-top:50px !important}

.animated .figure15 .chart .g1 .bar .p{transform:scale(1,1);opacity:1}
.animated .figure15 .chart .g2 .bar .p{transition-delay:0.5s;transform:scale(1,1);opacity:1}
.animated .figure15 .chart .g3 .bar .p{transition-delay:1s;transform:scale(1,1);opacity:1}
.animated .figure15 .chart .g1 .bar{transition-delay:2s;height:21px;border-width:1px}
.animated .figure15 .chart .g2 .bar{transition-delay:2s;height:88px;border-width:1px}
.animated .figure15 .chart .g3 .bar{transition-delay:2s;height:6px;border-width:1px}
.animated .figure15 .chart div .value{transition-delay:2.5s;transition-duration:0.5s;transform:scale(1,1);opacity:1}
/*****************************************************************
  정기보험 - 필요성 1 
*****************************************************************/
.figure16{height:206px}
.figure16 .txt1{position:relative;width:224px;height:21px;background:url(../images/figure/spr_figure16.png) no-repeat;background-size: 224px 134px;margin: 0 auto;}
.figure16 .txt1:after{content:'';position:absolute;top:0;right:0;width:100%;height:21px;background-color:#fff}
.figure16 .txt2{margin-top:16px;font-size:14px;color:#444;transform:translate(0, 20px);opacity:0}
.figure16 .txt3{margin-top:10px;font-size:14px;color:#3d5fc0;transform:translate(0, 20px);opacity:0}
.figure16 .family{position: relative;top: 0;left: 0;margin: 0 auto;margin-top: 25px;width: 184px;height: 118px;text-align: center;}
.figure16 .family:before{content:'';display:block;height:101px;background:url(../images/figure/spr_figure16.png) 0 -24px no-repeat;transform:scale(0,0);opacity:0;background-size: 224px 134px}
.figure16 .family:after{content:'';display:inline-block;width:68px;height:7px;margin-top:10px;background:url(../images/figure/spr_figure16.png) 0 -127px no-repeat;transform:translate(0, -5px);opacity:0;background-size: 224px 134px}

.animated .figure16 .txt1:after{transition-duration:2s;width:0}
.animated .figure16 .txt2{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure16 .txt3{transition-delay:3s;transform:translate(0, 0);opacity:1}
.animated .figure16 .family:before{transform:scale(1,1);opacity:1}
.animated .figure16 .family:after{transition-delay:1s;transform:translate(0, 0);transition-duration:0.5s;opacity:1}
/*****************************************************************
  정기보험 - 필요성 2
*****************************************************************/
.figure17 .info_list{margin:0 -13px}
.figure17 .info_list .item{position:relative;width:100%;margin:0 7px;margin-top: 10px;padding:20px 15px 15px 67px;background-color:#f6f8fa;border-radius:5px;transform:translate(0, 25px);opacity:0}
.figure17 .info_list .item.t1{margin-top: 0;}
.figure17 .info_list .item:before{content:'';position:absolute;top:35px;left:15px;background:url(../images/figure/spr_figure17.png) no-repeat;background-size: 120px 61px}
.figure17 .info_list .item.t3,.figure17 .info_list .item.t4{margin-top: 10px;}
.figure17 .info_list .item.t1:before{width:42px;height:36px;background-position:0 0}
.figure17 .info_list .item.t2:before{width:32px;height:38px;left: 18px;background-position:-42px 0}
.figure17 .info_list .item.t3:before{width:40px;height: 34px;background-position:-80px 0}
.figure17 .info_list .item.t4:before{width:13px;background-position:-61px 0}
.figure17 .info_list .item h4{font-size:14px;font-weight:700;color:#444;margin: 0;line-height: 1em;word-break: keep-all}
.figure17 .info_list .item .txt1{margin-top:8px;font-size:11px;color:#444}
.figure17 .info_list .item .txt1 span{font-size:14px}
.figure17 .info_list .item .txt1 strong{font-weight:700;color:#3d5fc0}
.figure17 .info_list .item .txt2{margin-top:10px;color:#777;line-height: 1.25em;}
.figure17 .arrow{position: relative;width:79px;height:14px;border:0;left:100px;margin-top: 25px;padding: 0;background:url(../images/figure/spr_figure17.png) 0 -21px no-repeat;transform:translate(0, -15px);opacity:0;background-size: 79px 33px}
.figure17 .box_txt{margin-top:10px;font-size:16px;font-weight:500;transform:translate(0, -15px);opacity:0}
.figure17 .box_txt strong{font-weight:700;color:#3d5fc0}

.animated .figure17 .info_list .item.t1{transform:translate(0, 0);opacity:1}
.animated .figure17 .info_list .item.t2{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure17 .info_list .item.t3{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure17 .info_list .item.t4{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.animated .figure17 .arrow{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure17 .box_txt{transition-delay:3s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  정기보험 - 필요성 3
*****************************************************************/
.figure18 .info h4{line-height:22px;background-color:#e8edf3;font-size:13px;text-align:center;border-radius:7px;margin: 0;padding: 7px;word-break: keep-all}
.figure18 .info p{margin-top:15px;font-size:12px;font-weight:500;color:#444;text-align:center}
.figure18 .info p strong{font-weight:700;color:#445bcd;word-break: keep-all}
.figure18 .info .chart{position:relative;margin-top:20px}
.figure18 .info .chart:after{content:'';display:block;height:2px;background-color:#444}
.figure18 .info .chart ul{position:relative;}
.figure18 .info .chart ul li{position:relative;height:61px}
.figure18 .info .chart .bar{position:absolute;bottom:-1px;left:50%;width:25px;height:0;margin-left:-15px;border:1px solid #444;background-color:#3d5fc0;border-radius:5px 5px 0 0;opacity:0}
.figure18 .info .chart .bar em{position:absolute;top:-18px;left:-7px;font-size:14px;font-weight:500;text-align:center;transform:translate(0, 10px);opacity:0}
.figure18 .info .chart .lb{display:block;margin-top:70px;font-size:14px;font-weight:700;text-align:center}
.figure18 .info .pie_area{margin:25px 10px 0}
.figure18 .info .pie_area .pie{position:relative;width:54px;height:54px;margin:0 auto;background:url(../images/figure/spr_figure18.png) no-repeat;background-size: 166px 52px;}
.figure18 .info .pie_area .pie.p1{background-position:1px 1px}
.figure18 .info .pie_area .pie.p2{background-position:-56px 1px}
.figure18 .info .pie_area .pie.p3{background-position:-113px 1px}
.figure18 .info .pie_area .pie .mask{position:absolute;top:0;left:0}
.figure18 .info .pie_area .pie .mask:before{content:'';position:absolute;top:0;left:27px;width:27px;height:54px;border-radius:0 27px 27px 0;background-color:#fff;transform-origin:center left}
.figure18 .info .pie_area .pie .mask:after{content:'';position:absolute;top:0;left:0;width:27px;height:54px;border-radius:27px 0 0 27px;background-color:#fff;transition:all 1s 1s linear;transform:rotate(0deg);transform-origin:center right}
.figure18 .info .pie_area .pie .mask span{position:absolute;top:1px;left:27px;width:26px;height:52px;background:url(../images/figure/spr_figure18.png) no-repeat;transition:all 0s 1s linear;opacity:0;z-index:10;background-size: 166px 52px;}
.figure18 .info .pie_area .pie .counter{position:absolute;top:0;left:0;width:100%;height:100%;line-height:54px;font-size:11px;text-align:center;z-index:20}
.figure18 .info .pie_area .pie .counter span{display:inline-block;line-height:10px;width:25px;overflow:hidden;font-size:11px;font-weight:700}
.figure18 .info .pie_area .pie.p1 .mask span{background-position:-26px 0}
.figure18 .info .pie_area .pie.p1 .counter{font-size:11px;font-weight:700}
.figure18 .info .pie_area .pie.p2 .mask span{background-position:-83px 0}
.figure18 .info .pie_area .pie.p3 .mask span{background-position:-140px 0}
.figure18 .info .pie_area .lb{display:block;margin-top:10px;font-size:11px;font-weight:500;color:#444;text-align:center;word-break: keep-all}
.animated .figure18 .info .chart .bar{transition-duration:2s;opacity:1}
.animated .figure18 .info .chart .g1 .bar{height:50px}
.animated .figure18 .info .chart .g2 .bar{height:43px}
.animated .figure18 .info .chart .g3 .bar{height:53px}
.animated .figure18 .info .chart .g4 .bar{height:40px;background-color:#dadeed}
.animated .figure18 .info .chart .g5 .bar{height:43px;background-color:#dadeed}
.animated .figure18 .info .chart .bar em{transition-delay:2s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure18 .info .pie_area .pie .mask:before{animation:pieS 1s forwards linear}
.animated .figure18 .info .pie_area .pie .mask:after{transform:rotate(180deg)}
.animated .figure18 .info .pie_area .pie .mask span{opacity:1}
@keyframes pieS {
  0%{opacity:1;transform:rotate(0deg)}
  99%{opacity:1;transform:rotate(180deg)}
  100%{opacity:0;transform:rotate(180deg)}
}
/*****************************************************************
  정기보험 - 필요성 4
*****************************************************************/
.figure19 .tbl{transform:translate(0, 50px);opacity:0}
.figure19 .info{position:relative;height:167px;margin-top:15px;border:1px solid #e1e1e1;border-radius:10px;text-align:center;transform:translate(0, 50px);opacity:0}
.figure19 .info:after{content:'';position:absolute;top:0;left:50%;width:1px;height:100%;background-color:#e1e1e1}
.figure19 .info h4{padding-top:15px;font-size:14px;font-weight:500;margin: 0;word-break: keep-all}
.figure19 .info p{padding-top:10px;color:#444;word-break: keep-all}
.figure19 .info .item{padding: 0 7px;}

.animated .figure19 .tbl{transform:translate(0, 0);opacity:1}
.animated .figure19 .info{transition-delay:1s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  연금보험 - 특징 1
*****************************************************************/
.figure20 .tbl{transform:translate(0, 50px);opacity:0}
.animated .figure20 .tbl{transform:translate(0, 0);opacity:1}
/*****************************************************************
  연금보험 - 특징 2
*****************************************************************/
.figure21{position:relative;width:188px;height:103px;margin:0 auto}
.figure21:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background-color:#444}
.figure21 .bar{position:absolute;bottom:0;left:10px;width:70px;height:103px;border:1px dotted #b4b4b4;border-radius:5px}
.figure21 .bar .g{position:absolute;bottom:-1px;left:-1px;width:70px;height:103px;padding-top:8px;border:1px solid #444;background-color:#3eb8c7;font-size:13px;color:#fff;text-align:center;border-radius:5px;transition-duration:2s}
.figure21 .bar .arrow_line{position:absolute;width:38px;opacity:0;transition-duration:2s}
.figure21 .bar em{position:absolute;top:43px;font-size:12px;font-weight:500;color:#445bcd;opacity:0}
.figure21 .b1 .arrow_line{top:25px;left:-30px;transform:rotate(90deg)}
.figure21 .b1 em{left:-61px;transform:translate(5px, 0)}
.figure21 .b2 .arrow_line{top:75px;right:-30px;transform:rotate(-90deg)}
.figure21 .b2 em{right:-37px;transform:translate(-5px, 0)}
.figure21 .b2{left:108px}
.figure21 .b2 .g{height:51px;background-color:#445bcd}

.animated .figure21 .bar .g{height:51px}
.animated .figure21 .b2 .g{height:103px}
.animated .figure21 .b1 .arrow_line{top:50px;opacity:1}
.animated .figure21 .b2 .arrow_line{top:50px;opacity:1}
.animated .figure21 .bar em{transition-delay:2s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  연금보험 - 특징 3
*****************************************************************/
.figure22 .info{border-top:2px solid #444}
.figure22 .info .item, .figure40 .info .item{display:table;position:relative;width:100%;padding: 10px 0;padding-left:100px;transform:translate(0, 25px);opacity:0}
.figure22 .info .item:before{content:'';position:absolute;left:16px;width:65px;background:url(../images/figure/spr_figure22.png) no-repeat; background-size: 65px 148px;}
.figure22 .info .item.t1:before{top:18px;height:49px;background-position:0 0}
.figure22 .info .item.t2:before{top:22px;height:50px;background-position:0 -98px}
.figure22 .info .item.t3:before{top:17px;height:39px;background-position:0 -54px}
.figure22 .info .item .inner{display:table-cell;vertical-align:middle}
.figure22 .info .item h4{font-size:14px;font-weight:700;color:#444;margin: 0;line-height: 18px}
.figure22 .info .item p{margin-top:5px;color:#444}
.figure22 .btn_set{transform:translate(0, 25px);opacity:0}

.animated .figure22 .info .item.t1, .animated .figure40 .info .item.t1{transform:translate(0, 0);opacity:1}
.animated .figure22 .info .item.t2, .animated .figure40 .info .item.t2{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure22 .info .item.t3, .animated .figure40 .info .item.t3{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure22 .btn_set{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  원금보장저축보험 - 특징 1
*****************************************************************/
.figure23 .chart{position:relative;height:135px;font-size:14px;font-weight:700;color:#444}
.figure23 .chart:before{content:'';position:absolute;top:0;left:30px;width:2px;height:115px;background-color:#444}
.figure23 .chart:after{content:'';position:absolute;top:115px;left:30px;right:0;height:2px;background-color:#444}
.figure23 .chart .value{position:absolute;top:0;left:-15px;width:40px;line-height:14px}
.figure23 .chart .v2{top:58px}
.figure23 .chart em{position:absolute;bottom:0;left:45px;text-align:center}
.figure23 .chart em:after{content:'';position:absolute;bottom:20px;left:50%;width:1px;height:115px;border-right:2px dotted #b4b4b4}
.figure23 .chart .g_line{position:absolute;top:11px;left:31px;width:0;height:50px;background:url(../images/figure/spr_figure23.png) no-repeat;opacity:0;background-size: 238px 156px;}
.figure23 .chart .g_line:after{content:'';position:absolute;bottom:1px;left:30px;width:7px;height:7px;border:1px solid #445bcd;background-color:#fff;border-radius:100%;transform:scale(0,0);opacity:0}
.figure23 .chart .g_area{position:absolute;top:14px;left:31px;width:236px;height:0;background:url(../images/figure/spr_figure23.png) 0 -55px no-repeat;z-index:-1;opacity:0;background-size: 238px 156px;}
.figure23 .chart .line{position:absolute;top:114px;left:31px;width:0;height:2px;background-color:#3eb8c7}
.figure23 .chart .g2{left:103px}
.figure23 .chart .g3{left:153px}
.figure23 .chart .g4{left:203px}
.figure23 .chart .g5{left:253px}

.animated .figure23 .chart .g_line{width:238px;opacity:1}
.animated .figure23 .chart .g_line:after{transition-delay:1s;transition-duration:0.5s;transform:scale(1,1);opacity:1}
.animated .figure23 .chart .g_area{transition-delay:1.5s;height:101px;opacity:1}
.animated .figure23 .chart .line{transition-delay:2.5s;top:61px;width:270px}
/*****************************************************************
  원금보장저축보험 - 특징 1
*****************************************************************/
.figure24{position:relative}
.figure24 .info{position:relative;height:285px}
.figure24 .info h4{height:30px;line-height:28px;background-color:#e8edf3;font-size:13px;text-align:center;border-radius:7px}
.figure24 .info .purse{position:relative;width:157px;height:154px;margin:45px auto 0;background:url(../images/figure/spr_figure24.png) no-repeat;transform:scale(0,0);opacity:0}
.figure24 .info .purse:before{content:'';position:absolute;top:104px;left:108px;width:23px;height:24px;background:url(../images/figure/spr_figure24.png) -83px -163px no-repeat;transform:scale(1,1) translate(0, 0)}
.figure24 .info .purse .tax{position:absolute;bottom:41px;left:83px;width:73px;height:56px;background:url(../images/figure/spr_figure24.png) 0 -163px no-repeat;opacity:0}
.figure24 .info .purse .tax span{position:absolute;top:-25px;left:50px;width:80px;font-size:16px;font-weight:700;color:#ff8a6e;text-align:center;z-index:-1}
.figure24 .info .purse .tax span em{transform:translate(0, -10px);opacity:0}
.figure24 .info .purse .tax span:before{content:''; position:absolute;top:59px;left:9px;width:0;height:2px;background-color:#ff8a6e}
.figure24 .info .purse .tax span:after{content:''; position:absolute;bottom:-28px;left:37px;width:2px;height:0;background-color:#ff8a6e}
.figure24 .info .lb{display:block;margin-top:25px;font-size:14px;font-weight:700;color:#444;text-align:center}

.animated .figure24 .info .purse{transform:scale(1,1);opacity:1}
.animated .figure24 .info .purse .tax{transition-delay:1s;opacity:1}
.animated .figure24 .info .purse.p1:before{transition-delay:1s;transform:scale(0.7,0.7) translate(0, 20px)}
.animated .figure24 .info .purse .tax span:before{transition-delay:2s;transition-duration:0.5s;width:30px}
.animated .figure24 .info .purse .tax span:after{transition-delay:2.5s;transition-duration:0.5s;height:26px}
.animated .figure24 .info .purse .tax span em{transition-delay:3s;transition-duration:0.5s;transform:translate(0, 0);opacity:1}
/*****************************************************************
  원금보장저축보험 - 특징 2 , 3
*****************************************************************/
.figure25{position:relative;width:300px;height:135px;margin:0 auto}
.figure25:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background-color:#444}
.figure25 .savings{position:absolute;top:2px;left:50px;width:200px;height:35px;line-height:30px;border:2px solid #444;background-color:#445bcd;font-size:14px;color:#fff;text-align:center;border-radius:7px;transform:scale(0,0);opacity:0}
.figure25 .plus{position:absolute;top:32px;left:50%;width:10px;height:10px;margin-left:-5px;background:url(../images/figure/ico_plus.png) no-repeat;background-size:10px 10px;z-index:10;transform:scale(0,0) rotate(360deg);opacity:0}
.figure25 .bar{position:absolute;bottom:0;left:50px;width:200px;height:100px;border:2px dotted #b4b4b4;border-radius:7px}
.figure25 .bar .g{position:absolute;bottom:-2px;left:-2px;width:200px;height:0;padding-top:15px;border:2px solid #444;background-color:#3eb8c7;font-size:14px;color:#fff;text-align:center;border-radius:7px;transition-duration:2s}
.animated .figure25 .bar .g{height:100px}
.animated .figure25 .savings{transition-delay:2s;transform:scale(1,1);opacity:1}
.animated .figure25 .plus{transition-delay:3s;transform:scale(1,1) rotate(0deg);opacity:1}
/*****************************************************************
  원금보장저축보험 - 특징 4
*****************************************************************/
.figure26 td strong{display:inline-block;padding:11px 0;font-size:14px}
.figure26 .tbl{transform:translate(0, 25px);opacity:0}
.animated .figure26 .tbl{transform:translate(0, 0);opacity:1}
/*****************************************************************
  원금보장저축보험 - 특징 5
*****************************************************************/
.figure27 ul{margin:-18px -30px}
.figure27 li{margin:18px 0;text-align:center;transform:translate(0, 30px);opacity:0}
.figure27 li:before{content:'';display:block;width:100px;height:100px;margin:0 auto 10px;background:url(../images/figure/spr_figure27.png) no-repeat}
.figure27 li.t1:before{background-position:0 0}
.figure27 li.t2:before{background-position:-110px 0}
.figure27 li.t3:before{background-position:-220px 0}
.figure27 li.t4:before{background-position:-330px 0}
.figure27 li.t5:before{background-position:0 -106px}
.figure27 li.t6:before{background-position:-110px -106px}
.figure27 li.t7:before{background-position:-220px -106px}
.figure27 li.t8:before{background-position:-330px -106px}

.animated .figure27 li.t1{transform:translate(0, 0);opacity:1}
.animated .figure27 li.t2{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t3{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t4{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t5{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t6{transition-delay:2.5s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t7{transition-delay:3s;transform:translate(0, 0);opacity:1}
.animated .figure27 li.t8{transition-delay:3.5s;transform:translate(0, 0);opacity:1}


/*2022.09.21 치매보험*/
.figure3 .g_bar.g3 .bar2_2, .figure3 .g_bar.g4 .bar3_2 {margin-bottom:0; left:4px;}
.g_bar.g3 .p_txt{position: absolute; width:74px; height:0px; display: block; margin-top: -2px; left:50%; margin-left:-36px; background:url(../images/figure/spr_figure28.png)no-repeat; background-position-x:-10px; background-size: 94px; opacity: 0}
.g_bar.g4 .p_txt{position: absolute; width:74px; height:0px; display: block; margin-top: -45px; left:50%; margin-left:-37px; background:url(../images/figure/spr_figure28.png)no-repeat; background-position:-10px -31px; background-size: 94px; opacity: 0}
.de_con_wrap {text-align: center; width:100% !important;}
.de_con_wrap .de_con {display: block; width: 0; height: 190px; margin:60px auto 0; background:url(../images/figure/spr_figure28.png) no-repeat; background-position: -1px -85px; opacity: 0; background-size: 130px;}

.animated .figure3 .g_bar.g3 .bar2_2 {height:100px;}
.animated .figure3 .g_bar.g4 .bar3_2 {height:140px;}
.animated .figure3 .g_bar.g3 .p_txt {opacity: 1; height:30px; transition-delay: 2s;}
.animated .figure3 .g_bar.g4 .p_txt {opacity: 1; height:30px; transition-delay: 3s;}
.animated .figure3 .de_con_wrap .de_con {width: 130px; transition-delay: 3.5s; opacity: 1;}
.de_txt {position:absolute; top:-40px;}
.list_s1 li span {font-weight: bold;}


.figure1_1:before {width:66.6%;}



/*2022.10.12 암치료보험*/
.figure28 {position: relative; width: 250px; height:230px; margin:0 auto;}
.figure28:before {content: ''; position: absolute; bottom:0; width: 250px; left:50%; margin-left:-125px; height:200px; background: url(../images/figure/spr_figure31.png)no-repeat; transform: scale(0,0); transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); background-size: 250px; opacity: 0;} 
.figure28 h4 {text-align: center; padding-top:220px; font-size:18px; color:#444; font-weight:700; transform:scale(0, 0);transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); opacity: 0}

.animated .figure28 h4, .animated .figure29 h4 {transition-delay:0.3s;transform:scale(1,1); opacity: 1;}
.animated .figure28:before{transition-delay:0.5s;transform:scale(1,1); opacity: 1;}


.figure28_info_txt{margin:25px -25px -15px}
.figure28_info_txt .item{position:relative;width:135px;height:150px;margin:15px;border:1px solid #e1e1e1;padding-top:70px;border-radius:8px;transform:translate(0, 50px);opacity:0;transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.figure28_info_txt .item:after {content: ''; position: absolute; width:20px; height:20px; background:url(../images/figure/spr_figure31.png) no-repeat; background-position: -196px -325px; top:50%; right:-26px; opacity: 0;transform:translate(10px, 0px);transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.figure28_info_txt .item.t3, .figure28_info_txt .item.t4 {height:160px;}
.figure28_info_txt .item.t5:after {width:0;}
.figure28_info_txt .item h4{position:absolute;top:0;left:0;width:100%;height:50px;text-align:center;border-bottom:1px solid #e1e1e1;}
.figure28_info_txt .item p {text-align: center; padding-top: 5px; font-size: 11px;}
.figure28_info_txt .item h4 span{display:inline-block;position:relative;line-height:45px;font-size:15px;font-weight:700;color:#444;text-align:center; margin-left:-10px;}
.figure28_info_txt .item h4 span:before{content:'';display:inline-block;height:37px; vertical-align:middle; margin:0 auto;background:url(../images/figure/spr_figure31.png) no-repeat; background-position: 0 -316px; margin-right:10px;}
.figure28_info_txt .item.t1 h4 span:before{width:24px;background-position-x:0}
.figure28_info_txt .item.t2 h4 span:before{width:34px;background-position-x:-32px}
.figure28_info_txt .item.t3 h4 span:before{width:24px;background-position-x:-73px}
.figure28_info_txt .item.t4 h4 span:before{width:37px;background-position-x:-103px; margin-right: 0}
.figure28_info_txt .item.t5 h4 span:before{width:35px;background-position-x:-144px}
.figure28_info_txt .item {padding:65px 0 0}
.figure28_info_txt .item ul.w2{width:310px}
.figure28_info_txt .item ul li{position:relative;width:210px;padding:1px 0 1px 11px;color:#444}/**/
.figure28_info_txt .item ul li:before{content:'';position:absolute;top:12px;left:0;width:3px;height:3px;background-color:#fff;border-radius:100%}
.figure28_info_txt .item ul li.blue{color:#3d5fc0; padding-top:10px;}

.figure28_info_txt .item ul li.cb{width:100%}

.animated .figure28_info_txt .item:after {transition-delay:4s;transform:translate(0, 0);opacity:1}
.animated .figure28_info_txt .item.t1{transition-delay:0.5s;transform:translate(0, 0);opacity:1}
.animated .figure28_info_txt .item.t2{transition-delay:1s;transform:translate(0, 0);opacity:1}
.animated .figure28_info_txt .item.t3{transition-delay:1.5s;transform:translate(0, 0);opacity:1}
.animated .figure28_info_txt .item.t4{transition-delay:2s;transform:translate(0, 0);opacity:1}
.animated .figure28_info_txt .item.t5{transition-delay:2.5s;transform:translate(0, 0);opacity:1}


.figure29{position:relative;width:300px;height:250px;margin:0 auto}
.figure29 h4 {text-align: center;padding-top: 300px;font-size: 18px;color: #444;font-weight: 700; padding-top:200px; transform: scale(0, 0);opacity: 0;}
.figure29:before {content:''; position:absolute; width:210px; height:200px; transform:scale(0,0); transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); background:url(../images/figure/spr_figure32.png)no-repeat -64px 0; left:50%; margin-left:-105px; background-size: 340px;}
.figure29 strong{position:absolute;width:47px;height:47px;background:url(../images/figure/spr_figure32.png) no-repeat; background-size: 250px; opacity:0}
.figure29 strong > span {display:inline-block; text-align: center; width:50px; padding-top:50px; line-height: 1.3;}
.figure29 strong.b2 > span {width:67px; margin-left:-9px;}
.figure29 strong.b5 > span {width:67px; margin-left:-9px;}
.figure29 .b1{top:112px;left:30px;background-position:0 -150px}
.figure29 .b2{top:75px;left:70px;background-position:-51px -150px}
.figure29 .b3{top:30px;left:159px;background-position:-102px -150px}
.figure29 .b4{top:30px;left:200px;background-position:-153px -150px}
.figure29 .b5{top:112px;left:230px;background-position:-204px -150px}

.figure29 .sso {position: absolute;width: 8px;height: 8px;background: url(../images/figure/spr_figure12.png) 0 -134px no-repeat; background-size: 120px 152px;}
.figure29 .ssb {position: absolute;width: 10px;height: 10px;background: url(../images/figure/spr_figure12.png) -11px -134px no-repeat; background-size: 120px 152px;}
.figure29 .s1{top:120px;left:-20px}
.figure29 .s2{top:0px;left:100px}
.figure29 .s3{top:102px;left:240px}
.figure29 .e1{top:110px;left:80px}
.figure29 .e2{top:-30px;left:300px}
.figure29 .e3{top:60px;left:280px}


.animated .figure29:before {transition-delay: 0.5s; transform: scale(1,1);}
.animated .figure29 .b1{transition-delay:1.5s;left:0;opacity:1}
.animated .figure29 .b2{transition-delay:2s;top:15px;left:35px;opacity:1}
.animated .figure29 .b3{transition-delay:2.5s;top:-60px;left:150px;opacity:1}
.animated .figure29 .b4{transition-delay:3s;top:0;left:240px;opacity:1}
.animated .figure29 .b5{transition-delay:3.5s;top:80px;left:260px;opacity:1}
.animated .figure29 .sso {animation: plus1 2s infinite;}
.animated .figure29 .ssb {animation: plus2 2s infinite;}


.animated .figure3 .g_bar.g4 .bar3.bar3_3 {height:255px;}

.figure30 {height:160px;}
.figure30:before {background:url(../images/figure/spr_figure33.png)no-repeat 0 0; height: 160px; background-size: cover;}
.figure30 strong {background:url(../images/figure/spr_figure33.png)no-repeat; background-size:150px;}
.figure30 strong.b2 {background-position: 0 -128px}
.figure30 strong.b4 {background-position: -53px -128px}
.figure30 strong.b2 > span, .figure30 strong.b4 > span {width:80px; margin-left:-20px;}


.figure31:before {background:url(../images/figure/spr_figure34.png)no-repeat -64px 0; left:50%; margin-left:-105px; background-size: 340px;}
.figure31 strong {background:url(../images/figure/spr_figure34.png)no-repeat; background-size:250px;}
.figure31 strong span {width:70px; margin-left: -15px;}
.figure31 strong.b2 span {width:105px; margin-left: -32px;}
.figure31 strong.b3 span {width:111px; margin-left: -34px;}
.figure31 strong.b5 span {width:105px; margin-left: -32px;}

.animated .figure31 .b3 {top:-65px;}
.animated .figure31 .b4 {top:-5px;}
.animated .figure31 .b5 {top:100px;}


/*20230920 미니저축보험*/
.figure32:before {content: ''; position: absolute; top: 194px; left: 0; width: 100%; height: 2px; background-color: #444;}
.figure32 .mini .inner{position:relative;height: 220px;}
.figure32 .mini .chart{position: absolute;top:65px;left:15px;width:40%;height: 190px;}
.figure32 .mini .chart .value{position:absolute;bottom:60px;left:0;width:100%;height:0;padding-top:20px;border:1px solid #444;background-color:#445bcd;font-size:17px;line-height:1.3;color:#fff;text-align:center;border-radius:5px;overflow:hidden;opacity:0}
.figure32 .mini .chart .lb{position: absolute;display:block;font-size:14px;font-weight:700;color:#444;text-align:center;bottom: 35px;width: 100%;}
.figure32 .mini .chart.c1 .value{background-color:#3eb8c7}
.figure32 .mini .chart.c2{left:55%}

.animated .figure32 .mini .chart.c1 .value{height:100px;opacity:1}
.animated .figure32 .mini .chart.c2 .value{height:200px;opacity:1}


.figure33{height:180px; padding:20px 15px;}
.figure33 .g_bar_area {width:278px;}
.figure33 .g_bar_area .g_bar {width:53px;}
.figure33 .g_bar_area .g_bar em {margin-left:-43px;}
.figure33 .g_bar_area .g_bar.g5 em {width:45px; margin-left:-1px; bottom:-30px;}
.figure33 .g_bar_area .rm {left:-20px;}
.figure33 .g_bar_area .rm2 {top:49px; left:-32px;}
.figure33 .g_bar_area .bar_line.bl3 span {top:4px;}
.figure33 .bl4 span {top:-10px; overflow: hidden; width:280px; height: 125px !important;}
.figure33 .bl4 span svg {width: 0;}
.figure33 .bl4 span .arrow_m {position: absolute; top: 11px; right: 9px; width: 0px; height: 0px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #3d5fc0; transform: rotate(-30deg); -webkit-transform: rotate(-30deg); opacity: 0;}
.bar_ball {position: absolute; top: 48px; left: 49px; width: 8px; height: 8px; border: 1px solid #3d5fc0; background-color: #fff; border-radius: 100%; z-index:9;}
.figure33 .g_bar_area .box {width:265px;}
.svg_round > div {position: absolute; background: #fff;}
.svg_round .svg_rd1 {width:300px; height:5px; top:0; left:0; border-radius: 0 0 8px 0;}
.svg_round .svg_rd2 {width:49px; height:55px; left: 0; border-radius: 0 0 10px 0;}
.svg_round .svg_rd3 {width:120px; height:88px; top:-40px; left: 31px; transform: rotate(-7deg); -webkit-transform: rotate(-7deg); border-radius: 10px 0 33px 0;}
.svg_round .svg_rd4 {width:129px; height:81px; top:-43px; left:99px; transform:rotate(-11deg); -webkit-transform:rotate(-11deg); border-radius: 0 0 35px 30px;}
.svg_round .svg_rd5 {width:60px; height:60px; top:-42px; left:201px; border-radius: 0 0 8px 0px; transform:rotate(-22deg); -webkit-transform:rotate(-22deg);}
.figure33 .g_bar_area .bar_line .lb {top:31px; left:28px; width:102px;}
.figure33 .g_bar_area .bar_line .lb em {font-size: 14px;}
.figure33 .g_bar_area .bar_line.bl3 .lb {top:-80px; left:200px; text-align: center;}

.animated .figure33 .g_bar_area .bar_line.bl3 span, .animated .figure33 .g_bar_area .bar_line.bl3:before {transition-delay: 0s;}
.animated .figure33 .g_bar_area .bar_line.bl3 span {width:263px;}
.animated .figure33 .g_bar_area .bar_line.bl3 span:after {transition-delay: 0.5s}
.animated .figure33 .g_bar_area .bar_line.bl4 span svg {transition-delay: 1s; width:270px;}
.animated .figure33 .bl4 span .arrow_m {transition-delay: 2s; opacity: 1;}
.animated .figure33 .g_bar_area .box {width:265px; height: 110px; transition-delay: 2.5s;}


.figure34{position:relative;height:206px;background: url(../images/figure/spr_figure36.png) no-repeat; background-size: cover;transform:scale(0.8,0.8); -webkit-transform:scale(0.8,0.8);}
.figure34 span{position:absolute;width:68px;height:66px;background:url(../images/figure/spr_figure36.png) no-repeat; opacity:0; background-size: 250px;}
.figure34 span:before {content:'';position:absolute;display:block;width:30px;height:20px; background:url(../images/figure/spr_figure36.png)no-repeat  -33px -364px;top:31px; left:21px; opacity:0;background-size: 250px;}
.figure34 .b1{top:-35px;left:-15px;background-position:-98px -176px;}
.figure34 .b2{top:-35px;left:180px;background-position:-182px -177px;}
.figure34 .b3{top:55px;left:110px;background-position:-11px -276px;}
.figure34 .b4{top:130px;left:-10px;background-position:-97px -278px;}
.figure34 em{position:absolute;width:61px;height:59px;background:url(../images/figure/spr_figure36.png)no-repeat;opacity: 0; background-size: 250px;}
.figure34 .e1{top:125px;left:-57px; background-position:-20px -187px;transform:scale(0,0); -webkit-transform:scale(0,0);}
.figure34 .e2{top:140px;left:250px; width:65px; height:61px; background-position:-180px -274px;}
.figure34 strong {position: absolute; text-align: center; line-height: 1.2; font-size:13px; opacity: 0;}
.figure34 strong.s1 {top:130px; left:95px;}
.figure34 strong.s2 {top:120px; right:-5px;}
.figure34 strong.s3 {top:205px; right:-35px;}

.animated .figure34 .b1{transition-delay:1.5s;opacity:1}
.animated .figure34 .b1:before{transition-delay:2s;opacity:1}
.animated .figure34 .b2{transition-delay:2.5s;opacity:1}
.animated .figure34 .b2:before{transition-delay:3s;opacity:1}
.animated .figure34 .b3{transition-delay:3.5s;opacity:1}
.animated .figure34 .b3:before{transition-delay:4s;opacity:1}
.animated .figure34 .b4{transition-delay:4.5s;opacity:1}
.animated .figure34 .b4:before{transition-delay:5s;opacity:1}
.animated .figure34 .e1{opacity:1;transform:scale(1,1);transition:all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)}
.animated .figure34 .e2{transition-delay:5.5s;opacity:1}
.animated .figure34 strong{transition-delay:6.5s;opacity:1}


.figure35 {transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); opacity: 0; transform: translate(1, 1);}
.figure35 table tr td ul {display: flex; justify-content: space-around;}
.figure35 table tr td ul li {width: 80px; font-size: 10px;}
.figure35 table tr td ul li:before {content:''; display:block; width:80px; height:80px; background:url(../images/figure/spr_figure37.png) no-repeat -230px -80px; opacity: 0; transform: translate(1, 1);}
.figure35 table tr td ul li.goods2:before {background-position: -437px -74px;}
.figure35 table tr td ul li.goods3:before {background-position: -437px -240px;}

.animated .figure35 {transform: translate(0, 0); opacity: 1;}
.animated .figure35 table tr td ul li:before {opacity: 1; transform: translate(0, 0);}
.animated .figure35 table tr td ul li.tb1:before {transition-delay: 1s;}
.animated .figure35 table tr td ul li.tb2:before {transition-delay: 1.5s;}
.animated .figure35 table tr td ul li.tb3:before {transition-delay: 2s;}
.animated .figure35 table tr td ul li.tb4:before {transition-delay: 2.5s;}
.animated .figure35 table tr td ul li.tb5:before {transition-delay: 3s;}
.animated .figure35 table tr td ul li.tb6:before {transition-delay: 3.5s;}

.figure36{position:relative;}
.figure36 .figure_box{position:relative;width:100%; height:235px;}
.figure36 .figure_box .couple{position:absolute;bottom:0;right:-150px;width:195px;height:195px;background:url(../images/figure/spr_figure38.png) no-repeat; transform:translate(50px, 0); background-position:-30px -40px; background-size:310px; opacity:0}
.figure36 .figure_box .airplane{position:absolute;right:-170px;width:200px;height:44px;background:url(../images/figure/spr_figure38.png) no-repeat;transform:translate(100px, 50px); background-position:-39px 0; background-size:290px; opacity:0}
.animated .figure36 .figure_box .couple{transform:translate(0, 0); right:50px; opacity:1}
.animated .figure36 .figure_box .airplane{transition-delay:0.5s;transform:translate(0, 0); right:45px; opacity:1}
.figure36 .txt1 {width:100px; height:100px; margin:0 auto; transform:translate(0, 30px);opacity:0; background:url(../images/figure/spr_figure38.png) no-repeat; background-position: -72px -195px; background-size:245px;}
.figure36 .txt1:before {content:''; width:75px; height:75px; position:absolute;bottom:0; background:url(../images/figure/spr_figure38.png) no-repeat; transition-duration:1s;transform:scale(0,0);opacity:0; top:50%; left:-65px; margin-top:-38px; background-position:0 -212px; background-size: 250px;}
.figure36 .txt1:after {content:''; width:75px; height:75px; position:absolute;bottom:0;background:url(../images/figure/spr_figure38.png) no-repeat; transition-duration:1s;transform:scale(0,0);opacity:0; top:50%; right:-65px; margin-top:-38px; background-position: -176px -212px; background-size: 250px;}
.animated .figure36 .txt1 {transition-delay:1s; transform:translate(0, 0);opacity:1}
.animated .figure36 .txt1:before {transition-delay:1.5s;transform:scale(1,1);opacity:1}
.animated .figure36 .txt1:after {transition-delay:2s;transform:scale(1,1);opacity:1}



/*****************************************************************
 (무)다이렉트 미니독감치료보험 2023.11.16
*****************************************************************/
.figure37 {overflow:hidden;padding:35px 0;}
.figure37 .g_bar_area {position: relative; width: 100%; height: 180px; margin-top: 0px; border-width: 0 2px; border-style: solid; border-color: #444; border-right:0; left:10px; opacity: 0;}
.figure37 .g_bar_area .g_bar {position:absolute; top: 120px; left: 0; background-color: #3d5fc0; color: #fff;width:0;height:40px;line-height:38px;padding:0 15px;font-size:16px;opacity:0}
.figure37 .g_bar_area .g_bar em {float: right;}
.figure37 .g_bar_area .g_bar:before{content:'';position:absolute;top:0;right:-20px;width:0px;height:0px;border-top:20px solid transparent;border-bottom:20px solid transparent;border-left:20px solid #3d5fc0}
.figure37 .g_bar_area .g_bar > div {content:'';background:url(../images/figure/spr_figure39.png) no-repeat; font-weight: bold; color:#2f2e2e; padding-top:75px; background-size: 130px; font-size:13px; position:absolute; margin-top:-110px; left:50%; margin-left:-65px; transform: scale(0,0); opacity: 0;}
.figure37.t2 .g_bar_area .lb {position: absolute; top: 190px; left: -15px; font-size: 15px; font-weight: 700; color: #444;}
.figure37.t2 .g_bar_area .lb > div {position:absolute;top:0px;left:0;width:100px}
.animated .figure37 .g_bar_area {opacity: 1;}
.animated .figure37 .g_bar_area .g_bar {width: 90%; opacity: 1;}
.animated .figure37 .g_bar_area .g_bar > div {transition-delay: 1s; transform: scale(1,1); opacity: 1;}

.figure38 {overflow:hidden;height:140px;}
.figure38 .influenza{position:absolute; left:0;width:140px;height:100px;text-align:center}
.figure38 .influenza:before{content:'';display:block;height:110px;background:url(../images/figure/spr_figure40.png) no-repeat;transform:scale(0,0);opacity:0; background-size: 295px;}
.figure38 .influenza p{display:inline-block;width:137px;height:14px; font-weight:bold; opacity:0}
.figure38 .plus {position:absolute; top:40px; left:140px; width:25px;height:25px;text-align:center}
.figure38 .plus:before {content: ''; display: block; background:url(../images/figure/spr_figure40.png) -150px -45px no-repeat; height:23px; transform:scale(0,0); background-size:300px; opacity:0;}
.figure38 .pres {position:absolute; top:25px; left:85px; width:100%; height:50px;text-align:center;}
.figure38 .pres .pres1 {display: inline-block; background:url(../images/figure/spr_figure40.png) -192px -32px no-repeat; width:49px; height:48px; transform:scale(0,0);opacity:0; background-size: 300px;}
.figure38 .pres .pres2 {display: inline-block; background:url(../images/figure/spr_figure40.png) -252px -32px no-repeat; width:49px; height:48px; transform:scale(0,0);opacity:0; background-size: 300px;}
.figure38 .pres p {padding-top:35px; font-weight:bold; opacity: 0;}
.animated .figure38 .influenza:before{transform:scale(1,1);opacity:1}
.animated .figure38 .plus:before{transition-delay:0.5s;transform:scale(1,1);opacity:1}
.animated .figure38 .pres .pres1{transition-delay:1s;transform:scale(1,1);opacity:1}
.animated .figure38 .pres .pres2{transition-delay:1.5s;transform:scale(1,1);opacity:1}
.animated .figure38 p {color:#000;transition-delay:2.5s;transform:translate(0, 0);transition-duration:0.5s;opacity:1}

.figure39{position:relative;height:180px;overflow:hidden;}
.figure39:before {content:''; position:absolute; width:136px; height:150px; transform:scale(0,0); transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); background:url(../images/figure/spr_figure41.png)no-repeat; background-size: 300px;}
.figure39 strong{position:absolute;width:57px;height:57px; border-radius:57px; background:url(../images/figure/spr_figure41.png) no-repeat; background-size:300px; opacity:0}
.figure39 .p1{top:0; left:150px; background-position:-142px -17px}
.figure39 .p2{top:-5px; left:215px;background-position:-203px 1px}
.figure39 .p3{top:50px;left:184px;background-position:-183px -60px}
.figure39 .p4{top:47px;left:245px;background-position:-244px -54px}

.animated .figure39:before {transition-delay: 0.5s; transform: scale(1,1);}
.animated .figure39 .p1{transition-delay:1.5s; opacity:1}
.animated .figure39 .p2{transition-delay:2s; opacity:1}
.animated .figure39 .p3{transition-delay:2.5s; opacity:1}
.animated .figure39 .p4{transition-delay:3s;opacity:1}

/*20231127 미니독감*/

.figure40 .info .item {font-size: 12px; color:#000;}
.figure40 .accordion_wrap .accordion {padding:0 18px; height:45px;}
.animated .figure40 .item.pl0.t1 {transition-delay:2s;}
.animated .figure40 .item.pl0.t2 {transition-delay:2.5s;}
.animated .figure40 .item.pl0.t3 {transition-delay:3s;}


/*(무)e원금보장 KDB하이브리드연금저축보험*/
.figure41 .g_bar_area {width:265px;}
.figure41 .g_bar_area .g_bar.g0 {width:20px;}
.figure41 .g_bar_area .g_bar.g1 {width:23px;}
.figure41 .g_bar_area .g_bar.g2 {width:43px;}
.figure41 .g_bar_area .g_bar.g4 {width:24px;}
.figure41 .g_bar_area .g_bar.g5 {width:20px;}
.figure41 .g_bar_area .g_bar.g6 {width:62px;}


.figure41 .g_bar_area .g_bar em {margin-left:-40px;}
.figure41 .g_bar_area .g_bar.g3 em {margin-left:-45px;}
.figure41 .g_bar_area .g_bar.g4 em {margin-left:-33px;}
.figure41 .g_bar_area .g_bar.g5 em {margin-left:-10px; bottom:-21px;}
.figure41 .g_bar_area .g_bar.g6 em {margin-left:15px;}

.figure41 .g_bar_area .box {width:245px;}
.figure41 .bl4 span .arrow_m {top:21px; right:31px;}

.figure41 .g_bar_area .bar_line .lb {opacity: 0; width:95px;}
.figure41 .g_bar_area .bar_line .lb.lb0 {position:relative; top:13px; left:3px; border:2px solid #e82f59; width: 40px;display:block; border-radius: 5px;  background:#fff; padding:3px 0 4px 4px;}
.figure41 .g_bar_area .bar_line .lb.lb0:before {content: ''; width:8px; height:8px; background:#fff; transform: rotate(42deg); left:50%; position:absolute; bottom:-5px; z-index:2; margin-left:-4px;}
.figure41 .g_bar_area .bar_line .lb.lb0:after {content: ''; width:10px; height:10px; border:2px solid #e82f59; position: absolute; left:50%; margin-left:-5px; transform: rotate(45deg); bottom:-8px; z-index: -1;}
.figure41 .g_bar_area .bar_line .lb.lb1 {top:60px; left:32px;}
.figure41 .g_bar_area .bar_line .lb.lb2 {top:30px; left:80px;}
.figure41 .g_bar_area .bar_line .lb.lb3 {top:25px; left:125px;}
.figure41 .g_bar_area .bar_line .lb.lb4 {top:15px; left:175px;}
.figure41 .g_bar_area .bar_line .lb.lb5 {top:0px; left:225px;}
.figure41 .g_bar_area .bar_ball {left:39px;}
.figure41 .g_bar_area .bar_line.bl3 .lb {top:-80px; left:240px;}
.figure41 .g_bar_area .bar_line.bl1 {opacity: 0;}
.figure41 .g_bar_area .bar_line.bl1:before, .figure41 .g_bar_area .bar_line.bl1 span:before, .figure41 .g_bar_area .bar_line.bl1 span:after {display: none;}
.figure41 .g_bar_area .bar_line.bl1 .b1{top:-9px; width:61px; left:-17px;transform:rotate(71deg);}
.figure41 .g_bar_area .bar_line.bl1 .b2{top:5px; left:16px; transform: rotate(-54deg); width:38px;}
.figure41 .g_bar_area .bar_line.bl1 .b3{top:-129px; left:39px; height:0;}
.figure41 .g_bar_area .bar_line.bl1 .lb {left:240px; top:-65px; color:#000;}
.figure41 .g_bar_area .bar_line.bl1 .lb1 {top:0px; left:40px;}
.figure41 .g_bar_area .bar_line.bl1 .lb2 {top:-5px; left:77px;}
.figure41 .g_bar_area .bar_line.bl1 .lb3 {top:-13px; left:130px;}
.figure41 .g_bar_area .bar_line.bl1 .lb4 {top:-25px; left:175px;}
.figure41 .g_bar_area .bar_line.bl1 .lb5 {top:-65px; left:220px;}
.figure41 .g_bar_area .bar_line .lb em {font-size: 11px;}

.figure42 {position:relative; opacity:0; transform: translate(0, 50px);}
.figure42 .tbl:before {content: ''; position:absolute; width:115px; height:181px; border:3px dashed #e82f59; top:37px; right:0; opacity: 0;}

.figure43 h4 {position:relative; text-align:center; font-weight:bold;}
.figure43 h4:before {content:''; position:absolute; width:250px; height:8px; background:#faf9b1; bottom:0; z-index: -1;}
.figure43 h4 span, .figure43 .round_wrap .round .round_txt1 span {font-weight:bold;}
.figure43 .round_wrap {overflow:hidden; width:277px; margin:0 auto;}
.figure43 .round_wrap .round {position:relative; float:left; text-align:center;}
.figure43 .round_wrap .round > p {opacity: 0; color:#111;}
.figure43 .round_wrap .round .round_txt {position: absolute; z-index: 2; top:10%; font-size:21px; padding-top:10px; line-height: 1.2;opacity: 0}
.figure43 .round_wrap .round .round_txt1 {left:23%;}
.figure43 .round_wrap .round .round_txt2 {left:25%;}
.figure43 .round_wrap .round .round_txt p {border-radius: 10px; font-size:15px; padding:5px 15px; margin-bottom:15px;}
.figure43 .round_wrap .round .round_txt p.rd1 {background:#3d5fc0; color:#fff;}
.figure43 .round_wrap .round .round_txt p.rd2 {color:#000; background:#fff;}
.figure43 .round_wrap .round:nth-child(2) {margin-left:-23px;}
.figure43 .round_wrap .round .round1, .figure43 .round_wrap .round .round2 {width:150px; height:150px; border-radius: 150px; margin-bottom:15px;}
.figure43 .round_wrap .round .round1 {position:relative; background:#e6ebff;opacity: 0}
.figure43 .round_wrap .round .round2 {background:#eaeaea; opacity:0;}
.figure43 .round_wrap .round .round1:after {content:'+'; position: absolute; color:#3d5fc0; font-size:33px; font-weight: bold; top:50%; margin-top:-18px; right:5px; z-index: 2;}
.figure43 .txt_box {opacity: 0;}

.figure44 .add_img_wrap {width:90px;float:left; height:170px; margin-left:-25px;}
.figure44 .add_img {width:90px; height:90px; margin-left:-5px;background:url(../images/figure/spr_figure43.png) no-repeat center;transform:scale(0, 0);opacity:0; float:left; background-size: cover;}
.figure44 .g_bar_area {border-bottom:2px solid #444; border-right:0; width:218px; margin-left:15px; float:left;}
.figure44 > div p {text-align: center; padding-top:140px; font-size:10px; color:#000; font-weight:bold;}
.figure44.t2 .g_bar_area:before {left:45px;}
.figure44.t2 .g_bar_area:after {border:0;}
.figure44 .g_bar_area .g_bar {height: 0;}
.figure44 .g_bar_area .g_bar.g3 {padding-top:10px; left:45px; height:80px; top:10px; line-height: 1.8; padding-left:25px; font-size:10px;}
.figure44 .g_bar_area .g_bar.g3:before {top:0; right:-20px;}
.figure44 .g_bar_area .g_bar.g3 span {opacity: 0;}
.figure44.t2 .g_bar_area .g_bar.g3:after {top:-35px; left:-11px;}
.figure44 .g_bar_area .g_bar:before {border-top:40px solid transparent; border-bottom:40px solid transparent; border-left:20px solid transparent;}
.figure44 .g_bar_area .g_bar .text_check {position:relative;}
.figure44 .g_bar_area .g_bar .text_check:before {content:''; background:url(../images/index/white_check.png)no-repeat; position: absolute; width:15px; height:10px; left:-15px; top:5px; background-size:11px;}
.figure44.t2 .g_bar_area .lb .lb1 {width:56px; left:-3px}

.animated .figure41 .g_bar_area .box,
.animated .figure41 .g_bar_area .bar_line.bl3 span,
.animated .figure41 .g_bar_area .bar_line.bl4 span svg {width:245px;}

.animated .figure41 .bl1 span .arrow {transition-delay: 2s; opacity: 1;}
.animated .figure41 .g_bar_area .bar_line .lb {transition-delay:4s;opacity:1;}
.animated .figure41 .g_bar_area .bar_line.bl1 {opacity: 1;}
.animated .figure41 .g_bar_area .bar_line.bl1 .b1{width:61px;}
.animated .figure41 .g_bar_area .bar_line.bl1 .b2{width:38px;}
.animated .figure41 .g_bar_area .bar_line.bl1 .b3 {width:210px;}

.animated .figure42 {transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000); opacity: 1; transition-delay: 2s; transform: translate(0, 0);}
.animated .figure42 .tbl:before {transition-delay: 3s; opacity: 1;}

.animated .figure43 .round_wrap .round .round1 {opacity: 1;}
.animated .figure43 .round_wrap .round .round2 {opacity: 0.7; transition-delay: 0.5s;}
.animated .figure43 .round_wrap .round .round1:after {transition: all 1s cubic-bezier(0.390, 0.575, 0.565, 1.000);}
.animated .figure43 .round_wrap .round .round_txt {transition-delay:1s; opacity:1;}
.animated .figure43 .round_wrap .round > p {transition-delay:1.5s; opacity:1;}
.animated .figure43 .txt_box {transition-delay:2s; opacity: 1;}

.animated .figure44 .add_img {transform:scale(1, 1);opacity:1;}
.animated .figure44 .g_bar_area .g_bar.g3 {transition-delay: 1s; width:150px;}
.animated .figure44 .g_bar_area .g_bar.g3 span {transition-delay: 2s; opacity: 1;}

@media (max-width: 365px) { 
	.figure44 .add_img {width:80px; height:80px; margin-left:7px;} 
	.figure41 .g_bar_area .bar_line.bl3 .lb {top:-100px; left:200px;}
	.figure41 .g_bar_area .bar_line.bl1 .lb em {font-size:10px; position: absolute; top:10px; left:5px;}
}
@media (max-width: 340px) {
	.figure33 .g_bar_area .rm2 {font-size:10px; top:38px; left:-26px;}
	.figure44 .add_img_wrap {width:93px; margin-left:-11px;}
	.figure44 .add_img {margin-left:10px;} 
	.figure44 .add_img p {padding-left:7px;}
	.figure44 .g_bar_area {width:216px; margin-left:2px;}
}



/*(무)챌린지 미니저축보험 특징 06 변경*/
.figure45 {height: 380px;}
.figure45 .health_care_wrap {position:relative;}
.figure45 .health_care{position:absolute; left:0;width:80px;height:80px;text-align:center}
.figure45 .health_care_wrap p {position:absolute; left:100px; opacity: 0; font-size:14px; color:#111; font-weight: bold;}
.figure45 .health_care_wrap p.p1 {top:13px;}
.figure45 .health_care_wrap p.p2 {top:168px;}
.figure45 .health_care_wrap p.p3 {top:320px;}
.figure45 .health_care_wrap p span {font-size:10px; line-height: 0;}
.figure45 .health_care.hc2 {top:150px;}
.figure45 .health_care.hc3 {top:300px;}
.figure45 .arrow_r {position:absolute; top:105px; width:53px;height:20px; transform: rotate(90deg); left:13px;}
.figure45 .arrow_r.ar2 {top:255px; left:13px;}
.figure45 .health_care:before{content:'';display:block;height:80px;background:url(../images/figure/spr_figure42.png) no-repeat;transform:scale(0,0);opacity:0; background-size: 250px;}
.figure45 .arrow_r:before {content:'';display:block;height:18px;background:url(../images/figure/spr_figure42.png) no-repeat 0 -114px;transform:scale(0,0);opacity:0; background-size: 350px;}
.figure45 .health_care.hc2:before {background-position-x: center;}
.figure45 .health_care.hc3:before {background-position-x: right;}
.animated .figure45 .health_care:before, .animated .figure45 .arrow_r:before {transform:scale(1,1);opacity:1}
.animated .figure45 .arrow_r:before {transition-delay: 0.5s;}
.animated .figure45 .health_care.hc2:before {transition-delay:1s;}  
.animated .figure45 .arrow_r.ar2:before {transition-delay: 1.5s;}
.animated .figure45 .health_care.hc3:before {transition-delay:2s;}  
.animated .figure45 .health_care_wrap p {transition-delay:3s; opacity: 1;}