.humanlife {font-family: 'Pretendard', sans-serif; width: 918px; margin: 95px auto 0; padding: 78px 0 175px; box-sizing: border-box;}

#subArea .humanlife h2, #subArea .humanlife h3, #subArea .humanlife h4 {position: relative; visibility: visible; top: auto; left: auto;}

.humanlife__tit {line-height: 1; margin-bottom: 70px; font-weight: 500; font-size: 36px; text-align: center;}

.humanlife .humanlife__box {padding: 90px 0; box-sizing: border-box;}
.humanlife .humanlife__box:nth-of-type(1) {padding-top: 0;}
.humanlife .humanlife__box:last-child {padding-bottom: 0;}
.humanlife .humanlife__box + .humanlife__box {border-top: 1px solid #eaeaea;}
.humanlife .humanlife__box--inner{display: flex; justify-content: space-between; box-sizing: border-box;}
.humanlife .humanlife__box--inner.bg_blue {background-color: #f5f9fb;}

.humanlife .humanlife__head {display: flex; flex-direction: column; justify-content: space-between;}
.humanlife .humanlife__head--tit {margin-bottom: 24px; line-height: 1.4; font-size: 30px; color: #105dae; font-weight: 700;}
.humanlife .humanlife__head--tit .roboto {font-family: 'roboto';}
.humanlife .humanlife__head--desc {color: #222; font-weight: 500;}
.humanlife .humanlife__head--btns {display: flex; flex-direction: column; gap: 7px 0;}
.humanlife .humanlife__btn {display: block; width: 280px; height: 57px; line-height: 57px; font-size: 18px; font-weight: 300; text-align: center;}
.humanlife .humanlife__btn.blue {background-color: #105dae; color: #fff;}
.humanlife .humanlife__btn.gray {background-color: #475771; color: #fff;}

.humanlife .humanlife__select {font-family: 'Pretendard', sans-serif; width: 280px; height: 57px; padding-left: 16px; border: 1px solid #b8b8b8; box-sizing: border-box; font-size: 18px; font-weight: 300; color: #3e3e3e; cursor: pointer; box-sizing: border-box; background: url('/img/assets/ic_select_box--arrow.png') #fff no-repeat center right 20px / 15px 8px; outline: none;}
.humanlife .humanlife__select > option {font-family: 'Noto Sans KR', sans-serif;}

/* box1 - ideal */
.ideal .humanlife__box--inner{padding: 55px 90px 60px 65px; box-sizing: border-box;}
.humanlife__ideal .humanlife__ideal--tit {margin-bottom: 16px; font-family: 'GmarketSans'; font-weight: 500; font-size: 22px; text-align: center;}
.humanlife__ideal .ideal__chart__head {display: flex; justify-content: center; align-items: flex-end;}
.humanlife__ideal .ideal__chart--tit {padding-bottom: 12px; font-family: 'GmarketSans'; font-size: 20px; font-weight: 500; color: #008492;}
.humanlife__ideal .ideal__chart--tit:last-child {color: #f84218;}
.humanlife__ideal .ideal__chart--tit::before {content: ''; position: absolute; bottom: 0; left: -10px; display: block; width: 182px; height: 1px; background-color: #008492;}
.humanlife__ideal .ideal__chart--tit:last-child::before {left: auto; right: -10px; background-color: #f84218;}
.humanlife__ideal .ideal__chart--img {display: flex; align-items: flex-end; justify-content: center; width: 102px;}
.humanlife__ideal .ideal__chart__main {margin-top: 16px;}
.humanlife__ideal .ideal__chart__main > li {display: flex; justify-content: center; align-items: center;}
.humanlife__ideal .ideal__chart__main > li + li {margin-top: 16px;}
.humanlife__ideal .ideal__chart__main .data {display: block; width: 148px; font-size: 18px; font-weight: 600; color: #008492; text-align: right;}
.humanlife__ideal .ideal__chart__main .data.women{text-align: left; color: #f84218;}
.humanlife__ideal .ideal__chart__main .label {display: block; width: 102px; min-width: 102px; text-align: center; font-weight: 300;}
.humanlife__ideal .ideal__chart__note {margin-top: 12px; font-family: 'Noto Sans KR', sans-serif; font-size: 12px; font-weight: 300; color: #909090; text-align: center;}
/* box2 - standard */
.humanlife__standard {display: flex; gap: 0 12px;}
.humanlife__standard .humanlife__standard__box {width: 260px; padding: 36px 0 160px; box-sizing: border-box; background: url('/html/duostory/img/human/standard_m.png?ver=1') #f6f9fc no-repeat bottom center / 81px 134px;}
.humanlife__standard .humanlife__standard__box.women {background: url('/html/duostory/img/human/standard_w.png?ver=1') #fff7f7 no-repeat bottom center / 82px 127px;}
.humanlife__standard .standard__tit {margin-bottom: 28px; font-family: 'GmarketSans'; font-size: 20px; font-weight: 500; line-height: 1; text-align: center;}
.humanlife__standard .standard__list {display: flex; flex-wrap: wrap; width: 154px; margin: 0 auto; font-size: 18px;}
.humanlife__standard .standard__list > dt {width: 70px; margin-bottom: 14px;}
.humanlife__standard .standard__list > dd {margin-left: 0; color: #1b909a; font-weight: 600;}
.humanlife__standard .humanlife__standard__box.women .standard__list > dd {color: #f84218;}

/* box3 - cost */
.humanlife__cost {width: 500px;}
.humanlife__cost .humanlife__cost__box {font-family: 'GmarketSans'; width: 100%; padding: 40px 0; box-sizing: border-box; background-color: #f6f9fb; text-align: center;}
.humanlife__cost .humanlife__cost__box + .humanlife__cost__box {margin-top: 20px;}
.humanlife__cost .cost__name {margin: 8px 0; font-weight: 500;}
.humanlife__cost .cost__val {font-weight: 700; color: #0061a0; font-size: 24px; line-height: 1;}
.humanlife__cost .cost__per {margin-top: 6px; font-weight: 500; font-size: 22px;}

/* box4 - happy */
.humanlife__box.happy .humanlife__box--inner {padding: 60px 54px; box-sizing: border-box;}
.humanlife__happy {padding: 48px 30px; box-sizing: border-box; background: #fff;}
.humanlife__happy .humanlife__happy--tit {font-family: 'GmarketSans'; font-weight: 500; font-size: 26px; text-align: center;}
.humanlife__happy .humanlife__happy--desc {margin-top: 8px; font-size: 14px; text-align: center;}
.humanlife__happy .humanlife__happy--unit {margin-top: 20px; margin-right: 16px; font-size: 14px; text-align: right;}
.humanlife__happy .happy__graph {width: 403px;}
.humanlife__happy .happy__graph .happy__graph--bars {display: flex; justify-content: space-between; align-items: flex-end; width: 370px; height: 190px; margin: 0 auto; padding: 0 13px; border-bottom: 1px solid #c2c2c2; box-sizing: border-box;}
.humanlife__happy .happy__graph .happy__graph__bar {position: relative; width: 40px; background-color: #939393; color: #939393;}
.humanlife__happy .happy__graph .happy__graph__bar:nth-child(2) {background-color: #6db923; color: #6db923;}
.humanlife__happy .happy__graph .happy__graph__bar:nth-child(3) {background-color: #0494ae; color: #0494ae;}
.humanlife__happy .happy__graph .happy__graph__bar:nth-child(4) {background-color: #6974b2; color: #6974b2;}
.humanlife__happy .happy__graph .happy__graph__bar .data {position: absolute; top: -30px; left: 50%; transform: translateX(-50%); font-size: 20px; font-weight: 700;}
.humanlife__happy .happy__graph .happy__graph--labels {display: flex; margin-top: 18px;}
.humanlife__happy .happy__graph .happy__graph__label {width: 25%; text-align: center; font-size: 16px; font-weight: 600; color: #222;}

/* box5 - baby */
.humanlife__baby {padding: 50px 80px; box-sizing: border-box; background-color: #f5f9fb;}
.humanlife__baby .humanlife__baby--tit {font-family: 'GmarketSans'; font-size: 22px; font-weight: 500; text-align: center;}
.humanlife__baby .humanlife__baby--unit {margin: 16px 0; font-family: 'GmarketSans'; font-size: 14px; font-weight: 300; text-align: right;}
.humanlife__baby .baby__graph {width: 333px; margin: 0 auto;}
.humanlife__baby .baby__graph > li + li {margin-top: 18px;}
.humanlife__baby .baby__graph--label {line-height: 1; font-size: 18px; margin-bottom: 10px;}
.humanlife__baby .baby__graph__bar {position:relative; height: 17.5px; background-color: #848c94; color: #848c94;}
.humanlife__baby .baby__graph > li:nth-child(1) .baby__graph__bar {background-color: #a4b4f3; color: #a4b4f3;}
.humanlife__baby .baby__graph > li:nth-child(2) .baby__graph__bar {background-color: #019efd; color: #019efd;}
.humanlife__baby .baby__graph > li:nth-child(3) .baby__graph__bar {background-color: #006bdc; color: #006bdc;}
.humanlife__baby .baby__graph > li:nth-child(4) .baby__graph__bar {background-color: #3e9ad8; color: #3e9ad8;}
.humanlife__baby .baby__graph > li:nth-child(5) .baby__graph__bar {background-color: #32bbd6; color: #32bbd6;}
.humanlife__baby .baby__graph__bar .data {position: absolute; top: 50%; left: calc(100% + 10px); transform: translateY(-40%); font-family: 'GmarketSans'; font-size: 20px; font-weight: 700; text-align: left;}

/* box6 - marry */
.humanlife__box.marry .humanlife__box--inner {padding: 70px 50px 80px 66px; box-sizing: border-box;}
.humanlife__marry .humanlife__marry--tit {margin-bottom: 36px; font-family: 'GmarketSans'; font-size: 22px; font-weight: 500; text-align: center;} 
.humanlife__marry .marry__graph--wrap {display: flex; justify-content: center; align-items: flex-end; width: 430px;}
.humanlife__marry .marry__graph__head {margin-bottom: 24px;}
.humanlife__marry .marry__graph__head .marry__graph--tit {font-size: 26px; font-weight: 700;}
.humanlife__marry .marry__graph__center {width: 156px; text-align: center;}
.humanlife__marry .marry__graph__center .marry__graph__head {display: flex; align-items: flex-end; justify-content: center;}
.humanlife__marry .marry__graph--labels > li {font-size: 18px; font-weight: 600;}
.humanlife__marry .marry__graph--labels > li + li {margin-top: 19.5px;}

.humanlife__marry .marry__graph .marry__graph--bars {display: flex; flex-direction: column;}
.humanlife__marry .marry__graph .marry__graph__bar {position:relative; width: 10px; height: 23px; background-color: #848c94; color: #848c94;}
.humanlife__marry .marry__graph .marry__graph__bar + li {margin-top: 17px;}
.humanlife__marry .marry__graph .marry__graph__bar .data {position: absolute; top: 50%; transform: translateY(-40%); font-family: 'GmarketSans'; font-weight: 700;}

.humanlife__marry .marry__graph.men .marry__graph--tit {color: #006dde; text-align: right;}
.humanlife__marry .marry__graph.men .marry__graph--bars {display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.humanlife__marry .marry__graph.men .marry__graph__bar:nth-child(1) {background-color: #aab8f5; color: #aab8f5;}
.humanlife__marry .marry__graph.men .marry__graph__bar:nth-child(2) {background-color: #00a1ff; color: #00a1ff;}
.humanlife__marry .marry__graph.men .marry__graph__bar:nth-child(3) {background-color: #006dde; color: #006dde;}
.humanlife__marry .marry__graph.men .marry__graph__bar:nth-child(4) {background-color: #409dda; color: #409dda;}
.humanlife__marry .marry__graph.men .marry__graph__bar .data {right: calc(100% + 10px);}

.humanlife__marry .marry__graph.women .marry__graph--tit {color: #f84218; text-align: left;}

.humanlife__marry .marry__graph.women .marry__graph__bar:nth-child(1) {background-color: #ee2d44; color: #ee2d44;}
.humanlife__marry .marry__graph.women .marry__graph__bar:nth-child(2) {background-color: #f45a6c; color: #f45a6c;}
.humanlife__marry .marry__graph.women .marry__graph__bar:nth-child(3) {background-color: #ff929c; color: #ff929c;}
.humanlife__marry .marry__graph.women .marry__graph__bar:nth-child(4) {background-color: #ffc3cb; color: #ffc3cb;}
.humanlife__marry .marry__graph.women .marry__graph__bar .data {left: calc(100% + 10px);}
