@charset "utf-8";

#atc01{overflow:hidden;display:flex;align-items:center;justify-content:center;height:100vh}
#atc01 *{word-break:keep-all}
#atc01 .tit h2{margin-top:30px}
#atc01 .l_inner{position:absolute;z-index:10;max-width:var(--mainsize);width:100%}
#atc01 .l_inner .pager{display:flex;gap:25px;margin-top:100px}
#atc01 .l_inner .pager p{width:auto;height:auto;padding:5px 10px 0;border-top:2px solid #fff;border-radius:0;font-size:17xp;font-weight:700;color:#fff;opacity:.3;background:none;transition:all .3s}
#atc01 .l_inner .pager p.on{opacity:1}

#atc01 .bg_area{width:100%;height:100vh;transition:all 1s;transition-delay:.5s}
#atc01.on .bg_area{overflow:hidden;width:calc(100% - 10%);height:77vh;border-radius:20px}
#atc01 .bg_area .atc01_slide{position:relative;width:100%;height:100%}
#atc01 .bg_area .atc01_slide:after{opacity:1;display:block;content:"";position:absolute;left:0;top:0;z-index:100;width:100%;height:100%;background:linear-gradient(90deg, rgba(0,0,0,0.9) 0%, rgba(255,255,255,0) 100%)}
#atc01 .bg_area li{width:100%;height:100%;background:url(./img/bg01.jpg) no-repeat;background-size:cover !important}
#atc01 .bg_area li.bg02{background:url(./img/bg02.jpg)}
#atc01 .bg_area li.bg03{background:url(./img/bg03.jpg)}
#atc01 .bg_area li.bg04{background:url(./img/bg04.jpg)}

#atc01 .txt_area{position:absolute;top:50%;right:0;width:450px;height:450px;transform:translateY(-50%)}
#atc01 .txt_area li{height:100%;border-radius:10px;background:rgba(255,255,255,.7);opacity:0;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);transition:all .3s}
#atc01 .txt_area li.on{opacity:1}
#atc01 .txt_area li a{display:flex;flex-direction:column;justify-content:space-between;height:100%;padding:60px 50px}
#atc01 .txt_area li:hover{background:#fff}
#atc01 .txt_area li:hover em{background:var(--primary)}
#atc01 .txt_area span{font-size:17px;font-weight:700;color:var(--primary)}
#atc01 .txt_area span .k{font-style:italic}
#atc01 .txt_area p{margin:25px 0 30px;font-size:25px;font-weight:700;color:#111}
#atc01 .txt_area div{line-height:1.6;transition:all .3s}
#atc01 .txt_area em{display:flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50px;color:#fff;background:#111;margin-left:auto;transition:all .3s}
#atc01 .txt_area .txt_slide{width:100%;height:100%}
#atc01 .txt_area .txt_slide .italic{font-style:italic;color:#000;font-weight:400;}