@charset "utf-8";

/******* 메인 /********/

    .wf_content {background-color:#f3f4f9; padding:20px;}
    .wf_content.main {background-color:#f3f4f9; padding:0px 20px 20px 20px;}

    .icon_wf:after,.icon_wf:before {content:"";display:block;background-image:url(../../../img/comm/iconstb/sprite_wf.png);background-size: 200px;}
  
    /* visual */
    .visual {position:relative; padding:37px 0 0 60px; min-height:200px;}
    .visual .slogan {position:relative; z-index:2;}
    .visual .slogan p {color:#555; font-size:0.938em; font-weight:600;}
    .visual .slogan p span {color:#942ea5; font-size:1.25em;}
    .visual .slogan button {position:relative;display: block;border-radius:20px;border:1px solid #942ea5;background:#f3f4f9;padding: 3px 28px 3px 14px;color:#942ea5;font-weight:600;font-size:0.813em;margin-top:20px;height:30px;max-height: 30px;}
    .visual .slogan button:after {content:"";position: absolute;top: calc(50% - 11px);display:inline-block;vertical-align:middle;width: 6px;height: 16px;background-position: -115px -10px;margin: 0px 0 0 7px;}
    .visual:before {content:"";position:absolute; bottom:-78px;left:-80px;background:url(../../../img/comm/imgtb/visualimg_left.png) no-repeat left bottom; width:171px;height:247px; background-size:100%;}
    .visual:after {content:"";position:absolute; top:-51px; right:-65px; background:url(../../../img/comm/imgtb/visualimg.png) no-repeat left bottom; width:367px; height:340px; background-size:contain; z-index:0;}

    /* 도움말 영역 */
    .welfare_guide {position:relative; background:#fff; border-radius:8px; box-shadow:0 5px 5px rgba(0,0,0,0.05); font-size:0.875em; display:flex; min-width:270px; width:calc(50% - 5px); z-index:1;}
    .welfare_guide .icon_wf:before {content:""; display:inline-flex; position:absolute; left:50%;}
    .welfare_guide .icon_wf.video:before {position: absolute;top: 50%;margin-top: -10px;margin-left:-75px;width: 22px;height:20px;background-position: -10px -9px;}
    .welfare_guide .icon_wf.help:before {position: absolute;top: 50%;margin-top: -10px;margin-left:-40px;width: 26px;height: 21px;background-position: -40px -11px;}
    .welfare_guide button {position:relative;flex:1.8;padding-left:25px;font-weight:600;/* padding: 10px 0px 10px 21px; */height: 38px;}
    .welfare_guide button:last-child {flex:1.2;}
    .down_btn {display:inline-block; text-align:center; padding:0 10px 0 10px; height:28px; background: #fff; border: 1px solid #999; border-radius: 3px;}
    .down_btn:after {width: 11px;height:11px;background-position: -20px -59px;display: inline-block;margin-left: 10px;}
    
    /* 박스영역 */
    .box_area {position:relative; display:flex; margin-top:10px; z-index:1;}
    .box_area .link_box01 {position:relative; border:1px solid #9281df; border-radius:7px; width:50%; min-width:281px; background:#fff; min-height:118px;}
    .box_area .link_box01:nth-child(odd) {margin-right:10px;}
    .box_area .link_box01 a.arr:after {content:"";display:inline-flex;position:absolute;bottom: 20px;right:20px;width: 25px;height: 25px;background-position: -279px -7px;}
    .box_area .link_box01 a {font-weight:600; width:100%; height:100%; padding:20px; display:inline-block;}
    .box_area .link_box01 a > span, .box_area .link_box01 p > span {display:block; font-weight:400; font-size:0.813em; color:#555; margin-top:10px;}
    .box_area .link_box01 p {font-weight:600; width:100%; padding:20px 20px 10px 20px; display:inline-block;}
    .box_area .link_box01 p.sub_button {background:#f4edfb;display:flex;border-bottom-left-radius:7px;border-bottom-right-radius:7px;padding:0;position:absolute;bottom:0; align-items: center;}
    .box_area:nth-child(4) .link_box01 p.sub_button {bottom:0;}
    .box_area .link_box01 p.sub_button > a {position:relative;font-size:0.875em;padding:0;text-align:center; color:#942ea5;min-height: 32px;display: flex;align-items: center;justify-content: center;}
    .box_area .link_box01 p.sub_button a:before {content:""; width:1px;height:10px;background:#c1c1c1; position: absolute;left: 0;}
    .box_area .link_box01 p.sub_button a:first-child:before {width:0; display:none;}
    .box_area .link_box01 p a:after {content:"";display:inline-block;vertical-align:middle;width: 6px;height: 20px;background-position: -115px -10px;margin: 0px 0 0 7px;background-size: 200px;}

    /* 버튼이 4개일때 */
    .box_area .link_box01.type1 .sub_button { flex-flow:row wrap;position:relative;}
    .box_area .link_box01.type1 .sub_button a {width:50%; margin:0;}
    .box_area .link_box01.type1 p.sub_button a:nth-child(3):before {content:""; display:none;}
    .box_area .link_box01.type1 p.sub_button a:nth-child(3),  .box_area .link_box01.type1 p.sub_button a:nth-child(4) {border-top:1px dotted #dfd5e9;}
    
    .box_area02 {display:inline-grid; width:50%;}    
    .box_area02 .link_box02 {position:relative; border:1px solid #9281df; border-radius:7px; width:100%; min-width:281px; background:#fff;}    
    .box_area02 .link_box02 a.arr:after {content:"";position:absolute;bottom:20px;right:20px;width: 25px;height: 25px;background-position: -79px -7px;}
    .box_area02 .link_box02 > a {font-weight:600; padding:20px 49px 20px 20px; display:flex; justify-content:center; flex-direction:column;}

    /* 일반회원 전용 */
    .box_area03 {display:flex; margin-top:10px;}
    .box_area03 .link_box03 {position:relative; border:1px solid #d7d7d7; width:33.333%; background:#fff; margin-right:10px; text-align:center; font-size:0.875em; display:flex; justify-content:center; flex-direction:column;}
    .box_area03 .link_box03:last-child {margin-right:0;}
    .box_area03 .link_box03 a, .box_area03 .link_box03 button {position:relative; padding:10px; font-weight:600; padding-top:65px; display:block; height:100%;}
    .box_area03 .link_box03 a em {font-weight:300}
    .box_area03 .link_box03:before {content:"";display:inline-flex;position:absolute;width: 45px;height: 45px;left:calc(50% - 22px);top: 15px;}
    .box_area03 .link_box03.icon01:before {background-position: -210px -41px;}
    .box_area03 .link_box03.icon02:before {background-position: -273px -41px;}
    .box_area03 .link_box03.icon03:before {background-position: -537px -41px;}

/* 메인end *************************************************************************************************************************************************/

/* 동영상 아코디언 */
.acc_wrap.mv {margin-top:15px;}
.acc_wrap.mv .panel {padding-top:15px; padding-bottom:15px;}
.acc_wrap.mv .acc_title {font-size:1em;}
.acc_wrap.mv .act .circle.blue {background:#0d4dae;}
.acc_wrap.mv .circle.blue {background:#838383; font-size:0.813em !important; margin-right:5px; height:25px; width:25px;}
.acc_wrap.mv .YouTube_view {position:relative; width:100%; height:0; padding-top:56%;}
.acc_wrap.mv .YouTube_view>iframe {position:absolute; top:0; left:0; width:100%; height:100%;}
.acc_wrap.mv .text_box {padding:10px 15px; background:#f4f8fd; height:115px; overflow-y:scroll; overflow-x:hidden; margin-top:10px; font-size:0.875em; line-height:1.5;}

/* 버튼(UTBICABA01) */
.checkList_btn {border:1px solid #46318c; display:inline-block; vertical-align:middle; float:right; font-weight:600; background:#fff; color:#46318c; overflow:hidden; font-size:0.857em; padding:4px 14px; box-sizing:border-box; height:30px; border-radius:20px;}
.checkList_btn:before {content:"";display:inline-block;vertical-align:middle;margin-right:3px;margin-top: -4px;width:10px;height:16px;background:url(../../../img/comm/iconstb/checklist_icon.png) no-repeat center 50%;background-size:100% auto;margin-bottom:-0.1em;}
.btn.text2 {height:auto; padding:5px;} /* 버튼에 택스트가 2줄이상 일때 */
.font12 {font-size:0.75em !important;}

/* 그드리 백그라운드 */
.table.flex table td.point_bg {background: #f7f1ed;}

/************************************************** media **************************************************************/

@media only screen and (min-width:640px){ 

    /* 동영상 아코디언 */
    .acc_wrap.mv .panel.text .YouTube_view {width:61%; height:0; padding-top:34%; margin-right:10px; float:left;}
    .acc_wrap.mv .panel.text .text_box {position:relative; height:0; padding-top:33%; margin-top:0; width:calc(39% - 10px);}
    .acc_wrap.mv .panel.text .text_box .media640 {position:absolute; display:block; top:10px; width:100%; padding-right:40px;}      

}

@media only screen and (max-width:700px) {

    /* 메인 */    
    .visual {padding:37px 0 0 0;}
    .visual:before {content:"";bottom:-63px;left:-63px; width:136px; height:123px;background-size:100%;}
    .visual:after {content:"";position:absolute;top:-12px;right:-84px;background:url(../../../img/comm/imgtb/visualimg.png) no-repeat right top;width:292px;height:230px;background-size:100%;}
    .welfare_guide {min-width:281px; width:100%;}    
    .box_area .link_box01 a {height:auto;}
    .box_area {display:block;}    
    .box_area .link_box01 {width:100%; margin-bottom:10px; min-height:auto;}
    .box_area:nth-child(4) .link_box01 p.sub_button {position:inherit;}
    .box_area .link_box01 p.sub_button {position:relative;min-height: 32px;}
    .box_area02 {display:block; width:100%;}    
    .box_area02 .link_box02 a {padding:20px 47px 20px 20px;}
    .box_area03 {display:block; min-width:281px;}
    .box_area03 .link_box03 {width:100%; margin-bottom:10px; text-align:left;}    
    .box_area03 .link_box03:before {content:"";position:absolute;display:inline-flex;width: 45px;height: 45px;margin:0 auto;right: 20px;left:auto;top:auto;}
    .box_area03 .link_box03 a, .box_area03 .link_box03 button {padding:15px 74px 15px 20px; min-height:66px; display:flex; justify-content:center; flex-direction:column;}
    .box_area03 .link_box03 a em {display:contents;}
    .box_area03 div:last-child {margin-bottom:0;}

}

@media only screen and (max-width:830px) and (min-width:701px){ 
    /* 메인 :버튼이 4개일때 */
    .box_area .link_box01.type1 .sub_button a:nth-child(even) {width:60%;}
    .box_area .link_box01.type1 .sub_button a:nth-child(odd) {width:40%;}
 }
 
 @media only screen and (max-width:480px) { 
     /* 메인 :버튼이 4개일때 */
     .box_area .link_box01.type1 .sub_button a:nth-child(even) {width:65%;}
     .box_area .link_box01.type1 .sub_button a:nth-child(odd) {width:35%;}
  }

@media only screen and (max-width:348px) {
    /* 메인 :> 숨김 */
    .box_area .link_box01 p a:after {display:none;}
}






/************************************************** 202310 소득자료 3차 **************************************************/
.form_line input,
.form_line select,
.form_line textarea {border-top:0 !important; border-right:0 !important; border-left:0 !important; background:none; border-color:#696f84;}
.form_line input.act,
.form_line textarea.act,
.form_line label.act,
.form_line input:focus,
.form_line select:focus,
.form_line textarea:focus {border-color:#0d4dae;}
.form_line input:read-only,
.form_line .readonly select,
.form_line .readonly:not(label) {background:none !important; color:#585858 !important; -webkit-text-fill-color:#585858 !important;}
.form_line input:disabled,
.form_line input[type="text"]:disabled,
.form_line input[type="tel"]:disabled,
.form_line input[type="number"]:disabled,
.form_line select:disabled,
.form_line textarea:disabled {color:#b9b9b9 !important; -webkit-text-fill-color:#b9b9b9 !important; border-color:#b0b3bc !important; background:none !important;}
.form_line input[type="text"]:read-only,
.form_line input[type="tel"]:read-only,
.form_line input[type="number"]:read-only,
.form_line textarea:read-only {color:#585858 !important; -webkit-text-fill-color:#585858 !important; border-color:#b0b3bc; background:none !important;}
.form_line .select {background:none;}
.form_line input[readonly].able,
.form_line input[disabled].able {background:none !important;}
.form_line .search_wrap input[type="text"]:read-only {border-color:#b0b3bc;}
.form_line .form li {padding-left:16px;}
.form_line .form li,
.form_line .form >li.ty2 .box_type .panel ul.form:after {transition: all 0.2s ease-in-out;}
.form_line .form li.act,
.form_line .form >li.ty2.act .box_type .panel ul.form:after {background:#fff0d7;}
.form_line .form li .reset,
.form_line .agreement_wrap .reset {position:relative;}
.form_line .form li .reset.on input,
.form_line .agreement_wrap .reset.on input {padding-right:25px;}
.form_line .form li .reset .close_btn,
.form_line .agreement_wrap .reset .close_btn {display:none; position:absolute; right:0; top:50%; margin-top:-9px; width:18px; height:18px; font-size:0; text-indent:-100%; background: url(../../../img/comm/iconstb/ico_mm.png) no-repeat -90px -250px; background-size:240px auto; z-index:99;}
.form_line .form li .reset .close_btn,
.form_line .agreement_wrap .reset .close_btn {background:none;}
.form_line .form li .reset .close_btn:before,
.form_line .form li .reset .close_btn:after,
.form_line .agreement_wrap .reset .close_btn:before,
.form_line .agreement_wrap .reset .close_btn:after {content:""; display:block; width:14px; height:2px; position:absolute; left:50%; top:50%; margin:-1px 0 0 -7px; border-radius:1px; background-color:#989cab; transform:rotate(45deg); -webkit-transform:rotate(45deg);}
.form_line .form li .reset .close_btn:after,
.form_line .agreement_wrap .reset .close_btn:after {transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
.form_line .form li .reset input:disabled + .close_btn,
.form_line .form li .reset input:read-only + .close_btn,
.form_line .agreement_wrap .reset input:disabled + .close_btn,
.form_line .agreement_wrap .reset input:read-only + .close_btn,
.form_line .form li .reset input[hidden="true"] + .close_btn,
.form_line .form li .reset + .close_btn {display:none !important;}
.form_line .form li .input_dp .reset input {width:calc(100% - 41px);}
.form_line .form li .input_dp .reset img {vertical-align:top;}
.form_line .form li .input_dp .reset .close_btn {right:41px; z-index:999;}
.form_line .form li .reset.pw .close_btn {right:18px;}
.form_line .form li .reset.on.pw input {padding-right:40px;}
.form_line .form li .reset.pw .pw_btn {position:absolute; right:0px; top:50%; margin-top:-7px; width:14px; height:14px; font-size:0; text-indent:-100%; background:url(../../../img/comm/welfare/pw_input_ico.png) no-repeat center top; z-index:99;}
.form_line .form li .reset.pw .pw_btn.on {background-position:center -14px;}
.form_line .form.off li .reset input {padding-right:5px;}
.form_line .form.off li .reset .close_btn {opacity:0;}

.counter {margin-bottom:15px;}
.counter:after {content:""; display:block; clear:both;}
.counter li {float:left; font-size:0.925em; margin-left:20px;}
.counter li:first-child {margin-left:0;}
.tab.switch label span {word-break:keep-all;}
.tab.switch label+label+label+label {margin-left:0;}
.form li .flex.depart .check_wrap.radio_ck {flex-basis:100px;}
.form li .flex.depart .flex {margin-top:0; flex:1;}

.form_wrap.typeA .agreement_wrap.ver2 {text-align:center; padding:25px 7%; border-radius:4px;}	
.form_wrap.typeA .agreement_wrap.ver2 p {font-weight:600; font-size:1.063em;}
.form_wrap.typeA .agreement_wrap.ver2 .flex {margin:10px 0;}
.form_wrap.typeA .agreement_wrap.ver2 .check_wrap {display:inline-block; text-align:center; padding-left:0 !important; line-height:1.6; font-size:1.063em;}

.info_box.tip {margin:0; background:#f9f9f9; border:0; padding:12px 15px;}
.info_box.tip p:not(.att), .info_box.tip li {font-size:0.875em; color:#666; line-height:1.5;}	
.info_box.tip p.att {line-height:1.4;}
.info_box.tip li {margin-top:5px; margin-bottom:0px;}
.info_box.tip li:first-child {margin-top:0px;}
li >.info_box.tip {margin-top:7px;}
.info_list_bullet.num li {text-indent:-20px; padding-left:20px !important;}
.info_list_bullet.num li:before {display:none;}	
.att_num {position:relative; padding-left:20px; line-height:1.5; font-size:0.875em;}
.att_num em.txt {background:#ff5a00; color:#fff !important; font-size:0.9em; width:18px; height:18px; line-height:17px; border-radius:9px 9px 0 9px; display:block; text-align:center; position:absolute; left:0; top:1px;}


@media only screen and (min-width: 768px) and (orientation: landscape){
    .form li .flex.depart .flex {flex:none;}
    .form_line .form li {padding-left:16px;}
} 
@media only screen and (max-width:767px) {
    .form_line .form li {padding-left:8px;}
}    
@media only screen and (max-width: 480px){
    .form li .flex.depart .flex {flex:none;}
} 
@media only screen and (max-width: 359px) {
    .form_line .form li >label {padding-left:8px;}
}    

/* 서브메인 */
.welfare {}
.welfare .btn {border:0; font-weight:400; font-size:0.925em; padding:5px 30px 5px 12px; height:auto; display:inline-block; min-width:10px;}
.welfare .link {text-decoration:none !important;}
.welfare .link:after {content:""; display:block; position:absolute; right:5px; top:50%; margin-top:-11px; border-radius:50%; -webkit-border-radius:50%; width:22px; height:22px; background-image:url(../../../img/comm/welfare/btn_arr.png); background-repeat:no-repeat;}
.welfare .box {border:1px solid #d6d6d6; border-radius:8px;}
.welfare .section {padding:30px 4%; position:relative;}
.welfare .section:after {content:""; display:block; clear:both;}
.welfare .section.bg_green {background-color:#eefcff;}
.welfare .section.bg_green:before {content:""; display:block; width:249px; height:135px; background-image:url(../../../img/comm/welfare/visual_bg.png); background-repeat:no-repeat; background-position:right bottom; position:absolute; right:0; top:0; z-index:1;}
.welfare .title {height:auto; margin-bottom:30px; position:relative; z-index:10; float:left; width:100%;}
.welfare .title .slogon {font-size:1.625em; word-break:keep-all;}
.welfare .title .slogon span {color:#046d7b;}
.welfare .title .slogon span em {color:#333;}
.welfare .title .sub_slogon {margin:10px 0 0 0;font-size:1.08em;}
.welfare .title .sub_slogon span {display:block;}
.welfare .title .sub_slogon span em {color:#046d7b;}
.welfare .title .btn {border:1px solid #107f8e; color:#006370; position:relative; z-index:10;}
.welfare .title .link:after {background-position:center top;}
.welfare .banner {margin-top:20px; display:flex; flex-wrap:nowrap;}
.welfare .banner:after {content:""; display:block; clear:both;}
.welfare .banner li {flex:1; margin-left:12px;}
.welfare .banner li:first-child {margin-left:0px;}
.welfare .banner li a {display:flex; align-items:center; height:100%;  border-radius:8px; -webkit-border-radius:8px; box-sizing:border-box; -webkit-box-sizing:border-box; padding:20px; position:relative; word-break: keep-all;}
.welfare .banner li a span {display:block; line-height:1.125em;}
.welfare .banner li a span em {display:inline-block; line-height:1.25em;}
.welfare .banner li a span i {font-style:normal;}
.welfare .banner.ty1 {margin-top:0; float:left; width:63%; height:210px;}
.welfare .banner.ty1 li a {text-align:center; justify-content:center; align-items:flex-start; font-size:1.3em; line-height:1.3em; font-weight:700; color:#333; padding:41px 25px; box-sizing:border-box; -webkit-box-sizing:border-box;}
.welfare .banner.ty1 li a span:before {content:""; display:block; width:78px; height:78px; border-radius:50%; -webkit-border-radius:50%; background-image:url(../../../img/comm/welfare/bn01_ico.png); background-repeat:no-repeat; margin:0 auto 12px auto;}
.welfare .banner.ty1 li:nth-child(1) a span:before {background-position:center top;}
/*
.welfare .banner.ty1 li:nth-child(2) a span:before {background-position:center -78px;}
*/
.welfare .banner.ty1 li:nth-child(2) a span:before {background-position:center -156px;}
.welfare .banner.ty1 li a.link:after {background-position:center -22px; right:50%; top:105px; margin-left:0; margin-right:-40px;}
.welfare .banner.ty1 li:nth-child(1) a {background-color:#bee9ea; border:1px solid #b0e1e3;}
.welfare .banner.ty1 li:nth-child(1) a span:before {background-color:#84c2cf;}
.welfare .banner.ty1 li:nth-child(1) a.link:after {background-color:#028896;}
.welfare .banner.ty1 li:nth-child(1) a span i {color:#007885;}
/*
.welfare .banner.ty1 li:nth-child(2) a {background-color:#f8efc7; border:1px solid #ffe2b0;}
.welfare .banner.ty1 li:nth-child(2) a span em + em {font-weight:400; font-size:0.8em; margin-left:5px;}
.welfare .banner.ty1 li:nth-child(2) a span:before {background-color:#fdd796;}
.welfare .banner.ty1 li:nth-child(2) a.link:after {background-color:#eb5e25;}
.welfare .banner.ty1 li:nth-child(2) a span i {color:#e25521;}
*/
.welfare .banner.ty1 li:nth-child(2) a {background-color:#c3e0fe; border:1px solid #bed9f5;}
.welfare .banner.ty1 li:nth-child(2) a span:before {background-color:#95c1e8;}
.welfare .banner.ty1 li:nth-child(2) a.link:after {background-color:#009ce4;}
.welfare .banner.ty1 li:nth-child(2) a span i {color:#1c61b6;}
.welfare .banner.ty2 {display:flex; float:left; width:calc(37% - 12px); display:block; margin-top:0; height:210px; margin-left:12px;}
.welfare .banner.ty2 li {flex:none; float:left; margin-left:0; height:calc(50% - 4px); margin-top:8px; width:100%;}
.welfare .banner.ty2 li:first-child {margin-top:0;}
/*
.welfare .banner.ty2 li + li {width:calc(50% - 4px);}
.welfare .banner.ty2 li:last-child {margin-left:8px;}
*/
.welfare .banner.ty2 li a {background:#e8e5f8; border:1px solid #d8d4ee; font-size:1.125em; font-weight:700; padding:25px 35px 25px 15px;}
.welfare .banner.ty2 li a.link:after {right:15px; background-color:#fff; background-position:center -45px; width:20px; height:20px; margin-top:0; top:auto; bottom:18px;}     
.welfare .banner.ty2 li a span i {color:#4c35c1; display:inline-block;}
.welfare .banner.ty2 li + li a {font-size:1.05em;}
.welfare .banner.ty2 li a span em.sub {font-weight:400; font-size:0.925em;}
.welfare .box.ty3 {display:flex;}
.welfare .banner.ty3 {margin:0 20px; flex:1; padding:0; background-image:none; background-repeat:repeat-x; background-position:left top; width:auto;}
.welfare .banner.ty3:nth-child(1) {background-position:3px bottom; padding-top:0px; padding-bottom:1px;}
.welfare .banner.ty3 li {}
.welfare .banner.ty3 li a {padding:20px 20px 20px 90px; min-height:108px; border-radius:0; -webkit-border-radius:0; font-size:1.05em;}
.welfare .banner.ty3 li a span:before {content:""; display:block; width:68px; height:68px; border-radius:50%; -webkit-border-radius:50%; background-color:#e6eff8; background-image:url(../../../img/comm/welfare/bn03_ico.png); background-repeat:no-repeat; position:absolute; left:10px; top:50%; margin-top:-34px;}
.welfare .banner.ty3:nth-child(1) li:nth-child(1) a span:before {background-position:center top;}
.welfare .banner.ty3:nth-child(1) li:nth-child(2) a span:before {background-position:center -68px;}
.welfare .banner.ty3:nth-child(2) li:nth-child(1) a span:before {background-position:center -136px;}
.welfare .banner.ty3:nth-child(2) li:nth-child(2) a span:before {background-position:center -204px;}
.welfare .banner.ty3 li a.link:after {background-color:#0591a0; background-position:center -23px; right:auto; left:62px; margin-top:0; top:65px; width:20px; height:20px;}
.welfare .box.info {padding:10px; display:flex; margin-top:20px;}
.welfare .box.info .list {flex:1; margin-left:12px; background-color:#f6f7f9; border-radius:6px; -webkit-border-radius:6px; padding:15px;}
.welfare .box.info .list:nth-child(1) {margin-left:0;}
.welfare .box.info .list .title {margin-bottom:7px; font-size:1.05em; min-height:10px; font-weight:700; padding-left:24px; background-image:url(../../../img/comm/welfare/ico_sm_time.png); background-repeat:no-repeat; float:none; width:auto;}
.welfare .box.info .list.time .title {background-position:left 3px;}
.welfare .box.info .list.method .title {background-position:left -37px;}
.welfare .box.info .list ul {margin-left:24px;}
.welfare .box.info .list.time ul li span {color:#046d7b; font-weight:700; letter-spacing:0.5px;}
.welfare .box.info .list.time ul li span.call {background-color:#046d7b; color:#fff; font-weight:400; border-radius:3px; -webkit-border-radius:3px; font-size:0.875em; padding:2px 5px; margin-right:8px; letter-spacing:0px;}
.welfare .box.info .list.method ul {display:flex; margin-left:15px;}
.welfare .box.info .list.method ul li {padding-left:10px; position:relative; flex:1;}
.welfare .box.info .list.method ul li:before {content:""; display:block; width:3px; height:3px; background-color:#747474; position:absolute; left:2px; top:9px;}
.welfare .box.info .list.method ul li strong {font-weight:400; display:inline-block; vertical-align:top;}
.welfare .box.info .list.method ul li div {display:inline-block; vertical-align:top; margin-left:10px;}
.welfare .box.info .list.method ul li div span {display:inline-block; position:relative; width:20px; height:20px; line-height:20px; background-color:#2d6fc0; color:#fff; text-align:center; border-radius:50%; -webkit-border-radius:50%; margin-left:30px;} 
.welfare .box.info .list.method ul li div span:before {content:""; display:block; width:20px; height:20px; position:absolute; left:-25px; top:0px; background-image:url(../../../img/comm/welfare/ask_tel.png); background-repeat:no-repeat; background-position:left -20px;}	
.welfare .box.info .list.method ul li div span.call {background-color:inherit; color:#7038c5; width:auto; margin-left:23px;}
.welfare .box.info .list.method ul li div span.call:before {background-position:left 0; left:-23px;}

@media only screen and (max-width:1600px) {
    /*
    .welfare .banner.ty1 {width:calc(100% - 370px);}
    .welfare .banner.ty2 {width:calc(370px - 12px);}
    */
    .welfare .box.info .list.method ul li strong {display:block;}
    .welfare .box.info .list.method ul li div {display:block; margin:5px 0 0 0;}
}
@media only screen and (max-width:1070px) {
    .welfare .title {margin-bottom:30px;}
    .welfare .section.bg_green:before {height:135px;}
    .welfare .title,
    .welfare .banner.ty1,
    .welfare .banner.ty2 {float:none; width:auto; height:auto;}
    /*
    .welfare .banner.ty1 li:nth-child(2) a span em + em {margin-left:0; margin-top:2px; display:block;}
    */
    .welfare .banner.ty1 li a {padding:25px;}
    .welfare .banner.ty1 li a.link:after {top:90px;}
    .welfare .banner.ty2 {margin-top:20px; display:flex; margin-left:0;}
    .welfare .banner.ty2 li {flex:1; margin-left:12px; margin-top:0; height:auto;}
    .welfare .banner.ty2 li:first-child {margin-left:0;}
    .welfare .banner.ty2 li:last-child {margin-left:12px;}
    .welfare .banner.ty2 li a {padding-top:25px; padding-bottom:25px; padding-right:25px;}
    .welfare .banner.ty2 li + li a {font-size:1.125em;}
    .welfare .banner.ty2 li a.link:after {top:auto; margin-top:0; bottom:15px;}
    .welfare .box.ty3 {display:block;}
    .welfare .box.ty3 .banner {flex:none; background-image:url(../../../img/comm/welfare/dashline_bg.png); padding-top:1px;}
    .welfare .banner.ty3:nth-child(1) {padding-top:0px; padding-bottom:1px;}
}
@media only screen and (max-width:900px) {
    .welfare .box.info .list.method ul {display:block;}
    .welfare .box.info .list.method ul li:nth-child(2) {margin-top:10px;}
}
@media only screen and (max-width:840px) {	
    .welfare {font-size:0.9em;}
    .welfare .section.bg_green {padding-top:25px;}
    .welfare .section.bg_green:before {transform:scale(0.9); -webkit-transform:scale(0.9); transform-origin:right top; -webkit-transform-origin:right top; right:-25px;}
    .welfare .title {margin-bottom:25px; min-height: 90px;}
    .welfare .banner.ty1 {display:block;}
    .welfare .banner.ty1 li {margin-left:0; margin-top:10px;}
    .welfare .banner.ty1 li:nth-child(1) {margin-top:0;}
    .welfare .banner.ty1 li a {padding:18px 15px;}
    .welfare .banner.ty1 li a span {position:relative; display:inline-block; vertical-align:top; min-height:68px; padding:22px 0 0 82px; text-align:left; width:215px;}
    /*
    .welfare .banner.ty1 li:nth-child(2) a span {padding-top:13px;}
    */
    .welfare .banner.ty1 li a span:before {margin-bottom:0; margin-right:10px; width:68px; height:68px; background-size:100% auto; position:absolute; left:0; top:0;}
    .welfare .banner.ty1 li a span:after {content:""; display:block; position:absolute; left:52px; top:42px; border-radius:50%; -webkit-border-radius:50%; width:22px; height:22px; background-image:url(../../../img/comm/welfare/btn_arr.png); background-repeat:no-repeat; background-position:center -22px;}
    .welfare .banner.ty1 li:nth-child(1) a span:after {background-color:#028896;}
    /*
    .welfare .banner.ty1 li:nth-child(2) a span:after {background-color:#eb5e25;}
    */
    .welfare .banner.ty1 li:nth-child(2) a span:after {background-color:#009ce4;}
    /*
    .welfare .banner.ty1 li:nth-child(2) a span:before {background-position:left -68px;}
    */
    .welfare .banner.ty1 li:nth-child(2) a span:before {background-position:left -136px;}
    .welfare .banner.ty1 li a span em {display:block;}
    .welfare .banner.ty1 li a.link:after {display:none;}
    .welfare .banner.ty2 li a {padding-top:18px; padding-bottom:18px;}
    .welfare .banner.ty3 li a {min-height:88px; padding:15px 15px 15px 78px;}
    .welfare .banner.ty3 li a span:before {width:58px; height:58px; background-size:100% auto; margin-top:-29px;}
    .welfare .banner.ty3:nth-child(1) li:nth-child(1) a span:before {background-position:left top;}
    .welfare .banner.ty3:nth-child(1) li:nth-child(2) a span:before {background-position:left -58px;}
    .welfare .banner.ty3:nth-child(2) li:nth-child(1) a span:before {background-position:left -116px;}
    .welfare .banner.ty3:nth-child(2) li:nth-child(2) a span:before {background-position:left -174px;}
    .welfare .banner.ty3 li a.link:after {left:51px; top:56px;}
    .welfare .box.info .list.time .title {background-position:left 1px;}
    .welfare .box.info .list.method .title {background-position:left -38px;}
}
@media only screen and (max-width:640px) {
    .welfare .title .slogon {font-size: 1.55em;}
    .welfare .banner.ty2 li a {padding-right:38px;}
}
@media only screen and (max-width:580px) {
    .welfare .banner.ty1 li {margin-top:8px;}
    .welfare .banner.ty1 li a {padding:15px;}
    .welfare .banner.ty2 {display:block;}
    .welfare .banner.ty2 li {margin-left:0;}
    .welfare .banner.ty2 li:nth-child(2) {margin-top:8px;}
    .welfare .banner.ty2 li + li {width:100%;}
    .welfare .banner.ty2 li:last-child {margin:0; margin-top:8px;}
    .welfare .banner.ty2 li a span em {display:inline-block;}
    .welfare .banner.ty2 li a span em + em {margin-top:0px;}
    .welfare .banner.ty2 li a.link:after {bottom:50%; margin-bottom:-11px;}
}
@media only screen and (max-width:540px) {
    .welfare .section.bg_green {padding-top:20px;}
    .welfare .section.bg_green:before {height:150px;}
    .welfare .title .slogon span {display:block; line-height:1.25em;}
}	
@media only screen and (max-width:480px) {
    .welfare .section.bg_green:before {transform:scale(0.85); -webkit-transform:scale(0.85);}
    .welfare .title .slogon {font-size: 1.45em;}
    .welfare .title .sub_slogon {font-size:1em;}
    .welfare .title .slogon span {line-height:1.2em;}
    .welfare .box.info {display:block;}
    .welfare .box.info .list {margin-left:0;}
    .welfare .box.info .list:nth-child(2) {margin-top:8px;}
    .welfare .box.info .list.method ul {display:flex;}
    .welfare .box.info .list.method ul li:nth-child(2) {margin-top:0;}
}	
@media only screen and (max-width:430px) {
    .welfare .banner.ty3 li {margin-left:0;}
    .welfare .banner.ty3 li a {padding-left:0; padding-right:0; text-align:center;}
    .welfare .banner.ty3 li a span {margin:0 auto;}
    .welfare .banner.ty3 li a span:before {position:relative; left:auto; top:auto; margin:0 auto 10px auto;}
    .welfare .banner.ty3 li a.link:after {left:50%; margin-left:13px;}
    .welfare .box.info .list.method ul {display:block;}
    .welfare .box.info .list.method ul li:nth-child(2) {margin-top:10px;}
}
@media only screen and (max-width:380px) {
    .welfare .section.bg_green:before {right:-50px;}
}    








