@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.purport .bg-con{background:url('../images/sub/purport_bg.jpg')no-repeat 50% 50%/cover;color: #fff;}
.purport .bg-con .contain{width:100%;}
.purport .bg-con .con{padding:165px 0 150px;position:relative;}
.purport .bg-con .con:before{content:'';width:100%;height:1px;background-color:rgba(255,255,255,.3);position: absolute;left:0;top:210px;}
.purport .bg-con ul{display:flex;margin:0 -10px;}
.purport .bg-con ul li{width:25%;padding:0 10px;}
.purport .bg-con ul li .step{padding-bottom:18px;margin-bottom:35px;font-size:24px;font-weight:600;position:relative;}
.purport .bg-con ul li .step:after{content:'';width:40px;height:3px;background-color:#fff;position: absolute;bottom: 0;left:0;}
.purport .bg-con ul li .txt{font-size:20px;line-height:1.8em;}
.purport .bg-con ul li .txt span{font-weight:600;}
.purport .con-img{margin:100px 0;}
.purport .imgs{display:flex;margin:0 -18px;}
.purport .imgs li{width:33.3333%;padding:0 18px;}
.purport .imgs li .img{position:relative; height:0; padding-bottom:79.794%; overflow:hidden;}
.purport .imgs li .img img{position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}

.award-list{margin-bottom:-80px;}
.award-list li{display:flex;margin-bottom:80px;}
.award-list li .list-tit{width:25%;font-size:20px;font-weight:600;padding-top:25px;position:relative;}
.award-list li .list-tit:before{content:'';width:200px;height:2px;background-color: #0078b8;position: absolute;left:0;top:0;}
.award-list li .con{width:75%;padding-top:25px;border-top:1px solid #ddd;}
.award-list li .con .txt{font-size:18px;line-height:1.333em;}
.award-list li .con .circles{display:flex;}
.award-list li .con .circles .circle{width:165px;height:165px;border-radius:50%;color: #fff;background-color: #3393c6;border:1px solid #3393c6;display:flex;justify-content:center;align-items:center;}
.award-list li .con .circles .circle:first-child{margin-right:30px;}
.award-list li .con .circles .circle p{font-size:20px;line-height:1.1em;font-weight:700;text-align:center;}
.award-list li .con .circles .circle.type2{border:1px dashed #3393c6;background-color: #fff;color: #0078b8;}

.process li{display:flex;padding:40px 55px;align-items:center;border-bottom:1px solid #ddd;}
.process li:last-child{border-bottom:0;}
.process li.type1{padding-top:0;}
.process li .circle-box .sm-circle{color: #fff;font-size:18px;font-weight:600;background-color:#7bcbf6;position:relative;z-index:1;width:45px;height:45px;border-radius:50%;margin:0 auto -25px;display:flex;align-items:center;justify-content:center;}
.process li .circle-box .circle{width:150px;height:150px;border-radius:50%;display:flex;justify-content:center;align-items:center;border:1px solid #7bcbf6;}
.process li.type2 .circle-box .sm-circle{background-color: #53afe0;}
.process li.type2 .circle-box .circle{border-color:#53afe0;}
.process li.type3 .circle-box .sm-circle{background-color: #3393c6;}
.process li.type3 .circle-box .circle{border-color:#3393c6;}
.process li.type4 .circle-box .sm-circle{background-color: #0078b8;}
.process li.type4 .circle-box .circle{border-color:#0078b8;}
.process li .wrap{display:flex;width:100%;align-items:center;}
.process li .tit-box{max-width:225px;width:100%;margin-left:38px;color: #7bcbf6;margin-right:55px;}
.process li .tit-box .month{font-size:24px;font-weight:700;margin-bottom:5px;}
.process li .tit-box .tit{font-size:22px;font-weight:500;}
.process li.type2 .tit-box{color: #53afe0;}
.process li.type3 .tit-box{color: #3393c6;}
.process li.type4 .tit-box{color: #0078b8;}
.sq-txt{padding-left:15px;font-size:18px;position:relative;line-height:1.889em;}
.sq-txt:before{content:'';width:4px;height:4px;background-color: #7bcbf6;position: absolute;left:0;top:14px;}
.sq-txt:before{background-color: #53afe0;}
.sq-txt:before{background-color: #3393c6;}
.sq-txt:before{background-color: #0078b8;}

.award-list.type2 .con .txt{margin-bottom:28px;}
.award-list.type2 .con .txt.type2{margin-bottom:18px;}
.award-list.type2 .sq-wrap .sq-txt{line-height:1.667em;}
.award-list.type2 .sq-wrap .sq-txt:before{top:12px;}