@charset "utf-8";

#atc05{padding:140px 12% 120px;text-align:center;background:url(/sh_img/include/inc05/bg01.png) 22% 15% no-repeat, url(/sh_img/include/inc05/bg02.png) 90% 80% no-repeat}
#atc05 .tit img{margin-left:15px}
#atc05 .tit span{display:block;margin:25px 0 20px;font-size:20px;font-weight:700;color:var(--primary);letter-spacing:0;text-transform:uppercase;font-family:'Inter'} 
#atc05 .tit p{font-size:3vw;color:#222;word-break:keep-all;font-family:'notokr-light'}

#atc05 .cost{display:flex;align-items:center;justify-content:center}
#atc05 .cost .center{display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;width:445px;height:445px;margin:0 8%;border-radius:50%;border:20px solid #222;background:#fff}
#atc05 .cost .center p{position:relative;z-index:2;font-size:70px;color:var(--primary);letter-spacing:-1.5px;font-family:'notokr-black'}
#atc05 .cost .center img{position:absolute;left:-75px;bottom:-100px;z-index:3}
#atc05 .cost .center:before{display:block;content:"";position:absolute;left:10px;top:10px;z-index:1;width:calc(100% - 20px);height:calc(100% - 20px);border-radius:50%;background:linear-gradient(135deg, rgba(226,226,226,1) 0%, rgba(255,255,255,0) 74%)}
#atc05 .cost .center:after{display:block;content:"";position:absolute;right:-55px;bottom:-20px;z-index:-1;transform:rotate(50deg);width:280px;height:92px;border-radius:50px;background-color:#222}
#atc05 .cost ul li{position:relative;margin-top:60px;color:#fff}
#atc05 .cost ul li .circle{display:flex;align-items:center;justify-content:center;width:240px;height:240px;border-radius:50%;font-size:36px;letter-spacing:-2px;color:#fff;line-height:1.2;background:var(--primary);font-family:'notokr-medium'}
#atc05 .cost ul li+li{margin-top:120px}
#atc05 .cost ul li img{position:absolute;z-index:-1}
#atc05 .cost ul li.sdw01 img{left:110px;top:22px}
#atc05 .cost ul li.sdw02 img{left:110px;bottom:22px}
#atc05 .cost ul li.sdw03 img{right:110px;top:22px}
#atc05 .cost ul li.sdw04 img{right:110px;bottom:22px}

@media (max-width:1650px){
#atc05{padding:140px 5% 120px}
}
@media (max-width:1320px){
#atc05 .tit p{font-size:52px}
#atc05 .cost .center{margin:0 5%}
}
@media (max-width:1024px){
#atc05{padding:120px 0 100px}	
#atc05 .cost .center{width:300px;height:300px;border-width:15px}
#atc05 .cost .center p{font-size:52px}	
#atc05 .cost .center:after{transform:rotate(55deg);height:70px}
#atc05 .cost .center img{width:180px}
#atc05 .cost ul li .circle{width:200px;height:200px;font-size:28px}
#atc05 .cost ul li img{width:230px}
#atc05 .cost ul li.sdw01 img{left:90px}
#atc05 .cost ul li.sdw02 img{left:90px}
#atc05 .cost ul li.sdw03 img{right:90px}
#atc05 .cost ul li.sdw04 img{right:90px}
}
@media (max-width:768px){
#atc05{padding:80px 0 60px;background-position:-20% 15%, 115% 80%}	
#atc05 .tit img{width:200px}
#atc05 .tit p{font-size:40px;line-height:1.3;word-break:keep-all}
#atc05 .cost .center{width:180px;height:180px;margin:0 4%;border-width:10px}
#atc05 .cost .center p{font-size:30px}
#atc05 .cost .center:after{right:-30px;transform:rotate(50deg);width:150px;height:50px}
#atc05 .cost .center img{left:-25px;bottom:-40px;width:100px}
#atc05 .cost ul li{margin-top:40px}
#atc05 .cost ul li+li{margin-top:80px}
#atc05 .cost ul li .circle{width:140px;height:140px;font-size:20px}
#atc05 .cost ul li img{width:155px}
#atc05 .cost ul li.sdw01 img{left:70px}
#atc05 .cost ul li.sdw02 img{left:70px}
#atc05 .cost ul li.sdw03 img{right:70px}
#atc05 .cost ul li.sdw04 img{right:70px}
}
@media (max-width:480px){
#atc05{padding:40px 0}
#atc05{background-size:50%, 30%}
#atc05 .tit img{width:140px}
#atc05 .tit span{margin:15px 0;font-size:14px}
#atc05 .tit p{font-size:24px}
#atc05 .cost .center{width:140px;height:140px;margin:0 2%;border-width:6px}
#atc05 .cost .center p{font-size:24px}
#atc05 .cost .center:before{left:5px;top:5px;z-index:1;width:calc(100% - 10px);height:calc(100% - 10px)}
#atc05 .cost .center:after{right:-20px;bottom:-10px;transform:rotate(50deg);width:100px;height:35px}
#atc05 .cost .center img{width:80px}
#atc05 .cost ul li{margin-top:20px}
#atc05 .cost ul li+li{margin-top:60px}
#atc05 .cost ul li .circle{width:110px;height:110px;font-size:16px}
#atc05 .cost ul li img{width:115px}
#atc05 .cost ul li.sdw01 img{left:60px}
#atc05 .cost ul li.sdw02 img{left:60px}
#atc05 .cost ul li.sdw03 img{right:60px}
#atc05 .cost ul li.sdw04 img{right:60px}
}
@media (max-width:380px){
#atc05 .cost .center{width:110px;height:110px}
#atc05 .cost .center p{font-size:20px}
#atc05 .cost .center:after{right:-20px;bottom:0;height:25px}
#atc05 .cost .center img{width:70px}
#atc05 .cost ul li{margin-top:20px}
#atc05 .cost ul li+li{margin-top:40px}
#atc05 .cost ul li .circle{width:95px;height:95px;font-size:16px}
#atc05 .cost ul li img{width:95px}
#atc05 .cost ul li.sdw01 img{left:60px}
#atc05 .cost ul li.sdw02 img{left:60px}
#atc05 .cost ul li.sdw03 img{right:60px}
#atc05 .cost ul li.sdw04 img{right:60px}


	
}