﻿@charset "UTF-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css'); 
.socialwelfare_Package * { font-family: 'Pretendard', 'Malgun Gothic', sans-serif; box-sizing:border-box; }
.socialwelfare_Package .content { position:relative; width:1200px; margin:0 auto; text-align:center; }
.socialwelfare_Package .con01 { position:relative; width:100%; height:750px; background:#ffe26d url(images/con01_bg.png) no-repeat center;}

/* quick */
.socialwelfare_Package .quick{position: fixed; right: 0; top: 80px; z-index: 100000;}
.socialwelfare_Package .quick li:nth-child(n+2){margin-top: 10px;}

/* con01 : main */
.con01 .btn01 { position:absolute; top: 85px; left: 240px; overflow: hidden;  animation: fadeIn_up 0.6s 0.6s both; background: rgb(0,0,0,0.5); border-radius: 5px;}
.con01 .btn01:hover { background: rgb(0,0,0,0.8);transition: all .3s; }
.con01 .sub_title li:first-child{ position: absolute; top: 100px; left: 50%; margin-left: -356px; animation: fadeIn_up 1s 1s both; overflow:hidden; z-index: 5;}
.con01 .sub_title li:nth-child(2) { position: absolute; top: 110px; left: 50%; margin-left: -356px; animation:line 0.7s 1s cubic-bezier(0.25, 0.45, 0.45, 0.95) both; overflow:hidden; }

@keyframes line {
    0% {
        width:0;
    }
    100% {
        width:713px;
    }
}

.con01 .main_title { position: absolute; top: 130px; left: 50%; margin-left: -356px; animation: fadeIn_up 1s 1.4s ease-out both; overflow:hidden;}
.con01 .btn02 { position:absolute; top: 435px; right: 350px; overflow: hidden;  animation: fadeIn_up 0.6s 1.3s both; background: rgb(0,0,0,0.5); border-radius: 5px; z-index: 9;}
.con01 .btn02:hover { background: rgb(0,0,0,0.8);transition: all .3s; }
.con01 .con_img { padding-top: 390px; animation: fadeIn_up 0.6s 1.6s both; }

/* con06 : 패키지 구매 영역 */
.socialwelfare_Package .con06 { background-color: #feece2; padding-bottom: 70px;}
.package_list > li dd { width:1000px; padding:50px 0 0 25px }
.package_list .apply_section { right:5px; top:20px; }
.package_list > li dt strong { font-size:25px; padding-top:15px; }
.package_list > li { border-radius:10px; height:140px; overflow:hidden; }
.package_list > li dt { width:185px; height:140px; }
.package_list .apply_section li, .package_list .apply_section li a { width:140px; height:102px; line-height:102px; }
.package_list .apply_section li:first-child a { background:#d40006; }
.package_list .apply_section li:first-child a:hover { background:#9b0004; }
.package_list .apply_section li:last-child a { background:#777777; }
.package_list .apply_section li:last-child a:hover { background:#333333; }
.package_list .subject_pay { margin-top:8px; }
.package_list .subject_name li { letter-spacing:-1px; }
.package_list .subject_name span{ top:-28px; font-size:13px; color:#333; letter-spacing:0; }
.package_list .subject_pay del { font-size:23px; }
.package_list .subject_pay li strong { font-size:34px; }
.package_list .subject_name li:after { padding:0 10px 0 5px; }

/* con07 :  혜택 */
.con07 { background-color: #28282d; }
.con07 ul { position: absolute; top: 280px;}
.con07 ul li { float: left; padding-left: 66px;}
.con07 ul li:first-child { padding-left: 20px; }
.con07 li a img { transition:all .15s; }
.con07 li a:hover img {transform:scale(1.05); }

/* evnet : 친구추천 이벤트 */
.event { background-color: #e6efff; position: relative; padding-bottom: 200px;}
.event .btn { position: absolute; bottom: -90px; left: 50%; margin-left: -300px; width: 600px; height: 90px; background: #244cf2; border-radius: 10px; display: block; transition:all .3s;}
.event .btn:hover {background: #000;  }

@keyframes fadeIn {0%{opacity: 0;} 100%{opacity: 1;}}
@keyframes fadeIn02 {0%{opacity:.5;} 100%{opacity: 1;}}
@keyframes scale { 0%{opacity: 0; transform: scale(.7);} 100%{opacity: 1; transform: scale(1);}}
@keyframes scale02 { 0%{opacity: 0; transform: scale(1.5);} 100%{opacity: 1; transform: scale(1);}}
@keyframes fadeIn_up {0%{opacity:0; transform: translateY(20%);} 100%{opacity:01; transform: translateY(20%);}}
@keyframes upDown { 0%{transform: translateY(0%);} 50%{transform: translateY(-5%);} 100%{transform: translateY(0%);}}

/* popup */
.btn_detailPop{position: absolute; right: 400px; bottom: 227px;}
.pop_wp{position: fixed; top: 0; left: 0; width: 100%; height: 100%;  display: flex; align-items: center; overflow-x: hidden; z-index: 1000001; background: rgba(0,0,0,0.7);}
.closeX{position: absolute; top: 12px; right: 5px; width: 2rem; line-height: 1rem; font-size: 1.5rem; text-align: center; cursor: pointer; color: #000; text-decoration: none; z-index: 11;}
.closeX:hover{color: #ccc;}

.popup-table{position: relative; width: 50%; margin: 0 auto; background: #fff; text-align: center; padding: 20px 20px 30px;  animation: fadeIn 1s;}
.popup-table .tit{text-align: center; font-size: 23px; font-weight: 900; line-height: 2;}
.popup-table > div{overflow-y: auto;}
.popup-table table{table-layout: fixed; word-break: break-all; border-collapse: collapse; width: 100%; margin: 0 auto;}

.popup-table table thead th{background: #000; color: #fff; border-bottom: 0;}
.popup-table table tbody th{background: #efefef; border-left: 0;}
.popup-table table th,
.popup-table table td{border: 1px solid #ccc; border-top: 0; border-right: 0; padding: 10px; font-size: 15px;}
.popup-table table td{background: #fff; text-align: center;}
.popup-table table td:last-child,
.popup-table table{margin-top: 30px;}
.popup-table table col:nth-child(1){width: 15%;}
.popup-table table col:nth-child(2){width: 25%;}
.popup-table table col:nth-child(3){width: 20%;}
.popup-table table col:nth-child(4){width: 20%;}
.popup-table table col:nth-child(5){width: 20%;}

/* 패키지 상담신청_무한재수강 추가 20250409 */
.package_list > li dl{width: 1200px; overflow:hidden; margin: 0 auto;}
.package_list .unlimited dd { height:140px; padding:35px 0 0 25px; }
.packageTitle { text-align:center; padding:60px 0 48px;  }
.packageTitle span { font-size:24px; }
.packageTitle h5 { font-size:54px; padding:8px 0 10px; font-weight:bold; letter-spacing:-2px; }
.packageTitle h5 strong { color:#d40006; line-height:1.1; }
.packageTitle p { font-size:20px; }

.package_list .subject_name li { letter-spacing:0; }
.package_list .unlimited { height:auto;}
.package_list .unlimited .package_guide { background:#f6f6f6; padding:20px 30px; text-align:left; border-radius:5px; }
.package_list .unlimited .package_guide strong { padding-bottom:3px; display:block; font-size:18px; }
.package_list .subject_name span { line-height:18px; }
