.math-problems {margin-top:-50px !important;}


.card-scatter-container1755 {
    position: relative;
    width: 750px;
    height: 850px;
    border: 4px solid #333;
    border-radius: 20px;
    margin: 15px auto;
    overflow: hidden;
    background-image: 
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.3) 2px, transparent 2px),
        radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.3) 1px, transparent 1px);
    background-size: 40px 40px, 60px 60px;
}

.pb_num1755 {
    position: absolute;
    top: -20px;
    left: 25px;
    background: linear-gradient(135deg, #FF6B9D, #FF8E9D);
    color: white;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 20px;
    border: 4px solid white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    z-index: 100;
}
 
.scattered-cards1755 {
    position: relative;
    width: 100%;
    height: 100%;
}

.connection-svg1755 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}

.floating-card1755 {
    position: absolute;
    width: 130px;
    height: 75px;
    background: white;
    border: 3px solid #333;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    transform-origin: center center;
}

.floating-card1755:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.25) !important;
    z-index: 50 !important;
}

.answered-card1755 {
    border-width: 4px !important;
    transform: scale(1.05);
}

.card-content1755 {
    text-align: center;
    padding: 8px;
    font-size: 24px;
    font-weight: bold;

}

.expression1755 {
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.result1755 {
    font-size: 18px;
    font-weight: bold;
    margin-top: 5px;
}

.answer-section1755 {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 25px;
    padding: 12px 25px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.completed1755 {
    background: rgba(212, 237, 218, 0.95) !important;
    border-color: #c3e6cb !important;
    color: #155724;
}

.answer-label1755 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 5px;
}

.answer-box1755 {
    display: inline-block;
    background: #fff;
    border: 2px solid #FFD700;
    border-radius: 15px;
    padding: 5px 15px;
    font-size: 20px;
    font-weight: bold;
}

.answer-count1755 {
    color: #FF6B9D;
    font-size: 24px;
}

/* 카드가 겹치지 않도록 z-index 조정 */
.floating-card1755:nth-child(1) { z-index: 31; }
.floating-card1755:nth-child(2) { z-index: 32; }
.floating-card1755:nth-child(3) { z-index: 33; }
.floating-card1755:nth-child(4) { z-index: 34; }
.floating-card1755:nth-child(5) { z-index: 35; }
.floating-card1755:nth-child(6) { z-index: 36; }
.floating-card1755:nth-child(7) { z-index: 37; }
.floating-card1755:nth-child(8) { z-index: 38; }
.floating-card1755:nth-child(9) { z-index: 39; }
.floating-card1755:nth-child(10) { z-index: 40; }
.floating-card1755:nth-child(11) { z-index: 41; }
.floating-card1755:nth-child(12) { z-index: 42; }
.floating-card1755:nth-child(13) { z-index: 43; }
.floating-card1755:nth-child(14) { z-index: 44; }
.floating-card1755:nth-child(15) { z-index: 45; }
.floating-card1755:nth-child(16) { z-index: 46; }





.puzzle-container224 {
    position: relative;
    width: 750px;
    height: 850px;
    margin: 20px auto;
    font-family: Arial, sans-serif;
    box-sizing: border-box;
}

/* 헤더와 제목 */
.puzzle-header224 {
    text-align: center;
    margin-bottom: 20px;
}

.puzzle-title224 {
    font-size: 28px;
    font-weight: bold;
    color: #333;
    letter-spacing: 2px;
}

.puzzle-instruction224 {
    font-size: 16px;
    color: #666;
    margin-top: 5px;
}

/* 카드 배치 영역 */
.puzzle-cards224 {
    position: relative;
    width: 100%;
    height: 730px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.05);
}

/* 개별 카드 스타일 */
.puzzle-card224 {
    position: absolute;
    width: 50px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* 숫자 스타일 */
.card-number224 {
    font-size: 16px;
    font-weight: bold;
    color: #555;
}

/* 답안지 영역 */
.answer-grid-container224 {
    display: grid;
    grid-template-columns: auto repeat(10, 1fr);
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

.answer-label224 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    padding: 5px 10px;
}

.answer-box224 {
    width: 50px;
    height: 35px;
    border: 2px solid #333;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    color: #2c3e50;
    background-color: #f0f0f0;
}

/* 답안 표시 스타일 */
.answer-box224.filled-box224 {
    background-color: #e8f5e9;
    border-color: #4caf50;
    color: #1b5e20;
}




.puzzle-container921 {
    position: relative;
    width: 760px;
    height: 750px;
    margin: 20px auto;
     font-family: Arial, sans-serif;
     box-sizing: border-box;
}

/* 색상 변수 정의 */
:root {
    --card-color-yellow: #fff3cd;
    --card-border-yellow: #ffe082;
    --card-color-blue: #cfe2f3;
    --card-border-blue: #9fc5e8;
    --card-color-green: #d9ead3;
    --card-border-green: #a8d6a8;
    --card-color-red: #f4cccc;
    --card-border-red: #ea9999;
    --card-color-purple: #ead1dc;
    --card-border-purple: #d5a6bd;
}

/* 헤더와 제목 */
.puzzle-header921 {
    text-align: center;
    margin-bottom: 20px;
}

.puzzle-title921 {
    font-size: 28px;
    font-weight: bold;
    color: #333;
    letter-spacing: 2px;
}

.puzzle-instruction921 {
    font-size: 16px;
    color: #666;
    margin-top: 5px;
}

/* 카드 배치 영역 */
.puzzle-cards921 {
    position: relative;
    width: 100%;
    height: 750px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.05);
}

/* 개별 카드 스타일 */
.puzzle-card921 {
    position: absolute;
    width: 50px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
     border: 2px solid #333;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* 숫자 스타일 */
.card-number921 {
    font-size: 16px;
    font-weight: bold;
    color: #555;
}

/* 답안지 영역 */
.answer-grid-container921 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 20px;
    gap: 10px;
}

.answer-label921 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    padding: 5px 10px;
}

.answer-group921 {
    display: flex;
    align-items: center;
    gap: 3px;
}

.group-label921 {
    font-weight: bold;
    font-size: 16px;
    color: #666;
}

.answer-box921 {
    width:50px;
    height: 40px;
    border: 2px solid #333;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    color: #2c3e50;
}

/* 답안 표시 스타일 */
.answer-box921.filled-box921 {
    background-color: #e8f5e9;
    border-color: #4caf50;
    color: #1b5e20;
}








.puzzle-container972 {
    position: relative;
    width: 750px;
    height: 750px;
    margin: 20px auto;
 
    font-family: Arial, sans-serif;
 
    box-sizing: border-box;
}

/* 헤더와 제목 */
.puzzle-header972 {
    text-align: center;
    margin-bottom: 20px;
}

.puzzle-title972 {
    font-size: 28px;
    font-weight: bold;
    color: #333;
    letter-spacing: 2px;
}

.puzzle-instruction972 {
    font-size: 16px;
    color: #666;
    margin-top: 5px;
}

/* 카드 배치 영역 */
.puzzle-cards972 {
    position: relative;
    width: 100%;
    height: 700px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.05);
}

/* 개별 카드 스타일 */
.puzzle-card972 {
    position: absolute;
    width: 60px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    border: 2px solid #333;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* 숫자 스타일 */
.card-number972 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}

/* 답안지 영역 */
.answer-grid-container972 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 20px;
}

.answer-label972 {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    padding: 5px 10px;
}

.answer-box972 {
    width: 50px;
    height: 40px;
    border: 2px solid #333;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    color: #2c3e50;
    background-color: #f0f0f0;
}

/* 답안 표시 스타일 */
.answer-box972.filled-box972 {
    background-color: #e8f5e9;
    border-color: #4caf50;
    color: #1b5e20;
}