@charset "utf-8";

#apply_btn {
    width:200px;
    height:50px;
    font-size:20px;
    color:white;
    background-color:#f8575f;
}

.prc_view .btn {float:left; width:100%; text-align:center; margin-top:100px;}
.prc_view .btn input[type="button"] {width:200px; height:50px; margin:0 2px; font-family:"notoMedium"; font-size:20px; color:white; background:#f8575f;}

/**
    카멜케이스로 네이밍 작성 요망
*/
/**
  center는 전역적으로갑니다.
*/
/* header */
header::after {
    position:fixed;
    left:0;
    top:-300px;
    z-index:9;
    display:block;
    width:100%;
    height:230px;
    content:"";
    background:#279b33;
    opacity:0.95;
    -webkit-transition:top 0.3s ease, height 0.3s ease;
    -moz-transition:top 0.3s ease, height 0.3s ease;
    -o-transition:top 0.3s ease, height 0.3s ease;
    transition:top 0.3s ease, height 0.3s ease;
}
/* header end */
.center {
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
}
#tomoGDbanner {
    width:100%;
    height:466px;
    background:transparent url("./img/new_tomo_guide.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    margin-top:160px;
    padding-top:70px;
}
#tomoGDbanner > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:450px;
    margin:0 auto;
}
#tomoGDbanner > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:32px;
    line-height:40px;
}
#tomoGDbanner > .text > .center > img {
    top:-100px;
    right:-130px;
    position:absolute;
    width:137px;
}
#tomoGDbanner > .text > h3 {
    padding-top:20px;
    font:normal normal medium Noto Sans CJK KR;
    font-size:18px;
    letter-spacing:-0.45px;
    color:#fff;
    text-align:center;
    margin-bottom:30px;
}
#tomoGDbanner > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    padding-bottom:4px;
    font-weight:bold;
    background-color:#fff;
    border-radius:4px;
    color:#399871;
    font-size:16px;
}
#tomoGDbanner > .text > img {
    float:left;
    display:inline-block;
    width:100px;
}
#cardComment {
    width:100%;
    height:20vh;
    padding-top:150px;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
    background:#e2f0e8;
}
#cardComment > .center > h3 {
    width:540px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:32px;
}
#cardComment > .center > h4 {
    width:546px;
    height:10vh;
    position:absolute;
    left:50%;
    top:90%;
    transform:translate(-50%, -50%);
    font-size:16px;
}
#backgroundArea {
    width:100%;
    height:50vh;
    display:flex;
    justify-content:center;
    background:#e2f0e8;
}
#backgroundArea > .center {
    background:no-repeat center url("./img/bg_tomorrow_green_line.png");
}
#backgroundArea > .center > .area {
    width:20%;
    padding:6px;
    display:flex;
    justify-content:center;
    flex-direction:column;
}
#backgroundArea > .center > .area > .round1 {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:258px;
    height:257px;
    margin:0 auto;
    background:#fff;
    border-radius:50%;
    font-weight:bold;
    font-size:35px;
    color:#3DA267;
}
#backgroundArea > .center > .area > .roundCenter {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:100px;
    height:100px;
    margin:0 auto;
    margin-left:60px;
    border-radius:50%;
    color:#3da267;
    background:#c7e9d5 0 0 no-repeat padding-box;
    border:3px dashed #3da267;
    font-weight:bold;
    font-size:20px;
}
#backgroundArea > .center > .area > .round2 {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:258px;
    height:257px;
    margin:0 auto;
    background:#3da267 0% 0% no-repeat padding-box;
    border-radius:50%;
    color:#fff;
    font-weight:bold;
    font-size:35px;
}
#backgroundArea > .center > .area > img {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:230px;
    height:154px;
    margin:0 auto;
    padding:30px;
}
#rectang_parent {
    width:100%;
    height:500px;
    background:#e2f0e8;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    padding-bottom:12%;
}
#rectang_parent > .container {
    width:84%;
    height:500px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}
#rectang_parent .container > .rect {
    width:49%;
    height:257px;
    background:#fff;
    display:flex;
    margin-bottom:30px;
}
#rectang_parent .container > .rect > .iconBox {
    width:60px;
    height:60px;
    margin:20px;
    padding:20px;
}
#rectang_parent .container > .rect > .desc {
    position:relative;
    margin:40px 0;
    width:600px;
}
#rectang_parent .container > .rect > .desc > h4 {
    font-weight:bold;
    font-size:24px;
}
#rectang_parent .container > .rect > .desc > h5::before {
    content:"";
    position:absolute;
    top:70px;
    left:2px;
    height:2px;
    width:2px;
    padding:2px;
    border-radius:100%;
    background:#3da267;
}
#rectang_parent .container > .rect > .desc > h5 {
    margin-left:14px;
    margin-top:22px;
    font:normal normal bold 18px/30px Noto Sans CJK KR;
    font-weight:bold;
    color:#3da267;
}
#rectang_parent .container > .rect > .desc > h6 {
    font:normal normal medium Noto Sans CJK KR;
    font-size:16px;
    margin-left:2px;
    margin-top:10px;
}
/*
*middleBanner
*/
#middleBanner {
    width:100%;
    height:1000px;
}
#middleBanner > .center > h5 {
    margin-top:100px;
    font-size:32px;
    font-weight:bold;
    width:520px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
}
#middleBanner > .center > h6 {
    margin-top:200px;
    font-size:16px;
    width:500px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
}
#middleBanner > .boxArea {
    width:84%;
    height:700px;
    margin:0 auto;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}
#middleBanner > .boxArea > .imgBox {
    margin-top:250px;
    width:349px;
    height:584px;
    background:#fff;
}
#middleBanner > .boxArea > .BoxCenter {
    position:relative;
}
#middleBanner > .boxArea .arrowLefT {
    position:absolute;
    top:205px;
    left:-56px;
    width:84px;
    height:84px;
    font-size:40px;
    font-weight:bold;
    background:#FFFFFF 0 0 no-repeat padding-box;
    box-shadow:0 5px 15px #67676726;
    border-radius:100%;
}
#middleBanner > .boxArea .arrowRight {
    position:absolute;
    top:205px;
    right:-56px;
    width:84px;
    height:84px;
    font-size:40px;
    font-weight:bold;
    background:#FFFFFF 0 0 no-repeat padding-box;
    box-shadow:0 5px 15px #67676726;
    border-radius:100%;
}
#middleBanner > .boxArea .arrowLefT img, .arrowRight img {
    margin:16px 0 0 14px;
}
#middleBanner > .boxArea > .imgBox > .imgBoxTop {
    width:349px;
    height:209px;
    margin:0 auto;
    background:#ddd;
    border:solid 1px #ddd;
}

#middleBanner > .boxArea > .imgBox > .desc {
    text-align:center;
}
#middleBanner > .boxArea > .imgBox > .desc > h5 {
    font-weight:bold;
    font-size:20px;
    margin:35px 30px;
}
#middleBanner > .boxArea > .imgBox > .desc > h5 {
    font-size:20px;
    padding:10px;
}
#middleBanner > .boxArea > .imgBox > .desc > h6 {
    font-size:16px;
}
#middleBanner > .boxArea > .imgBox > .desc > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background:#E6F4EC 0 0 no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#3DA267;
    font-size:16px;
    margin-top:30px;
}

#middleBanner > .center > button {
    width:256px;
    height:59px;
    background:#3da267 0 0 no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    font-weight:bold;
    font-size:16px;
    margin-top:150px;
}

#cardIssue {
    width:100%;
    height:900px;
    /* UI Properties */
    background:#f5f8f7 0 0 no-repeat padding-box;
    opacity:1;
}

#cardIssue > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    margin-top:150px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:27px;
}

#cardIssue > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    margin-top:230px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:13px;
}

#cardIssue > .center > .row {
    width:84%;
    height:500px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}
#cardIssue > .center > .row > .rec {
    width:48%;
    height:405px;
    margin-top:340px;
    background:#fff;
}
#cardIssue > .center > .row > .rec > .desc {
    padding:20px 20px;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}

#cardIssue > .center > .row > .rec > .desc > .iconBox {
    display:flex;
    flex-direction:row;
}
#cardIssue > .center > .row > .rec > .desc > .iconBox > img {
    margin:1px;
    width:30px;
    height:30px;
}

#cardIssue > .center > .row > .rec > .desc > .iconBox > h4 {
    padding-left:10px;
    width:100%;
    font:normal normal bold 24px/30px Noto Sans CJK KR;
    letter-spacing:-0.6px;
    color:#3da267;
    opacity:1;
}

#cardIssue > .center > .row > .rec > .desc > h5 {
    font-size:18px;
    font-weight:bold;
}
#cardIssue > .center > .row > .rec > .desc > h6 {
    font-size:16px;
}

#cardIssue > .center > .row > .rec > .top_green {
    width:100%;
    height:12px;
    background:#3da267 0 0 no-repeat padding-box;
}

#cardIssue > .center > .row > .rec > .boxMessage {
    margin:20px 20px;
    height:200px;
}

#cardIssue > .center > .row > .rec > .boxMessage > h6::before {
    content:"";
    position:absolute;
    top:10px;
    left:3px;
    width:2px;
    padding:2px;
    border-radius:50%;
    background:#3da267;
}

#cardIssue > .center > .row > .rec > .boxMessage > h6 {
    text-align:left;
    color:#3da267;
    font-size:18px;
    font-weight:bold;
    position:relative;
    padding-left:12px;
}

#cardIssue > .center > .row > .rec > .boxMessage > .smRound {
    padding:10px;
    margin-top:20px;
    width:100%;
    height:140px;
    display:flex;
    justify-content:space-between;
}

#cardIssue > .center > .row > .rec > .boxMessage > .smRound > .round {
    margin-top:20px;
    width:100px;
    height:100px;
    border-radius:50%;
    background:#f5f8f7 0 0 no-repeat padding-box;
    opacity:1;
    display:flex;
    justify-content:center;
    flex-direction:column;
    font-size:16px;
    font-weight:bold;
}
#cardIssue > .center > .row > .rec > .boxMessage > button {
    width:238px;
    height:59px;
    background:#3da267 0 0 no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    font-size:18px;
}

/* TomoProcess */

#TomoProcess {
    width:100%;
    height:30vh;
    padding-top:4%;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
    background:#e2f0e8;
}

#TomoProcess > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:32px;
}

#TomoProcess > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    top:76%;
    transform:translate(-50%, -50%);
    font-size:16px;
    padding:20px;
}

#TomoProcessIconBox {
    width:100%;
    height:60vh;
    display:flex;
    justify-content:center;
    background:#e2f0e8;
}
#TomoProcessIconBox > .center {
    background:no-repeat top url("./img/bg_tomorrow_progress.png");
}
#TomoProcessIconBox > .center > .areaNormal {
    width:100%;
    height:220px;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    margin-bottom:20px;
}
#TomoProcessIconBox > .center > .areaNormal > h4 {
    padding-top:20px;
    font-size:20px;
    font-weight:bold;
}
#TomoProcessIconBox > .center > .area {
    height:200px;
}
#TomoProcessIconBox > .center > .area > h4 {
    font-size:20px;
    font-weight:bold;
}
#TomoProcessIconBox > .center > .areaNormal > img {
    width:230px;
    height:230px;
    margin-top:20px;
}

#TomoProcessIconBox > .center > .area > img {
    width:270px;
    height:270px;
}

#Question {
    width:100%;
    height:100vh;
}

#Question > .center > h4 {
    margin-top:20px;
    font:normal normal bold 32px/50px Noto Sans CJK KR;
    letter-spacing:-0.8px;
    color:#000000;
}

#Question > .center > .rectWrapper {
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    margin:20px;
}

#Question > .center > .rectWrapper > .rect:nth-child(1) {
    margin:10px;
    width:102px;
    height:40px;
    /* UI Properties */
    background:#3da267 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    line-height:40px;
}

#Question > .center > .rectWrapper > .rect {
    margin:10px;
    width:102px;
    height:40px;
    vertical-align:center;
    line-height:40px;
    /* UI Properties */
    background:#e6f4ec 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
}

#Question > .center > .BoxWrapper > .qBox {
    width:1443px;
    height:100px;
    /* UI Properties */
    background:#f6f6f6 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    border-radius:4px;
    opacity:1;
    margin:10px 10px;
    padding:40px;
}
#Question > .center > .BoxWrapper > .qBox > .iconBox {
    display:flex;
    justify-content:flex-start;
    line-height:12px;
    padding:20px;
}

#Question > .center > .BoxWrapper > .qBox > .iconBox > h4 {
    line-height:24px;
    padding-left:10px;
    text-align:left;
    font:normal normal bold 18px/30px Noto Sans CJK KR;
    letter-spacing:-0.45px;
    color:#000000;
    opacity:1;
}

#Question > .center > .BoxWrapper > .qBox > .desc {
    text-align:left;
    font:normal normal medium 16px/30px Noto Sans CJK KR;
    letter-spacing:-0.4px;
}

#ServiceQuestion {
    width:100%;
    height:70vh;
    background:transparent url("./img/new_tomo_guide.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    padding-top:100px;
}
#ServiceQuestion > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:480px;
    margin:0 auto;
    line-height:27px;
    overflow:hidden;
}

#ServiceQuestion > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:26px;
    font-weight:bold;
    line-height:34px;
}

#ServiceQuestion > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background-color:#fff;
    color:#399871;
    font-size:13px;
    margin-top:50px;
}

/* 바우처 */

#vouCherbanner {
    width:100%;
    height:466px;
    background:transparent url("./img/voucherBanner.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    margin-top:160px;
    padding-top:70px;
}

#vouCherbanner > .text {
    padding:70px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:580px;
    margin:0 auto;
    line-height:27px;
    overflow:hidden;
}

#vouCherbanner > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:32px;
    line-height:34px;
}

#vouCherbanner > .text > h3 {
    padding-top:18px;
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:18px;
}

#vouCherbanner > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background-color:#fff;
    color:#399871;
    font-size:16px;
    margin-top:30px;
}

#voucherComment {
    /* UI Properties */
    background:#e6f3f4 0% 0% no-repeat padding-box;
    opacity:1;
    width:100%;
    height:40vh;
    background-size:cover;
    opacity:1;
    padding-top:100px;
}

#voucherComment > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:525px;
    margin:0 auto;
    line-height:27px;
    overflow:hidden;
}

#voucherComment > .text > .center > p {
    font-weight:bold;
    text-align:center;
    font-size:26px;
    font-weight:bold;
    line-height:32px;
}

#voucherComment > .text > h3 {
    padding-top:18px;
    font-weight:bold;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    font-family:normal normal medium 18px/30px Noto Sans CJK KR;
}

#VoucherbackgroundArea {
    width:100%;
    height:50vh;
    display:flex;
    justify-content:center;
    background:#e2f0e8;
}
#VoucherbackgroundArea > .center {
    background:no-repeat center url("./img/bg_tomorrow_cyan_line.png");
}
#VoucherbackgroundArea > .center > .area {
    width:20%;
    padding:6px;
    display:flex;
    justify-content:center;
    flex-direction:column;
}

#VoucherbackgroundArea > .center > .area > .round1 {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:258px;
    height:257px;
    margin:0 auto;
    background:#fff;
    border-radius:50%;
    font-weight:bold;
    font-size:35px;
}

#VoucherbackgroundArea > .center > .area > .roundCenter {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:100px;
    height:100px;
    margin:0 auto;
    margin-left:60px;
    border-radius:50%;
    color:#4ab5c3;
    background:#4ab5c3 0% 0% no-repeat padding-box;
    border:3px dashed #4ab5c3;
    opacity:1;
    font-weight:bold;
    color:#fff;
}

#VoucherbackgroundArea > .center > .area > .round2 {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:258px;
    height:257px;
    margin:0 auto;
    /* UI Properties */
    background:#4ab5c3 0% 0% no-repeat padding-box;
    opacity:1;
    border-radius:50%;
    color:#fff;
    font-weight:bold;
    font-size:35px;
}

#VoucherbackgroundArea > .center > .area > img {
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:230px;
    height:154px;
    margin:0 auto;
    padding:30px;
}

/* supportArea */

#supportArea {
    width:100%;
    height:1200px;
    background:#e2f0e8;
    margin-bottom:30px;
}

#supportArea > .rectTop {
    width:80%;
    height:40vh;
    margin:0 auto;
    background:#fff;
    margin-bottom:20px;
}

#supportArea > .box {
    width:82%;
    margin:0 auto;
    display:flex;
    justify-content:flex-start;
}

#supportArea > .box > .rect {
    width:48%;
    height:292px;
    margin:0 auto;
    background:#fff;
}
#supportArea > .box > .rect > .desc {
    width:100%;
    padding:25px 25px;
    display:flex;
    justify-content:flex-start;
}

#supportArea > .box > .rect > .desc > h4 {
    padding:18px;
    font-size:18px;
    line-height:16px;
    font-weight:bold;
}

#supportArea > .box > .rect > .detailDesc {
    margin-left:80px;
    position:relative;
}

#supportArea > .box > .rect > .detailDesc > h5 {
    font-size:18px;
    font-weight:bold;
    /* UI Properties */
    text-align:left;
    font:normal normal bold 18px/30px Noto Sans CJK KR;
    letter-spacing:-0.45px;
    color:#4ab5c3;
    opacity:1;
    margin-bottom:4px;
}

#supportArea > .box > .rect > .detailDesc > h5::before {
    content:"";
    position:absolute;
    top:14px;
    left:-12px;
    width:2px;
    padding:2px;
    border-radius:50%;
    background:#4ab5c3;
}

#supportArea > .box > .rect > .detailDesc > h6 {
    font-size:16px;
}

#supportArea > .rectTop {
    height:90vh;
}
#supportArea > .rectTop > .desc {
    padding:20px 20px;
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
}

#supportArea > .rectTop > .desc > h4 {
    padding:18px;
    font-size:18px;
    line-height:16px;
    font-weight:bold;
}

#supportArea > .rectTop > .desc > .iconBox > img {
    width:47px;
    height:47px;
}

#supportArea > .rectTop > h5 {
    margin-left:75px;
    font-size:18px;
    line-height:16px;
    font-weight:bold;
    /* UI Properties */
    text-align:left;
    font:normal normal bold 18px/30px Noto Sans CJK KR;
    letter-spacing:-0.45px;
    color:#4ab5c3;
    opacity:1;
}

#supportArea > .rectTop > h6 {
    margin:3px;
    margin-left:75px;
    font-size:18px;
    line-height:18px;
    line-height:16px;
}

#supportArea > .rectTop > table {
    width:80%;
    height:38vh;
    margin:0 auto;
    margin-top:25px;
}

#supportArea > .rectTop > table > thead {
    width:1213px;
    height:55px;
    border-top:solid 1px #000;
    /* UI Properties */
    background:#f6f6f6 0% 0% no-repeat padding-box;
    opacity:1;
}

#supportArea > .rectTop > table tr th {
    padding:20px;
}

#supportArea > .rectTop > table tr td {
    text-align:center;
    vertical-align:center;
}

.firstCell {
    text-align:center;
    padding-top:130px;
    vertical-align:top;
}

.bottomCell {
    text-align:center;
    padding-top:30px;
    vertical-align:top;
}

#supportArea > .rectTop > table tr td > h5 {
    padding:10px;
}

/* Voucher Middle Banner */

#VouchermiddleBanner {
    width:100%;
    height:1000px;
}

#VouchermiddleBanner > .center > h5 {
    margin-top:100px;
    font-size:32px;
    font-weight:bold;
    width:540px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
}

#VouchermiddleBanner > .center > h6 {
    margin-top:200px;
    font-size:16px;
    font-weight:bold;
    width:500px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
}
#VouchermiddleBanner > .boxArea {
    width:84%;
    height:700px;
    margin:0 auto;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}
#VouchermiddleBanner > .boxArea > .imgBox {
    margin-top:250px;
    width:349px;
    height:584px;
    background:#fff;
}
#VouchermiddleBanner > .boxArea > .BoxCenter {
    position:relative;
}
#VouchermiddleBanner > .boxArea .arrowLefT {
    position:absolute;
    top:205px;
    left:-56px;
    width:12px;
    padding:12px;
    font-size:40px;
    font-weight:bold;
}
#VouchermiddleBanner > .boxArea .arrowRight {
    position:absolute;
    top:205px;
    right:-56px;
    width:12px;
    padding:12px;
    font-size:40px;
    font-weight:bold;
}
#VouchermiddleBanner > .boxArea > .imgBox > .imgBoxTop {
    width:349px;
    height:209px;
    margin:0 auto;
    background:#ddd;
    border:solid 1px #ddd;
}

#VouchermiddleBanner > .boxArea > .imgBox > .desc {
    text-align:center;
}
#VouchermiddleBanner > .boxArea > .imgBox > .desc > h5 {
    font-weight:bold;
    font-size:20px;
    margin:35px 30px;
}

#VouchermiddleBanner > .boxArea > .imgBox > .desc > h5 {
    font-size:20px;
    padding:10px;
}

#VouchermiddleBanner > .boxArea > .imgBox > .desc > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background:#e6f3f4 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    font-size:16px;
    margin-top:30px;
}

#VouchermiddleBanner > .center > button {
    width:256px;
    height:59px;
    background:#4ab5c3 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    font-size:18px;
    margin-top:150px;
}

#VouchercardIssue {
    width:100%;
    height:900px;
    /* UI Properties */
    background:#f5f8f7 0 0 no-repeat padding-box;
    opacity:1;
}

#VouchercardIssue > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    margin-top:150px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:27px;
}

#VouchercardIssue > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    margin-top:230px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:16px;
}

#VouchercardIssue > .center > .row {
    width:84%;
    height:500px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}
#VouchercardIssue > .center > .row > .rec {
    width:48%;
    height:405px;
    margin-top:340px;
    background:#fff;
}
#VouchercardIssue > .center > .row > .rec > .desc {
    padding:20px 20px;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}

#VouchercardIssue > .center > .row > .rec > .desc > .iconBox {
    display:flex;
    flex-direction:row;
}
#VouchercardIssue > .center > .row > .rec > .desc > .iconBox > img {
    margin:1px;
}

#VouchercardIssue > .center > .row > .rec > .desc > .iconBox > h4 {
    padding-left:10px;
    width:100%;
    font:normal normal bold 24px/30px Noto Sans CJK KR;
    line-height:2.5;
    letter-spacing:-0.6px;
    color:#4ab5c3;
    opacity:1;
}

#VouchercardIssue > .center > .row > .rec > .desc > h5 {
    font-size:18px;
    font-weight:bold;
}

#VouchercardIssue > .center > .row > .rec > .top_blue {
    width:100%;
    height:12px;
    background:#4ab5c3 0% 0% no-repeat padding-box;
}

#VouchercardIssue > .center > .row > .rec > .boxMessage {
    margin:20px 20px;
    height:200px;
}

#VouchercardIssue > .center > .row > .rec > .boxMessage > h6::before {
    content:"";
    position:absolute;
    top:10px;
    left:3px;
    width:2px;
    padding:2px;
    border-radius:50%;
    background:#4ab5c3 0% 0% no-repeat padding-box;
}

#VouchercardIssue > .center > .row > .rec > .boxMessage > h6 {
    text-align:left;
    color:#4ab5c3;
    font-size:18px;
    font-weight:bold;
    position:relative;
    padding-left:12px;
}

#VouchercardIssue > .center > .row > .rec > .boxMessage > .smRound {
    padding:10px;
    margin-top:20px;
    width:100%;
    height:140px;
    display:flex;
    justify-content:space-between;
}

#VouchercardIssue > .center > .row > .rec > .boxMessage > .smRound > .round {
    margin-top:20px;
    width:100px;
    height:100px;
    border-radius:50%;
    background:#f5f8f7 0% 0% no-repeat padding-box;
    opacity:1;
    display:flex;
    justify-content:center;
    flex-direction:column;
    font-size:16px;
    font-weight:bold;
}
#VouchercardIssue > .center > .row > .rec > .boxMessage > button {
    width:238px;
    height:59px;
    background:#4ab5c3 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    color:#fff;
    font-size:18px;
}

#VoucherProcess {
    width:100%;
    height:30vh;
    padding-top:4%;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
    background:#e2f0e8;
}

#VoucherProcess > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:27px;
}

#VoucherProcess > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    top:60%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:16px;
    padding:20px;
}

#VoucherProcessIconBox {
    width:100%;
    height:60vh;
    display:flex;
    justify-content:center;
    background:#e2f0e8;
}

#VoucherProcessIconBox > .center > .areaNormal {
    width:100%;
    height:220px;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    margin-bottom:30px;
}
#VoucherProcessIconBox > .center > .areaNormal > h4 {
    padding-top:20px;
    font-size:18px;
}
#VoucherProcessIconBox > .center > .area {
    height:200px;
}
#VoucherProcessIconBox > .center > .area > h4 {
    font-size:18px;
}
#VoucherProcessIconBox > .center > .areaNormal > img {
    width:230px;
    height:230px;
    margin-top:20px;
}

#VoucherProcessIconBox > .center > .area > img {
    width:270px;
    height:270px;
}

#VoucherQuestion {
    width:100%;
    height:1200px;
}

#VoucherQuestion > .center > h4 {
    margin-top:20px;
    font:normal normal bold 32px/50px Noto Sans CJK KR;
    letter-spacing:-0.8px;
    color:#000000;
}

#VoucherQuestion > .center > .BoxWrapper > .qBox {
    width:1443px;
    height:100px;
    /* UI Properties */
    background:#f6f6f6 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
    margin:10px 10px;
    padding:40px;
}
#VoucherQuestion > .center > .BoxWrapper > .qBox > .iconBox {
    display:flex;
    justify-content:flex-start;
    line-height:12px;
    padding:20px;
}

#VoucherQuestion > .center > .BoxWrapper > .qBox > .iconBox > h4 {
    padding-left:10px;
    text-align:left;
    font:normal normal bold 18px/30px Noto Sans CJK KR;
    line-height:24px;
    letter-spacing:-0.45px;
    color:#000000;
    opacity:1;
}

#VoucherQuestion > .center > .BoxWrapper > .qBox > .desc {
    padding-left:60px;
    text-align:left;
    font:normal normal medium 16px/30px Noto Sans CJK KR;
    letter-spacing:-0.4px;
    font-size:16px;
}

#VoucherServiceQuestion {
    width:100%;
    height:70vh;
    background:#4ab5c3 0% 0% no-repeat padding-box;
    opacity:1;
    padding-top:100px;
}
#VoucherServiceQuestion > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:480px;
    margin:0 auto;
    line-height:27px;
    overflow:hidden;
}

#VoucherServiceQuestion > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:26px;
    line-height:34px;
}

#VoucherServiceQuestion > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background-color:#fff;
    color:#4ab5c3;
    font-size:16px;
    margin-top:50px;
}

/* 사업자훈련 시작*/

#OnwerGuideBanner {
    width:100%;
    height:466px;
    background:transparent url("./img/new_owner_guide.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    margin-top:160px;
    padding-top:70px;
}
#OnwerGuideBanner > .text {
    padding:70px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:550px;
    margin:0 auto;
}
#OnwerGuideBanner > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:32px;
    line-height:40px;
}
#OnwerGuideBanner > .text > h3 {
    padding-top:20px;
    font:normal normal medium Noto Sans CJK KR;
    font-size:18px;
    letter-spacing:-0.45px;
    color:#fff;
    text-align:center;
    margin-bottom:30px;
}
#OnwerGuideBanner > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    padding-bottom:4px;
    font-weight:bold;
    background-color:#fff;
    border-radius:4px;
    color:#2544B6;
    font-size:16px;
}
#OnwerGuideBanner > .text > img {
    float:left;
    display:inline-block;
    width:100px;
}

#OnwerComment {
    width:100%;
    height:20vh;
    padding-top:150px;
    padding-bottom:150px;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
    background:#e8ebf8 0% 0% no-repeat padding-box;
}

#OnwerComment > .center > h3 {
    width:540px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:32px;
}

#OnwerComment > .center > h4 {
    width:546px;
    height:10vh;
    position:absolute;
    left:50%;
    top:90%;
    transform:translate(-50%, -50%);
    font-size:16px;
}

#OnwerectangParent {
    width:100%;
    height:600px;
    background:#e8ebf8 0% 0% no-repeat padding-box;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    padding-bottom:12%;
}
#OnwerectangParent > .container {
    width:87%;
    height:800px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}

#OnwerectangParent .container > .rect1 {
    position:relative;
    width:439px;
    height:212px;
    background:#2342b5 0% 0% no-repeat padding-box;
    box-shadow:0px 10px 30px #2342b514;
    border-radius:4px;
    opacity:1;
}

#OnwerectangParent .container > .rect1::after {
    content:"";
    position:absolute;
    background:#2342b5;
    border-right:12px solid transparent;
    border-left:12px solid transparent;
    bottom:-80px;
    left:15px;
}

#OnwerectangParent .container > .rect1::before {
    content:"";
    position:absolute;
    border-top:18px solid #2342b5;
    border-right:12px solid transparent;
    border-left:12px solid transparent;
    bottom:-10px;
    left:15px;
}

#OnwerectangParent .container > .rect1 > .loIcon {
    text-align:center;
    width:100px;
    margin:0 auto;
    padding:55px;
}
#OnwerectangParent .container > .rect1 > .loIcon > h5 {
    color:#fff;
    font-weight:bold;
    font-size:24px;
}

#OnwerectangParent .container > .rect {
    width:439px;
    height:212px;
    box-shadow:0px 10px 30px #2342b514;
    background:#fff;
    border-radius:4px;
    opacity:1;
}
#OnwerectangParent .container > .rect > .loIcon {
    text-align:center;
    width:220px;
    margin:0 auto;
    padding:55px;
}
#OnwerectangParent .container > .rect > .loIcon > h5 {
    width:220px;
    font-weight:bold;
    font-size:24px;
}

#OnwerectangParent .container > .OnwerectangParentBottom {
    width:100%;
    height:450px;
    margin:0 auto;
    background:#fff;
}

#OnwerectangParent .container > .OnwerectangParentBottom > .center > .left {
    margin:60px 70px;
}

#OnwerectangParent
.container
> .OnwerectangParentBottom
> .center
> .left
> .sTop {
    width:390px;
    height:154px;
}
#OnwerectangParent
.container
> .OnwerectangParentBottom
> .center
> .left
> .sTop
> h5 {
    width:390px;
    font-weight:bold;
    font-size:24px;
}

#OnwerectangParent
.container
> .OnwerectangParentBottom
> .center
> .left
> .sTop
> h6 {
    font-size:16px;
    padding-top:10px;
}
#OnwerectangParent
.container
> .OnwerectangParentBottom
> .center
> .left
> .sBottom {
    width:360px;
    height:154px;
    background:#e8ebf8 0% 0% no-repeat padding-box;
}

#OnwerectangParent .container > .OnwerectangParentBottom {
    display:flex;
    flex-direction:row;
}
#OnwerectangParent
.container
> .OnwerectangParentBottom
> .left
> .sBottom
> .title {
    display:flex;
    justify-content:flex-start;
    padding-top:30px;
    padding-left:20px;
}

#OnwerectangParent
.container
> .OnwerectangParentBottom
> .left
> .sBottom
> .title
> h5 {
    font-weight:bold;
    margin:5px;
    line-height:16px;
    font-size:16px;
}

#OnwerectangParent
.container
> .OnwerectangParentBottom
> .left
> .sBottom
> h6 {
    padding:10px 35px;
    font-weight:bold;
}

#OnwerectangParent .container > .OnwerectangParentBottom > .right {
    margin-top:60px;
    width:806px;
    height:357px;
}
#OwnerConsulting {
    width:100%;
    height:900px;
    /* UI Properties */
    background:#fff;
    opacity:1;
}

#OwnerConsulting > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    margin-top:150px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:27px;
}

#OwnerConsulting > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    margin-top:230px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:13px;
}

#OwnerConsulting > .center > .consultingImg > img {
    width:87%;
    margin-top:300px;
}

#OwnerConsulting button {
    width:284px;
    height:59px;
    color:#fff;
    background:#2342b5 0% 0% no-repeat padding-box;
    border-radius:4px;
    opacity:1;
}

#OnwerCareComment {
    width:100%;
    height:1100px;
    /* UI Properties */
    opacity:1;
}

#OnwerCareComment > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    margin-top:150px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:27px;
}

#OnwerCareComment > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    margin-top:230px;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:13px;
}

#OnwerCareComment > .center > .careImgArea {
    position:relative;
    margin-top:300px;
    margin-bottom:200px;
    width:648px;
    height:648px;
    background:transparent url("./img/OnwerCareCommentImg.png") 0% 0% no-repeat padding-box;
    background-size:cover;
    opacity:1;
}

#OnwerCareComment > .center > .careImgArea > .rect1 {
    position:absolute;
    width:273px;
    height:92px;
    top:-50px;
    left:185px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

/* 제일상단에있는 박스안 텍스트는 강제로  */
#OnwerCareComment > .center > .careImgArea > .rect1 > h5 {
    margin-left:3px;
}

#OnwerCareComment > .center > .careImgArea > .rect1 > img {
    margin-left:32px;
}

#OnwerCareComment > .center > .careImgArea > .rect2 {
    position:absolute;
    width:273px;
    height:92px;
    top:165px;
    left:-195px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

#OnwerCareComment > .center > .careImgArea > .rect3 {
    position:absolute;
    width:273px;
    height:92px;
    top:400px;
    left:-195px;
    width:273px;
    height:92px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

#OnwerCareComment > .center > .careImgArea > .rect4 {
    position:absolute;
    width:273px;
    height:92px;
    top:165px;
    right:-195px;
    width:273px;
    height:92px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

#OnwerCareComment > .center > .careImgArea > .rect5 {
    position:absolute;
    width:273px;
    height:92px;
    top:400px;
    right:-195px;
    width:273px;
    height:92px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

#OnwerCareComment > .center > .careImgArea > .rect6 {
    position:absolute;
    width:273px;
    height:92px;
    bottom:-50px;
    left:185px;
    background:#fff;
    display:flex;
    flex-direction:row;
}

/* 이미지 아이콘 */
#OnwerCareComment > .center > .careImgArea img {
    margin-left:5px;
    padding:25px 10px;
    width:32px;
    height:36px;
}

#OnwerCareComment > .center > .careImgArea h5 {
    margin-top:30px;
    text-align:center;
    color:#2342b5;
    font-weight:bold;
    font-size:20px;
}

#OnwerProcess {
    width:100%;
    height:30vh;
    padding-top:4%;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
    background:#e8ebf8 0% 0% no-repeat padding-box;
}

#OnwerProcess > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:32px;
}

#OnwerProcess > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    top:76%;
    transform:translate(-50%, -50%);
    font-size:16px;
    padding:20px;
}

#OnwerProcessIconBox {
    width:100%;
    height:60vh;
    display:flex;
    justify-content:center;
    background:#e8ebf8 0 0 no-repeat padding-box;
}
#OnwerProcessIconBox > .center {
    background:no-repeat top url("./img/bg_tomorrow_progress.png");
}
#OnwerProcessIconBox > .center > .areaNormal {
    width:100%;
    height:220px;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    margin-bottom:20px;
}
#OnwerProcessIconBox > .center > .areaNormal > h4 {
    padding-top:20px;
    font-size:20px;
    font-weight:bold;
}
#OnwerProcessIconBox > .center > .area {
    height:200px;
}
#OnwerProcessIconBox > .center > .area > h4 {
    font-size:20px;
    font-weight:bold;
}
#OnwerProcessIconBox > .center > .areaNormal > img {
    width:230px;
    height:230px;
    margin-top:20px;
}

#OnwerProcessIconBox > .center > .area > img {
    width:270px;
    height:270px;
}

#OnwerProcessIconBoxBottom {
    width:100%;
    height:200px;
    margin:0 auto;
    margin-bottom:20px;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    background:#e8ebf8 0 0 no-repeat padding-box;
}
#OnwerProcessIconBoxBottom > .center > .rec {
    padding:24px 20px;
    margin:10px;
    width:600px;
    height:25px;
    /* UI Properties */
    background:#d3d9f1 0 0 no-repeat padding-box;
    border-radius:12px;
    opacity:1;
    display:flex;
    justify-content:flex-start;
}

#OnwerProcessIconBoxBottom > .center > .rec > h6 {
    padding:1px;
    padding-left:2px;
    font:normal normal bold 24px Noto Sans CJK KR;
    color:#2544b6;
    line-height:24px;
}
#OnwerProcessIconBoxBottom > .center > .rec > .arrow {
    margin-top:10px;
    margin-left:200px;
    width:13px;
    height:6px;
}

#OnwerProcess2 {
    width:100%;
    height:50vh;
    padding-top:4%;
    display:flex;
    flex-direction:row;
    justify-content:center;
    position:relative;
}

#OnwerProcess2 > .center > h3 {
    width:500px;
    height:18vh;
    position:absolute;
    left:50%;
    top:40%;
    transform:translate(-50%, -50%);
    font-weight:bold;
    font-size:32px;
}

#OnwerProcess2 > .center > h4 {
    width:500px;
    height:10vh;
    position:absolute;
    left:50%;
    top:76%;
    transform:translate(-50%, -50%);
    font-size:16px;
    padding:20px;
}

#OnwerProcess2 > .center > .OnwerprocessGuideImg {
    width:80%;
    height:10vh;
}

#supportCompany {
    width:100%;
    height:80vh;
    margin:0 auto;
}
#supportCompany .center > .rec {
    margin-top:80px;
    width:80%;
    height:400px;
    display:flex;
    flex-direction:column;
}

#OwnerServiceQuestion {
    width:100%;
    height:70vh;
    background:#2544b6 0 0 no-repeat padding-box;
    opacity:1;
}
#OwnerServiceQuestion > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:480px;
    margin:0 auto;
    line-height:27px;
    overflow:hidden;
}

#OwnerServiceQuestion > .text > .center > p {
    width:700px;
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:26px;
    line-height:34px;
}

#OwnerServiceQuestion > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    font-weight:bold;
    background-color:#fff;
    color:#399871;
    font-size:13px;
    margin-top:50px;
}
#lmsGDbanner {
    width:100%;
    height:466px;
    background:transparent url("./img/new_lms_guide.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    margin-top:160px;
    padding-top:70px;
}
#lmsGDbanner > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:550px;
    margin:0 auto;
}
#lmsGDbanner > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:32px;
    line-height:40px;
}
#lmsGDbanner > .text > .center > img {
    top:-100px;
    right:-130px;
    position:absolute;
    width:137px;
}
#lmsGDbanner > .text > h3 {
    padding-top:20px;
    font:normal normal medium Noto Sans CJK KR;
    font-size:18px;
    letter-spacing:-0.45px;
    color:#fff;
    text-align:center;
    margin-bottom:30px;
}
#lmsGDbanner > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    padding-bottom:4px;
    font-weight:bold;
    background-color:#fff;
    border-radius:4px;
    color:#399871;
    font-size:16px;
}
#lmsGDbanner > .text > img {
    float:left;
    display:inline-block;
    width:100px;
}
#jobGDbanner {
    width:100%;
    height:466px;
    background:transparent url("./img/new_job_guide.png") center center no-repeat;
    background-size:cover;
    opacity:1;
    margin-top:160px;
    padding-top:70px;
}
#jobGDbanner > .text {
    padding:100px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    width:450px;
    margin:0 auto;
}
#jobGDbanner > .text > .center > p {
    font-weight:bold;
    color:#fff;
    text-align:center;
    font-size:32px;
    line-height:40px;
}
#jobGDbanner > .text > .center > img {
    top:-100px;
    right:-130px;
    position:absolute;
    width:137px;
}
#jobGDbanner > .text > h3 {
    padding-top:20px;
    font:normal normal medium Noto Sans CJK KR;
    font-size:18px;
    letter-spacing:-0.45px;
    color:#fff;
    text-align:center;
    margin-bottom:30px;
}
#jobGDbanner > .text > button {
    width:196px;
    height:59px;
    margin:0 auto;
    padding-bottom:4px;
    font-weight:bold;
    background-color:#fff;
    border-radius:4px;
    color:#399871;
    font-size:16px;
}
#jobGDbanner > .text > img {
    float:left;
    display:inline-block;
    width:100px;
}

#JopProcessIconBox {
    width:100%;
    height:60vh;
    display:flex;
    justify-content:center;
    background:#e2f0e8;
}
#JopProcessIconBox > .center {
    background:no-repeat top url("./img/bg_tomorrow_progress.png");
}
#JopProcessIconBox > .center > .areaNormal {
    width:100%;
    height:220px;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    margin-bottom:20px;
}
#JopProcessIconBox > .center > .areaNormal > h4 {
    padding-top:20px;
    font-size:20px;
    font-weight:bold;
}
#JopProcessIconBox > .center > .area {
    height:200px;
}
#JopProcessIconBox > .center > .area > h4 {
    font-size:20px;
    font-weight:bold;
}
#JopProcessIconBox > .center > .areaNormal > img {
    width:230px;
    height:230px;
    margin-top:20px;
}

#JopProcessIconBox > .center > .area > img {
    width:270px;
    height:270px;
}