.s0401_stepbox ul li{width:32.5%;float:left;border:1px solid #ddd;box-sizing:border-box;padding:120px 15px 30px;position:relative;margin-right:5px;text-align:center;height:380px}
.s0401_stepbox ul li:after{position:absolute;right:-20px;content:'';top:45%;background: url(/pages/fund/img/sub/sub0401_arrow.png) no-repeat;width:34px;height:34px;z-index:9 }
.s0401_stepbox ul li:last-child:after{display:none}
.s0401_stepbox ul li dt{font-size:19px;font-weight:700;color:#000;margin:10px 0 20px}
.s0401_stepbox ul li dd{text-align:left; letter-spacing: -1px;}
.s0401_stepbox ul li h5{color:#fff;font-weight:700}
.s0401_stepbox ul li.s0401_step1{background:#67c4d3 url(/pages/fund/img/sub/sub0401_icon01new.png) no-repeat center 35px}
.s0401_stepbox ul li.s0401_step2{background:#67c4d3 url(/pages/fund/img/sub/sub0401_icon02new.png) no-repeat center 35px}
.s0401_stepbox ul li.s0401_step3{background:#67c4d3 url(/pages/fund/img/sub/sub0401_icon03new.png) no-repeat center 35px}

.donation_online{width:100%;padding:20px;box-sizing:border-box;text-align:center;background:#369f67;color:#fff;display:block;clear:both}
.donation_online:hover{background:#25804f;text-decoration:none;font-weight:700}
.donation_online span{background:url(../img/sub/btn_link_icon.png) right top no-repeat;padding-right:21px}


.whoone{font-size:18px; margin-bottom:25px}

.support_box{width:100%;display:block;border-radius:25px;height: 306px;background:url(/pages/new_fund/img/sub/support_bg.jpg) no-repeat center right;margin-bottom:50px;overflow: hidden;}
.support_box .support_top{float:left;font-size: 32px;line-height: 37px;color:#000;font-weight: 400;margin: 134px 0 0 103px;float: left;}


.circle-diagram .circle-diagram-wrap .title{text-align:center;font-size:24px;line-height: 28px;margin-bottom: 10px;font-weight: 600;}
.circle-diagram .circle-diagram-wrap .title span{font-size:16px;color: #8BC34A;display: block;}
.circle-diagram .circle-diagram-wrap {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap-24);
    flex-wrap: wrap;
    padding-bottom: var(--gap-100);
    position: relative;
    margin-bottom: var(--gap-16);
}

.circle-diagram .circle-diagram-wrap:before {
    content: "";
    width: 100%;
    height: var(--gap-100);
    background-size: auto 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}

.circle-diagram .circle-diagram-wrap .circle-box {
   width: calc(100% / 4 - 0px);
   padding: 10px;
   position: relative;
   box-sizing: border-box;
   overflow: hidden;
   z-index: 10;
   margin: 25px;
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    position: relative;
    z-index: 10;
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap:before {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #fff;
    border: 2px solid rgba(192,189,185,0.4);
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 0;
    transform: translate(-50%,-50%);
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box {
    width: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    padding: var(--gap-24);
    box-sizing: border-box;
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .icon {
    width: 40%;
    max-width: 92px;
    margin: 0 auto;
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .icon img {
    display: block;
    max-width: 100%;
    margin: 0 auto;
}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .conts {
    text-align: center;
    font-size: 18px;
    line-height: 24px;
    margin-top: 15px;
    letter-spacing: -1px;
}

.circle-diagram .circle-diagram-wrap .circle-box .line {
    width: 100%;
    height: 50%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    overflow: hidden;
}

.circle-diagram .circle-diagram-wrap .circle-box .line:before {
    content: "";
    width: 100%;
    height: calc(100%* 2);
    border-radius: 50%;
    box-sizing: border-box;
    border: 4px solid #4CAF50;
    position: absolute;
    left: 0;
    top: 0;
}

.support_mailbox{width: 80%;display: flex;justify-content: center;padding: 30px 0 10px 0;border: solid 1px #ffffff;margin: 0 auto;background: #f3f2f2;border-bottom-right-radius: 30px;}
.support_mail{/* width: 64%; */background:url('/pages/new_fund/img/sub/support_icon4.png') no-repeat 10px 15px;padding-left: 101px;width: calc(100% / 2 - -100px);}
.support_mail2
.s_tit{font-size:18px}
.fund_down dl .hwp_blue {
    margin-right: 15px;
}

/****** 1200 ******/
@media screen and (max-width: 1200px) {
.support_box{ height:250px; overflow: hidden; background-size: 100%;}
.support_box .support_top{font-size: 30px;line-height:33px;margin:80px 0 0 150px;float: left;}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .icon img {
    display: block;
    max-width: 60%;
    margin: 0 auto;
}
.circle-diagram .circle-diagram-wrap .circle-box {
    width: calc(100% / 3 - 54px); margin-right: 13px;}
.support_mailbox {width: 94%;}
}

/****** 96 ******/
@media screen and (max-width: 960px) {
.support_mail {
    width: calc(100% / 2 - -30px);}
}

/****** Tablet Device ******/
@media screen and (min-width:691px) and (max-width:899px) {

.support_box{ height:180px;}
.support_box .support_top{font-size: 21px;line-height: 27px;margin: 76px 0 0 53px;float: left;}
.support_txt {font-size: 16px;line-height: 27px;margin-top: 0px;}

.s0401_stepbox ul li{font-size:14px;padding:120px 10px 30px}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .icon { width: 40%;max-width:55px;}
.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .conts { font-size: 15px;line-height: 17px;}
.support_mailbox {
    width: 92%;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: row;
}
.support_mail {
    width: calc(100% / 1 - -30px);}
}


/****** Mobile ******/
@media screen and (max-width:690px){

.support_box{ height:200px; background-size: cover;margin-bottom:20px;}
.support_box .support_top{margin: 108px 0 0 0px;float: left;font-size:18px;line-height:24px;font-weight:500;color:#333;background: #ffffffa8;padding: 10px 20px;width: 100%;}
.support_txt {font-size: 15px;line-height: 27px;margin-top: 0px; text-align:left;}

.s0401_stepbox ul li{width:100%;margin-bottom:5px}
.s0401_stepbox ul li::after{right:auto;top:auto;bottom:-20px;transform:rotate(90deg);left:50%;margin-left:-17px}
    .circle-diagram .circle-diagram-wrap .circle-box {
        width: calc(100% / 1 - 35px);}

.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap {padding-bottom:62%;}
.circle-diagram .circle-diagram-wrap .circle-box {margin:15px}
.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap:before {border-radius: 0;width: 100%; height: 100%;}
.circle-diagram .circle-diagram-wrap .circle-box .line {display:none}
.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .icon {width: 40%;max-width: 66px;}
.support_mailbox {
    width: 92%;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: row;
}
    .support_mail {
        width: calc(100% / 1 - -30px);
    }
	.ul_type1 {
    margin: 0 0 10px 0;
    width: 88%;
    overflow: hidden;
}
.circle-diagram .circle-diagram-wrap .circle-box .circle-wrap .conts-box .conts {
    text-align: center;
    font-size: 15px;
    line-height: 18px;
    font-weight: 400;
    margin-top: 15px;
    letter-spacing: 0px;
    margin-bottom: 10px;
}
	}