@font-face { font-family: 'DS-DIGIB'; font-style: normal; font-weight: 100; src: url(../../common/css/DS-DIGIB.TTF) format('truetype') }
@font-face {
    font-family: 'seolleimcool-SemiBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/seolleimcool-SemiBold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

main {max-width:700px; margin:0 auto; position: relative; height:max-content;}
/* main > div {margin-bottom:50px;} */
img {width:100%; display:block;}
.swiper {margin:0;}
.sub {font-size: 0.8rem; color: #999; text-align: right; padding: 2%;}

/* .floating {max-width:700px; position:sticky; top:0; background-color:#000; z-index:999;} */
.floating {max-width:700px; background-color:#000;}
/* .floating > p {width:80%; margin:0 auto;} */
.float_btn {
        width: 15%; position: fixed; bottom: 5%; right: 5%; z-index:998;
        max-width:150px; min-width:100px; cursor:pointer;
}

/* cf배너 */
.bnr_wrap {position:relative; overflow:hidden;}
.bnr_wrap .bnr_cf {position:absolute; top:0; left:-5%; z-index:-1;  width:74.1%;}

/* review-02 */
.review_wrap {position:relative;}
.review_wrap .gif {
    width:85.7%; transform:translate(-50%,-50%);
    position:absolute; top:50%; left:50%;
}

/* 타이머 */
#time_wrap {display:flex; align-items:center; justify-content:center;}
#time_wrap > p {width:max-content; font-size:1.7rem; color:#fff; margin:0 2% 1% 0;}
.timer {background-color:#000; display:flex; justify-content:space-between; width:50%;}
.timer li {color:#ff0c0c; text-align:center; width:30%;}
.timer li:nth-child(even) {width:3%;}
.time {font-size:4rem; font-family:'DS-DIGIB';}

/* 만족도 */
.satisfaction {position:relative;}
.satisfaction .gif {
    position: absolute; transform: translate(-50%, -50%); top:40%; left:50%; width:80%; 
}

/* db단 css */
form {background-color:#fafafa; padding:3% 0;}

#db_info,#db2 {
    /* background-color:yellowgreen; */
    width:100%; margin:0 auto;
}
#db_info > * ,#db_q > * {
    /* background-color:pink; */
    width:80%; margin:0 auto;
}
#db_info,#db_q .question {}
/* #db_info,#db_q .question dl {background-color:yellow;} */
#db_q .question dl dt, #db_q .question dl dt * {
    font-size:1.8rem; font-weight:500; margin:15px 0;
}
#db_q .question dl dt .qnum {
    background-color:#ffeb6c; border-radius:10px; color: #b30a0a;
    display:inline-block; padding:0 3%; line-height:40px; text-align:center;
    font-size:1.5rem; font-weight:700;
}
#db_q .question dl dt span {font-weight:700; color:#b30a0a;}
#db_q .question dl dd {display:inline-block; width:24%; margin-bottom:3px;}
#db_q .question dl dd label {
    display:inline-block; width:100%; background-color:#eee; padding:15px 0;
    border-radius:10px; text-align:center;
}
#db_q .question .q2 dd {width:31%;}
#db_q .question .q3 dd {width:47%;}

#db_q .question dl dd input[type="checkbox"] {display:none;}
#db_q .question dl dd input[type="checkbox"]:checked+label {background-color:#b30a0a; color:#fff;}
#db_q .question dl dd input[type="radio"] {display:none;}
#db_q .question dl dd input[type="radio"]:checked+label {background-color:#fff9b2; color:#b30a0a; font-weight:700;}

#db_q .question p {text-align:center; margin-top:30px;}
#db_q .btn {text-align:center;}

/* 개인정보란 */
#db_info .userinfo_wrap { /* background-color:aqua; */ width:100%;} 
#db_info .userinfo_wrap dl {
    /* background-color:yellow; */
    display:flex; justify-content:space-between; align-items:center;
    margin:40px 0 20px;
} 
#db_info .userinfo_wrap dl:last-child {margin:0;}
#db_info .userinfo_wrap dl dt {
    background-color:#eee; border-radius:5px;
    width:25%; text-align:center; font-size:1.4rem; line-height:45px;
}
#db_info .userinfo_wrap dl dd {width:70%;}
#db_info .userinfo_wrap dl span {color:red; font-size:0.9rem;}
#db_info .userinfo_wrap dl dd input,select {height:45px; border-radius:7px; padding:7px;}
#db_info .userinfo_wrap .callnum dd input[type=tel],select {width:27%; text-align:center; padding:0; font-size:0.9rem;}
#db_info .userinfo_wrap dl dd input[type=text],#db_info .userinfo_wrap dl dd input[name=age] {
    display:inline-block; width:100%; text-align:left;
}

#db_info .userinfo_wrap dl dd textarea {width:100%; height:100px; border-radius:7px;}
#db_info .userinfo_wrap p {text-align:center;}
#db_info .userinfo_wrap .btn {text-align:center;}

#db_info .userinfo_wrap .btn span {font-size:1.5rem;}
#db_info .userinfo_wrap .btn .strong {font-size:1.5rem; font-weight:700; color:#fff9b2;}

button {
    display: block;
    width: 80%;
    margin: 8% auto;
}

/* db하단 롤링부분 */
#db_rolling { background-color: #fff; padding: 2% 3%; }
#db_rolling .rolling_title {
    font-size: 2rem; text-align: center; color: #fff; font-weight: 500;
    background-color: #b3090a; padding: 4% 0; border-radius: 10px 10px 0 0;
}
#db_rolling .rolling_title img { margin: 0 auto; }
#db_rolling .rolling_wrap {
    background-color:#faf6f5; padding: 4%;
    border-radius:0 0 10px 10px; border: 2px solid #c8c8c8;
}
#rolling_list {height:320px !important;}
#rolling_list ul {
    width: 100%; height: 100%; overflow: hidden; margin: 0 auto;
    /* background-color:yellow; */
    /* !important; */
}
#rolling_list ul li {
    display: flex; justify-content:space-between; align-items:center; height:60px;
    font-size: 1.0rem; border-bottom: 1px solid #c8c8c8; color:#666;
}
#rolling_list ul li > span {/* flex: 0 0 30%; */ white-space: nowrap; }
#rolling_list ul li > span:first-child, #rolling_list ul li > span:last-child { flex-basis: 20%; text-align: center; }
#rolling_list ul li > span > span { padding: 4px; border: 1px solid #ccc; border-radius: 6px; font-size: 80%; }
#rolling_list ul li > span.status_finish > span { background-color: #f4d439; color: #ffffff; border: 0; }
.list_name, .list_number { text-align: center; }

footer {max-width:700px; margin:0 auto; background-color:#eee; padding:30px 0; color:#999;}
footer p {text-align:center; line-height:1.6; transition:all 0.5s; font-size:0.8rem;}
footer .footer_btn {text-align:center; line-height:1.6; cursor:pointer;}
footer p:last-child {height:0; overflow:hidden; padding-top:20px;}

/* 신청 팝업 */
.tostPop {position:fixed; left:10%; bottom:10px; width:80%; transform:scale(0); opacity:0; transition:all 0s; z-index:1}
.tostPop.on { transform:scale(1); opacity:1; transition:all 0.3s;}
.tostPop .wrapInner {width:100%; max-width:640px; margin:0 auto; position:relative; background:#b30a0a; border-radius:10px; padding:18px 0; color:#fff; text-align:center; box-sizing: border-box; font-weight:bold; font-size:17px}  
.tostPop .wrapInner b {color:#F3F781;}

@media (max-width: 700px) {
    #time_wrap > p {font-size:1.4rem;}
    .time {font-size:3rem;}
}
@media (max-width: 480px) {
#rolling_list ul li { font-size: 0.9rem; height: 40px; line-height: 40px; letter-spacing: -1px; }
#db_q .question dl dt, #db_q .question dl dt * { font-size: 1rem;}
#db_q .question dl dt .qnum {font-size:1.1rem;}
#db_q .btn span {font-size:1.2rem;}
}
@media (max-width: 360px) {
#rolling_list ul li { font-size: 0.8rem; height: 36px; line-height: 36px; letter-spacing: -1px; }
}