2025-09-12 16:55:21 +09:00
|
|
|
/*!* (★ 수정) #game-container가 전체 화면(100vw/vh)을 차지하는 대신,*/
|
|
|
|
|
/* common_game_theme의 body(#f4f7f9 배경) 위에 떠 있는*/
|
|
|
|
|
/* '게임 테이블(카드)' 역할을 하도록 변경합니다. *!*/
|
|
|
|
|
/*#game-container {*/
|
|
|
|
|
/* !* (★ 남김) 내부 캔버스를 정렬하는 로직은 유지 *!*/
|
|
|
|
|
/* display: flex;*/
|
|
|
|
|
/* justify-content: center;*/
|
|
|
|
|
/* align-items: flex-start;*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 유지/수정) '펠트' 배경색은 유지하되, 공통 '카드' UI 요소를 추가 *!*/
|
|
|
|
|
/* background-color: #008000;*/
|
|
|
|
|
/* border-radius: 8px; !* (★ 추가) 공통 테마 둥근 모서리 *!*/
|
|
|
|
|
/* box-shadow: 0 4px 10px rgba(0,0,0,0.08); !* (★ 추가) 공통 테마 그림자 *!*/
|
|
|
|
|
/* padding: 15px; !* (★ 추가) 캔버스 주변 여백 *!*/
|
|
|
|
|
/* box-sizing: border-box;*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 삭제) 100vw, 100vh 속성을 삭제하여 body의 중앙 정렬이 동작하도록 함 *!*/
|
|
|
|
|
/* !* width: 100vw; (삭제) *!*/
|
|
|
|
|
/* !* height: 100vh; (삭제) *!*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 수정) 너비 관리: 다른 게임(500px)보다 넓은 반응형 최대 너비를 가짐 *!*/
|
|
|
|
|
/* width: 95%; !* 뷰포트의 95%를 사용 *!*/
|
|
|
|
|
/* max-width: 1200px; !* 단, 스파이더 게임에 맞게 1200px까지 허용 *!*/
|
|
|
|
|
/*}*/
|
|
|
|
|
|
|
|
|
|
/*#gameCanvas {*/
|
|
|
|
|
/* !* (★ 삭제) 컨테이너가 이미 녹색이므로 캔버스 자체의 배경은 불필요 *!*/
|
|
|
|
|
/* !* background-color: #008000; (삭제) *!*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 수정) 흰색 테두리보다 펠트 색과 대비되는 어두운 테두리로 변경 *!*/
|
|
|
|
|
/* border: 2px solid #004d00; !* #fff (흰색) -> #004d00 (어두운 녹색) *!*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 수정) 너비: 부모(#game-container) 패딩 영역의 100%를 차지 *!*/
|
|
|
|
|
/* width: 100%;*/
|
|
|
|
|
/* height: auto; !* 너비에 맞춰 캔버스 비율(JS가 설정한)을 따름 *!*/
|
|
|
|
|
|
|
|
|
|
/* !* (★ 삭제) 뷰포트 기준 max-height 삭제. 컨테이너 너비와 캔버스 비율로 크기가 결정됨. *!*/
|
|
|
|
|
/* !* max-height: min(95vw, 95vh); (삭제) *!*/
|
|
|
|
|
|
|
|
|
|
/* box-sizing: border-box; !* 유지 *!*/
|
|
|
|
|
/*}*/
|
