@import url('sub.css'); 


/**** S:: 사이버신문고 ****/
.cyber_cont .subtitle p.fs20 {font-size:1.111rem; text-align:center; color:rgba(34,34,34,.7); line-height:160%; margin-bottom:73px; }
.cyber_cont .line_box{padding-bottom:40px; text-align:center; }
.cyber_cont .line_box .fs40 {font-size:2.222rem; line-height:130%; font-weight:700; color:var(--black);}

.cyber_icon{display:flex; flex-wrap:wrap;}
.cyber_icon li{box-sizing:border-box;  border:1px solid var(--border); padding:40px 130px 40px 40px; width:calc(100% / 4); position:relative;}
.cyber_icon li:nth-child(4n){margin-right:0;}
.cyber_icon li .num{display:block; width:40px; height:40px; line-height:40px; font-size:0.889rem; font-weight: 700; color:var(--main); background:var(--white);  border:1px solid rgba(0,171,169,.3); border-radius:50%; text-align:center; margin:0 0 12px; box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.08);}
.cyber_icon li .fs20{font-weight:500; color:var(--black); font-size:1.111rem; line-height:150%;}
.cyber_icon li .icon{display:flex; justify-content: center; align-items:center; position:absolute; right:20px; top:50%; margin-top:-50px;}
.cyber_icon li .icon img{max-width:100%; width:112px;}

.cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(7) {background:var(--grayBg); }
.cyber_icon li:nth-of-type(1), .cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3) {border-right:0; border-bottom:0;}
.cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {border-right:0; }
.cyber_icon li:nth-of-type(4) {border-bottom:0;}



.cyber_principle{background:url('/customer/img/cyber_bg.jpg') no-repeat center/cover;}
.cyber_principle h3 {text-align:center; font-size:2.222rem; line-height:130%; font-weight:700; color:var(--black);}
.cyber_principle .cyber_list{display:flex; flex-wrap:wrap; padding:50px 0 0;}
.cyber_principle .cyber_list dl{margin:0 30px 0 0; width:calc((100% - 60px)/3); box-sizing:border-box; background:var(--white);}
.cyber_principle .cyber_list dl:last-child{margin:0;}
.cyber_principle .cyber_list dl dt{padding:20px; font-size:1.111rem; font-weight:700; line-height:150%; color:var(--white); background:var(--main)}
.cyber_principle .cyber_list dl dd {text-align:left;padding:30px; font-size:1rem; color:rgba(34,34,34,.6); line-height:155.556%;}
.cyber_principle .cyber_list dl.list .fs16{font-size:1rem;  line-height:155.556%; padding:0 0 15px 60px; position:relative; box-sizing:border-box;}
.cyber_principle .cyber_list dl.list .fs16:last-child{padding-bottom:0; border-top:1px solid var(--border); padding-top:18px;}
.cyber_principle .cyber_list dl.list .fs16 strong{display:inline-block; font-size:1rem;  line-height:155.556%; color:var(--black); font-weight:700; position:absolute; left:0; top:0;}
.cyber_principle .cyber_list dl.list .fs16:last-child strong {top:18px;}


.cyber_report{}
.cyber_report ul{display:flex; flex-wrap:wrap;}
.cyber_report ul li{margin:0 30px 0 0; width:calc((100% - 30px)/2); text-align:center; padding:50px 40px; box-sizing:border-box; background:var(--grayBg); }
.cyber_report ul li:first-child{background:none; border:1px solid var(--border)}
.cyber_report ul li:last-child{margin:0;}
.cyber_report ul li .fs40{padding:0 0 30px; font-size:2.222rem; line-height:130%; font-weight:700; color:var(--black);}
.cyber_report ul li.report_way dl{display:flex; flex-wrap:wrap; box-sizing:border-box; margin:0 0 20px;  background:var(--white);}
.cyber_report ul li.report_way dd{box-sizing:border-box; width:50%;}
.cyber_report ul li.report_way dd:first-child{border-right:1px solid var(--border);}
.cyber_report ul li.report_way dd a{display:block; padding:30px; text-align:center;}
.cyber_report ul li.report_way dd a h4{padding:0 0 18px; font-weight: 700; font-size:1.111rem; color:var(--black);}
.cyber_report ul li.report_way dd a h4 .material-symbols-outlined{display:inline-block; vertical-align: middle; margin:-2px 0 0 3px; font-size:16px; color:rgba(34,34,34,.5);}
.cyber_report ul li.report_way dd a .portal{font-size:84px; color:var(--main); font-variation-settings: 'wght' 300;}
.cyber_report ul li.report_way dd a .call{font-size:50px; color:var(--main);}
.cyber_report ul li.report_way dd a .tel{ color:var(--main); font-family:var(--eng); font-size:1.111rem; font-weight: 700; line-height: 170%; }
.cyber_report ul li h5{text-align:left; padding:0 0 0 98px; box-sizing:border-box; position:relative; font-weight:400; font-size:1rem; line-height: 155.556%; color:rgba(34,34,34,.7)}
.cyber_report ul li h5 strong{display:inline-block; font-size:1.111rem; color:var(--black); font-weight:700; line-height: 150%; position:absolute; left:0; top:0;}
.cyber_report .ex{padding:45px 0 0; text-align:center; color:rgba(34,34,34,.6); font-size:1.111rem; line-height:150%; color:rgba(34,34,34,.6)}
.cyber_report .ex span {font-size:1.111rem; line-height:150%;}

.cyber_report ul li .dot {}
.cyber_report ul li .dot dd {position:relative; padding-left:12px; font-size:1rem; color:rgba(34,34,34,.6); margin-bottom:8px; line-height:155.556%;  text-align:left;}
.cyber_report ul li .dot dd:before {display:block; content:''; width:4px; height:4px; border-radius:100%; background:rgba(34,34,34,.3); left:0; top:10px; position:absolute; }
/**** E:: 사이버신문고 ****/


/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){

.cyber_principle .cyber_list dl dd br {display:none;}

.cyber_report ul li .dot dd br {display:none;}
}

/*******************************************************************************
    @media 1350px
*******************************************************************************/
@media all and (max-width:1350px){

/**** S:: 사이버신문고 ****/
.cyber_cont .subtitle p.fs20 {font-size:1.111rem; line-height:160%; margin-bottom:73px; }
.cyber_cont .line_box{padding-bottom:40px;}
.cyber_cont .line_box .fs40 {font-size:2.222rem; line-height:130%; }

.cyber_icon{display:flex; flex-wrap:wrap;}
.cyber_icon li{ padding:40px 130px 40px 40px; width:calc(100% / 4); }
.cyber_icon li .num{display:block; width:40px; height:40px; line-height:40px; font-size:0.889rem; margin:0 0 12px; }
.cyber_icon li .fs20{font-size:1.111rem; line-height:150%;}
.cyber_icon li .icon{right:20px; top:50%; margin-top:-50px;}
.cyber_icon li .icon img{width:100px}

.cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(7) {background:var(--grayBg); }
.cyber_icon li:nth-of-type(1), .cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3) {border-right:0; border-bottom:0;}
.cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {border-right:0; }
.cyber_icon li:nth-of-type(4) {border-bottom:0;}


}

/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1280px){

/**** S:: 사이버신문고 ****/
.cyber_cont .subtitle p.fs20 {font-size:1.1rem; line-height:160%; margin-bottom:60px; }
.cyber_cont .line_box{padding-bottom:30px;}
.cyber_cont .line_box .fs40 {font-size:2.2rem; line-height:130%; }

.cyber_icon{display:flex; flex-wrap:wrap;}
.cyber_icon li{ padding:30px ; width:calc(100% / 4); display:flex; flex-direction:column; align-items: center;}
.cyber_icon li .num{display:block; width:40px; height:40px; line-height:40px; font-size:0.889rem; margin:0 0 12px; }
.cyber_icon li .fs20{font-size:1.1rem; line-height:150%; text-align:center;}
.cyber_icon li .icon{position:unset; margin-top:0; margin-bottom:20px;}
.cyber_icon li .icon img{width:100px}

.cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(7) {background:var(--grayBg); }
.cyber_icon li:nth-of-type(1), .cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3) {border-right:0; border-bottom:0;}
.cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {border-right:0; }
.cyber_icon li:nth-of-type(4) {border-bottom:0;}

.cyber_principle h3 {font-size:2.222rem; line-height:130%; }
.cyber_principle .cyber_list{padding:40px 0 0;}
.cyber_principle .cyber_list dl{margin:0 20px 0 0; width:calc((100% - 40px)/3); }
.cyber_principle .cyber_list dl dt{padding:18px; font-size:1.111rem; line-height:150%; }
.cyber_principle .cyber_list dl dd {padding:20px; font-size:1rem; color:rgba(34,34,34,.6); line-height:155.556%;}
.cyber_principle .cyber_list dl.list .fs16{font-size:1rem;  line-height:155.556%; padding:0 0 15px 60px;}
.cyber_principle .cyber_list dl.list .fs16:last-child{padding-top:15px;}
.cyber_principle .cyber_list dl.list .fs16 strong{font-size:1rem;  line-height:155.556%; }
.cyber_principle .cyber_list dl.list .fs16:last-child strong {top:15px;}


.cyber_report ul li{margin:0 30px 0 0; width:calc((100% - 30px)/2); padding:40px; }
.cyber_report ul li .fs40{padding:0 0 30px; font-size:2.222rem; line-height:130%;}
.cyber_report ul li.report_way dl{display:flex; flex-wrap:wrap; margin:0 0 20px; }
.cyber_report ul li.report_way dd{width:50%;}
.cyber_report ul li.report_way dd:first-child{border-right:1px solid var(--border);}
.cyber_report ul li.report_way dd a{padding:30px;}
.cyber_report ul li.report_way dd a h4{padding:0 0 18px; font-size:1.111rem; color:var(--black);}
.cyber_report ul li.report_way dd a h4 .material-symbols-outlined{margin:-2px 0 0 3px; font-size:16px; }
.cyber_report ul li.report_way dd a .portal{font-size:64px; }
.cyber_report ul li.report_way dd a .call{font-size:50px; }
.cyber_report ul li.report_way dd a .tel{ font-size:1.111rem; }
.cyber_report ul li h5{text-align:left; padding:0 0 0 88px; font-size:1rem; line-height: 155.556%; }
.cyber_report ul li h5 strong{font-size:1.111rem; line-height: 150%; }
.cyber_report .ex{padding:45px 0 0; font-size:1.111rem; line-height:150%; }
.cyber_report .ex span {font-size:1.111rem; line-height:150%;}

.cyber_report ul li .dot dd {padding-left:12px; font-size:1rem; margin-bottom:8px; line-height:155.556%;  }
.cyber_report ul li .dot dd:before {width:4px; height:4px; top:10px; }

}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

/**** S:: 사이버신문고 ****/
.cyber_cont .subtitle p.fs20 {font-size:1.1rem; line-height:160%; margin-bottom:40px; }
.cyber_cont .subtitle p.fs20 br {display:none;}
.cyber_cont .line_box{padding-bottom:20px;}
.cyber_cont .line_box .fs40 {font-size:2.2rem; line-height:130%; }

.cyber_icon li{ padding:20px ; width:calc(100% / 4); }
.cyber_icon li .num{display:block; width:35px; height:35px; line-height:35px; font-size:0.88rem;  margin:0 0 12px; }
.cyber_icon li .fs20{font-size:1.1rem; line-height:150%; text-align:center;}
.cyber_icon li .icon{position:unset; margin-top:0; margin-bottom:20px;}
.cyber_icon li .icon img{width:80px}

.cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(7) {background:var(--grayBg); }
.cyber_icon li:nth-of-type(1), .cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3) {border-right:0; border-bottom:0;}
.cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {border-right:0; }
.cyber_icon li:nth-of-type(4) {border-bottom:0;}

.cyber_principle h3 {font-size:2.2rem; line-height:130%; }
.cyber_principle .cyber_list{padding:40px 0 0;}
.cyber_principle .cyber_list dl{margin:0 20px 0 0; width:calc((100% - 40px)/3); }
.cyber_principle .cyber_list dl dt{padding:18px; font-size:1.1rem; line-height:150%; }
.cyber_principle .cyber_list dl dd {padding:20px; font-size:1rem; color:rgba(34,34,34,.6); line-height:155.556%;}
.cyber_principle .cyber_list dl.list .fs16{font-size:1rem;  line-height:155.556%; padding:0 0 15px 0; display: flex; flex-direction: column;}
.cyber_principle .cyber_list dl.list .fs16:last-child{padding-top:15px;}
.cyber_principle .cyber_list dl.list .fs16 strong{font-size:1rem;  line-height:155.556%; position:unset;}


.cyber_report ul li{margin:0 0 30px 0; width:100%; padding:30px; }
.cyber_report ul li .fs40{padding:0 0 25px; font-size:2.2rem; line-height:130%;}
.cyber_report ul li.report_way dl{margin:0 0 20px; }
.cyber_report ul li.report_way dd{width:50%;}
.cyber_report ul li.report_way dd:first-child{border-right:1px solid var(--border);}
.cyber_report ul li.report_way dd a{padding:20px;}
.cyber_report ul li.report_way dd a h4{padding:0 0 18px; font-size:1.1rem; color:var(--black);}
.cyber_report ul li.report_way dd a h4 .material-symbols-outlined{margin:-2px 0 0 3px; font-size:15px; }
.cyber_report ul li.report_way dd a .portal{font-size:64px; }
.cyber_report ul li.report_way dd a .call{font-size:45px; }
.cyber_report ul li.report_way dd a .tel{ font-size:1.1rem; }
.cyber_report ul li h5{text-align:left; padding:0 0 0 68px; font-size:1rem; line-height: 155.556%; }
.cyber_report ul li h5 strong{font-size:1.1rem; line-height: 150%; }
.cyber_report .ex{padding:30px 0 0; font-size:1.1rem; line-height:150%; }
.cyber_report .ex span {font-size:1.1rem; line-height:150%;}

.cyber_report ul li .dot dd {padding-left:12px; font-size:1rem; margin-bottom:8px; line-height:155.556%;  }
.cyber_report ul li .dot dd:before {width:4px; height:4px; top:9px; }



}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/**** S:: 사이버신문고 ****/
.cyber_cont .subtitle p.fs20 {font-size:1.1rem; line-height:160%; margin-bottom:20px; }
.cyber_cont .line_box{padding-bottom:20px;}
.cyber_cont .line_box .fs40 {font-size:1.8rem; line-height:130%; }

.cyber_icon li{ padding:15px ; width:calc(100% / 2); }
.cyber_icon li .num{width:30px; height:30px; line-height:30px; font-size:0.8rem;  margin:0 0 12px; }
.cyber_icon li .fs20{font-size:1.1rem; line-height:150%; text-align:center;}
.cyber_icon li .icon{position:unset; margin-top:0; margin-bottom:10px;}
.cyber_icon li .icon img{width:65px}

.cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5) {background:var(--white);}
.cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {background:var(--grayBg); }
.cyber_icon li:nth-of-type(1), .cyber_icon li:nth-of-type(2), .cyber_icon li:nth-of-type(3) {border-right:1px solid var(--border); border-bottom:0;}
.cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6), .cyber_icon li:nth-of-type(7) {border-right:1px solid var(--border);}
.cyber_icon li:nth-of-type(4), .cyber_icon li:nth-of-type(5), .cyber_icon li:nth-of-type(6) {border-bottom:0;}
.cyber_icon li:nth-of-type(odd) {border-right:0;}

.cyber_principle h3 {font-size:2.2rem; line-height:130%; }
.cyber_principle .cyber_list{padding:20px 0 0;}
.cyber_principle .cyber_list dl{margin:0 0 20px 0; width:100%; }
.cyber_principle .cyber_list dl dt{padding:16px; font-size:1.1rem; line-height:150%; }
.cyber_principle .cyber_list dl dd {padding:14px; font-size:1rem; color:rgba(34,34,34,.6); line-height:155.556%;}
.cyber_principle .cyber_list dl.list .fs16{font-size:1rem;  line-height:155.556%; padding:0 0 15px 0; display: flex; flex-direction: column;}
.cyber_principle .cyber_list dl.list .fs16:last-child{padding-top:15px;}
.cyber_principle .cyber_list dl.list .fs16 strong{font-size:1rem;  line-height:155.556%; position:unset;}


.cyber_report ul li{margin:0 0 20px 0; width:100%; padding:20px; }
.cyber_report ul li .fs40{padding:0 0 20px; font-size:1.8rem; line-height:130%;}
.cyber_report ul li.report_way dl{margin:0 0 15px; }
.cyber_report ul li.report_way dd{width:50%;}
.cyber_report ul li.report_way dd:first-child{border-right:1px solid var(--border);}
.cyber_report ul li.report_way dd a{padding:15px 10px;}
.cyber_report ul li.report_way dd a h4{padding:0 0 15px; font-size:1.1rem; color:var(--black);}
.cyber_report ul li.report_way dd a h4 .material-symbols-outlined{margin:-3px 0 0 3px; font-size:13px; }
.cyber_report ul li.report_way dd a .portal{font-size:50px; }
.cyber_report ul li.report_way dd a .call{font-size:35px; }
.cyber_report ul li.report_way dd a .tel{ font-size:1.1rem; }
.cyber_report ul li h5{text-align:left; padding:0 0 0 65px; font-size:1rem; line-height: 155.556%; }
.cyber_report ul li h5 strong{font-size:1.1rem; line-height: 150%; }
.cyber_report .ex{padding:20px 0 0; font-size:1.1rem; line-height:150%; }
.cyber_report .ex span {font-size:1.1rem; line-height:150%;}

.cyber_report ul li .dot dd {padding-left:12px; font-size:1rem; margin-bottom:8px; line-height:155.556%;  }
.cyber_report ul li .dot dd:before {width:4px; height:4px; top:9px; }


}
/*******************************************************************************
    @media ~480px             
*******************************************************************************/
@media all and (max-width:480px){


.cyber_report ul li h5{display:flex; flex-direction:column; padding:0 0 0 15px; font-size:1rem; line-height: 155.556%; }
.cyber_report ul li h5 strong{font-size:1.1rem; line-height: 150%; position:unset;}


}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){




}