@charset "utf-8";

#main, section{position: relative; overflow: hidden;}

#wrap.lock{height: 960px; overflow: hidden;}
.letter_wrap{background:#000;position:fixed;width:100%;height:100%;top:0;left:0;z-index:99999;display:flex;justify-content:center;align-items:center;animation:fadeOut02 1s ease-out forwards;animation-delay:3s;}
.letter_wrap .letters{display:flex;justify-content:center;align-items:center;width:100%;height:200px;gap:10px;overflow:hidden;animation:fadeOut01 1s ease-out forwards;animation-delay:2.5s;}
.letter_wrap .letters .letter{color:#fff;font-size:150px;font-family:"Bebas Neue",sans-serif;animation:riseUp01 0.8s ease-out forwards;transform:translateY(200px);}
.letter_wrap .letter:nth-child(1){animation-delay:0s;}
.letter_wrap .letter:nth-child(2){animation-delay:0.2s;}
.letter_wrap .letter:nth-child(3){animation-delay:0.4s;}
.letter_wrap .letter:nth-child(4){display:flex;transform:translate(70px,70px);opacity:0;animation:riseUp02 0.8s ease-out forwards;animation-delay:1.2s;}
.letter_wrap .letter:nth-child(4) img{width:45px;}
@keyframes riseUp01{to{opacity:1;transform:translateY(0); z-index: 0;}}
@keyframes riseUp02{to{opacity:1;transform:translateY(-70px); z-index: 0;}}
@keyframes fadeOut01{to{opacity:0;margin-top:-500px; z-index: 0;}}
@keyframes fadeOut02{to{opacity:0; z-index: 0;}}

/* 헤더 */
header{position: fixed; width: 100%; z-index: 99998;}
header .logo{position: absolute; top: 50%; transform: translateY(-50%); left: 50%; margin-left: -900px; cursor: pointer;}
header nav ul{display: flex; justify-content: center; align-items: center; gap: 85px; height: 100px; border-bottom: 1px solid rgba(255, 255, 255, 0.2);
transition: 0.5s;}
header nav ul li{font-size: 19px; color: #fff; font-weight: 300; cursor: pointer;}

header.scroll_on{background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}
header.scroll_on ul{height: 75px;}

/* 메인 */
#main .bg{background: url(../image/main_bg.jpg) no-repeat center / cover; height: 1019px; animation: bg_ani 10s infinite alternate linear;}
@keyframes bg_ani{0%{transform: scale(1);} 100%{transform: scale(1.1);}}
#main .inner{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; justify-content: center; align-items: center;
width: 100%; gap: 110px; text-align: center;}
#main .inner .title_wrap{text-align: center;}
#main .inner .title_wrap h2{font-size: 24px; color: #fff; font-weight: 600;}
#main .inner .title_wrap h2 span{color: #cd1818; font-weight: 500;}
#main .inner .title_wrap h1{font-size: 100px; color: #fff; margin: 20px 0; line-height: 1.1;}
#main .inner .title_wrap h1 span{background: linear-gradient(to left, #fff 50%, #fff 50%) no-repeat;
color: rgba(255, 255, 255, 0.3); background-size: 0%; background-clip: text; -webkit-background-clip: text;}
#main .inner .title_wrap p{font-size: 24px; font-weight: 300; color: #fff;}
#main .inner .title_wrap p span{font-weight: 600;}
#main .inner .title_wrap button{margin-top: 40px; cursor: pointer;  width: 280px; height: 60px; background: #750808;
border-radius: 50px; position: relative; display: flex; justify-content: center; align-items: center; margin:54px auto;}
#main .inner .title_wrap button p{font-size: 20px; color: #fff; position: absolute; z-index: 9999; left: 30px; font-weight: 500;}
#main .inner .title_wrap button img{margin-top: 4px; position: absolute; z-index: 9999; right: 25px; transition: 0.3s;}
#main .inner .title_wrap button:after{content: ""; width: 100%; height: 100%; background: #cd1818; position: absolute; transition: 0.5s; right: 0; border-radius: 50px;}
#main .inner .title_wrap button:hover::after{width: 60px;}
#main .inner .title_wrap button:hover img{right: 20px;}

/* s01 */
#s01{background: url(../image/s01_bg.jpg) no-repeat center / cover; height: 1060px; text-align: center;}
#s01 .title{padding: 195px 0 35px;}
#s01 .list{display: flex; justify-content: center; gap: 20px;}
#s01 .list li:nth-child(2){margin-top: 60px;}

/* s02 */
#s02{background:#c51414; height: 830px; display: flex; justify-content: center; align-items: center; gap: 50px;}
#s02 .title_wrap .ctn{display: flex; justify-content: center; gap: 20px; margin-top: 50px;}
#s02 .list li+li{margin-top: 25px;}

/* s03 */
#s03{background: url(../image/s03_bg.jpg) no-repeat center / cover; height: 1140px; width: 1800px; margin: 60px 0; display: flex; justify-content: center;
align-items: center; gap: 60px; left: 50%; transform: translateX(-50%);}
#s03 .inner{width: 900px; height: 1035px; background: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#s03 .inner .tab{width: 770px; display: flex; flex-wrap: wrap; margin: 0 auto 0;}
#s03 .inner .tab li:first-child{width: 100%; height: 60px; line-height: 60px; background: #ffedef; font-size: 20px; color: #ff7887; text-align: center;
font-weight: bold; font-family:'Pretendard','MalgunGothic',sans-serif; border: none;}
#s03 .inner .tab li{width: 192px; height: 70px; line-height: 70px; font-size: 32px; color: #111; text-align: center; font-family: "Bebas Neue", sans-serif;
font-weight: 400; box-sizing: border-box; border-top: none; cursor: pointer; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
opacity: 0.85; box-shadow: none; border: 1px solid rgba(0, 0, 0, 0.1);}
#s03 .inner .tab li.on{border: 1px solid rgba(0, 0, 0, 0); background: #d9142a; color: #fff; opacity: 1; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
transform: scale(1.1); position: relative; z-index: 9999;}
#s03 .inner .table_wrap .table{display: flex; align-items: center; gap: 50px; display: none;}
#s03 .inner .table_wrap .table .info table{margin-top: 40px; width: 400px;}
#s03 .inner .table_wrap .table .info table caption{font-size: 28px; padding: 10px 5px; border-bottom: 2px solid #111; text-align: left; font-weight: bold;}
#s03 .inner .table_wrap .table .info table tbody tr td{font-size: 17px; padding: 12.5px 5px;  box-sizing: border-box; border-bottom: 1px solid #111;}
#s03 .inner .table_wrap .table .info table tbody tr td:first-child{font-weight: bold; width: 32.5%;}
#s03 .inner .table_wrap .table .info table tbody tr:last-child td{border: none;}
#s03 .inner .table_wrap .table .info table tbody tr td.price{font-size: 35px; font-family: "Bebas Neue", sans-serif; color: #cd1818; text-align: right;}
#s03 .inner .table_wrap .table .info table tbody tr td.price span{font-family:'Pretendard','MalgunGothic',sans-serif; font-size: 24px; font-weight: 600;}
@keyframes fade_ani01{
    0%{opacity: 0; transform: translateY(-100px); visibility: hidden;}
    100%{opacity: 1; transform: translateY(0); visibility: visible;}
}

@keyframes fade_ani02{
    0%{opacity: 0; transform: translateX(-100px); visibility: hidden;}
    100%{opacity: 1; transform: translateX(0); visibility: visible;}
}
.fade-in-down{animation: fade_ani01 1s ease forwards;}
.fade-in-left{animation: fade_ani02 1s ease forwards;}

/* s04 */
#s04{text-align: center; padding: 150px 0;}
#s04 .list{display: flex; flex-wrap: wrap; justify-content: center; gap: 35px; margin-top: 50px;}

/* s05 */
#s05{ padding:140px 0 100px; background:#f2f2f2;}
#s05>div{}
#s05 .title_wrap{background: #222; display: flex; justify-content: center; align-items: center;}

#s05 .db{display: flex; justify-content: center; align-items: center;}
#s05 .db .inner .db_title{text-align: center; margin-bottom: 40px;}
#s05 .db .inner .db_title h2{font-size: 36px; font-weight: 800; letter-spacing: -1px; margin-bottom: 25px;}
#s05 .db .inner .db_title p{font-size: 18px;}
#s05 .db .inner .db_info ul{display:flex; flex-wrap: wrap; width: 100%; max-width:1100px; margin: 0 auto; gap:16px;}
#s05 .db .inner .db_info ul li{width:calc(50% - 16px ); margin-bottom: 25px; }
#s05 .db .inner .db_info ul li h4{font-size: 19px; font-weight: bold; color: #111; width: 100%; margin-bottom:8px;}
#s05 .db .inner .db_info ul li input[type="text"]{width:100%; font-size: 16px; font-weight: 500; color: #111; background: #fff;
 height: 55px; line-height: 55px; padding-left: 10px; box-sizing: border-box; font-family:'Pretendard','MalgunGothic',sans-serif; border:1px solid #ddd}
#s05 .db .inner .db_info ul li textarea{width:100%; height: 55px;font-size: 16px; font-weight: 500; color: #111; background: #fff;
 padding: 15px 10px 10px; box-sizing: border-box; font-family:'Pretendard','MalgunGothic',sans-serif; resize: none; border:1px solid #ddd}
#s05 .db .inner .db_info ul li input[type="text"]:focus,
#s05 .db .inner .db_info ul li textarea:focus{outline: none;}
#s05 .db .inner .db_info ul li input[type="text"]::placeholder,
#s05 .db .inner .db_info ul li textarea::placeholder{font-size: 16px; opacity: 0.6; letter-spacing: -1px;}
#s05 .db .agree{margin-bottom:35px; display:flex; justify-content:center; align-items:center; color: #111; font-size: 16px;}
#s05 .db .agree a{text-decoration:underline; font-weight:600; cursor:pointer;}
#s05 .db .agree input[type="checkbox"]{width:20px; height:20px; margin-right:6px; margin-top: 3px;}
#s05 .db button{margin-top: 40px; cursor: pointer;  width: 280px; height: 60px; background: #750808; margin: 0 auto;
border-radius: 50px; position: relative; display: flex; justify-content: center; align-items: center;}
#s05 .db button p{font-size: 20px; color: #fff; position: absolute; z-index: 9999; left: 30px; font-weight: 500;}
#s05 .db button img{margin-top: 4px; position: absolute; z-index: 9999; right: 25px; transition: 0.3s;}
#s05 .db button:after{content: ""; width: 100%; height: 100%; background: #cd1818; position: absolute; transition: 0.5s; right: 0; border-radius: 50px;}
#s05 .db button:hover::after{width: 60px;}
#s05 .db button:hover img{right: 20px;}

.layer{position:fixed; left:0; top: 50%; transform: translateY(-50%); z-index: 99999; width:100%; display: none;}
.layer .close_btn{position:absolute; overflow: hidden; right:0; top:0;background:#aa0000; border-radius:0 10px 0 10px; color: #fff;}
.layer .close_btn a{display: block;color: #fff;padding:14px 18px; font-size:20px; font-weight:bold;}
.layer .layer_wrap{position:relative;width:100%; max-width:700px; top:0px; margin:0 auto; border-radius:10px; background:rgba(0,0,0,0.95); text-align:left; letter-spacing:-0.5px; box-shadow:0 0 50px rgba(0,0,0,0.6);}
.layer .layer_wrap .DB_info_detail{width:100%;  margin:18px auto; padding-bottom:16px; line-height:1.6; color: #fff;font-size:12px;}
.layer .layer_wrap .DB_info_detail h2{padding:22px;border-bottom:1px solid #222; font-size:24px; font-weight:bold;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap p{padding:8px;margin-bottom:12px; font-size:13px; }
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap{width:98%; height:360px; padding:8px 16px; overflow:auto; box-sizing:border-box;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dt{display:block; background: #fff;border-radius:3px; padding:7px 10px; font-weight: bold; color: #333;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dd{margin-bottom:16px; padding:4px 12px; box-sizing:border-box;}

/* 푸터 */
footer{background: #333; color: #fff; text-align: center; padding: 100px 0; font-size: 14px; font-weight: 600;}
footer p{line-height: 2;}
footer cite{font-style: normal; opacity: 0.6; margin-top: 15px; display: block;}