@charset "utf-8";

#atc03{position:relative;z-index:1}
#atc03:before{ display:block; content:""; position:absolute; left:50%; top:182px;width:100%; height:1px; margin-left:-680px; background-color:#e1e1e1}
/*#atc03:after{ display:block; content:""; position:absolute; right:0; top:0; z-index:-1; width:50%; height:182px; background-color:#f5f5f5}*/
#atc03 .inner{display:flex;position:relative;width:100%;max-width:1200px;margin:0 auto}
#atc03 .inner:after{display:block;content:'';clear:both}
#atc03 .inner:before{content:'';position:absolute;left: -80px;top:0;width:1px;height:100%;background-color:#e1e1e1}
#atc03 .inner>div{width:calc(100% / 2)}

/*list*/
#atc03 .left{padding:118px 40px 100px}
#atc03 .left .tit_area{display:block;position:relative;margin-bottom:66px}
#atc03 .left .tit_area .tit{font-size:32px;line-height:32px;color:#0066e0;transform:rotate(-0.1deg);font-family:'NEXEN_TIRE_Bold'}
#atc03 .left .tit_area .more{position:absolute;right:0;top:5px;width:19px;height:19px;-webkit-transition:all .3s;-ms-transition:all .3s;transition:all .3s}
#atc03 .left .tit_area .more:before{content:'';position:absolute;left:9px;top:0;width:1px;height:100%;background-color:#003c62}
#atc03 .left .tit_area .more:after{content:'';position:absolute;left:0;top:9px;width:100%;height:1px;background-color:#003c62}
#atc03 .left ul li{margin-bottom:20px}
#atc03 .left ul li a{display:block;overflow:hidden}
#atc03 .left ul li a .date{float:left;width:90px;height:90px;padding-top:22px;background-color:#f5f5f5;border-radius:15px;letter-spacing:0;text-align:center;font-size:15px;line-height:16px;color:#777;font-family:'Philosopher'}
#atc03 .left ul li a .date .day{margin-bottom:8px;font-size:23px;line-height:23px;color:#0066e0;font-weight:700}
#atc03 .left ul li a .cont{float:left;width:calc(100% - 90px);padding:8px 0 0 35px;letter-spacing:-.2px}
#atc03 .left ul li a .cont .subj{margin-bottom:12px;font-size:16px;line-height:16px;color:#222;font-family:'notokr-medium'}
#atc03 .left ul li a .cont .txt{font-size:15px;line-height:25px;color:#777}

/*right*/
#atc03 .right{padding:90px 0 86px 60px;border-left:1px solid #e1e1e1;text-align:center;color:#fff}
#atc03 .right .tit{padding:28px 0 67px;font-size:32px;text-align:left;line-height:32px;color:#0066e0;transform:rotate(-0.1deg);font-family:'NEXEN_TIRE_Bold'}
#atc03 .right .cont{overflow:hidden;height:420px;border-radius:30px;background-color:#0066e0}
#atc03 .right .cont .stit{display:inline-block;position:relative;z-index:1;margin-bottom:60px;font-size:17px;font-weight:700;letter-spacing:0;font-family:'Philosopher'}
#atc03 .right .cont .stit:before{position:absolute;left:50%;top:50%;z-index:-1;content:url(/sh_img/include/inc03/img/inc03_Licon.png);margin:-52px;animation:rotate 10s linear infinite;transform-origin:50% 50%}
@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg)}}
@keyframes rotate{100%{transform:rotate(360deg)}}
#atc03 .right .cont .tit{margin-bottom:26px;font-size:32px;line-height:43px;letter-spacing:-1px;white-space:pre-line;font-family:'notokr-thin'}
#atc03 .right .cont .tit b{font-family:'notokr-bold'}
#atc03 .right .cont .txt{margin-bottom:38px;font-size:15px;line-height:26px;letter-spacing:-.2px;white-space:pre-line;color:rgba(255,255,255,.4)}
#atc03 .right .cont a{display:inline-block;width:250px;height:65px;border-radius:34px;border:1px solid rgba(255,255,255,.2);-webkit-transition:all .3s;-ms-transition:all .3s;transition:all .3s;line-height:65px;color:#fff;font-size:15px;letter-spacing:0;font-weight:700;font-family:'Philosopher'}
#atc03 .right .cont a span{position:relative;padding-right:32px}
#atc03 .right .cont a span:after{right:0px}
#atc03 .right .cont a span:before, #atc03 .right .cont a span:after{display:block;content:"\f178";position:absolute;bottom:0;-webkit-transition:all .3s;transition:all .3s;line-height:15px;font-size:13px;font-weight:normal;font-family:'fontawesome'}
#atc03 .right .cont a span:before{right:10px;opacity:0}

#atc03 .right .cont iframe{display:block}

/* 모바일 호버 X */
@media (hover: hover) {
#atc03 .left .tit_area:hover .more{transform:rotate(90deg)}
#atc03 .right .cont a:hover{border:1px solid rgba(255,255,255,.5)}
#atc03 .right .cont a:hover span:before{right:0;opacity:1;-webkit-transition-delay:.1s;transition-delay:.1s}
#atc03 .right .cont a:hover span:after{right:-10px;opacity:0}
}

/* 반응형 [s] */
@media (max-width:1360px){
#atc03:before{left:0;margin-left:0}
}
@media (max-width:1230px){
#atc03 .left{padding:118px 30px 100px}
#atc03 .right{padding:90px 30px 86px}
}
@media (max-width:1024px){
#atc03:before{top:130px}
#atc03 .left{padding:70px 30px}
#atc03 .left .tit_area .tit{font-size:25px}
#atc03 .left ul li a .date{width:75px;height:75px;padding-top:15px;font-size:14px}
#atc03 .left ul li a .date .day{margin-bottom:5px;font-size:20px}
#atc03 .left ul li a .cont{width:calc(100% - 75px);padding-left:25px}
#atc03 .left ul li a .cont .subj{font-size:15px}
#atc03 .left ul li a .cont .txt{font-size:14px;line-height:24px}
#atc03 .right{padding:70px 30px}
#atc03 .right .tit{padding-top:0;font-size:25px}
}
@media (max-width:768px){
#atc03:before{display:none}
#atc03 .inner{display:block;padding:70px 15px}
#atc03 .inner>div{width:100%;padding:0}
#atc03 .left .tit_area{margin-bottom:33px;padding-bottom:33px;border-bottom:1px solid #e1e1e1}
#atc03 .left ul{display:flex;flex-wrap:wrap;gap:20px}
#atc03 .left ul li{width:calc(100%/2 - 10px);margin-bottom:0}
#atc03 .left ul li a .cont .subj{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#atc03 .right{margin-top:70px;border-left:none}
#atc03 .right .tit{padding-bottom:33px;margin-bottom:33px;border-bottom:1px solid #e1e1e1}
}
@media (max-width:660px){
#atc03 .left ul{display:block}
#atc03 .left ul li{width:100%}
#atc03 .left ul li+li{margin-top:20px}
#atc03 .right .cont{height:355px}
}
@media (max-width:480px){
#atc03 .inner{padding:50px 15px}
#atc03 .left .tit_area .tit{font-size:23px}
#atc03 .right{margin-top:50px}
#atc03 .right .tit{font-size:23px}
#atc03 .right .cont{height:255px}
}
@media (max-width:380px){
#atc03 .left .tit_area{margin-bottom:25px;padding-bottom:20px}
#atc03 .left .tit_area .tit{font-size:20px}
#atc03 .right .tit{margin-bottom:25px;padding-bottom:20px;font-size:20px}
#atc03 .right .cont{height:195px}
}
/* 반응형 [e] */