diff --git a/.DS_Store b/.DS_Store
index 56b23cd..27b8526 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/accounts/__pycache__/admin.cpython-311.pyc b/accounts/__pycache__/admin.cpython-311.pyc
index 14bf874..4e5b793 100644
Binary files a/accounts/__pycache__/admin.cpython-311.pyc and b/accounts/__pycache__/admin.cpython-311.pyc differ
diff --git a/accounts/__pycache__/urls.cpython-311.pyc b/accounts/__pycache__/urls.cpython-311.pyc
index 5a0432d..a4e427d 100644
Binary files a/accounts/__pycache__/urls.cpython-311.pyc and b/accounts/__pycache__/urls.cpython-311.pyc differ
diff --git a/accounts/__pycache__/views.cpython-311.pyc b/accounts/__pycache__/views.cpython-311.pyc
index ee21a6a..caaf5c6 100644
Binary files a/accounts/__pycache__/views.cpython-311.pyc and b/accounts/__pycache__/views.cpython-311.pyc differ
diff --git a/accounts/admin.py b/accounts/admin.py
index 8c38f3f..8b13789 100644
--- a/accounts/admin.py
+++ b/accounts/admin.py
@@ -1,3 +1 @@
-from django.contrib import admin
-# Register your models here.
diff --git a/accounts/views.py b/accounts/views.py
index 4656a2a..445b3ef 100644
--- a/accounts/views.py
+++ b/accounts/views.py
@@ -1,21 +1,80 @@
+from django.contrib.auth.models import User
from django.shortcuts import render, redirect
+from django.contrib.auth import login, logout, authenticate
+from django.contrib.auth import get_user_model
+
+User = get_user_model()
+
def signup_view(request):
- # GET 요청 시 HTML 응답
- if request.method == 'GET':
- return render(request, 'accounts/signup.html')
- else:
+ if request.method == 'POST':
+ nickname = request.POST.get('nickname')
+ email = request.POST.get('email')
+ password = request.POST.get('password')
+
+ # 데이터 유효성 검사
+ if not nickname or not email or not password:
+ error_message = '모든 필드를 입력해주세요.'
+ return render(request, 'accounts/signup.html', {'error_message': error_message})
+
+ # 사용자 이름, 이메일 데이터 중복 확인
+ if User.objects.filter(nickname=nickname).exists():
+ error_message = '사용 불가능한 닉네임입니다.'
+ return render(request, 'accounts/signup.html', {'error_message': error_message})
+ if User.objects.filter(email=email).exists():
+ error_message = '사용 불가능한 이메일입니다.'
+ return render(request, 'accounts/signup.html', {'error_message': error_message})
+
+ # 데이터 저장
+ user = User.objects.create_superuser(nickname=nickname, password=password, email=email)
+ user.save()
+
+ # 회원가입 후 로그인
+ user.backend = 'django.contrib.auth.backends.ModelBackend'
+ login(request, user)
+
# 리다이렉트
- return redirect('accounts:signup')
+ return redirect('accounts:login')
+ # GET 요청 시 HTML 응답
+ return render(request, 'accounts/signup.html')
+
def login_view(request):
# GET, POST 분리
- if request.method == 'GET':
- # 로그인 HTML 응답
- return render(request, 'accounts/login.html')
- else:
- pass
+ if request.method == 'POST':
+ email = request.POST.get('email')
+ password = request.POST.get('password')
+
+ # 이메일, 비밀번호 유효성 검사
+ if not email:
+ error_message = '이메일을 입력해주세요.'
+ return render(request, 'accounts/login.html', {'error_message': error_message})
+ if not password:
+ error_message = '비밀번호를 입력해주세요.'
+ return render(request, 'accounts/login.html', {'error_message': error_message})
+
+ # 사용자 인증
+ user = authenticate(request, email=email, password=password)
+
+ if user is not None:
+ # 사용자 인증 성공 시 로그인
+ user.backend = 'django.contrib.auth.backends.ModelBackend'
+ login(request, user)
+ # 리다이렉트
+ return redirect('main')
+ else:
+ # 사용자 인증 실패 시 에러 처리
+ error_message = '이메일 또는 비밀번호가 올바르지 않습니다.'
+ return render(request, 'accounts/login.html', {'error_message': error_message})
+ # 로그인 HTML 응답
+ return render(request, 'accounts/login.html')
+
def logout_view(request):
- # 로그인일 때
- pass
\ No newline at end of file
+ # 데이터 유효성 검사
+ # 로그인일 때
+ if request.user.is_authenticated:
+ # 로그아웃 로직 처리
+ logout(request)
+ # 리다이렉트
+ return redirect('accounts:login')
\ No newline at end of file
diff --git a/db.sqlite3 b/db.sqlite3
deleted file mode 100644
index bca27ba..0000000
Binary files a/db.sqlite3 and /dev/null differ
diff --git a/informationPost/__pycache__/admin.cpython-311.pyc b/informationPost/__pycache__/admin.cpython-311.pyc
index 1935740..acbe8a6 100644
Binary files a/informationPost/__pycache__/admin.cpython-311.pyc and b/informationPost/__pycache__/admin.cpython-311.pyc differ
diff --git a/informationPost/__pycache__/form.cpython-311.pyc b/informationPost/__pycache__/form.cpython-311.pyc
new file mode 100644
index 0000000..a849fc3
Binary files /dev/null and b/informationPost/__pycache__/form.cpython-311.pyc differ
diff --git a/informationPost/__pycache__/models.cpython-311.pyc b/informationPost/__pycache__/models.cpython-311.pyc
index 6849cb7..44b1c64 100644
Binary files a/informationPost/__pycache__/models.cpython-311.pyc and b/informationPost/__pycache__/models.cpython-311.pyc differ
diff --git a/informationPost/__pycache__/urls.cpython-311.pyc b/informationPost/__pycache__/urls.cpython-311.pyc
new file mode 100644
index 0000000..067d7d5
Binary files /dev/null and b/informationPost/__pycache__/urls.cpython-311.pyc differ
diff --git a/informationPost/__pycache__/views.cpython-311.pyc b/informationPost/__pycache__/views.cpython-311.pyc
new file mode 100644
index 0000000..d48430a
Binary files /dev/null and b/informationPost/__pycache__/views.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0001_initial.cpython-311.pyc b/informationPost/migrations/__pycache__/0001_initial.cpython-311.pyc
new file mode 100644
index 0000000..bbc8d61
Binary files /dev/null and b/informationPost/migrations/__pycache__/0001_initial.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0002_post_file.cpython-311.pyc b/informationPost/migrations/__pycache__/0002_post_file.cpython-311.pyc
new file mode 100644
index 0000000..1c1c957
Binary files /dev/null and b/informationPost/migrations/__pycache__/0002_post_file.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0003_alter_post_topic.cpython-311.pyc b/informationPost/migrations/__pycache__/0003_alter_post_topic.cpython-311.pyc
new file mode 100644
index 0000000..1af4708
Binary files /dev/null and b/informationPost/migrations/__pycache__/0003_alter_post_topic.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0004_alter_post_topic.cpython-311.pyc b/informationPost/migrations/__pycache__/0004_alter_post_topic.cpython-311.pyc
new file mode 100644
index 0000000..725cbe6
Binary files /dev/null and b/informationPost/migrations/__pycache__/0004_alter_post_topic.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0005_alter_post_topic.cpython-311.pyc b/informationPost/migrations/__pycache__/0005_alter_post_topic.cpython-311.pyc
new file mode 100644
index 0000000..64a3e7a
Binary files /dev/null and b/informationPost/migrations/__pycache__/0005_alter_post_topic.cpython-311.pyc differ
diff --git a/informationPost/migrations/__pycache__/0006_alter_post_file_alter_post_image.cpython-311.pyc b/informationPost/migrations/__pycache__/0006_alter_post_file_alter_post_image.cpython-311.pyc
new file mode 100644
index 0000000..f3ffeee
Binary files /dev/null and b/informationPost/migrations/__pycache__/0006_alter_post_file_alter_post_image.cpython-311.pyc differ
diff --git a/lisamate/__pycache__/settings.cpython-311.pyc b/lisamate/__pycache__/settings.cpython-311.pyc
index 547252b..5dd51ca 100644
Binary files a/lisamate/__pycache__/settings.cpython-311.pyc and b/lisamate/__pycache__/settings.cpython-311.pyc differ
diff --git a/lisamate/__pycache__/urls.cpython-311.pyc b/lisamate/__pycache__/urls.cpython-311.pyc
index fbeecdc..47b7449 100644
Binary files a/lisamate/__pycache__/urls.cpython-311.pyc and b/lisamate/__pycache__/urls.cpython-311.pyc differ
diff --git a/lisamate/__pycache__/views.cpython-311.pyc b/lisamate/__pycache__/views.cpython-311.pyc
index 0fa0f12..2fede6e 100644
Binary files a/lisamate/__pycache__/views.cpython-311.pyc and b/lisamate/__pycache__/views.cpython-311.pyc differ
diff --git a/lisamate/settings.py b/lisamate/settings2.py
similarity index 95%
rename from lisamate/settings.py
rename to lisamate/settings2.py
index 29b1855..14ffe97 100644
--- a/lisamate/settings.py
+++ b/lisamate/settings2.py
@@ -39,7 +39,7 @@
'django.contrib.staticfiles',
'informationPost',
'users',
- 'accounts'
+ 'accounts',
]
MIDDLEWARE = [
@@ -129,4 +129,10 @@
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
-AUTH_USER_MODEL = 'users.User'
\ No newline at end of file
+AUTH_USER_MODEL = 'users.User'
+
+
+AUTHENTICATION_BACKENDS = [
+ 'users.backends.EmailBackend',
+ 'django.contrib.auth.backends.ModelBackend'
+]
\ No newline at end of file
diff --git a/lisamate/urls.py b/lisamate/urls2.py
similarity index 89%
rename from lisamate/urls.py
rename to lisamate/urls2.py
index 39f860a..21959b0 100644
--- a/lisamate/urls.py
+++ b/lisamate/urls2.py
@@ -16,10 +16,11 @@
"""
from django.contrib import admin
from django.urls import path, include
-from lisamate.views import MainView
+from lisamate.views import MainView, ProfileView
urlpatterns = [
path('admin/', admin.site.urls),
path('', MainView.as_view(), name='main'),
+ path('profile/', ProfileView.as_view(), name='profile'),
path('accounts/', include('accounts.urls', namespace='accounts')),
]
diff --git a/lisamate/views.py b/lisamate/views.py
index 93d9d08..63c9051 100644
--- a/lisamate/views.py
+++ b/lisamate/views.py
@@ -1,4 +1,4 @@
from django.views.generic import TemplateView
-class MainView(TemplateView):
+class ProfileView(TemplateView):
template_name = 'mypage.html'
\ No newline at end of file
diff --git a/lisamate/views2.py b/lisamate/views2.py
new file mode 100644
index 0000000..6067967
--- /dev/null
+++ b/lisamate/views2.py
@@ -0,0 +1,7 @@
+from django.views.generic import TemplateView
+
+class MainView(TemplateView):
+ template_name = 'checklist.html'
+
+class ProfileView(TemplateView):
+ template_name = 'profile.html'
\ No newline at end of file
diff --git a/static/.DS_Store b/static/.DS_Store
new file mode 100644
index 0000000..3cfb81b
Binary files /dev/null and b/static/.DS_Store differ
diff --git a/static/css/basic.css b/static/css/basic.css
index 3dc1af6..e1356ec 100644
--- a/static/css/basic.css
+++ b/static/css/basic.css
@@ -1,700 +1,866 @@
-@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
-
-body{
- background: linear-gradient(#CDCDCD, #F5F5F5) no-repeat center fixed;
-}
-
-.circle{
- height:149px;
- width:975px;
- border-radius:100px;
- background-color:#151E63;
- position:absolute;
- top:-85px;
- left:480px;
-}
-
-p {
- position: absolute;
- top: 102px;
- left: 128px;
- color: #233C9B;
- width: auto;
- font-size: 100px;
- font-family: 'Jua';
- font-weight: 400;
-}
-
-.text1>p {
- position:absolute;
- top: 2px;
- left: 62px;
- color: #242A57;
- font-size: 30px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
-}
-
-i{
- width:36.94px;
- height:43.99px;
- position:absolute;
- top:51px;
- left:1626px;
- color:#181D45;
- cursor:pointer;
-}
-
-.home>i{
- width:50px;
- height:50px;
- position:absolute;
- top:51px;
- left: 1689.59px;
- color:#181D45;
-}
-
-.bell>i{
- width:37px;
- height:30px;
- position:absolute;
- top:52px;
- left:1759px;
- color:#181D45;
-}
-
-.bell>.redcircle{
- width:13px;
- height:12px;
- border-radius:50%;
- position:absolute;
- top:43px;
- left:1775px;
- background-color:#FF5050;
-}
-
-.text2>p {
- position: absolute;
- top: 210px;
- left: 1497px;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 30px;
- color: #0F3FE8;
- cursor: pointer;
-}
-
-.text2-1>p {
- position: absolute;
- top: 210px;
- left: 1676px;
- width:100px;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 30px;
- color: #242A57;
- cursor: pointer;
-}
-
-.text2-2>p {
- position: absolute;
- top: 210px;
- left: 1650px;
- width:50px;
- overflow: hidden;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 30px;
- color: #000000;
-
-}
-.user {
- width: 292px;
- height: 51px;
- position: absolute;
- top: 455px;
- left: 222px;
- border-radius: 100px;
- background-color: #0015AD;
- box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
- display: flex;
- align-items: center;
- justify-content: center;
- text-align: center;
- color: white;
- font-size: 25px;
- font-weight: 600;
- font-family: 'Hind', sans-serif;
- z-index: 1;
-}
-
-.userbox{
- width:292px;
- height:393px;
- position:absolute;
- top:455px;
- left:223px;
- border-radius:50px;
- border: 1px solid #919191;
- background-color:white;
- box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
- display: flex;
- justify-content: center;
- align-items: center;
-}
-
-.userbox>.userImage{
- width:164px;
- height:164px;
- border-radius:50%;
- position:absolute;
- top:70px;
- background:linear-gradient(#CFCFCF, #FFFFFF);
- border: 2px solid #142F9E;
-}
-
-.userbox>.id{
- position:absolute;
- top:250px;
- font-family: 'Inter', sans-serif;
- font-weight:600;
- font-size:18px;
- color:#142F9E;
-}
-
-.userbox>.email{
- position: absolute;
- top: 275px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 13px;
- color: #4967FF;
-}
-
-.userbox>.explain{
- position: absolute;
- top: 307px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 18px;
- color: #142F9E;
-}
-
-#pen{
- position:absolute;
- background-color:white;
- border:none;
- cursor:pointer;
- color: #09174E;
- top:340px;
- left:45px;
-}
-
-#pen:hover{
- color:#142F9E;
-}
-
-#pen>img{
- width:17.12px;
- height:17.12px;
-}
-
-#setting{
- position: absolute;
- background-color: white;
- color: #09174E;
- border:none;
- cursor:pointer;
- top: 340px;
- left: 115px;
-}
-
-#setting:hover {
- color: #142F9E;
-}
-
-#setting>img{
- width: 17.12px;
- height: 17.12px;
-}
-
-.menu{
- width:274px;
- height:1049px;
- position:absolute;
- top:920px;
- left:230px;
- border-radius: 50px;
- border: 1px solid #919191;
- background-color:white;
- box-shadow:inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
-}
-
-.checklist{
- width:274.25px;
- height:76px;
- background-color:#131B5A;
- position:absolute;
- top:920px;
- left:230px;
- box-shadow: 0px 9px 11px 0px rgba(0, 0, 0, 0.29);
-}
-
-.checklist>p{
- font-family: 'Hind', sans-serif;
- font-weight: 600;
- font-size: 25px;
- color: white;
- position:absolute;
- left:90px;
- top:-4px;
-}
-
-.checklistCircle{
- width:80.16px;
- height:76px;
- background-color:#131B5A;
- position:absolute;
- top:920px;
- left:457.84px;
- border-radius: 0 76px 76px 0;
- box-shadow: 9px 5px 11px 0px rgba(0, 0, 0, 0.29);
-}
-
-.noticeboard{
- width: 274.25px;
- height: 76px;
- background-color: #131B5A;
- position: absolute;
- top: 1139px;
- left: 230px;
- box-shadow: 0px 9px 11px 0px rgba(0, 0, 0, 0.29);
-}
-
-.noticeboard>p {
- font-family: 'Hind', sans-serif;
- font-weight: 600;
- font-size: 25px;
- color: white;
- position: absolute;
- left: 110px;
- top: -4px;
-}
-
-.noticeboardCircle {
- width: 80.16px;
- height: 76px;
- background-color: #131B5A;
- position: absolute;
- top: 1139px;
- left: 457.84px;
- border-radius: 0 76px 76px 0;
- box-shadow: 9px 5px 11px 0px rgba(0, 0, 0, 0.29);
-}
-
-.check{
- width:243px;
- height:65px;
- position:absolute;
- top:1007px;
- left:248px;
- border-radius:40px;
-}
-
-.check>i{
- width:100px;
- height:100px;
- color:#131B5A;
- position:absolute;
- top:31px;
- left:30px;
- z-index:1;
-}
-
-.check>p{
- position:absolute;
- top:-10px;
- left:80px;
- font-family: 'Inter', sans-serif;
- font-weight:400;
- font-size:25px;
- color:#131B5A;
- cursor:pointer;
-}
-
-.calender{
- width: 243px;
- height: 65px;
- position: absolute;
- top: 1057px;
- left: 248px;
- border-radius: 40px;
-}
-
-.calender>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 31px;
- left: 30px;
- z-index: 1;
-}
-
-.calender>p {
- position: absolute;
- top: -10px;
- left: 105px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.information>p{
- position:absolute;
- top:1226px;
- left:300px;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.information>.monthly{
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1314px;
- left: 247px;
- border-radius: 40px;
-}
-
-.information>.monthly>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.information>.monthly>p {
- position: absolute;
- top: -25px;
- left: 50px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.information>.Jeonse{
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1365px;
- left: 247px;
- border-radius: 40px;
-}
-
-.information>.Jeonse>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.information>.Jeonse>p {
- position: absolute;
- top: -25px;
- left: 50px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.information>.bargain {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1416px;
- left: 247px;
- border-radius: 40px;
-}
-
-.information>.bargain>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.information>.bargain>p {
- position: absolute;
- top: -25px;
- left: 50px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.information>hr{
- position:absolute;
- top:1473px;
- left:230px;
- width:273px;
- border:1px solid #131B5A;
-}
-
-.review>p{
- position:absolute;
- top:1501px;
- left: 300px;
- font-family: 'Inter', sans-serif;
- font-weight:600;
- font-size:25px;
- color: #131B5A;
-}
-
-.review>.monthlyReview {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1589px;
- left: 247px;
- border-radius: 40px;
-}
-
-.review>.monthlyReview>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.review>.monthlyReview>p {
- position: absolute;
- top: -25px;
- left: 70px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.review>.JeonseReview {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1640px;
- left: 247px;
- border-radius: 40px;
-}
-
-.review>.JeonseReview>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.review>.JeonseReview>p {
- position: absolute;
- top: -25px;
- left: 70px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.review>.bargainReview {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1691px;
- left: 247px;
- border-radius: 40px;
-}
-
-.review>.bargainReview>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.review>.bargainReview>p {
- position: absolute;
- top: -25px;
- left: 70px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-
-.review>hr {
- position: absolute;
- top: 1743px;
- left: 230px;
- width: 273px;
- border: 1px solid #131B5A;
-}
-
-.town>p {
- position: absolute;
- top: 1766px;
- left: 275px;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 25px;
- color: #131B5A;
-}
-
-.town>.situation {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1849px;
- left: 247px;
- border-radius: 40px;
-}
-
-.town>.situation>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.town>.situation>p {
- position: absolute;
- top: -25px;
- left: 45px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
-}
-.town>.criminal {
- width: 243px;
- height: 40px;
- position: absolute;
- top: 1900px;
- left: 247px;
- border-radius: 40px;
-}
-
-.town>.criminal>i {
- width: 100px;
- height: 100px;
- color: #131B5A;
- position: absolute;
- top: 18px;
- left: 20px;
- z-index: 1;
-}
-
-.town>.criminal>p {
- position: absolute;
- top: -25px;
- left: 45px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 25px;
- color: #131B5A;
- cursor: pointer;
- white-space:nowrap;
-}
-
-.schedulebar{
- width:292px;
- height:51px;
- position:absolute;
- top:2033px;
- left:223px;
- border-radius: 100px;
- background-color:#0015AD;
- box-shadow:0px 7px 14px 0px rgba(0, 0, 0, 0.32);
- z-index:1;
- color:white;
- display: flex;
- align-items: center;
- justify-content: center;
- text-align: center;
- font-family: 'Hind', sans-serif;
- font-weight: 600;
- font-size: 25px;
-}
-
-.scheduleMenu{
- width:292px;
- height:378px;
- position:absolute;
- top:2033px;
- left:223px;
- border: 1px solid #919191;
- border-radius:50px;
- background-color: white;
- box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
- display: flex;
- justify-content: center;
- align-items: center;
-}
-
-.scheduleMenu>img{
- width:133.72px;
- height:137px;
-}
-
-.scheduleMenu>.text3{
- display: flex;
- justify-content: center;
-}
-
-.scheduleMenu>.text3>p{
- font-family: 'Inter', sans-serif;
- font-size: 20px;
- font-weight: 400;
- z-index:1;
- position:absolute;
- top:280px;
- left: 0;
- right: 0;
- margin: auto;
- text-align: center;
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(#CDCDCD, #F5F5F5) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left:12%;
+ float: left;
+ box-sizing: border-box;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+}
+
+.Middle {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.Middle>.Mcircle {
+ height: 149px;
+ width: 60%;
+ border: none;
+ border-radius: 100px;
+ background-color: #151E63;
+ margin-top: -100px;
+ margin-left: -20px;
+}
+
+.top{
+ margin-top:-70px;
+}
+
+p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 2vw;
+ line-height: 36.31px;
+ letter-spacing: -0.05rem;
+ color: #242A57;
+ margin-right: auto;
+ margin-left: 2vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -3vw;
+ margin-right: 5vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color:#181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i{
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+
+.logo>p{
+ font-family: 'Jua';
+ font-weight:400;
+ font-size:6.25vw;
+ line-height: 125px;
+ letter-spacing: -0.05rem;
+ color:#233C9B;
+ margin-left:7%;
+ margin-top:8%;
+}
+
+.userBox>.user{
+ width: 15vw;
+ height: 3vw;
+ border:none;
+ border-radius:100px;
+ background-color:#0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0,0,0,0.32);
+ color:white;
+ font-family: 'Hind';
+ font-weight:600;
+ font-size:25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align:center;
+ display:flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox{
+ width:15vw;
+ min-width: 30px;
+ min-height:30px;
+ height:20vw;
+ border:1px solid #919191;
+ background-color:white;
+ border-radius:50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0,0,0,0.28);
+ margin-top:-3vw;
+ display:flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage{
+ width:8vw;
+ padding-top:8vw;
+ border:2px solid #142F9E;
+ background:linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius:50%;
+ margin-top:4vh;
+}
+
+.userbox>.name{
+ font-family: 'Inter';
+ font-weight:600;
+ font-size:18px;
+ color: #142F9E;
+ margin-top:5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email{
+ font-family:'Inter';
+ font-weight:400;
+ font-size:13px;
+ color:#4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain{
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:18px;
+ color:#142F9E;
+ margin-top:2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+ #pen,
+ #setting {
+ font-size: 1px;
+ height:1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu{
+ width:14.5vw;
+ height:55vw;
+ border:1px solid #919191;
+ border-radius:50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0,0,0,0.28);
+ margin-top:20%;
+ margin-left:0.5%;
+ background-color:white;
+}
+
+.menu>.checklist{
+ width:13vw;
+ height:4vw;
+ padding-left:9%;
+ background-color:#131B5A;
+ font-family: 'Hind';
+ font-weight:600;
+ font-size:25px;
+ line-height:40.03px;
+ letter-spacing: -0.05rem;
+ color:white;
+ display:flex;
+ justify-content:center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist{
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist{
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist{
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle{
+ width:3vw;
+ height:4vw;
+ background-color:#131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top:-4vw;
+ margin-left:13vw;
+}
+
+.menu>.text1{
+ display:flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText, .menu>.text1>.calText{
+ display: flex;
+ align-items: center;
+ margin-top:1.5vw;
+}
+
+.menu>.text1>.calText{
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText{
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText{
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p, .menu>.text1>.calText>p{
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin:0;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>p, .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.text1>.checklistText>p, .menu>.text1>.calText>p{
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.checklistText>p, .menu>.text1>.calText>p{
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i, .menu>.text1>.calText>i{
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+.menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i{
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top:1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal{
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top:1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation{
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText{
+ margin-left:-1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText{
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i{
+ padding-right:2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain{
+ margin-left:-1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i{
+ padding-right:1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation{
+ margin-left:-1vw;
+}
+
+.menu>.text4>.situation>i{
+ padding-right:1vw;
+}
+
+.menu>.text4>.criminal>i{
+ padding-right:0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i{
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p{
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p{
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p{
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p{
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p{
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin:0;
+}
+
+@media (max-width: 1700px) {
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p{
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p{
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p{
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i{
+ font-size:0.5rem;
+}
+
+@media (max-width: 1700px) {
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i{
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i{
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top:1.5vw;
+}
+
+@media (max-width: 1900px) {
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+ .text2>hr,
+ .text3>hr{
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle{
+ width:15vw;
+ height:3vw;
+ border:none;
+ border-radius:100px;
+ background-color:#0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0,0,0,0.32);
+ color:white;
+ font-family: 'Hind';
+ font-weight:600;
+ font-size:25px;
+ line-height:40.03px;
+ text-align:center;
+ display:flex;
+ justify-content: center;
+ align-items: center;
+ margin-top:20%;
+ z-index:1;
+ position:relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox{
+ width:15vw;
+ height:20vw;
+ border:1px solid #919191;
+ background-color:white;
+ border-radius:50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0,0,0,0.28);
+ margin-top:-3vw;
+ display:flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img{
+ width:7vw;
+ height:7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img{
+ margin-top:2vw;
+ }
+}
+
+.scheduleBox>.scheduleText{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p{
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:20px;
+ line-height:24.2px;
+ letter-spacing: -0.05rem;
+ color:#818181;
+ margin:0;
+ margin-top:20px;
+}
+
+@media (max-width:1500px){
+ .scheduleBox>.scheduleText>p{
+ font-size:15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
}
\ No newline at end of file
diff --git a/static/css/cal2.css b/static/css/cal2.css
new file mode 100644
index 0000000..1f60352
--- /dev/null
+++ b/static/css/cal2.css
@@ -0,0 +1,1485 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(#CDCDCD, #F5F5F5) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+}
+
+.Middle {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.Middle>.Mcircle {
+ height: 149px;
+ width: 60%;
+ border: none;
+ border-radius: 100px;
+ background-color: #151E63;
+ margin-top: -100px;
+ margin-left: -20px;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 2vw;
+ line-height: 36.31px;
+ letter-spacing: -0.05rem;
+ color: #242A57;
+ margin-right: auto;
+ margin-left: 2vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -1vw;
+ margin-right: 5vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+
+.logo>p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 6.25vw;
+ line-height: 125px;
+ letter-spacing: -0.05rem;
+ color: #233C9B;
+ margin-left: 7%;
+ margin-top: 8%;
+ margin-bottom:7%;
+}
+
+.middleTitle {
+ display: flex;
+ align-items: center;
+ margin-left:79%;
+ margin-top:-13%;
+ margin-bottom: 11%;
+}
+
+.middleTitle>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 1.5vw;
+ line-height: 36.31px;
+ letter-spacing: -0.05rem;
+ color: #000000;
+ margin: 0;
+}
+
+.middleTitle>p:not(:first-child) {
+ margin-left: 5px;
+}
+
+.middleTitle>#bar{
+ margin-right:5%;
+ margin-left:10%;
+}
+
+.middleTitle>#Cal{
+ color:#0F3FE8;
+ font-weight:700;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1600px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1500px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.3vw;
+ }
+}
+
+@media (max-width: 1300px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.8vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.calendarbox {
+ cursor: pointer;
+ position:relative;
+}
+
+.calendarbox>.Calendar1 {
+ width: 55vw;
+ height: 40vw;
+ margin-left:5%;
+ border: 1px solid #424242;
+ background-color: #F5F5F5;
+ border-radius: 40px;
+ box-shadow: 23px 27px 38px 1px rgba(0, 0, 0, 0.20);
+ z-index: 1;
+}
+
+.calendarbox>.leftbar {
+ position:absolute;
+ width: 8vw;
+ height:40vw;
+ margin-top:-58%;
+ margin-left:1%;
+ border-radius: 100px;
+ background: linear-gradient(#23326F, #4967FF);
+ box-shadow: 9px 14px 34px 0px rgba(0, 0, 0, 0.34);
+ z-index:-1;
+}
+
+.calendarbox>.leftcircle {
+ width: 7vw;
+ height: 7vw;
+ position: absolute;
+ margin-top:-59%;
+ margin-left:1%;
+ background-color: #09174E;
+ border-radius: 50%;
+ box-shadow: 9px 14px 34px 0px rgba(0, 0, 0, 0.34);
+ z-index: 3;
+}
+
+.calendarbox>.Calendar1>.Container{
+ display: flex;
+ align-items: center;
+ margin-left:7vw;
+ margin-top:4vw;
+}
+
+.calendarbox>.Calendar1>.Container>i {
+ width: 18px;
+ height: 16.5px;
+ z-index: 3;
+ color: #4F4F4F;
+ margin-top: -1vw;
+}
+
+@media (max-width:1400px) {
+ .calendarbox>.Calendar1>.Container>i{
+ font-size:1.5rem;
+ }
+}
+
+.calendarbox>.Calendar1>.Container>.ctext>p {
+ font-family: Inter;
+ font-size: 1.2vw;
+ font-weight: 400;
+ line-height: 30px;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: #4F4F4F;
+ margin-top:-1vw;
+ margin-left:1vw;
+ z-index: 3;
+}
+
+.calendarbox>.Calendar1>.innerCalendar {
+ width: 51vw;
+ height: 34vw;
+ border: 1px solid #767676;
+ border-radius: 70px;
+ margin-left:2vw;
+ z-index: 4;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+* {
+ margin: 0;
+ padding: 0;
+ font-family: sans-serif;
+ box-sizing: border-box;
+}
+
+.calendarbox>.Calendar1>.innerCalendar>.calendar {
+ z-index: 999;
+ margin-top:-3vw;
+}
+
+.header {
+ display: flex;
+ align-items: center;
+ margin-left: 11vw;
+ margin-top:3vw;
+}
+
+.year-month,
+.year-month2 {
+ font-family: 'Inter', sans-serif;
+ font-size: 1.6vw;
+ font-weight: 700;
+ text-align: left;
+ margin-top:1vw;
+ color: #505050;
+}
+
+.year-month {
+ margin-right: 1vw;
+}
+
+.year-month2 {
+ margin-left: 1vw;
+}
+
+.nav {
+ display: flex;
+}
+
+.nav-btn {
+ width: 3vw;
+ height: 1.5vw;
+ border: none;
+ background-color: transparent;
+ cursor: pointer;
+ font-family: 'Inter', sans-serif;
+ font-weight: 900;
+ font-size: 2.7vw;
+ color: #1A2344;
+}
+
+.go-prev {
+ color: #000000;
+ margin-top:-1vw;
+}
+
+.go-today {
+ width: 8vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.go-next {
+ color: #000000;
+ margin-top: -1vw;
+}
+
+.days {
+ display: flex;
+ margin: 0.2vw 0 0;
+ width: 47vw;
+ height: 2.7vw;
+ border: 1px solid #4967FF;
+ border-radius: 20px;
+ background-color: #BFCBF6;
+ box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.35);
+}
+
+.day {
+ width: calc(100%/7);
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-family: Inter;
+ font-size: 15px;
+ font-weight: 500;
+ line-height: 18px;
+ letter-spacing: 0em;
+ text-align: left;
+}
+
+.dates {
+ display: flex;
+ flex-flow: row wrap;
+ width: 47vw;
+ height: 26vw;
+ border-right: 1px solid #676767;
+ border-bottom: 1px solid #676767;
+ border-left: 1px solid #676767;
+ border-radius: 30px;
+ overflow: hidden;
+ box-shadow: inset 4px 4px 6px 0px rgba(0, 0, 0, 0.25);
+}
+
+.date {
+ width: calc(100%/7);
+ padding: 0.5vw 0.7vw;
+ text-align: right;
+ border-bottom: 2px solid #BFCBF6;
+ border-left: 2px solid #BFCBF6;
+ font-family: Inter;
+ font-size: 0.7vw;
+ font-weight: 400;
+ line-height: 18px;
+ letter-spacing: -0.05em;
+ text-align: right;
+}
+
+.day:nth-child(7n+1),
+.date:nth-child(7n+1) {
+ color: #D13E3E;
+}
+
+.day:nth-child(7n),
+.date:nth-child(7n) {
+ color: #396EE2;
+}
+
+.other {
+ opacity: .3;
+}
+
+.today {
+ position: relative;
+}
+
+.today:before {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ z-index: 1;
+ display: block;
+ width: 1.5vw;
+ height: 1.5vw;
+ border: 2px solid #BFCBF6;
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+ content: '';
+}
+
+.modal {
+ display: none;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.4);
+ /* 배경 투명도 조절 */
+ z-index: 1000;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.modal-content {
+ width: 100vw;
+ height: 100vh;
+ background: linear-gradient(#4A66FF, #77B5FF);
+ margin: auto;
+}
+
+.modal>.modal-content>.modalTop>p {
+ font-family: Jua;
+ font-size: 3.5vw;
+ font-weight: 400;
+ line-height: 88px;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: #E9E9E9;
+ cursor: pointer;
+ background-color: none;
+}
+
+.modal>.modal-content>.modalTop>p:hover {
+ color: #233C9B;
+}
+
+.modal>.modal-content>.modalTop{
+ display: flex;
+ justify-content: flex-end;
+ margin-top:1vw;
+}
+
+.modal>.modal-content>.modalTop>.rightContainer{
+ display:inline-flex;
+ margin-top:2vw;
+ margin-right:3vw;
+
+}
+
+.modal>.modal-content>.modalTop>.rightContainer>.text4>p {
+ font-family: Inter;
+ font-size: 1.5vw;
+ font-weight: 400;
+ line-height: 36px;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: #D1D1D1;
+}
+
+.modal>.modal-content>.modalTop>.rightContainer>p {
+ color:#A4A4A4;
+}
+
+.modal>.modal-content>.modalTop>.rightContainer>.text6>p {
+ font-family: Inter;
+ font-size: 1.5vw;
+ font-weight: 700;
+ line-height: 36px;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: white;
+}
+
+.modal>.modal-content>.modalBox {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+}
+
+.modal>.modal-content>.modalBox>.modalbox {
+ width: 60%;
+ height: 39vw;
+ border-radius: 50px;
+ border: 1px solid #424242;
+ background-color: white;
+ z-index: 2;
+}
+
+.modal>.modal-content>.modalBox>.modalbar {
+ z-index:1;
+ position: absolute;
+ margin-left:-60%;
+ width: 5vw;
+ height: 39vw;
+ background: linear-gradient(#23326F, #4967ff);
+ border-radius: 100px;
+ box-shadow: 9px 14px 34px 0px rgba(0, 0, 0, 0.34);
+}
+
+.modal>.modal-content>.modalBox>.modalcircle {
+ position:absolute;
+ width: 5vw;
+ height: 5vw;
+ margin-left:-60%;
+ margin-top:-35%;
+ border-radius: 50%;
+ background-color: #09174E;
+ box-shadow: 9px 14px 34px 0px rgba(0, 0, 0, 0.34);
+ z-index: 2;
+}
+
+.modal>.modal-content>.modalBox>i{
+ position:absolute;
+ width:0.9vw;
+ height:0.8vw;
+ color:#4F4F4F;
+ z-index:3;
+ margin-left:-50%;
+ margin-top:-32%;
+}
+
+@media (max-width:1400px) {
+ .modal>.modal-content>.modalBox>i {
+ font-size: 1.5rem;
+ }
+}
+
+@media (max-width:1200px) {
+ .modal>.modal-content>.modalBox>i{
+ font-size:1rem;
+ }
+}
+
+.modal>.modal-content>.modalBox>.ctext2{
+ position:absolute;
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:1.2vw;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color:#4F4F4F;
+ margin-top:-32%;
+ margin-left:-42%;
+ z-index:3;
+}
+
+.modal>.modal-content>.modalBox>.inner{
+ width: 55vw;
+ height: 34vw;
+ border: 1px solid #767676;
+ border-radius: 30px;
+ position: absolute;
+ margin-top:4vw;
+ z-index:4;
+}
+
+.modalcalendar{
+ display:flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ position: absolute;
+ z-index: 9999;
+ margin-top:-35%;
+ margin-left:25%;
+}
+
+.modalheader {
+ display: flex;
+ align-items: center;
+ margin-left:-5%;
+}
+
+.modal-year-month,
+.modal-year-month2 {
+ font-family: 'Inter', sans-serif;
+ font-size: 1.9vw;
+ font-weight: 700;
+ color: #505050;
+ margin-top: 1vw;
+}
+
+.modal-year-month {
+ margin-right: 1vw;
+}
+
+.modal-year-month2 {
+ margin-left: 1vw;
+}
+
+.modalnav {
+ display: flex;
+}
+
+.modalnav-btn {
+ width: 1.4vw;
+ height: 1.5vw;
+ border: none;
+ line-height: 34px;
+ background-color: transparent;
+ cursor: pointer;
+ font-family: 'Inter', sans-serif;
+ font-weight: 900;
+ font-size: 2.7vw;
+ color: #1A2344;
+ margin-top:0.5vw;
+}
+
+.modal-go-today {
+ width: 8vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top:1vw;
+}
+
+.modaldays {
+ display: flex;
+ margin: 0.7vw 0 0;
+ width: 50vw;
+ height: 2.7vw;
+ border: 1px solid #4967FF;
+ border-radius: 20px;
+ background-color: #BFCBF6;
+ box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.35);
+}
+
+.modalday {
+ width: calc(100%/7);
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ font-size: 0.7vw;
+ font-family: 'Inter', sans-serif;
+ font-weight: 500;
+ color: #000000;
+}
+
+.modaldates {
+ display: flex;
+ flex-flow: row wrap;
+ width: 50vw;
+ height: 27vw;
+ border-right: 1px solid #676767;
+ border-bottom: 1px solid #676767;
+ border-left: 1px solid #676767;
+ border-radius: 15px;
+ overflow: hidden;
+ box-shadow: inset 4px 4px 6px 0px rgba(0, 0, 0, 0.25);
+}
+
+.modaldate {
+ width: calc(100%/7);
+ padding: 10px 15px;
+ text-align: right;
+ border-bottom: 2px solid #BFCBF6;
+ border-left: 2px solid #BFCBF6;
+ font-family: 'Inter', sans-serif;
+ font-weight: 400;
+ font-size: 0.7vw;
+ color: #646464;
+}
+
+.modalday:nth-child(7n+1),
+.modaldate:nth-child(7n+1) {
+ color: #D13E3E;
+}
+
+.modalday:nth-child(7n),
+.modaldate:nth-child(7n) {
+ color: #396EE2;
+}
+
+.mdoal-today-hover:hover {
+ background-color: #E7FFDE;
+}
+
+.modal-other {
+ opacity: .3;
+}
+
+.modal-other-style {
+ background-color: pink;
+}
+
+.modal-today {
+ position: relative;
+}
+
+.modal-today:before {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ z-index: 1;
+ display: block;
+ width: 1.5vw;
+ height: 1.5vw;
+ border: 2px solid #BFCBF6;
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+ content: '';
+}
\ No newline at end of file
diff --git a/static/css/checklist2.css b/static/css/checklist2.css
new file mode 100644
index 0000000..ad4b06c
--- /dev/null
+++ b/static/css/checklist2.css
@@ -0,0 +1,1342 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(#CDCDCD, #F5F5F5) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background: #ece6cc;
+}
+
+.Middle {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.Middle>.Mcircle {
+ height: 149px;
+ width: 60%;
+ border: none;
+ border-radius: 100px;
+ background-color: #151E63;
+ margin-top: -100px;
+ margin-left: -20px;
+}
+
+.top {
+ margin-top: -70px;
+}
+
+p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 2vw;
+ line-height: 36.31px;
+ letter-spacing: -0.05rem;
+ color: #242A57;
+ margin-right: auto;
+ margin-left: 2vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -3vw;
+ margin-right: 5vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+
+.logo>p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 6.25vw;
+ line-height: 125px;
+ letter-spacing: -0.05rem;
+ color: #233C9B;
+ margin-left: 7%;
+ margin-top: 8%;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.exambox {
+ height: 24vw;
+ width: 39vw;
+ border-radius: 100px;
+ background: linear-gradient(180deg, #5072FF 0%, #75B0FF 100%);
+ position: absolute;
+ top: 23vw;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.box_title {
+ font-size: 2.5vw;
+ color: #FFFFFF;
+ text-align: left;
+ margin-left: 4vw;
+ margin-bottom: 1vw;
+}
+
+.box_text1,
+.box_text2,
+.box_text3 {
+ font-size: 1.2vw;
+ color: #FFFFFF;
+ text-align: left;
+ margin-left: 4vw;
+ margin-bottom: 1vw;
+}
+
+.box_text4 {
+ margin-top: 1vw;
+ font-size: 1.5vw;
+ color: #FFFFFF;
+ text-align: left;
+ margin-left: 4vw;
+ margin-bottom: 1vw;
+}
+
+.box_hr {
+ background-color: #FFFFFF;
+ height: 4px;
+ width: 80%;
+}
+
+/* 반응형 스타일을 추가합니다 */
+@media (max-width: 1200px) {
+ .exambox {
+ height: 40vw;
+ width: 65vw;
+ top: 10vw;
+ left: 50%;
+ transform: translateX(-50%);
+ }
+
+ .box_title {
+ font-size: 4vw;
+ margin-left: 8vw;
+ }
+
+ .box_text1,
+ .box_text2,
+ .box_text3 {
+ font-size: 2vw;
+ margin-left: 8vw;
+ }
+
+ .box_text4 {
+ font-size: 2.5vw;
+ margin-left: 8vw;
+ }
+}
+
+/* 추가된 부분 */
+.checkbox {
+ height: 24vw;
+ width: 39vw;
+ border-radius: 100px;
+ position: absolute;
+ top: 50vw;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.plusboxs {
+ height: 4vw;
+ width: 35vw;
+ border-radius: 100px;
+ position: absolute;
+ background: linear-gradient(180deg, #cbc7c7 0%, rgba(226, 226, 226, 0) 100%);
+ left: 50%;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+}
+
+#plusBtn {
+ height: 4vw;
+ width: 35vw;
+ border-radius: 100px;
+ position: absolute;
+ background: linear-gradient(180deg, #cbc7c7 0%, rgba(226, 226, 226, 0) 100%);
+ left: 50%;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+ font-size: 1.0vw;
+ color: #0418AB;
+ cursor: pointer;
+}
+
+.plus_text {
+ margin-top: 0%;
+ font-size: 1.3vw;
+ text-align: left;
+ margin-left: 39%;
+}
+
+.right>.checkbox>i {
+ font-size: 3vw;
+ margin-left: 47%;
+ margin-bottom: 5%;
+ margin-top: 7vw;
+ color: #676767;
+}
+
+.right>.checkbox>.plusbox>i {
+ font-size: 1.5vw;
+ margin-left: 35%;
+ margin-top: 4%;
+ color: #0418AB;
+}
+
+.check_text1 {
+ color: #222B72;
+ font-size: 1.5vw;
+ font-weight: bold;
+}
+
+.check_text2 {
+ color: #222B72;
+ margin-top: 10vw;
+ font-size: 1.5vw;
+ font-weight: bold;
+}
+
+.check_text3 {
+ color: #222B72;
+ margin-top: 10vw;
+ font-size: 1.5vw;
+ font-weight: bold;
+}
+
+/* 추가된 부분 */
+@media (max-width: 600px) {
+ .checkbox {
+ height: 50vw;
+ width: 80vw;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ }
+
+ .plusboxs,
+ #plusBtn {
+ height: 10vw;
+ width: 80vw;
+ left: 50%;
+ transform: translateX(-50%);
+ }
+
+ .plus_text {
+ font-size: 3vw;
+ text-align: center;
+ margin-left: 0;
+ }
+
+ .right>.checkbox>i {
+ font-size: 6vw;
+ margin-left: 50%;
+ margin-bottom: 10%;
+ }
+
+ .right>.checkbox>.plusbox>i {
+ font-size: 3vw;
+ margin-left: 35%;
+ margin-top: 8%;
+ }
+}
+
+.modal-container {
+ position: fixed;
+ top: 5vw;
+ left: 15vw;
+ height: 40vw;
+ width: 70vw;
+ display: none;
+ align-items: center;
+ justify-content: center;
+ z-index: 9999;
+ backdrop-filter: blur(3px);
+ background-color: #FFFFFF;
+ border-radius: 70px;
+ border: 2px solid #000000;
+ /* 검은색 테두리 선 추가 */
+}
+
+.first_checkbox {
+ height: 4vw;
+ width: 35vw;
+ border-radius: 100px;
+ position: absolute;
+ background: #FFFFFF;
+ left: 50%;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+ font-size: 1.0vw;
+ color: #0418AB;
+ cursor: pointer;
+}
+
+.second_checkbox {
+ height: 4vw;
+ width: 35vw;
+ border-radius: 100px;
+ position: absolute;
+ background: #FFFFFF;
+ left: 50%;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+ font-size: 1.0vw;
+ color: #0418AB;
+ cursor: pointer;
+}
+
+.third_checkbox {
+ height: 4vw;
+ width: 35vw;
+ border-radius: 100px;
+ position: absolute;
+ background: #FFFFFF;
+ left: 50%;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+ font-size: 1.0vw;
+ color: #0418AB;
+ cursor: pointer;
+}
+
+.checkbox>.first_checkbox {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+
+.checkbox>.first_checkbox>i {
+ margin-left: 1vw;
+ font-size: 1.5vw;
+}
+
+.checkbox>.first_checkbox>.first_checkbox_text {
+ margin-left: 1vw;
+ font-size: 1.1vw;
+ font-weight: bold;
+}
+
+.checkbox>.second_checkbox {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+
+.checkbox>.second_checkbox>i {
+ margin-left: 1vw;
+ font-size: 1.5vw;
+}
+
+.checkbox>.second_checkbox>.second_checkbox_text {
+ margin-left: 1vw;
+ font-size: 1.1vw;
+ font-weight: bold;
+}
+
+.checkbox>.third_checkbox {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+
+.checkbox>.third_checkbox>i {
+ margin-left: 1vw;
+ font-size: 1.5vw;
+}
+
+.checkbox>.third_checkbox>.third_checkbox_text {
+ margin-left: 1vw;
+ font-size: 1.1vw;
+ font-weight: bold;
+}
+
+first_checkbox.clicked {
+ background: #ff0000;
+ /* 변경할 색상을 지정합니다 */
+}
+
+.modal-container>.modal>#ModalTitle {
+ color: #222B72;
+ margin-top: -13vw;
+ margin-left: 30vw;
+ margin-top: -7vw;
+}
+
+.modal-container>.modal>#close {
+ height: 2.5vw;
+ width: 5vw;
+ border-radius: 100px;
+ position: absolute;
+ background: #5073FF;
+ top: 35vw;
+ left: 60vw;
+ transform: translateX(-50%);
+ border: 8px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #ffffff;
+ cursor: pointer;
+
+}
+
+.modal-container>.modal>#modal_firsttext {
+ font-size: 1.2vw;
+ font-weight: bold;
+ margin-left: 30vw;
+ margin-top: 3vw;
+}
+
+.modal-container>.modal>#modal_secondtext {
+ font-size: 1.2vw;
+ font-weight: bold;
+ margin-left: 30vw;
+ margin-top: 3vw;
+}
+
+.modal-container>.modal>#modal_thirdtext {
+ font-size: 1.2vw;
+ font-weight: bold;
+ margin-left: 30vw;
+ margin-top: 3vw;
+}
+
+.modal-container>.modal>#modal_Input {
+ margin-left: 60vw;
+ text-align: center;
+ height: 2.5vw;
+ width: 60vw;
+ border-radius: 100px;
+ background: #F6F6F6;
+ top: 35vw;
+ transform: translateX(-50%);
+ border: 5px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #000000;
+ cursor: pointer;
+}
+
+.modal-container>.modal>.dropbox {
+ margin-left: 30vw;
+}
+
+.modal-container>.modal>.dropbox>#year,
+.modal-container>.modal>.dropbox>#month,
+.modal-container>.modal>.dropbox>#day {
+ display: inline-block;
+ margin-left: 10vw;
+ /* 드롭박스 사이의 간격을 조정할 수 있습니다 */
+ text-align: center;
+ height: 2.5vw;
+ width: 10vw;
+ border-radius: 100px;
+ background: #F6F6F6;
+ top: 35vw;
+ transform: translateX(-50%);
+ border: 5px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #000000;
+ cursor: pointer;
+}
+
+.modal-container>.modal>.checkbox {
+ display: inline-block;
+ margin-right: 10px;
+ padding: 5px 10px;
+ border-radius: 5px;
+ background-color: #F6F6F6;
+ color: #333333;
+ cursor: pointer;
+
+}
+
+#item1 {
+ text-align: center;
+ height: 1.5vw;
+ width: 10vw;
+ margin-left: -20vw;
+ border-radius: 100px;
+ background: #F6F6F6;
+ top: 30vw;
+ transform: translateX(-50%);
+ border: 5px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #000000;
+ cursor: pointer;
+}
+
+#item2 {
+ text-align: center;
+ height: 1.5vw;
+ width: 10vw;
+ border-radius: 100px;
+ background: #F6F6F6;
+ top: 30vw;
+ transform: translateX(-50%);
+ border: 5px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #000000;
+ cursor: pointer;
+}
+
+#item3 {
+ text-align: center;
+ height: 1.5vw;
+ margin-left: 20vw;
+ width: 10vw;
+ border-radius: 100px;
+ background: #F6F6F6;
+ top: 30vw;
+ transform: translateX(-50%);
+ border: 5px solid #5073FF;
+ font-size: 1.0vw;
+ font-weight: bold;
+ color: #000000;
+ cursor: pointer;
+}
+
+.selected {
+ background-color: #5073FF;
+ color: #FFFFFF;
+}
\ No newline at end of file
diff --git a/static/css/criminal.css b/static/css/criminal.css
new file mode 100644
index 0000000..e16febd
--- /dev/null
+++ b/static/css/criminal.css
@@ -0,0 +1,1304 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(white, #CDCDCD) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all {
+ padding-top: 9vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+ background-color: lightblue;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background-color: pink;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 2.5vw;
+ line-height: 62.5px;
+ letter-spacing: -0.05rem;
+ color: #0F3FE8;
+ margin-right: auto;
+ margin-left: 15vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -4.5vw;
+ margin-right: 10vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+.topBox {
+ width: 100vw;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 2vw;
+ margin-left: -1vw;
+ position: relative;
+}
+
+.topBox>.topBlueBox {
+ width: 96vw;
+ height: 31vw;
+ background-color: #4762FF;
+ border-color: none;
+ border-radius: 3vw;
+ box-shadow: inset 0px -39px 34px 0px rgba(0, 0, 0, 0.01);
+}
+
+.topBox>.topCircle {
+ width: 31vw;
+ height: 31vw;
+ position: absolute;
+ margin-left: -20vw;
+ background: linear-gradient(270deg, #0418AB -20.77%, rgba(4, 24, 171, 0) 71.88%);
+ box-shadow: 17px 5px 33px 0px #00000030;
+ border-radius: 50%;
+ border: none;
+}
+
+.topBox>p {
+ position: absolute;
+ margin-left: -50vw;
+ margin-top: -5.5vw;
+ font-family: 'Pretendard';
+ font-weight: 700;
+ font-size: 7.5vw;
+ font-weight: 150px;
+ color: white;
+}
+
+.topBox>#p1 {
+ letter-spacing: 0.1rem;
+ margin-left: -54.1vw;
+}
+
+.topBox>#p2 {
+ letter-spacing: -0.05rem;
+ margin-top: 10vw;
+}
+
+.topBox>#mini2 {
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8vw;
+ letter-spacing: -0.05rem;
+ color: whtie;
+ margin-left: 56vw;
+ margin-top: 17.5vw;
+}
+
+.topBox>.miniTitle>#mini {
+ position: absolute;
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8px;
+ color: white;
+ white-space: nowrap;
+ margin-left: -82.5vw;
+ margin-top: 7vw;
+}
+
+.topBox>.topbar {
+ position: absolute;
+ width: 7.4vw;
+ height: 0.7vw;
+ background-color: white;
+ border: none;
+ margin-left: 63vw;
+ margin-top: -15vw;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.right>.rightTop {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: -55px;
+ margin-left: -3vw;
+}
+
+.right>.rightTop>.pContainer {
+ display: flex;
+ align-items: center;
+ margin-left: -10vw;
+}
+
+.right>.rightTop>.pContainer>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color: white;
+ display: inline-block;
+ white-space: nowrap;
+ margin-right: -12vw;
+ z-index: 1;
+}
+
+#pBar {
+ margin-left: 14vw;
+}
+
+#ptown {
+ margin-left: 14vw
+}
+
+.right>.rightTop>.pContainer>.pBackground,
+.right>.rightTop>.pContainer>.pBackground2 {
+ width: 7.6vw;
+ height: 1.8vw;
+ background-color: #5378FF;
+ border: none;
+ margin-left: 29.5vw;
+ position: absolute;
+ margin-top: -1vw;
+}
+
+.right>.rightTop>.pContainer>.pBackground {
+ border-radius: 2.5vw;
+ margin-top: 1vw;
+}
+
+
+.right>.rightTop>form {
+ display: flex;
+ justify-content: flex-end;
+ margin-right: 10vw;
+}
+
+.right>.rightTop>form>.SSbox>select {
+ width: 7vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ outline: none;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.2vw;
+ padding-right: 0.1vw;
+}
+
+.right>.rightTop>form>.SSbox>#searchBox {
+ width: 9.4vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ font-weight: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.4vw;
+}
+
+.right>.rightTop>form>.SSbox>.submitContainer>#searchSubmit {
+ position: absolute;
+ width: 2.25vw;
+ height: 1.4vw;
+ border: 1px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #5378FF;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ color: white;
+ margin-top: -1.45vw;
+ margin-left: 22.5vw;
+}
+
+.right>#postTitle {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 2.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #5B5B5B;
+ margin: 0;
+ margin-left: 0.4vw;
+}
+
+.right>#postSub {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 6.5vw;
+ color: #787878;
+ margin: 0;
+ margin-left: 0.8vw;
+ margin-top: -4.5vw;
+}
+
+.right>select {
+ position: absolute;
+ width: 5vw;
+ height: 1.4vw;
+ border: 1px solid #595959;
+ border-radius: 0.5vw;
+ outline: none;
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.5vw;
+ color: #858585;
+ margin-left: 55.5vw;
+ margin-top: -3vw;
+}
+
+#postHr,
+#postBottomHr {
+ width: 61vw;
+ height: 1px;
+ background-color: #7A7A7A;
+ border: 0;
+ margin: 0;
+ margin-top: -1vw;
+}
+
+#postBottomHr {
+ margin-top: -45px;
+}
+
+.right>.postTopbar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 2vw;
+}
+
+.right>.postTopbar>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 1vw;
+ line-height: 130px;
+ color: #858585;
+ margin: 0;
+ margin-top: -40px;
+}
+
+.right>.postTopbar>#writer {
+ margin-right: -15vw;
+}
+
+.right>.postTopbar>#createDay {
+ margin-left: 5vw;
+}
+
+.right>.postTopbar>#createDay,
+.right>.postTopbar>#view {
+ margin-right: 10vw;
+}
+
+.right>.postTopbar>#view {
+ margin-left: -20vw;
+}
+
+.right>.notificationBox {
+ width: 61vw;
+ height: 2.4vw;
+ background-color: #E8E8E8;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ border-bottom: 1px solid #7A7A7A;
+ margin: 0;
+ display: flex;
+ align-items: center;
+ position: relative;
+ white-space: nowrap;
+}
+
+.right>.notificationBox>.Topicbox {
+ width: 2.3vw;
+ height: 1.2vw;
+ border: 2px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #87B3FF;
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.5vw;
+ color: #0418AB;
+ flex-direction: column;
+ display: flex;
+ justify-content: center;
+ text-align: center;
+ margin-left: 2vw;
+}
+
+.right>.notificationBox>.postxtbox {
+ position: absolute;
+ margin-left: 8vw;
+}
+
+.right>.notificationBox>.postxtbox>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+ display: inline;
+}
+
+.right>.notificationBox>.postxtbox>#writeCount {
+ font-family: 'Inter';
+ font-weight: 500;
+ font-size: 0.6vw;
+ color: #FF0000;
+}
+
+.right>.notificationBox>.Writerbox>p,
+.right>.notificationBox>.CreateDaybox>p,
+.right>.notificationBox>.viewbox>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+}
+
+.right>.notificationBox>.Writerbox {
+ position: absolute;
+ margin-left: 40vw;
+}
+
+.right>.notificationBox>.CreateDaybox {
+ position: absolute;
+ margin-left: 48.8vw;
+}
+
+.right>.notificationBox>.viewbox {
+ position: absolute;
+ margin-left: 58.4vw;
+}
+
+.right>.paging {
+ width: 61vw;
+ height: 2.6vw;
+ border: 1px solid #949494;
+ border-radius: 1vw;
+ margin-top: 1vw;
+ flex: display;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+.right>.ourtownBox {
+ margin-top: 3vw;
+ position: relative;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.right>.ourtownBox>.ourtownbox1 {
+ margin-left: 2vw;
+}
+
+.right>.ourtownBox>.ourtownbox2,
+.right>.ourtownBox>.ourtownbox3 {
+ margin-left: 6vw;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownImage,
+.right>.ourtownBox>.ourtownbox2>.ourtownImage,
+.right>.ourtownBox>.ourtownbox3>.ourtownImage {
+ width: 15vw;
+ height: 10vw;
+ border-radius: 1.5vw;
+ box-shadow: inset 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+ background-image: url("../image/sleepy.png");
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ position:relative;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer>#ourtownTitle,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer>#ourtownTitle,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer>#ourtownTitle {
+ font-family: 'Inter';
+ font-weight: 500;
+ font-size: 1vw;
+ color: #2D2D2D;
+ white-space: nowrap;
+ margin:0;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer>#live,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer>#live,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer>#live{
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:0.6vw;
+ color:#949494;
+ margin:0;
+ margin-top:-40px;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer>#criminalText,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer>#criminalText,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer>#criminalText{
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:0.7vw;
+ color: #fd0303;
+ margin:0;
+ margin-top:-30px;
+}
\ No newline at end of file
diff --git a/static/css/information.css b/static/css/information.css
new file mode 100644
index 0000000..1b8a0a4
--- /dev/null
+++ b/static/css/information.css
@@ -0,0 +1,1267 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(white,#CDCDCD) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all{
+ padding-top:9vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+ background-color:lightblue;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background-color:pink;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 2.5vw;
+ line-height: 62.5px;
+ letter-spacing: -0.05rem;
+ color: #0F3FE8;
+ margin-right: auto;
+ margin-left: 15vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -4.5vw;
+ margin-right: 10vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+.topBox{
+ width:100vw;
+ height:auto;
+ display:flex;
+ justify-content: center;
+ align-items: center;
+ margin-top:2vw;
+ margin-left:-1vw;
+ position:relative;
+}
+
+.topBox>.topBlueBox{
+ width: 96vw;
+ height: 31vw;
+ background-color: #4762FF;
+ border-color: none;
+ border-radius: 3vw;
+ box-shadow: inset 0px -39px 34px 0px rgba(0, 0, 0, 0.01);
+}
+
+.topBox>.topCircle{
+ width:31vw;
+ height:31vw;
+ position:absolute;
+ margin-left:-20vw;
+ background: linear-gradient(270deg, #0418AB -20.77%, rgba(4, 24, 171, 0) 71.88%);
+ box-shadow: 17px 5px 33px 0px #00000030;
+ border-radius:50%;
+ border:none;
+}
+
+.topBox>p{
+ position:absolute;
+ margin-left:-50vw;
+ margin-top:-5.5vw;
+ font-family: 'Pretendard';
+ font-weight:700;
+ font-size:7.5vw;
+ font-weight:150px;
+ color:white;
+}
+
+.topBox>#p1{
+ letter-spacing: 0.1rem;
+ margin-left:-54.1vw;
+}
+
+.topBox>#p2{
+ letter-spacing: -0.05rem;
+ margin-top:10vw;
+}
+
+.topBox>#mini2{
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size:1.5vw;
+ line-height: 35.8vw;
+ letter-spacing: -0.05rem;
+ color:whtie;
+ margin-left:56vw;
+ margin-top:17.5vw;
+}
+
+.topBox>.miniTitle>#mini{
+ position:absolute;
+ font-family: 'Pretendard';
+ font-weight:600;
+ font-size:1.5vw;
+ line-height: 35.8px;
+ color:white;
+ white-space: nowrap;
+ margin-left:-82.5vw;
+ margin-top:7vw;
+}
+
+.topBox>.topbar{
+ position: absolute;
+ width:7.4vw;
+ height:0.7vw;
+ background-color:white;
+ border:none;
+ margin-left:63vw;
+ margin-top:-15vw;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.right>.rightTop {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-top:-55px;
+ margin-left:-3vw;
+}
+
+.right>.rightTop>.pContainer{
+ display: flex;
+ align-items: center;
+ margin-left: -10vw;
+}
+
+.right>.rightTop>.pContainer>p{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:0.9vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color:white;
+ display: inline-block;
+ white-space: nowrap;
+ margin-right: -12vw;
+ z-index:1;
+}
+
+#pBar{
+ margin-left:14vw;
+}
+
+#ptown{
+ margin-left:14vw
+}
+.right>.rightTop>.pContainer>.pBackground, .right>.rightTop>.pContainer>.pBackground2{
+ width:7.6vw;
+ height:1.8vw;
+ background-color:#5378FF;
+ border:none;
+ margin-left:13.4vw;
+ position:absolute;
+ margin-top:-1vw;
+}
+
+.right>.rightTop>.pContainer>.pBackground {
+ border-radius:2.5vw;
+ margin-top:1vw;
+}
+
+
+.right>.rightTop>form{
+ display: flex;
+ justify-content: flex-end;
+ margin-right:10vw;
+}
+
+.right>.rightTop>form>.SSbox>select{
+ width:7vw;
+ height:1.5vw;
+ border:1px solid #9A9A9A;
+ border-radius:2vw;
+ outline:none;
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:0.5vw;
+ line-height: 6vw;
+ letter-spacing: -0.1rem;
+ color:#7A7A7A;
+ padding-left:0.2vw;
+ padding-right:0.1vw;
+}
+
+.right>.rightTop>form>.SSbox>#searchBox{
+ width:9.4vw;
+ height:1.5vw;
+ border:1px solid #9A9A9A;
+ border-radius:2vw;
+ font-weight: 'Inter';
+ font-weight: 400;
+ font-size:0.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color:#7A7A7A;
+ padding-left:0.4vw;
+}
+
+.right>.rightTop>form>.SSbox>.submitContainer>#searchSubmit{
+ position:absolute;
+ width:2.25vw;
+ height:1.4vw;
+ border:1px solid #5378FF;
+ border-radius:2vw;
+ background-color:#5378FF;
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:0.5vw;
+ color:white;
+ margin-top:-1.45vw;
+ margin-left:22.5vw;
+}
+
+.right>#postTitle{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:2.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color:#5B5B5B;
+ margin:0;
+ margin-left:0.4vw;
+}
+
+.right>#postSub{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:0.9vw;
+ line-height: 6.5vw;
+ color:#787878;
+ margin:0;
+ margin-left:0.8vw;
+ margin-top:-4.5vw;
+}
+
+.right>select{
+ position: absolute;
+ width:5vw;
+ height:1.4vw;
+ border:1px solid #595959;
+ border-radius:0.5vw;
+ outline:none;
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:0.5vw;
+ color:#858585;
+ margin-left:55.5vw;
+ margin-top:-3vw;
+}
+
+#postHr, #postBottomHr{
+ width:61vw;
+ height:1px;
+ background-color:#7A7A7A;
+ border:0;
+ margin:0;
+ margin-top:-1vw;
+}
+
+#postBottomHr {
+ margin-top: -45px;
+}
+
+.right>.postTopbar{
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left:2vw;
+}
+
+.right>.postTopbar>p{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:1vw;
+ line-height: 130px;
+ color:#858585;
+ margin:0;
+ margin-top:-40px;
+}
+
+.right>.postTopbar>#writer{
+ margin-right:-15vw;
+}
+
+.right>.postTopbar>#createDay{
+ margin-left:5vw;
+}
+
+.right>.postTopbar>#createDay, .right>.postTopbar>#view{
+ margin-right:10vw;
+}
+
+.right>.postTopbar>#view{
+ margin-left:-20vw;
+}
+
+.right>.notificationBox, .right>.writepostBox{
+ width:61vw;
+ height:2.4vw;
+ background-color:#E8E8E8;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ border-bottom:1px solid #7A7A7A;
+ margin:0;
+ display: flex;
+ align-items: center;
+ position:relative;
+ white-space: nowrap;
+}
+
+.right>.writepostBox {
+ background-color:white;
+}
+
+.right>.writepostBox>.Topicbox{
+ position:absolute;
+ margin-left:-12.5vw;
+}
+
+.right>.writepostBox>.Topicbox>p{
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size:0.5vw;
+ color:#757575;
+}
+
+.right>.notificationBox>.Topicbox{
+ width:2.3vw;
+ height:1.2vw;
+ border:2px solid #5378FF;
+ border-radius:2vw;
+ background-color:#87B3FF;
+ font-family: 'Inter';
+ font-weight:600;
+ font-size:0.5vw;
+ color:#0418AB;
+ flex-direction: column;
+ display: flex;
+ justify-content: center;
+ text-align:center;
+ margin-left:2vw;
+}
+
+.right>.notificationBox>.postxtbox,
+.right>.writepostBox>.postxtbox{
+ position:absolute;
+ margin-left:8vw;
+}
+
+.right>.notificationBox>.postxtbox>p,
+.right>.writepostBox>.postxtbox>p{
+ font-family: 'Inter';
+ font-weight:600;
+ font-size:0.6vw;
+ color:#000000;
+ margin:0;
+ display:inline;
+}
+
+.right>.writepostBox>.postxtbox>p{
+ font-weight:500;
+}
+
+.right>.notificationBox>.postxtbox>#writeCount,
+.right>.writepostBox>.postxtbox>#writeCount{
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:0.6vw;
+ color:#FF0000;
+}
+
+.right>.notificationBox>.Writerbox>p,
+.right>.notificationBox>.CreateDaybox>p,
+.right>.notificationBox>.viewbox>p,
+.right>.writepostBox>.Writerbox>p,
+.right>.writepostBox>.CreateDaybox>p,
+.right>.writepostBox>.viewbox>p{
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+}
+
+.right>.notificationBox>.Writerbox{
+ position:absolute;
+ margin-left:40vw;
+}
+
+.right>.writepostBox>.Writerbox{
+ position:absolute;
+ margin-left:39.8vw;
+}
+
+.right>.notificationBox>.CreateDaybox,
+.right>.writepostBox>.CreateDaybox {
+ position: absolute;
+ margin-left: 48.8vw;
+}
+
+.right>.notificationBox>.viewbox{
+ position: absolute;
+ margin-left: 58.4vw;
+}
+
+.right>.writepostBox>.viewbox{
+ position:absolute;
+ margin-left:59vw;
+}
+
+.right>.paging{
+ width:61vw;
+ height:2.6vw;
+ border:1px solid #949494;
+ border-radius:1vw;
+ margin-top:2vw;
+ flex: display;
+ justify-content: center;
+ align-items: center;
+ text-align:center;
+}
\ No newline at end of file
diff --git a/static/css/login.css b/static/css/login.css
index a024d61..036ae4a 100644
--- a/static/css/login.css
+++ b/static/css/login.css
@@ -1,373 +1,226 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
@font-face {
font-family: 'Pretendard-Regular';
src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
- font-weight: 600;
-}
-
-html{
- width:1920px;
- height:1080px;
+ font-weight: 400;
+ font-style: normal;
}
-body{
- overflow:hidden;
- background: linear-gradient(#CDCDCD, #F5F5F5);
+body {
+ background: linear-gradient(180deg, #CDCDCD 0%, #F5F5F5 100%);
background-repeat: no-repeat;
+ height: 100vh;
+ width: 100vw;
+ overflow: hidden;
}
-.one1{
- width:713px;
- height:713px;
- position: absolute;
- top: 580px;
- left:-149px;
- background-color:#242A5D;
- border-radius:50%;
-}
-
-.one2 {
- width: 910px;
- height: 910px;
- position: absolute;
- top: 15px;
- left: 1620px;
- background-color: #99BCFF;
- border-radius: 50%;
- filter: blur(5px);
+.logo {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
}
-.one3{
- width:460px;
- height:460px;
- position:absolute;
- top:-282px;
- left:1123px;
- background-color:#2A38B1;
- border-radius:50%;
- filter: blur(10px);
+.logo>p {
+ margin-top: 0%;
+ margin-left: 1%;
+ font-family: Inter;
+ font-size: 3vw;
+ font-weight: 600;
+ line-height: 3.631vw;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: #242A57;
}
-i {
- position: absolute;
- width:30px;
- height:32px;
- top: 35px;
- left: 1856px;
+.logo>a>i {
+ width: 3vw;
+ height: 3.2vw;
+ color: #242A5D;
+ margin-right: 2vw;
}
-.text1{
+.CircleContainer {
position: absolute;
- top: 2px;
- left: 62px;
+ z-index: -1;
}
-.text1>p{
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size:30px;
- line-height: 36.31px;
- color:#242A57;
- letter-spacing: -5%;
+.circle1 {
+ width: 45vw;
+ height: 45vw;
+ background-color: #242A5D;
+ border-radius: 50%;
+ margin-top: 25vw;
+ margin-left: -10vw;
}
-.bluebox{
- display: flex;
- justify-content: center;
- width:600px;
- height:723px;
- position: absolute;
- top:70px;
- left:305px;
- border-radius:130px;
- background:linear-gradient(#4762FF, #78B6FF);
- box-shadow: 25px 0px 36px -1px rgba(0, 0, 0, 0.23);
- z-index: 2;
+.circle2 {
+ width: 61.6vw;
+ height: 61.6vw;
+ background-color: #99BCFF;
+ border-radius: 50%;
+ filter: blur(5px);
+ margin-top: -78vw;
+ margin-left: 80vw;
}
-.bluebox>i{
- position:absolute;
- top:80px;
- left:55px;
+.circle3 {
+ width: 31vw;
+ height: 31vw;
+ background-color: #2A38B1;
+ border-radius: 50%;
+ filter: blur(10px);
+ margin-top: -85vw;
+ margin-left: 50vw;
}
-.bluebox>p{
- color:white;
- position:absolute;
- top:180px;
- text-align: center;
- font-family: 'Inter', sans-serif;
- font-weight: 600;
- font-size: 35px;
+.bluebox-whitebox-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: -7%;
+ margin-left: -5%;
}
-.bluebox>.text2{
+.bluebox-whitebox-container>.bluebox {
+ width: 34vw;
+ height: 38vw;
+ border-radius: 6.5vw;
+ background: linear-gradient(#4762FF, #78B6FF);
+ box-shadow: 25px 0px 36px -1px #0000003B;
+ z-index: 2;
display: flex;
justify-content: center;
+ align-items: center;
+ flex-direction: column;
}
-.bluebox>.text2>p{
- color: white;
- position: absolute;
- top: 200px;
- text-align: center;
- font-family: 'Jua', sans-serif;
- font-weight: 400;
- font-size: 90px;
- z-index:1;
-}
-.bluebox>.text3{
- display: flex;
- justify-content: center;
+.bluebox-whitebox-container>.bluebox>.subTitle {
+ font-family: 'Inter';
+ margin-top: -10%;
+ font-weight: 600;
+ font-size: 2vw;
+ color: white;
}
-.bluebox>.text3>p{
+.bluebox-whitebox-container>.bluebox>.Title {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 6vw;
color: white;
- position: absolute;
- top: 390px;
- text-align: center;
- font-family: 'Pretendard-Regular';
- font-size: 25px;
+ margin-top: 5%;
+ white-space: nowrap;
}
-.whitebox{
- width:770px;
- height:600px;
- position:absolute;
- top:260px;
- right:260px;
- background:white;
- border-radius:100px;
- box-shadow: 38px 22px 65px 0px rgba(0, 0, 0, 0.25);
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
+.bluebox-whitebox-container>.bluebox>.explain {
+ font-family: 'Pretendard';
+ font-weight: 500;
+ font-size: 1.2vw;
+ color: white;
+ margin-top: -2%;
}
-.whitebox>p{
- position: absolute;
- top:5px;
- left:128px;
- font-family: 'Inter', sans-serif;
- font-weight: 700;
- font-size:60px;
- color:#000000;
+.bluebox-whitebox-container>.whitebox {
+ width: 36vw;
+ height: 32vw;
+ margin-top: 10%;
+ margin-left: -1%;
+ border-radius: 5vw;
+ background-color: white;
+ box-shadow: 1.9vw 1.1vw 3.25vw 0 rgba(0, 0, 0, 0.25);
}
-.whitebox>.text4{
+.bluebox-whitebox-container>.whitebox>form {
display: flex;
- flex-direction: column;
justify-content: center;
align-items: center;
+ flex-direction: column;
}
-.whitebox>.text4>i{
- position:absolute;
- color:#575757;
- width:14.31px;
- height:16.95px;
- top: 232px;
- left: 148px;
- z-index: 1;
+.bluebox-whitebox-container>.whitebox>form>.LoginText {
+ margin-top: 10%;
+ margin-left: -35%;
+ font-family: 'Inter';
+ font-weight: 700;
+ font-size: 4vw;
+ color: #000000;
}
-.whitebox>.text4>p{
- position:absolute;
- top:150px;
- left:131px;
- font-family: 'Inter', sans-serif;
- font-weight:400;
- font-size:20px;
- color:#BEBEBE;
-}
-.whitebox>.text4>input{
- box-sizing: border-box;
- width:523.81px;
- height:65px;
- position:absolute;
- top:200px;
- border-radius:55px;
- border:2px solid #C4C4C4;
- background-color:white;
- display: flex;
- justify-content: center;
- align-items: center;
- padding-left: 60px;
- padding-right: 60px;
- font-family: 'Inter', sans-serif;
- font-weight:400;
- font-size:16px;
- color:#4A4A4A;
+.bluebox-whitebox-container>.whitebox>form>p {
+ font-weight: 'Inter';
+ font-weight: 400;
+ font-size: 1vw;
+ color: #BEBEBE;
+ margin-left: -53%;
+ margin-top: 2vw;
}
-.whitebox>.text5{
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
+.bluebox-whitebox-container>.whitebox>form>.PasswordText,
+.bluebox-whitebox-container>.whitebox>form>.EmailText {
+ position: relative;
}
-.whitebox>.text5>p{
+.bluebox-whitebox-container>.whitebox>form>.PasswordText>i,
+.bluebox-whitebox-container>.whitebox>form>.EmailText>i {
+ width: 0.7vw;
+ height: 0.8vw;
+ color: #575757;
position: absolute;
- top: 267px;
- left: 131px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 20px;
- color: #BEBEBE;
+ margin-left: 7%;
+ margin-top: 3%;
}
-.whitebox>.text5>i {
- position: absolute;
- color: #575757;
- width: 14.31px;
- height: 16.95px;
- top: 347px;
- left: 148px;
- z-index: 1;
+@media (max-width:1300px) {
+ .bluebox-whitebox-container>.whitebox>form>.PasswordText,
+ .bluebox-whitebox-container>.whitebox>form>.EmailText {
+ font-size: 0.5rem;
+ }
}
-.whitebox>.text5>input{
- box-sizing:border-box;
- width: 523.81px;
- height: 65px;
- position: absolute;
- top: 315px;
+.bluebox-whitebox-container>.whitebox>form>.PasswordText>input,
+.bluebox-whitebox-container>.whitebox>form>.EmailText>input {
+ width: 21vw;
+ height: 3.3vw;
border-radius: 55px;
border: 2px solid #C4C4C4;
background-color: white;
- padding-left: 60px;
- padding-right: 60px;
- font-family: 'Inter', sans-serif;
+ outline: none;
+ padding-left: 3vw;
+ font-family: 'Inter';
font-weight: 400;
- font-size: 16px;
+ font-size: 0.8vw;
+ line-height: 19.36px;
+ letter-spacing: -0.05rem;
color: #4A4A4A;
+ margin-top: -4%;
}
-[type="checkbox"]{
- appearance: none;
- border:2px solid #C4C4C4;
- border-radius:50%;
- position:absolute;
- left:131px;
- top:395px;
- width:22px;
- height:22px;
- cursor:pointer;
-}
-
-[type="checkbox"]:checked {
- border: 2px solid #4967FF;
- border-radius: 50%;
- background: #4967FF;
- background-image: url("../image/check.png");
- background-repeat: no-repeat;
- background-position: center;
- background-size: contain;
- cursor:pointer;
-}
-
-.whitebox>.text6>label>p{
- position: absolute;
- top: 388px;
- left: 161px;
- font-family: 'Inter', sans-serif;
- font-weight: 400;
- font-size: 13px;
- color: #C4C4C4;
- cursor:pointer;
-}
-
-.whitebox>.text6>label>[type="checkbox"]:checked+p{
- color:#4967FF;
-}
-
-
-.whitebox>.text7>p{
- position: absolute;
- top:382px;
- right:198px;
- color:#C4C4C4;
-}
-
-.whitebox>.text7>button{
- border:none;
- background-color:white;
- color: #C4C4C4;
- font-family: 'Inter', sans-serif;
- font-size:13px;
- font-weight:400;
- cursor: pointer;
-}
-
-#idbtn{
- position:absolute;
- top:400px;
- right:209px;
-}
-
-#joinbtn{
- position: absolute;
- top: 400px;
- right:131px;
- color: #C4C4C4;
-}
-
-.whitebox>.text7>#idbtn:hover {
- color: #4967FF;
- font-weight: 800;
-}
-
-.whitebox>.text7>#joinbtn:hover{
- color: #4967FF;
- font-weight: 800;
-}
-
-.whitebox>button{
- width: 523.81px;
- height: 65px;
- position: absolute;
- top: 463px;
+.bluebox-whitebox-container>.whitebox>form>a>button {
+ width: 24vw;
+ height: 3.3vw;
border-radius: 55px;
- border: 2px solid #4967FF;
- background-color: #4967FF;
- font-family: 'Inter', sans-serif;
- font-weight:500;
- font-size:23px;
- color:white;
- cursor:pointer;
-}
-
-.circle1 {
- width: 9.19px;
- height: 9.19px;
- border-radius: 50%;
background-color: #4967FF;
- position: absolute;
- top: 805px;
- right: 652px;
+ font-family: 'Inter';
+ font-weight: 500;
+ font-size: 1.1vw;
+ line-height: 27.84px;
+ letter-spacing: -0.02rem;
+ text-align: center;
+ color: white;
+ border: none;
+ margin-top: 2vw;
}
-.circle2{
- width:9.19px;
- height:9.19px;
- border-radius: 50%;
- background-color: #4967FF;
- position:absolute;
- top:805px;
- right:637px;
+.bottom {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1vw;
}
-.circle3{
-width: 9.19px;
- height: 9.19px;
- border-radius: 50%;
- background-color: #4967FF;
- position: absolute;
- top: 805px;
- right: 622px;
+.bottom>a>img {
+ width: 25vw;
}
\ No newline at end of file
diff --git a/static/css/ourtown.css b/static/css/ourtown.css
new file mode 100644
index 0000000..958c508
--- /dev/null
+++ b/static/css/ourtown.css
@@ -0,0 +1,1317 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(white, #CDCDCD) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all {
+ padding-top: 9vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+ background-color: lightblue;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background-color: pink;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 2.5vw;
+ line-height: 62.5px;
+ letter-spacing: -0.05rem;
+ color: #0F3FE8;
+ margin-right: auto;
+ margin-left: 15vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -4.5vw;
+ margin-right: 10vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+.topBox {
+ width: 100vw;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 2vw;
+ margin-left: -1vw;
+ position: relative;
+}
+
+.topBox>.topBlueBox {
+ width: 96vw;
+ height: 31vw;
+ background-color: #4762FF;
+ border-color: none;
+ border-radius: 3vw;
+ box-shadow: inset 0px -39px 34px 0px rgba(0, 0, 0, 0.01);
+}
+
+.topBox>.topCircle {
+ width: 31vw;
+ height: 31vw;
+ position: absolute;
+ margin-left: -20vw;
+ background: linear-gradient(270deg, #0418AB -20.77%, rgba(4, 24, 171, 0) 71.88%);
+ box-shadow: 17px 5px 33px 0px #00000030;
+ border-radius: 50%;
+ border: none;
+}
+
+.topBox>p {
+ position: absolute;
+ margin-left: -50vw;
+ margin-top: -5.5vw;
+ font-family: 'Pretendard';
+ font-weight: 700;
+ font-size: 7.5vw;
+ font-weight: 150px;
+ color: white;
+}
+
+.topBox>#p1 {
+ letter-spacing: 0.1rem;
+ margin-left: -54.1vw;
+}
+
+.topBox>#p2 {
+ letter-spacing: -0.05rem;
+ margin-top: 10vw;
+}
+
+.topBox>#mini2 {
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8vw;
+ letter-spacing: -0.05rem;
+ color: whtie;
+ margin-left: 56vw;
+ margin-top: 17.5vw;
+}
+
+.topBox>.miniTitle>#mini {
+ position: absolute;
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8px;
+ color: white;
+ white-space: nowrap;
+ margin-left: -82.5vw;
+ margin-top: 7vw;
+}
+
+.topBox>.topbar {
+ position: absolute;
+ width: 7.4vw;
+ height: 0.7vw;
+ background-color: white;
+ border: none;
+ margin-left: 63vw;
+ margin-top: -15vw;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.right>.rightTop {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: -55px;
+ margin-left: -3vw;
+}
+
+.right>.rightTop>.pContainer {
+ display: flex;
+ align-items: center;
+ margin-left: -10vw;
+}
+
+.right>.rightTop>.pContainer>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color: white;
+ display: inline-block;
+ white-space: nowrap;
+ margin-right: -12vw;
+ z-index: 1;
+}
+
+#pBar {
+ margin-left: 14vw;
+}
+
+#ptown {
+ margin-left: 14vw
+}
+
+.right>.rightTop>.pContainer>.pBackground,
+.right>.rightTop>.pContainer>.pBackground2 {
+ width: 7.6vw;
+ height: 1.8vw;
+ background-color: #5378FF;
+ border: none;
+ margin-left: 29.5vw;
+ position: absolute;
+ margin-top: -1vw;
+}
+
+.right>.rightTop>.pContainer>.pBackground {
+ border-radius: 2.5vw;
+ margin-top: 1vw;
+}
+
+
+.right>.rightTop>form {
+ display: flex;
+ justify-content: flex-end;
+ margin-right: 10vw;
+}
+
+.right>.rightTop>form>.SSbox>select {
+ width: 7vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ outline: none;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.2vw;
+ padding-right: 0.1vw;
+}
+
+.right>.rightTop>form>.SSbox>#searchBox {
+ width: 9.4vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ font-weight: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.4vw;
+}
+
+.right>.rightTop>form>.SSbox>.submitContainer>#searchSubmit {
+ position: absolute;
+ width: 2.25vw;
+ height: 1.4vw;
+ border: 1px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #5378FF;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ color: white;
+ margin-top: -1.45vw;
+ margin-left: 22.5vw;
+}
+
+.right>#postTitle {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 2.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #5B5B5B;
+ margin: 0;
+ margin-left: 0.4vw;
+}
+
+.right>#postSub {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 6.5vw;
+ color: #787878;
+ margin: 0;
+ margin-left: 0.8vw;
+ margin-top: -4.5vw;
+}
+
+.right>select {
+ position: absolute;
+ width: 5vw;
+ height: 1.4vw;
+ border: 1px solid #595959;
+ border-radius: 0.5vw;
+ outline: none;
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.5vw;
+ color: #858585;
+ margin-left: 55.5vw;
+ margin-top: -3vw;
+}
+
+#postHr,
+#postBottomHr {
+ width: 61vw;
+ height: 1px;
+ background-color: #7A7A7A;
+ border: 0;
+ margin: 0;
+ margin-top: -1vw;
+}
+
+#postBottomHr {
+ margin-top: -45px;
+}
+
+.right>.postTopbar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 2vw;
+}
+
+.right>.postTopbar>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 1vw;
+ line-height: 130px;
+ color: #858585;
+ margin: 0;
+ margin-top: -40px;
+}
+
+.right>.postTopbar>#writer {
+ margin-right: -15vw;
+}
+
+.right>.postTopbar>#createDay {
+ margin-left: 5vw;
+}
+
+.right>.postTopbar>#createDay,
+.right>.postTopbar>#view {
+ margin-right: 10vw;
+}
+
+.right>.postTopbar>#view {
+ margin-left: -20vw;
+}
+
+.right>.notificationBox{
+ width: 61vw;
+ height: 2.4vw;
+ background-color: #E8E8E8;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ border-bottom: 1px solid #7A7A7A;
+ margin: 0;
+ display: flex;
+ align-items: center;
+ position: relative;
+ white-space: nowrap;
+}
+
+.right>.notificationBox>.Topicbox {
+ width: 2.3vw;
+ height: 1.2vw;
+ border: 2px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #87B3FF;
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.5vw;
+ color: #0418AB;
+ flex-direction: column;
+ display: flex;
+ justify-content: center;
+ text-align: center;
+ margin-left: 2vw;
+}
+
+.right>.notificationBox>.postxtbox{
+ position: absolute;
+ margin-left: 8vw;
+}
+
+.right>.notificationBox>.postxtbox>p{
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+ display: inline;
+}
+
+.right>.notificationBox>.postxtbox>#writeCount{
+ font-family: 'Inter';
+ font-weight: 500;
+ font-size: 0.6vw;
+ color: #FF0000;
+}
+
+.right>.notificationBox>.Writerbox>p,
+.right>.notificationBox>.CreateDaybox>p,
+.right>.notificationBox>.viewbox>p{
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+}
+
+.right>.notificationBox>.Writerbox {
+ position: absolute;
+ margin-left: 40vw;
+}
+
+.right>.notificationBox>.CreateDaybox{
+ position: absolute;
+ margin-left: 48.8vw;
+}
+
+.right>.notificationBox>.viewbox {
+ position: absolute;
+ margin-left: 58.4vw;
+}
+
+.right>.paging {
+ width: 61vw;
+ height: 2.6vw;
+ border: 1px solid #949494;
+ border-radius: 1vw;
+ margin-top: 1vw;
+ flex: display;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+.right>.ourtownBox{
+ margin-top:5vw;
+ position:relative;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.right>.ourtownBox>.ourtownbox1{
+ margin-left:2vw;
+}
+
+.right>.ourtownBox>.ourtownbox2,
+.right>.ourtownBox>.ourtownbox3 {
+ margin-left: 6vw;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownImage,
+.right>.ourtownBox>.ourtownbox2>.ourtownImage,
+.right>.ourtownBox>.ourtownbox3>.ourtownImage{
+ width:15vw;
+ height:10vw;
+ border-radius:1.5vw;
+ box-shadow: inset 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+ background-image:url("../image/sleepy.png");
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer,
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer2,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer2,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer2{
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer>p,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer>p,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer>p{
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:0.7vw;
+ color:#2D2D2D;
+ margin:0;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer>#ourtownView,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer>#ourtownView,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer>#ourtownView{
+ font-size:0.6vw;
+ color:#FF0000;
+ margin:0;
+ margin-left:0.5vw;
+}
+
+.right>.ourtownBox>.ourtownbox1>#ourtownWriter,
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer2>p,
+.right>.ourtownBox>.ourtownbox2>#ourtownWriter,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer2>p,
+.right>.ourtownBox>.ourtownbox3>#ourtownWriter,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer2>p{
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:0.6vw;
+ color:#949494;
+ margin:0;
+ margin-top:-45px;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer2>#ourtownView1,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer2>#ourtownView1,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer2>#ourtownView1 {
+ margin-left:1vw;
+}
+
+.right>.ourtownBox>.ourtownbox1>.ourtownContainer2>#ourtownView2,
+.right>.ourtownBox>.ourtownbox2>.ourtownContainer2>#ourtownView2,
+.right>.ourtownBox>.ourtownbox3>.ourtownContainer2>#ourtownView2{
+ margin-left:0.5vw;
+}
\ No newline at end of file
diff --git a/static/css/profile.css b/static/css/profile.css
new file mode 100644
index 0000000..aa3e27f
--- /dev/null
+++ b/static/css/profile.css
@@ -0,0 +1,1245 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(#CDCDCD, #F5F5F5) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+}
+
+.Middle {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.Middle>.Mcircle {
+ height: 149px;
+ width: 60%;
+ border: none;
+ border-radius: 100px;
+ background-color: #151E63;
+ margin-top: -100px;
+ margin-left: -20px;
+}
+
+.top {
+ margin-top: -85px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 3vw;
+ line-height: 75px;
+ letter-spacing: -0.05rem;
+ color: #233C9B;
+ margin-right: auto;
+ margin-left: 2vw;
+ cursor:pointer;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -5.5vw;
+ margin-right: 5vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ cursor:pointer;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ cursor:pointer;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+
+.EditTitle>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 36.31px;
+ letter-spacing: -0.05rem;
+ color: #525253;
+ margin-left: 88%;
+ margin-top: 5%;
+ margin-bottom:5%;
+ cursor:pointer;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.8vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.all>.right>.profile{
+ margin-left:2vw;
+ margin-top:-2vw;
+}
+
+.all>.right>.profile>i{
+ font-size:3rem;
+ color:#142F9E;
+ display: inline-block;
+}
+
+@media (max-width:1200px) {
+ .all>.right>.profile>i{
+ font-size:2rem;
+ }
+}
+
+@media (max-width:700px) {
+ .all>.right>.profile>i {
+ font-size: 1.5rem;
+ }
+}
+
+.all>.right>.profile>p{
+ display: inline-block;
+ padding-top:2vw;
+ font-family: 'Inter';
+ font-weight:600;
+ font-size:2vw;
+ line-height: 10px;
+ letter-spacing: -0.05rem;
+ color:#142F9E;
+ margin-left:0.5vw;
+}
+
+.all>.right>form>.profilebox {
+ width: 90%;
+ height: auto;
+ border: 1px solid #919191;
+ border-radius: 70px;
+ background-color: white;
+ margin-left: 2vw;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ text-align: left;
+ padding-bottom: 2vw;
+ position: relative;
+}
+
+.all>.right>form>.profilebox>#uname {
+
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 4vw;
+ line-height: 30px;
+ letter-spacing: -0.1rem;
+ color: #142F9E;
+ margin-left: 10%;
+ margin-top: 10%;
+}
+
+.all>.right>form>.profilebox>.emailbox {
+ width: 26vw;
+ height: 4.8vh;
+ border-radius: 100px;
+ border: none;
+ background-color: #0015AD;
+ opacity: 0.6;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ margin-left: 10%;
+ margin-top: -2%;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 1.6vw;
+ line-height: 10px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ flex-direction: center;
+ justify-content: center;
+ align-items: center;
+}
+
+.all>.right>form>.profilebox>.photoEdit {
+ position: absolute;
+ margin-top: 1vw;
+ margin-left: -1vw;
+}
+
+.all>.right>form>.profilebox>.photoEdit>.photo {
+ position: relative;
+ width: 15vw;
+ height: 15vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-left: 45vw;
+ margin-top: -10vw;
+}
+
+#rephoto {
+ position: absolute;
+ border: none;
+ width: 3vw;
+ height: 3vw;
+ background-color: #0015AD;
+ border-radius: 50%;
+ margin-left: 57vw;
+ margin-top: -4vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+#rephoto>i {
+ width: 1.5vw;
+ height: 1.6vw;
+ color: white;
+ margin-top: 1.5vw;
+}
+
+@media (max-width:1200px) {
+ #rephoto>i {
+ font-size: 0.1rem;
+ }
+}
+
+.all>.right>form>.profilebox>.EmailContainer{
+ width: 33vw;
+ height: auto;
+ border: 4px solid #5378FF;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 10%;
+ margin-top: -1vw;
+}
+
+.all>.right>form>.profilebox>.ExplainContainer1,
+.all>.right>form>.profilebox>.ExplainContainer2 {
+ width: 33vw;
+ height: auto;
+ border: 4px solid #5378FF;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 10%;
+ margin-top: 5vw;
+}
+
+.all>.right>form>.profilebox>.EmailContainer>#Email{
+ margin-top:5vw;
+}
+
+.all>.right>form>.profilebox>.EmailContainer>#Email,
+.all>.right>form>.profilebox>.ExplainContainer1>#Explain {
+ font-family: 'Inter';
+ font-weight: 700;
+ font-size: 1.9vw;
+ line-height: 10px;
+ letter-spacing: -0.05rem;
+ color: #4967FF;
+ margin-left: 0;
+ margin-bottom: 0.8vw;
+}
+
+.all>.right>form>.profilebox>.EmailContainer>p{
+ margin-top:5vw;
+}
+
+.all>.right>form>.profilebox>.EmailContainer>p,
+.all>.right>form>.profilebox>.ExplainContainer2>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 1.5vw;
+ line-height: 10px;
+ letter-spacing: -0.05rem;
+ color: #4967FF;
+ margin-right: 0;
+ margin-bottom: 0.8vw;
+}
+
+.all>.right>form>.profilebox>.ExplainContainer1,
+.all>.right>form>.profilebox>.ExplainContainer2 {
+ width: 50vw;
+}
+
+.all>.right>form>.profilebox>.ExplainContainer2 {
+ display: flex;
+ justify-content: flex-end;
+ margin-top: 0.5vw;
+}
+
+.all>.right>form>.profilebox>.buttonContainer {
+ display: flex;
+ justify-content: flex-end;
+ margin-right: 10%;
+ margin-top: 2vw;
+ gap: 1vw;
+}
+
+#edit,
+#save {
+ border: 3px solid #4967FF;
+ border-radius: 30px;
+ width: 5vw;
+ height: 2.5vw;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 1vw;
+ background-color: white;
+ cursor: pointer;
+}
+
+#edit:hover,
+#save:hover {
+ background-color: #4967FF;
+ color: white;
+}
+
+.input-box {
+ width: 50vw;
+ height: 3vw;
+ border: none;
+ outline: none;
+ font-family: 'Inter', sans-serif;
+ font-weight: 400;
+ font-size: 1.5vw;
+ color: #4967FF;
+ padding-left: 20px;
+}
+
+.input-box2 {
+ position: absolute;
+ width: 30vw;
+ height: 5vw;
+ top:-2%;
+ border: none;
+ outline: none;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 4vw;
+ color: #142F9E;
+ background-color: white;
+ border: none;
+ outline: none;
+}
+
+.input-box3 {
+ position: absolute;
+ width: 30vw;
+ height: 5vw;
+ top: 2%;
+ border: none;
+ outline: none;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 4vw;
+ color: #142F9E;
+ background-color: white;
+ border: none;
+ outline: none;
+}
+
+.modal-container {
+ position: fixed;
+ top: 0;
+ left: 0;
+ height: 100vh;
+ width: 100vw;
+ display: none;
+ align-items: center;
+ justify-content: center;
+ z-index: 9999;
+ backdrop-filter: blur(3px);
+}
+
+.modal {
+ height: 400px;
+ width: 700px;
+ background-color: #c9d1f7;
+ border: 4px solid #7282fa;
+ border-radius: 30px;
+ text-align: center;
+}
+
+.modal-container>.modal>h1 {
+ margin-top: 80px;
+ font-family: 'Inter', sans-serif;
+ text-align: left;
+ margin-left: 50px;
+}
+
+.modal-container>.modal>.photobox {
+ width: 300px;
+ height: 300px;
+ border-radius: 50%;
+ margin-top: -230px;
+ margin-left: auto;
+ margin-right: 50px;
+ background-color: #0015AD;
+}
+
+.modal-container>.modal>.photobox>.photoImage {
+ width: 300px;
+ height: 300px;
+ background-color: #0015AD;
+ border-radius: 50%;
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: cover;
+}
+
+.modal-container>.modal>#photoInput {
+ margin-left: -350px;
+ margin-top: 70px;
+}
+
+.modal-container>.modal>#close {
+ width: 30px;
+ height: 30px;
+ border: none;
+ font-size: 30px;
+ background-color: #c9d1f7;
+ font-family: 'Inter', sans-serif;
+ cursor: pointer;
+ margin-left: auto;
+ margin-right: -640px;
+ margin-top: 10px;
+}
+
+.modal-container.show {
+ display: flex;
+}
+
+.modal-container.show .modal {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
\ No newline at end of file
diff --git a/static/css/review.css b/static/css/review.css
new file mode 100644
index 0000000..7f26b8d
--- /dev/null
+++ b/static/css/review.css
@@ -0,0 +1,1272 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(white, #CDCDCD) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all {
+ padding-top: 9vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+ background-color: lightblue;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background-color: pink;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 2.5vw;
+ line-height: 62.5px;
+ letter-spacing: -0.05rem;
+ color: #0F3FE8;
+ margin-right: auto;
+ margin-left: 15vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -4.5vw;
+ margin-right: 10vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+.topBox {
+ width: 100vw;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 2vw;
+ margin-left: -1vw;
+ position: relative;
+}
+
+.topBox>.topBlueBox {
+ width: 96vw;
+ height: 31vw;
+ background-color: #4762FF;
+ border-color: none;
+ border-radius: 3vw;
+ box-shadow: inset 0px -39px 34px 0px rgba(0, 0, 0, 0.01);
+}
+
+.topBox>.topCircle {
+ width: 31vw;
+ height: 31vw;
+ position: absolute;
+ margin-left: -20vw;
+ background: linear-gradient(270deg, #0418AB -20.77%, rgba(4, 24, 171, 0) 71.88%);
+ box-shadow: 17px 5px 33px 0px #00000030;
+ border-radius: 50%;
+ border: none;
+}
+
+.topBox>p {
+ position: absolute;
+ margin-left: -50vw;
+ margin-top: -5.5vw;
+ font-family: 'Pretendard';
+ font-weight: 700;
+ font-size: 7.5vw;
+ font-weight: 150px;
+ color: white;
+}
+
+.topBox>#p1 {
+ letter-spacing: 0.1rem;
+ margin-left: -54.1vw;
+}
+
+.topBox>#p2 {
+ letter-spacing: -0.05rem;
+ margin-top: 10vw;
+}
+
+.topBox>#mini2 {
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8vw;
+ letter-spacing: -0.05rem;
+ color: whtie;
+ margin-left: 56vw;
+ margin-top: 17.5vw;
+}
+
+.topBox>.miniTitle>#mini {
+ position: absolute;
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8px;
+ color: white;
+ white-space: nowrap;
+ margin-left: -82.5vw;
+ margin-top: 7vw;
+}
+
+.topBox>.topbar {
+ position: absolute;
+ width: 7.4vw;
+ height: 0.7vw;
+ background-color: white;
+ border: none;
+ margin-left: 63vw;
+ margin-top: -15vw;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.right>.rightTop {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: -55px;
+ margin-left: -3vw;
+}
+
+.right>.rightTop>.pContainer {
+ display: flex;
+ align-items: center;
+ margin-left: -10vw;
+}
+
+.right>.rightTop>.pContainer>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color: white;
+ display: inline-block;
+ white-space: nowrap;
+ margin-right: -12vw;
+ z-index: 1;
+}
+
+#pBar {
+ margin-left: 14vw;
+}
+
+#ptown {
+ margin-left: 14vw
+}
+
+.right>.rightTop>.pContainer>.pBackground,
+.right>.rightTop>.pContainer>.pBackground2 {
+ width: 7.6vw;
+ height: 1.8vw;
+ background-color: #5378FF;
+ border: none;
+ margin-left: 20.4vw;
+ position: absolute;
+ margin-top: -1vw;
+}
+
+.right>.rightTop>.pContainer>.pBackground {
+ border-radius: 2.5vw;
+ margin-top: 1vw;
+}
+
+
+.right>.rightTop>form {
+ display: flex;
+ justify-content: flex-end;
+ margin-right: 10vw;
+}
+
+.right>.rightTop>form>.SSbox>select {
+ width: 7vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ outline: none;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.2vw;
+ padding-right: 0.1vw;
+}
+
+.right>.rightTop>form>.SSbox>#searchBox {
+ width: 9.4vw;
+ height: 1.5vw;
+ border: 1px solid #9A9A9A;
+ border-radius: 2vw;
+ font-weight: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #7A7A7A;
+ padding-left: 0.4vw;
+}
+
+.right>.rightTop>form>.SSbox>.submitContainer>#searchSubmit {
+ position: absolute;
+ width: 2.25vw;
+ height: 1.4vw;
+ border: 1px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #5378FF;
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 0.5vw;
+ color: white;
+ margin-top: -1.45vw;
+ margin-left: 22.5vw;
+}
+
+.right>#postTitle {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 2.5vw;
+ line-height: 6.5vw;
+ letter-spacing: -0.1rem;
+ color: #5B5B5B;
+ margin: 0;
+ margin-left: 0.4vw;
+}
+
+.right>#postSub {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.9vw;
+ line-height: 6.5vw;
+ color: #787878;
+ margin: 0;
+ margin-left: 0.8vw;
+ margin-top: -4.5vw;
+}
+
+.right>select {
+ position: absolute;
+ width: 5vw;
+ height: 1.4vw;
+ border: 1px solid #595959;
+ border-radius: 0.5vw;
+ outline: none;
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 0.5vw;
+ color: #858585;
+ margin-left: 55.5vw;
+ margin-top: -3vw;
+}
+
+#postHr,
+#postBottomHr {
+ width: 61vw;
+ height: 1px;
+ background-color: #7A7A7A;
+ border: 0;
+ margin: 0;
+ margin-top: -1vw;
+}
+
+#postBottomHr {
+ margin-top: -45px;
+}
+
+.right>.postTopbar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 2vw;
+}
+
+.right>.postTopbar>p {
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 1vw;
+ line-height: 130px;
+ color: #858585;
+ margin: 0;
+ margin-top: -40px;
+}
+
+.right>.postTopbar>#writer {
+ margin-right: -15vw;
+}
+
+.right>.postTopbar>#createDay {
+ margin-left: 5vw;
+}
+
+.right>.postTopbar>#createDay,
+.right>.postTopbar>#view {
+ margin-right: 10vw;
+}
+
+.right>.postTopbar>#view {
+ margin-left: -20vw;
+}
+
+.right>.notificationBox,
+.right>.writepostBox {
+ width: 61vw;
+ height: 2.4vw;
+ background-color: #E8E8E8;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ border-bottom: 1px solid #7A7A7A;
+ margin: 0;
+ display: flex;
+ align-items: center;
+ position: relative;
+ white-space: nowrap;
+}
+
+.right>.writepostBox {
+ background-color: white;
+}
+
+.right>.writepostBox>.Topicbox {
+ position: absolute;
+ margin-left: -12.5vw;
+}
+
+.right>.writepostBox>.Topicbox>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.5vw;
+ color: #757575;
+}
+
+.right>.notificationBox>.Topicbox {
+ width: 2.3vw;
+ height: 1.2vw;
+ border: 2px solid #5378FF;
+ border-radius: 2vw;
+ background-color: #87B3FF;
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.5vw;
+ color: #0418AB;
+ flex-direction: column;
+ display: flex;
+ justify-content: center;
+ text-align: center;
+ margin-left: 2vw;
+}
+
+.right>.notificationBox>.postxtbox,
+.right>.writepostBox>.postxtbox {
+ position: absolute;
+ margin-left: 8vw;
+}
+
+.right>.notificationBox>.postxtbox>p,
+.right>.writepostBox>.postxtbox>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+ display: inline;
+}
+
+.right>.writepostBox>.postxtbox>p {
+ font-weight: 500;
+}
+
+.right>.notificationBox>.postxtbox>#writeCount,
+.right>.writepostBox>.postxtbox>#writeCount {
+ font-family: 'Inter';
+ font-weight: 500;
+ font-size: 0.6vw;
+ color: #FF0000;
+}
+
+.right>.notificationBox>.Writerbox>p,
+.right>.notificationBox>.CreateDaybox>p,
+.right>.notificationBox>.viewbox>p,
+.right>.writepostBox>.Writerbox>p,
+.right>.writepostBox>.CreateDaybox>p,
+.right>.writepostBox>.viewbox>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 0.6vw;
+ color: #000000;
+ margin: 0;
+}
+
+.right>.notificationBox>.Writerbox {
+ position: absolute;
+ margin-left: 40vw;
+}
+
+.right>.writepostBox>.Writerbox {
+ position: absolute;
+ margin-left: 39.8vw;
+}
+
+.right>.notificationBox>.CreateDaybox,
+.right>.writepostBox>.CreateDaybox {
+ position: absolute;
+ margin-left: 48.8vw;
+}
+
+.right>.notificationBox>.viewbox {
+ position: absolute;
+ margin-left: 58.4vw;
+}
+
+.right>.writepostBox>.viewbox {
+ position: absolute;
+ margin-left: 59vw;
+}
+
+.right>.paging {
+ width: 61vw;
+ height: 2.6vw;
+ border: 1px solid #949494;
+ border-radius: 1vw;
+ margin-top: 2vw;
+ flex: display;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
\ No newline at end of file
diff --git a/static/css/signup.css b/static/css/signup.css
new file mode 100644
index 0000000..c975802
--- /dev/null
+++ b/static/css/signup.css
@@ -0,0 +1,218 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(180deg, #CDCDCD 0%, #F5F5F5 100%);
+ background-repeat: no-repeat;
+ height: 100vh;
+ width: 100vw;
+ overflow: hidden;
+}
+
+.logo {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.logo>p {
+ margin-top: 0%;
+ margin-left: 1%;
+ font-family: Inter;
+ font-size: 3vw;
+ font-weight: 600;
+ line-height: 3.631vw;
+ letter-spacing: -0.05em;
+ text-align: left;
+ color: #242A57;
+}
+
+.logo>a>i {
+ width: 3vw;
+ height: 3.2vw;
+ color: #242A5D;
+ margin-right: 2vw;
+}
+
+.CircleContainer {
+ position: absolute;
+ z-index: -1;
+}
+
+.circle1 {
+ width: 45vw;
+ height: 45vw;
+ background-color: #242A5D;
+ border-radius: 50%;
+ margin-top: 25vw;
+ margin-left: -10vw;
+}
+
+.circle2 {
+ width: 61.6vw;
+ height: 61.6vw;
+ background-color: #99BCFF;
+ border-radius: 50%;
+ filter: blur(5px);
+ margin-top: -78vw;
+ margin-left: 80vw;
+}
+
+.circle3 {
+ width: 31vw;
+ height: 31vw;
+ background-color: #2A38B1;
+ border-radius: 50%;
+ filter: blur(10px);
+ margin-top: -85vw;
+ margin-left: 50vw;
+}
+
+.bluebox-whitebox-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: -7%;
+ margin-left: -5%;
+}
+
+.bluebox-whitebox-container>.bluebox {
+ width: 34vw;
+ height: 38vw;
+ border-radius: 6.5vw;
+ background: linear-gradient(#4762FF, #78B6FF);
+ box-shadow: 25px 0px 36px -1px #0000003B;
+ z-index: 2;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+
+.bluebox-whitebox-container>.bluebox>.subTitle {
+ font-family: 'Inter';
+ margin-top:-10%;
+ font-weight: 600;
+ font-size: 2vw;
+ color: white;
+}
+
+.bluebox-whitebox-container>.bluebox>.Title {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 6vw;
+ color: white;
+ margin-top: 5%;
+ white-space: nowrap;
+}
+
+.bluebox-whitebox-container>.bluebox>.explain {
+ font-family: 'Pretendard';
+ font-weight: 500;
+ font-size: 1.2vw;
+ color: white;
+ margin-top: -2%;
+}
+
+.bluebox-whitebox-container>.whitebox {
+ width: 36vw;
+ height: 36vw;
+ margin-top: 10%;
+ margin-left: -1%;
+ border-radius: 5vw;
+ background-color: white;
+ box-shadow: 1.9vw 1.1vw 3.25vw 0 rgba(0, 0, 0, 0.25);
+}
+
+.bluebox-whitebox-container>.whitebox>form {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.bluebox-whitebox-container>.whitebox>form>.SignupText {
+ margin-top: 10%;
+ margin-left: -35%;
+ font-family: 'Inter';
+ font-weight: 700;
+ font-size: 4vw;
+ color: #000000;
+}
+
+
+.bluebox-whitebox-container>.whitebox>form>p{
+ font-weight: 'Inter';
+ font-weight:400;
+ font-size:1vw;
+ color:#BEBEBE;
+ margin-left:-50%;
+ margin-top:2vw;
+}
+
+.bluebox-whitebox-container>.whitebox>form>.NicknameText,
+.bluebox-whitebox-container>.whitebox>form>.PasswordText,
+.bluebox-whitebox-container>.whitebox>form>.EmailText{
+ position:relative;
+}
+
+.bluebox-whitebox-container>.whitebox>form>.NicknameText>i,
+.bluebox-whitebox-container>.whitebox>form>.PasswordText>i,
+.bluebox-whitebox-container>.whitebox>form>.EmailText>i{
+ width:0.7vw;
+ height:0.8vw;
+ color:#575757;
+ position: absolute;
+ margin-left:7%;
+ margin-top:2.5%;
+}
+
+@media (max-width:1400px) {
+ .bluebox-whitebox-container>.whitebox>form>.NicknameText,
+ .bluebox-whitebox-container>.whitebox>form>.PasswordText,
+ .bluebox-whitebox-container>.whitebox>form>.EmailText {
+ font-size:0.5rem;
+ }
+}
+
+.bluebox-whitebox-container>.whitebox>form>.NicknameText>input,
+.bluebox-whitebox-container>.whitebox>form>.PasswordText>input,
+.bluebox-whitebox-container>.whitebox>form>.EmailText>input{
+ width:21vw;
+ height:2.6vw;
+ border-radius:55px;
+ border:2px solid #C4C4C4;
+ background-color:white;
+ outline:none;
+ padding-left:3vw;
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:0.7vw;
+ line-height: 18.15px;
+ letter-spacing: -0.05rem;
+ color:#4A4A4A;
+ margin-top:-5%;
+}
+
+.bluebox-whitebox-container>.whitebox>form>a>button{
+ width:24vw;
+ height:2.6vw;
+ border-radius:55px;
+ background-color:#4967FF;
+ font-family: 'Inter';
+ font-weight:500;
+ font-size:1vw;
+ line-height: 27.84px;
+ letter-spacing: -0.05rem;
+ color:white;
+ border:none;
+ margin-top:2vw;
+}
\ No newline at end of file
diff --git a/static/css/write.css b/static/css/write.css
new file mode 100644
index 0000000..0fd72d1
--- /dev/null
+++ b/static/css/write.css
@@ -0,0 +1,1190 @@
+@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Hind&display=swap');
+@font-face {
+ font-family: 'Pretendard-Regular';
+ src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ background: linear-gradient(white, #CDCDCD) no-repeat center fixed;
+ height: 100vh;
+ width: 100vw;
+}
+
+.all {
+ padding-top: 9vw;
+}
+
+.all>.left {
+ width: 30%;
+ padding-left: 12%;
+ float: left;
+ box-sizing: border-box;
+ background-color: lightblue;
+}
+
+.all>.right {
+ width: 70%;
+ float: right;
+ box-sizing: border-box;
+ background-color: pink;
+}
+
+.top {
+ margin-top: -30px;
+}
+
+p {
+ font-family: 'Jua';
+ font-weight: 400;
+ font-size: 2.5vw;
+ line-height: 62.5px;
+ letter-spacing: -0.05rem;
+ color: #0F3FE8;
+ margin-right: auto;
+ margin-left: 15vw;
+}
+
+.icon {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: -4.5vw;
+ margin-right: 10vw;
+}
+
+.icon>i {
+ margin-right: 2vw;
+ font-size: 2rem;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .icon>i {
+ font-size: 1.5rem;
+ }
+}
+
+.bell {
+ display: flex;
+ align-items: center;
+}
+
+.bell>i {
+ margin-right: 5px;
+ color: #181D45;
+}
+
+@media (max-width: 1300px) {
+ .bell>i {
+ font-size: 1.5rem;
+ }
+}
+
+.topBox {
+ width: 100vw;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 2vw;
+ margin-left: -1vw;
+ position: relative;
+}
+
+.topBox>.topBlueBox {
+ width: 96vw;
+ height: 31vw;
+ background-color: #4762FF;
+ border-color: none;
+ border-radius: 3vw;
+ box-shadow: inset 0px -39px 34px 0px rgba(0, 0, 0, 0.01);
+}
+
+.topBox>.topCircle {
+ width: 31vw;
+ height: 31vw;
+ position: absolute;
+ margin-left: -20vw;
+ background: linear-gradient(270deg, #0418AB -20.77%, rgba(4, 24, 171, 0) 71.88%);
+ box-shadow: 17px 5px 33px 0px #00000030;
+ border-radius: 50%;
+ border: none;
+}
+
+.topBox>p {
+ position: absolute;
+ margin-left: -50vw;
+ margin-top: -5.5vw;
+ font-family: 'Pretendard';
+ font-weight: 700;
+ font-size: 7.5vw;
+ font-weight: 150px;
+ color: white;
+}
+
+.topBox>#p1 {
+ letter-spacing: 0.1rem;
+ margin-left: -54.1vw;
+}
+
+.topBox>#p2 {
+ letter-spacing: -0.05rem;
+ margin-top: 10vw;
+}
+
+.topBox>#mini2 {
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8vw;
+ letter-spacing: -0.05rem;
+ color: whtie;
+ margin-left: 56vw;
+ margin-top: 17.5vw;
+}
+
+.topBox>.miniTitle>#mini {
+ position: absolute;
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 1.5vw;
+ line-height: 35.8px;
+ color: white;
+ white-space: nowrap;
+ margin-left: -82.5vw;
+ margin-top: 7vw;
+}
+
+.topBox>.topbar {
+ position: absolute;
+ width: 7.4vw;
+ height: 0.7vw;
+ background-color: white;
+ border: none;
+ margin-left: 63vw;
+ margin-top: -15vw;
+}
+
+.userBox>.user {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ position: relative;
+ z-index: 1;
+}
+
+@media (max-width: 1500px) {
+ .userBox>.user {
+ font-size: 15px;
+ }
+}
+
+.userbox {
+ width: 15vw;
+ min-width: 30px;
+ min-height: 30px;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+}
+
+.userbox>.userImage {
+ width: 8vw;
+ padding-top: 8vw;
+ border: 2px solid #142F9E;
+ background: linear-gradient(#CFCFCF, #FFFFFF);
+ border-radius: 50%;
+ margin-top: 4vh;
+}
+
+.userbox>.name {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 5%;
+}
+
+@media (max-width: 1300px) {
+ .userbox>.name {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.name {
+ font-size: 2px;
+ }
+}
+
+.userbox>.email {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 13px;
+ color: #4967FF;
+}
+
+@media (max-width: 1200px) {
+ .userbox>.email {
+ font-size: 5px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.email {
+ font-size: 2px;
+ }
+}
+
+.userbox>.explain {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 18px;
+ color: #142F9E;
+ margin-top: 2%;
+}
+
+@media (max-width: 1600px) {
+ .userbox>.explain {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .userbox>.explain {
+ font-size: 10px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .userbox>.explain {
+ font-size: 2px;
+ }
+}
+
+.userbox>.button-container {
+ display: flex;
+ align-items: center;
+ margin-top: 3%;
+}
+
+#pen,
+#setting {
+ width: 6vw;
+ height: 20px;
+ border: none;
+ background-color: white;
+ color: #09174E;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: 'Inter', sans-serif;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 17px;
+ letter-spacing: -0.05rem;
+ white-space: nowrap;
+}
+
+@media (max-width: 1700px) {
+
+ #pen,
+ #setting {
+ font-size: 1px;
+ height: 1vh;
+ }
+}
+
+#pen {
+ width: 4vw;
+ margin-right: 5px;
+}
+
+#pen:hover,
+#setting:hover {
+ color: #142F9E;
+}
+
+#pen img,
+#setting img {
+ width: 1vw;
+ height: 1vw;
+ margin-right: 3px;
+}
+
+.menu {
+ width: 14.5vw;
+ height: 55vw;
+ border: 1px solid #919191;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: 20%;
+ margin-left: 0.5%;
+ background-color: white;
+}
+
+.menu>.checklist {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.checklist {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+ .menu>.checklist {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.checklist {
+ font-size: 10px;
+ }
+}
+
+.menu>.checklistcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text1>.checklistText,
+.menu>.text1>.calText {
+ display: flex;
+ align-items: center;
+ margin-top: 1.5vw;
+}
+
+.menu>.text1>.calText {
+ margin-bottom: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.calText {
+ margin-bottom: 1vw;
+ }
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.text1>.calText {
+ margin-bottom: 0.5vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText,
+ .menu>.text1>.calText {
+ margin-top: 0.5vw;
+ }
+}
+
+.menu>.text1>.checklistText>p,
+.menu>.text1>.calText>p {
+ font-family: 'Inter';
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ font-weight: 400;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text1>.checklistText>p,
+ .menu>.text1>.calText>p {
+ font-size: 10px;
+ }
+}
+
+.menu>.text1>.checklistText>i,
+.menu>.text1>.calText>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text1>.checklistText>i,
+ .menu>.text1>.calText>i {
+ font-size: 0.1rem;
+ }
+}
+
+.menu>.noticeboard {
+ width: 13vw;
+ height: 4vw;
+ padding-left: 9%;
+ background-color: #131B5A;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ letter-spacing: -0.05rem;
+ color: white;
+ display: flex;
+ justify-content: center;
+ flex-direction: center;
+ align-items: center;
+}
+
+@media (max-width: 1600px) {
+ .menu>.noticeboard {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .menu>.noticeboard {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+ .menu>.noticeboard {
+ font-size: 10px;
+ }
+}
+
+.menu>.noticeboardcircle {
+ width: 3vw;
+ height: 4vw;
+ background-color: #131B5A;
+ border-radius: 0 4vw 4vw 0;
+ margin-top: -4vw;
+ margin-left: 13vw;
+}
+
+.menu>.text2,
+.menu>.text3,
+.menu>.text4 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview,
+.menu>.text4>.criminal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 1vw;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1000px) {
+
+ .menu>.text2>.Jeonse,
+ .menu>.text2>.bargain,
+ .menu>.text3>.JeonseReview,
+ .menu>.text3>.bargainReview,
+ .menu>.text4>.criminal {
+ margin-top: 0.1vw;
+ }
+}
+
+.menu>.text2>.notice,
+.menu>.text2>.monthly,
+.menu>.text3>.review,
+.menu>.text3>.monthlyReview,
+.menu>.text4>.town,
+.menu>.text4>.situation {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1700px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 1.5vw;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.5vw;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .menu>.text2>.notice,
+ .menu>.text2>.monthly,
+ .menu>.text3>.review,
+ .menu>.text3>.monthlyReview,
+ .menu>.text4>.town,
+ .menu>.text4>.situation {
+ margin-top: 0.1vw;
+ }
+}
+
+
+.menu>.text1>.checklistText {
+ margin-left: -1vw;
+}
+
+.menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1700px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText {
+ margin-left: -1vw;
+ }
+}
+
+@media (max-width: 1500px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText {
+ margin-left: -2vw;
+ }
+}
+
+@media (max-width: 1300px) {
+ .menu>.text1>.checklistText>i {
+ padding-right: 2vw;
+ }
+}
+
+.menu>.text1>.calText {
+ margin-left: -3vw;
+}
+
+.menu>.text1>.calText>i {
+ padding-right: 2.5vw;
+}
+
+.menu>.text2>.monthly,
+.menu>.text2>.Jeonse,
+.menu>.text2>.bargain {
+ margin-left: -1vw;
+}
+
+.menu>.text2>.monthly>i,
+.menu>.text2>.Jeonse>i,
+.menu>.text2>.bargain>i {
+ padding-right: 1vw;
+}
+
+.menu>.text3>.monthlyReview,
+.menu>.text3>.JeonseReview,
+.menu>.text3>.bargainReview {
+ margin-left: -2vw;
+}
+
+.menu>.text3>.monthlyReview>i,
+.menu>.text3>.JeonseReview>i,
+.menu>.text3>.bargainReview>i {
+ padding-right: 2vw;
+}
+
+.menu>.text4>.situation {
+ margin-left: -1vw;
+}
+
+.menu>.text4>.situation>i {
+ padding-right: 1vw;
+}
+
+.menu>.text4>.criminal>i {
+ padding-right: 0.6vw;
+}
+
+@media (max-width: 1400px) {
+ .menu>.text4>.criminal>i {
+ padding-right: 1vw;
+ }
+}
+
+.text2>.notice>p,
+.text3>.review>p,
+.text4>.town>p {
+ font-family: 'Inter';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1100px) {
+
+ .text2>.notice>p,
+ .text3>.review>p,
+ .text4>.town>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>p,
+.text2>.Jeonse>p,
+.text2>.bargain>p,
+.text3>.monthlyReview>p,
+.text3>.JeonseReview>p,
+.text3>.bargainReview>p,
+.text4>.criminal>p,
+.text4>.situation>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 25px;
+ line-height: 30.26px;
+ letter-spacing: -0.05rem;
+ color: #131B5A;
+ margin: 0;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 20px;
+ }
+}
+
+@media (max-width: 1400px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width: 1200px) {
+
+ .text2>.monthly>p,
+ .text2>.Jeonse>p,
+ .text2>.bargain>p,
+ .text3>.monthlyReview>p,
+ .text3>.JeonseReview>p,
+ .text3>.bargainReview>p,
+ .text4>.criminal>p,
+ .text4>.situation>p {
+ font-size: 10px;
+ }
+}
+
+.text2>.monthly>i,
+.text2>.Jeonse>i,
+.text2>.bargain>i,
+.text4>.situation>i,
+.text4>.criminal>i {
+ font-size: 0.5rem;
+}
+
+@media (max-width: 1700px) {
+
+ .text2>.monthly>i,
+ .text2>.Jeonse>i,
+ .text2>.bargain>i,
+ .text4>.situation>i,
+ .text4>.criminal>i {
+ font-size: 0.1rem;
+ }
+}
+
+.text3>.monthlyReview>i,
+.text3>.JeonseReview>i,
+.text3>.bargainReview>i {
+ font-size: 0.5rem;
+}
+
+.text2>hr,
+.text3>hr {
+ width: 14.5vw;
+ border: 1px solid #131B5A;
+ margin-top: 1.5vw;
+}
+
+@media (max-width: 1900px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.9vw;
+ }
+}
+
+@media (max-width: 1800px) {
+
+ .text2>hr,
+ .text3>hr {
+ margin-top: 0.6vw;
+ }
+}
+
+.scheduleTitle {
+ width: 15vw;
+ height: 3vw;
+ border: none;
+ border-radius: 100px;
+ background-color: #0015AD;
+ box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.32);
+ color: white;
+ font-family: 'Hind';
+ font-weight: 600;
+ font-size: 25px;
+ line-height: 40.03px;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20%;
+ z-index: 1;
+ position: relative;
+}
+
+@media (max-width: 1500px) {
+ .scheduleTitle {
+ font-size: 15px;
+ }
+}
+
+.scheduleBox {
+ width: 15vw;
+ height: 20vw;
+ border: 1px solid #919191;
+ background-color: white;
+ border-radius: 50px;
+ box-shadow: inset 6px -5px 28px 0px rgba(0, 0, 0, 0.28);
+ margin-top: -3vw;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+}
+
+.scheduleBox>img {
+ width: 7vw;
+ height: 7vw;
+}
+
+@media (max-width:1300px) {
+ .scheduleBox>img {
+ margin-top: 2vw;
+ }
+}
+
+.scheduleBox>.scheduleText {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+
+
+.scheduleBox>.scheduleText>p {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 24.2px;
+ letter-spacing: -0.05rem;
+ color: #818181;
+ margin: 0;
+ margin-top: 20px;
+}
+
+@media (max-width:1500px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 15px;
+ }
+}
+
+@media (max-width:1100px) {
+ .scheduleBox>.scheduleText>p {
+ font-size: 10px;
+ }
+}
+
+.right>.writebar{
+ width:55vw;
+ height:3.8vw;
+ border:1px solid #0F3FE8;
+ border-radius:1.7vw;
+ background-color:#0F3FE8;
+ display:flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.right>.writebar>#writeTitle{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:1.5vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color:#FFFFFF;
+ margin-left:3vw;
+}
+
+.right>.writebar>#subTitle{
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:0.9vw;
+ line-height: 130px;
+ letter-spacing: -0.1rem;
+ color:#E8E8E8;
+ margin-left:-25vw;
+}
+
+.right>.writebar>i{
+ margin-right:2vw;
+ color:#E8E8E8;
+}
+
+.right>form>.writebox{
+ margin-top:5vw;
+ width:55vw;
+ height:45vw;
+ border: 1px solid #0F3FE8;
+ border-radius:5vw;
+ background-color:white;
+ box-shadow: 5px 5px 14px 0px rgba(0, 0, 0, 0.32);
+}
+
+.right>form>.writebox>.selectBox1>#postType{
+ width:23vw;
+ height:2vw;
+ border-radius:5vw;
+ border:1px solid #525252;
+ background-color:white;
+ outline:none;
+ font-family: 'Inter';
+ font-weight:600;
+ font-size:0.9vw;
+ line-height: 1vw;
+ letter-spacing: -0.05rem;
+ color:#878787;
+ margin-top:3vw;
+ margin-left:5vw;
+}
+
+.right>form>.writebox>.selectBox1>#postType>optgroup,
+.right>form>.wrtiebox>.selectBox1>#postType>option{
+ font-family: 'Pretendard';
+ font-weight:600;
+ font-size:0.7vw;
+ line-height: 0.9vw;
+ letter-spacing: -0.05rem;
+ color:#646464;
+}
+
+.right>form>.writebox>.selectBox1>#postType>option{
+ font-size:0.65vw;
+ line-height: 0.7vw;
+ color:#868686;
+}
+
+.right>form>.writebox>input{
+ width:44vw;
+ height:4vw;
+ margin-left:5vw;
+ margin-top:1vw;
+ border:1px solid #8C8C8C;
+ outline:none;
+ border-top:none;
+ border-left:none;
+ border-right:none;
+ font-family: 'Hind';
+ font-weight:500;
+ font-size:2vw;
+ line-height: 4vw;
+ color:#8C8C8C;
+}
+
+.right>form>.writebox>.toolbox{
+ width:44.5vw;
+ height:2.6vw;
+ background-color:#EBEBEB;
+ margin-left:5vw;
+ margin-top:3vw;
+ display: flex;
+ align-items:center;
+ justify-content: flex-start;
+}
+
+.right>form>.writebox>.toolbox>i{
+ margin-left:2vw;
+}
+
+.right>form>.writebox>#textareaContainer {
+ width: 44vw;
+ height: 25.5vw;
+ border: 1px solid #8C8C8C;
+ outline: none;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ font-family: 'Hind';
+ font-weight: 500;
+ font-size: 1.2vw;
+ margin-left: 5vw;
+ text-align: center;
+ color: #878787;
+ resize:none;
+}
+
+
+#submitButton{
+ width:6vw;
+ height:2.5vw;
+ border:1px solid #0F3FE8;
+ border-radius:1.2vw;
+ background-color:#0F3FE8;
+ box-shadow: 5px 5px 14px 0px rgba(0, 0, 0, 0.32);
+ font-family: 'Inter';
+ font-weight:400;
+ font-size:0.9vw;
+ line-height: 21.78px;
+ letter-spacing: -0.05rem;
+ text-align: center;
+ color:white;
+ margin-top:2vw;
+ margin-left:46vw;
+}
+
+#modal {
+ position: fixed;
+ z-index: 1;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.4);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ display:none;
+}
+
+#modal>.modal-content {
+ background-color: white;
+ margin: 0 auto;
+ padding: 20px;
+ border: 1px solid #868686;
+ border-radius:54px;
+ width:405px;
+ height:320px;
+ text-align: center;
+ display:flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+ position:relative;
+}
+
+#modal>.modal-content>p{
+ font-family: 'Pretendard';
+ font-weight: 600;
+ font-size: 20px;
+ line-height: 15px;
+ color: #515151;
+ margin:0;
+ position:absolute;
+ margin-top:-250px;
+}
+
+#modal>.modal-content>input{
+ display:none;
+}
+
+#modal>.modal-content>.custom{
+ display: flex;
+ flex-direction: row;
+ gap:2vw;
+}
+
+#modal>.modal-content>.custom>label>.imagebox{
+ width:74px;
+ height:74px;
+ border:0.5px solid #A7A7A7;
+ border-radius:27px;
+ box-shadow: 2px 3px 6px 0px rgba(0, 0, 0, 0.25);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor:pointer;
+}
+
+#modal>.modal-content>.custom>label>.imagebox>i {
+ font-size:2.5rem;
+ color:#0418AB;
+}
+
+#modal>.modal-content>.custom>#fileName{
+ text-align: left;
+ font-family: 'Pretendard';
+ font-weight:600;
+ font-size:12px;
+ line-height: 15px;
+ color:#646464;
+ margin-top:1vw;
+}
+
+#close-modal{
+ background-color:white;
+ border:none;
+ cursor:pointer;
+ position:absolute;
+ margin-top:-270px;
+ margin-left:370px;
+}
\ No newline at end of file
diff --git a/static/image/.DS_Store b/static/image/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/static/image/.DS_Store differ
diff --git a/static/image/error.png b/static/image/error.png
new file mode 100644
index 0000000..b92b663
Binary files /dev/null and b/static/image/error.png differ
diff --git a/static/image/signup.png b/static/image/signup.png
new file mode 100644
index 0000000..48b2f81
Binary files /dev/null and b/static/image/signup.png differ
diff --git a/static/javascript/cal2.js b/static/javascript/cal2.js
new file mode 100644
index 0000000..d901c46
--- /dev/null
+++ b/static/javascript/cal2.js
@@ -0,0 +1,198 @@
+// 현재 날짜 가져오는 Date 객체 생성
+let date = new Date();
+
+const renderCalendar = () => {
+ const viewYear = date.getFullYear(); // 현재 년도 가져오기
+ const viewMonth = (date.getMonth() + 1).toString().padStart(2, '0'); // 현재 월 가져오기, 2자리로 변환
+ const monthNames = [
+ // 월 영문 이름 배열
+ 'JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN',
+ 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'
+ ];
+ const monthText = monthNames[date.getMonth()]; // 현재 월의 영문 이름 가져오기
+
+ document.querySelector('.year-month').textContent = `${viewYear}.`;
+ document.querySelector('.year-month2').textContent = `.${viewMonth}`;
+ document.querySelector('.go-today').textContent = `${monthText}`;
+
+ const prevLast = new Date(viewYear, viewMonth - 1, 0); // 이전 달의 마지막 날짜 가져오기
+ const thisLast = new Date(viewYear, viewMonth, 0); // 현재 달의 마지막 날짜 가져오기
+
+ const PLDate = prevLast.getDate(); // 이전 달 마지막 날짜
+ const PLDay = prevLast.getDay(); // 이전 달 마지막 날짜의 요일
+
+ const TLDate = thisLast.getDate(); // 현재 달 마지막 날짜
+ const TLDay = thisLast.getDay(); // 현재 달 마지막 날짜의 요일
+
+ const prevDates = [];
+ const thisDates = [...Array(TLDate + 1).keys()].slice(1);
+ const nextDates = [];
+
+ // 이전 달의 날짜들이 담긴 배열
+ if (PLDay !== 6) {
+ for (let i = 0; i < PLDay + 1; i++) {
+ prevDates.unshift(PLDate - i);
+ }
+ }
+
+ // 다음 달의 날짜들이 담긴 배열
+ for (let i = 1; i < 7 - TLDay; i++) {
+ nextDates.push(i);
+ }
+
+ // 날짜 배열 합침
+ const dates = prevDates.concat(thisDates, nextDates);
+ const firstDateIndex = dates.indexOf(1);
+ const lastDateIndex = dates.lastIndexOf(TLDate);
+
+ dates.forEach((date, i) => {
+ const condition = i >= firstDateIndex && i < lastDateIndex + 1 ? 'this' : 'other';
+ dates[i] = `${date}
`;
+ });
+
+ document.querySelector('.dates').innerHTML = dates.join('');
+
+ const today = new Date();
+ if (
+ viewMonth === (today.getMonth() + 1).toString().padStart(2, '0') &&
+ viewYear === today.getFullYear()
+ ) {
+ // 현재 달에 해당하는 모든 요소에 today-hover 클래스 추가
+ const thisDates = document.querySelectorAll('.this');
+ for (let date of thisDates) {
+ date.parentElement.classList.add('today-hover');
+ }
+
+ // 현재 날짜와 일치하는 요소에 today 클래스 추가
+ for (let date of thisDates) {
+ if (+date.innerText === today.getDate()) {
+ date.classList.add('today');
+ break;
+ }
+ }
+ }
+};
+
+renderCalendar();
+
+const prevMonth = () => {
+ date.setDate(1);
+ date.setMonth(date.getMonth() - 1);
+ renderCalendar();
+};
+
+const nextMonth = () => {
+ date.setDate(1);
+ date.setMonth(date.getMonth() + 1);
+ renderCalendar();
+};
+
+
+const modalContainer = document.getElementById("modal");
+const modalContent = document.querySelector(".modal-content");
+
+function openModal() {
+ modalContainer.style.display = "flex";
+}
+
+function closeModal() {
+ modalContainer.style.display = "none";
+}
+
+modalContent.addEventListener("click", function (event) {
+ event.stopPropagation(); // 이벤트 전파 중단
+});
+
+window.addEventListener("load", function () {
+ modalContainer.style.display = "none";
+});
+
+
+//모달 안의 달력 -> 기존 html꺼 복사해오려고 했는데, 이전 달과 다음 달로 넘어가는 버튼에서 문제 생겨서 그냥 새로 만들어줬습니다.
+let calendarDate = new Date();
+
+const modalrenderCalendar = () => {
+ const viewYear = calendarDate.getFullYear(); // 현재 년도 가져오기
+ const viewMonth = (calendarDate.getMonth() + 1).toString().padStart(2, '0'); // 현재 월 가져오기, 2자리로 변환
+ const monthNames = [
+ // 월 영문 이름 배열
+ 'JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN',
+ 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'
+ ];
+ const monthText = monthNames[calendarDate.getMonth()]; // 현재 월의 영문 이름 가져오기
+
+ document.querySelector('.modal-year-month').textContent = `${viewYear}.`;
+ document.querySelector('.modal-year-month2').textContent = `.${viewMonth}`;
+ document.querySelector('.modal-go-today').textContent = `${monthText}`;
+
+ const prevLast = new Date(viewYear, viewMonth - 1, 0); // 이전 달의 마지막 날짜 가져오기
+ const thisLast = new Date(viewYear, viewMonth, 0); // 현재 달의 마지막 날짜 가져오기
+
+ const PLDate = prevLast.getDate(); // 이전 달 마지막 날짜
+ const PLDay = prevLast.getDay(); // 이전 달 마지막 날짜의 요일
+
+ const TLDate = thisLast.getDate(); // 현재 달 마지막 날짜
+ const TLDay = thisLast.getDay(); // 현재 달 마지막 날짜의 요일
+
+ const prevDates = [];
+ const thisDates = [...Array(TLDate + 1).keys()].slice(1);
+ const nextDates = [];
+
+ // 이전 달의 날짜들이 담긴 배열
+ if (PLDay !== 6) {
+ for (let i = 0; i < PLDay + 1; i++) {
+ prevDates.unshift(PLDate - i);
+ }
+ }
+
+ // 다음 달의 날짜들이 담긴 배열
+ for (let i = 1; i < 7 - TLDay; i++) {
+ nextDates.push(i);
+ }
+
+ // 날짜 배열 합침
+ const dates = prevDates.concat(thisDates, nextDates);
+ const firstDateIndex = dates.indexOf(1);
+ const lastDateIndex = dates.lastIndexOf(TLDate);
+
+ dates.forEach((date, i) => {
+ const condition = i >= firstDateIndex && i < lastDateIndex + 1 ? 'modal-this' : 'modal-other';
+ dates[i] = `${date}
`;
+ });
+
+ document.querySelector('.modaldates').innerHTML = dates.join('');
+
+ const today = new Date();
+ if (
+ viewMonth === (today.getMonth() + 1).toString().padStart(2, '0') &&
+ viewYear === today.getFullYear()
+ ) {
+ // 현재 달에 해당하는 모든 요소에 today-hover 클래스 추가
+ const thisDates = document.querySelectorAll('.modal-this');
+ for (let date of thisDates) {
+ date.parentElement.classList.add('modal-today-hover');
+ }
+
+ // 현재 날짜와 일치하는 요소에 today 클래스 추가
+ for (let date of thisDates) {
+ if (+date.innerText === today.getDate()) {
+ date.classList.add('modal-today');
+ break;
+ }
+ }
+ }
+};
+
+modalrenderCalendar();
+
+const prevMonth2 = () => {
+ calendarDate.setDate(1);
+ calendarDate.setMonth(calendarDate.getMonth() - 1);
+ modalrenderCalendar();
+};
+
+const nextMonth2 = () => {
+ calendarDate.setDate(1);
+ calendarDate.setMonth(calendarDate.getMonth() + 1);
+ modalrenderCalendar();
+};
diff --git a/static/javascript/checklist2.js b/static/javascript/checklist2.js
new file mode 100644
index 0000000..c21ead0
--- /dev/null
+++ b/static/javascript/checklist2.js
@@ -0,0 +1,156 @@
+
+
+//close 버튼 누르면 모달 종료
+function closeModal() {
+ const modalContainer = document.getElementById("modalContainer");
+ modalContainer.style.display = "none";
+}
+
+// 모달 초기화 여부
+var isModalInitialized = false;
+
+// 모달 초기화 함수
+function initializeModal() {
+ if (isModalInitialized) {
+ return;
+ }
+
+ //photo에 있는 사진의 background를 photoimage에 담아 초기 값 주기
+ var mainPhotoBox = document.querySelector('.photo');
+ var photoBox = document.querySelector('.photoImage');
+ var photoBoxStyle = getComputedStyle(mainPhotoBox);
+
+ photoBox.style.backgroundImage = photoBoxStyle.backgroundImage;
+ photoBox.style.backgroundSize = photoBoxStyle.backgroundSize;
+ photoBox.style.backgroundPosition = photoBoxStyle.backgroundPosition;
+ photoBox.style.backgroundRepeat = photoBoxStyle.backgroundRepeat;
+
+ isModalInitialized = true;
+}
+
+// 모달 열기 함수
+function openModal() {
+ const modalContainer = document.getElementById('modalContainer');
+ modalContainer.style.display = 'flex';
+ setTimeout(initializeModal, 0); // 모달이 열린 후에 초기화
+}
+
+
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.checkbox > .first_checkbox');
+ let clicked = false;
+
+ checkbox.addEventListener('click', function () {
+ clicked = !clicked;
+
+ if (clicked) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
+
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.checkbox > .second_checkbox');
+ let clicked = false;
+
+ checkbox.addEventListener('click', function () {
+ clicked = !clicked;
+
+ if (clicked) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
+
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.checkbox > .third_checkbox');
+ let clicked = false;
+
+ checkbox.addEventListener('click', function () {
+ clicked = !clicked;
+
+ if (clicked) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
+
+const items = document.querySelectorAll('.checkbox');
+
+items.forEach(item => {
+ item.addEventListener('click', () => {
+ if (!item.classList.contains('active')) {
+ items.forEach(otherItem => {
+ if (otherItem !== item && otherItem.classList.contains('active')) {
+ otherItem.classList.remove('active');
+ }
+ });
+ item.classList.add('active');
+ } else {
+ item.classList.remove('active');
+ }
+ });
+});
+let clicked1 = false;
+let clicked2 = false;
+let clicked3 = false;
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.modal > #item1');
+
+
+ checkbox.addEventListener('click', function () {
+ clicked1 = !clicked1;
+
+ if (clicked1 && !clicked2 && !clicked3) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
+
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.modal > #item2');
+
+ checkbox.addEventListener('click', function () {
+ clicked2 = !clicked2;
+
+ if (!clicked1 && clicked2 && !clicked3) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
+
+document.addEventListener('DOMContentLoaded', function () {
+ const checkbox = document.querySelector('.modal > #item3');
+
+ checkbox.addEventListener('click', function () {
+ clicked3 = !clicked3;
+
+ if (!clicked1 && !clicked2 && clicked3) {
+ this.style.background = '#5377FF';
+ //cnt올리기?
+ } else {
+ this.style.background = '#FFFFFF';
+ //cnt내리기?
+ }
+ });
+});
\ No newline at end of file
diff --git a/static/javascript/criminal.js b/static/javascript/criminal.js
new file mode 100644
index 0000000..8c60459
--- /dev/null
+++ b/static/javascript/criminal.js
@@ -0,0 +1,124 @@
+function addressKindChange(e) {
+ var seoul = ["구/군 선택",
+ "강남구", "강동구", "강북구", "강서구", "관악구",
+ "광진구", "구로구", "금천구", "노원구", "도봉구",
+ "동대문구", "동작구", "마포구", "서대문구", "서초구",
+ "성동구", "성북구", "송파구", "양천구", "영등포구",
+ "용산구", "은평구", "종로구", "중구", "중랑구"];
+
+ var gyeonggi = ["구/군 선택",
+ "가평군", "고양시", "과천시", "광명시", "광주시",
+ "구리시", "군포시", "김포시", "남양주시", "동두천시",
+ "부천시", "성남시", "수원시", "시흥시", "안산시",
+ "안성시", "안양시", "양주시", "양평군", "여주시",
+ "연천군", "오산시", "용인시", "의왕시", "의정부시",
+ "이천시", "파주시", "평택시", "포천시", "하남시",
+ "화성시"];
+
+ var incheon = ["구/군 선택",
+ "강화군", "계양군", "남동구", "동구", "미추홀구",
+ "부평구", "서구", "연수구", "옹진군", "중구"];
+
+ var gangwon = ["구/군 선택",
+ "강릉시", "고성군", "동해시", "삼척시", "속초시",
+ "양구군", "양양군", "영월군", "원주시", "인제군",
+ "정선군", "철원군", "춘천시", "태백시", "평창군",
+ "홍천군", "화천군", "횡성군"];
+
+ var daejeon = ["구/군 선택",
+ "대덕구", "동구", "서구", "유성구", "중구"];
+
+ var sejong = ["구/군 선택",
+ "고운동", "금남면", "나성동", "다정동", "대평동",
+ "도담동", "반곡동", "부강면", "보람동", "새롬동",
+ "소담동", "소정면", "아름동", "어진동", "연기면",
+ "연동면", "연서면", "장군면", "전동면", "전의면",
+ "조치원읍", "종촌동", "한솔동", "해밀동"];
+
+ var chungnam = ["구/군 선택",
+ "계룡시", "공주시", "금산군", "논산시", "당진시",
+ "보령시", "부여군", "서산시", "서천군", "아산시",
+ "예산군", "천안시", "청양군", "태안군", "홍성군"];
+
+ var chungbuk = ["구/군 선택",
+ "괴산군", "단양군", "보은군", "영동군", "옥천군",
+ "음성군", "제천시", "증평군", "진천군", "청주시",
+ "충주시"];
+
+ var busan = ["구/군 선택",
+ "강서구", "금정구", "기장군", "남구", "동구",
+ "동래구", "부산진구", "북구", "사상구", "사하구",
+ "서구", "수영구", "연제구", "영도구", "중구",
+ "해운대구"];
+
+ var ulsan = ["구/군 선택",
+ "남구", "동구", "북구", "울주군", "중구"];
+
+ var gyeongnam = ["구/군 선택",
+ "거제시", "거창군", "고성군", "김해시", "남해군",
+ "밀양시", "사천시", "산천군", "양산시", "의령군",
+ "진주시", "창녕군", "창원시", "통영시", "하동군",
+ "함안군", "함양군", "합천군"];
+
+ var gyeongbuk = ["구/군 선택",
+ "경산시", "경주시", "고령군", "구미시", "김천시",
+ "문경시", "봉화군", "상주시", "성주군", "안동시",
+ "영덕군", "영양군", "영주시", "영천시", "예천군",
+ "울릉군", "울진군", "의성군", "청도군", "청송군",
+ "칠곡군", "포항시"];
+
+ var daegu = ["구/군 선택",
+ "군위군", "남구", "달서구", "달성군", "동구",
+ "북구", "서구", "수성구", "중구"];
+
+ var gwangju = ["구/군 선택",
+ "광산구", "남구", "동구", "북구", "서구"];
+
+ var jeonnam = ["구/군 선택",
+ "강진군", "고흥군", "곡성군", "광양시", "구례군",
+ "나주시", "담양군", "목포시", "무안군", "보성군",
+ "순천시", "신안군", "여수시", "영광군", "영암군",
+ "완도군", "장성군", "장흥군", "진도군", "함평군",
+ "해남군", "화순군"];
+
+ var jeonbuk = ["구/군 선택",
+ "고창군", "군산시", "김제시", "남원시", "무주군",
+ "부안군", "순창군", "완주군", "익산시", "임실군",
+ "장수군", "전주시", "정읍시", "진안군"];
+
+ var jeju = ["구/군 선택",
+ "구좌읍", "남원읍", "대정읍", "서귀포시", "성산읍",
+ "안덕면", "애월읍", "우도면", "제주시", "조천읍",
+ "추자면", "표선면", "한경면", "한림읍"];
+
+ var target = document.getElementById("Location2");
+
+ if (e.value == "Seoul") var d = seoul;
+ else if (e.value == "Gyeonggi") var d = gyeonggi;
+ else if (e.value == "Incheon") var d = incheon;
+ else if (e.value == "Gangwon") var d = gangwon;
+ else if (e.value == "Daejeon") var d = daejeon;
+ else if (e.value == "Sejong") var d = sejong;
+ else if (e.value == "Chungnam") var d = chungnam;
+ else if (e.value == "Chungbuk") var d = chungbuk;
+ else if (e.value == "Busan") var d = busan;
+ else if (e.value == "Ulsan") var d = ulsan;
+ else if (e.value == "Gyeongnam") var d = gyeongnam;
+ else if (e.value == "Gyeongbuk") var d = gyeongbuk;
+ else if (e.value == "Daegu") var d = daegu;
+ else if (e.value == "Gwangju") var d = gwangju;
+ else if (e.value == "Jeonnam") var d = jeonnam;
+ else if (e.value == "Jeonbuk") var d = jeonbuk;
+ else if (e.value == "Jeju") var d = jeju;
+
+ target.options.length = 0;
+
+ for (x in d) {
+ var opt = document.createElement("option");
+ opt.value = d[x];
+ opt.innerHTML = d[x];
+ target.appendChild(opt);
+ }
+
+ target.options[0].style.display = "none";
+}
\ No newline at end of file
diff --git a/static/javascript/information.js b/static/javascript/information.js
new file mode 100644
index 0000000..50ab796
--- /dev/null
+++ b/static/javascript/information.js
@@ -0,0 +1,124 @@
+function addressKindChange(e){
+ var seoul=["구/군 선택",
+ "강남구", "강동구", "강북구", "강서구", "관악구",
+ "광진구", "구로구", "금천구", "노원구", "도봉구",
+ "동대문구", "동작구", "마포구", "서대문구", "서초구",
+ "성동구", "성북구", "송파구", "양천구", "영등포구",
+ "용산구", "은평구", "종로구", "중구", "중랑구"];
+
+ var gyeonggi = ["구/군 선택",
+ "가평군", "고양시", "과천시", "광명시", "광주시",
+ "구리시", "군포시", "김포시", "남양주시", "동두천시",
+ "부천시", "성남시", "수원시", "시흥시", "안산시",
+ "안성시", "안양시", "양주시", "양평군", "여주시",
+ "연천군", "오산시", "용인시", "의왕시", "의정부시",
+ "이천시", "파주시", "평택시", "포천시", "하남시",
+ "화성시"];
+
+ var incheon = ["구/군 선택",
+ "강화군", "계양군", "남동구", "동구", "미추홀구",
+ "부평구", "서구", "연수구", "옹진군", "중구"];
+
+ var gangwon = ["구/군 선택",
+ "강릉시", "고성군", "동해시", "삼척시", "속초시",
+ "양구군", "양양군", "영월군", "원주시", "인제군",
+ "정선군", "철원군", "춘천시", "태백시", "평창군",
+ "홍천군", "화천군", "횡성군"];
+
+ var daejeon = ["구/군 선택",
+ "대덕구", "동구", "서구", "유성구", "중구"];
+
+ var sejong = ["구/군 선택",
+ "고운동", "금남면", "나성동", "다정동", "대평동",
+ "도담동", "반곡동", "부강면", "보람동", "새롬동",
+ "소담동", "소정면", "아름동", "어진동", "연기면",
+ "연동면", "연서면", "장군면", "전동면", "전의면",
+ "조치원읍", "종촌동", "한솔동", "해밀동"];
+
+ var chungnam = ["구/군 선택",
+ "계룡시", "공주시", "금산군", "논산시", "당진시",
+ "보령시", "부여군", "서산시", "서천군", "아산시",
+ "예산군", "천안시", "청양군", "태안군", "홍성군"];
+
+ var chungbuk = ["구/군 선택",
+ "괴산군", "단양군", "보은군", "영동군", "옥천군",
+ "음성군", "제천시", "증평군", "진천군", "청주시",
+ "충주시"];
+
+ var busan = ["구/군 선택",
+ "강서구", "금정구", "기장군", "남구", "동구",
+ "동래구", "부산진구", "북구", "사상구", "사하구",
+ "서구", "수영구", "연제구", "영도구", "중구",
+ "해운대구"];
+
+ var ulsan = ["구/군 선택",
+ "남구", "동구", "북구", "울주군", "중구"];
+
+ var gyeongnam = ["구/군 선택",
+ "거제시", "거창군", "고성군", "김해시", "남해군",
+ "밀양시", "사천시", "산천군", "양산시", "의령군",
+ "진주시", "창녕군", "창원시", "통영시", "하동군",
+ "함안군", "함양군", "합천군"];
+
+ var gyeongbuk = ["구/군 선택",
+ "경산시", "경주시", "고령군", "구미시", "김천시",
+ "문경시", "봉화군", "상주시", "성주군", "안동시",
+ "영덕군", "영양군", "영주시", "영천시", "예천군",
+ "울릉군", "울진군", "의성군", "청도군", "청송군",
+ "칠곡군", "포항시"];
+
+ var daegu = ["구/군 선택",
+ "군위군", "남구", "달서구", "달성군", "동구",
+ "북구", "서구", "수성구", "중구"];
+
+ var gwangju = ["구/군 선택",
+ "광산구", "남구", "동구", "북구", "서구"];
+
+ var jeonnam = ["구/군 선택",
+ "강진군", "고흥군", "곡성군", "광양시", "구례군",
+ "나주시", "담양군", "목포시", "무안군", "보성군",
+ "순천시", "신안군", "여수시", "영광군", "영암군",
+ "완도군", "장성군", "장흥군", "진도군", "함평군",
+ "해남군", "화순군"];
+
+ var jeonbuk = ["구/군 선택",
+ "고창군", "군산시", "김제시", "남원시", "무주군",
+ "부안군", "순창군", "완주군", "익산시", "임실군",
+ "장수군", "전주시", "정읍시", "진안군"];
+
+ var jeju = ["구/군 선택",
+ "구좌읍", "남원읍", "대정읍", "서귀포시", "성산읍",
+ "안덕면", "애월읍", "우도면", "제주시", "조천읍",
+ "추자면", "표선면", "한경면", "한림읍"];
+
+ var target=document.getElementById("Location2");
+
+ if(e.value=="Seoul") var d=seoul;
+ else if(e.value=="Gyeonggi") var d=gyeonggi;
+ else if(e.value=="Incheon") var d=incheon;
+ else if(e.value=="Gangwon") var d=gangwon;
+ else if(e.value=="Daejeon") var d=daejeon;
+ else if(e.value=="Sejong") var d=sejong;
+ else if(e.value=="Chungnam") var d=chungnam;
+ else if(e.value=="Chungbuk") var d=chungbuk;
+ else if(e.value == "Busan") var d = busan;
+ else if(e.value=="Ulsan") var d=ulsan;
+ else if (e.value == "Gyeongnam") var d = gyeongnam;
+ else if(e.value=="Gyeongbuk") var d=gyeongbuk;
+ else if(e.value=="Daegu") var d=daegu;
+ else if(e.value=="Gwangju") var d=gwangju;
+ else if(e.value=="Jeonnam") var d=jeonnam;
+ else if(e.value=="Jeonbuk") var d=jeonbuk;
+ else if(e.value=="Jeju") var d=jeju;
+
+ target.options.length=0;
+
+ for(x in d){
+ var opt=document.createElement("option");
+ opt.value=d[x];
+ opt.innerHTML=d[x];
+ target.appendChild(opt);
+ }
+
+ target.options[0].style.display = "none";
+}
\ No newline at end of file
diff --git a/static/javascript/login.js b/static/javascript/login.js
deleted file mode 100644
index a3cae11..0000000
--- a/static/javascript/login.js
+++ /dev/null
@@ -1,6 +0,0 @@
-const saveUser = document.getElementById("saveUser");
-const saveLogin = document.getElementById("saveLogin");
-
-saveUser.addEventListener("click", function () {
- saveLogin.checked = !saveLogin.checked;
-});
\ No newline at end of file
diff --git a/static/javascript/ourtown.js b/static/javascript/ourtown.js
new file mode 100644
index 0000000..8c60459
--- /dev/null
+++ b/static/javascript/ourtown.js
@@ -0,0 +1,124 @@
+function addressKindChange(e) {
+ var seoul = ["구/군 선택",
+ "강남구", "강동구", "강북구", "강서구", "관악구",
+ "광진구", "구로구", "금천구", "노원구", "도봉구",
+ "동대문구", "동작구", "마포구", "서대문구", "서초구",
+ "성동구", "성북구", "송파구", "양천구", "영등포구",
+ "용산구", "은평구", "종로구", "중구", "중랑구"];
+
+ var gyeonggi = ["구/군 선택",
+ "가평군", "고양시", "과천시", "광명시", "광주시",
+ "구리시", "군포시", "김포시", "남양주시", "동두천시",
+ "부천시", "성남시", "수원시", "시흥시", "안산시",
+ "안성시", "안양시", "양주시", "양평군", "여주시",
+ "연천군", "오산시", "용인시", "의왕시", "의정부시",
+ "이천시", "파주시", "평택시", "포천시", "하남시",
+ "화성시"];
+
+ var incheon = ["구/군 선택",
+ "강화군", "계양군", "남동구", "동구", "미추홀구",
+ "부평구", "서구", "연수구", "옹진군", "중구"];
+
+ var gangwon = ["구/군 선택",
+ "강릉시", "고성군", "동해시", "삼척시", "속초시",
+ "양구군", "양양군", "영월군", "원주시", "인제군",
+ "정선군", "철원군", "춘천시", "태백시", "평창군",
+ "홍천군", "화천군", "횡성군"];
+
+ var daejeon = ["구/군 선택",
+ "대덕구", "동구", "서구", "유성구", "중구"];
+
+ var sejong = ["구/군 선택",
+ "고운동", "금남면", "나성동", "다정동", "대평동",
+ "도담동", "반곡동", "부강면", "보람동", "새롬동",
+ "소담동", "소정면", "아름동", "어진동", "연기면",
+ "연동면", "연서면", "장군면", "전동면", "전의면",
+ "조치원읍", "종촌동", "한솔동", "해밀동"];
+
+ var chungnam = ["구/군 선택",
+ "계룡시", "공주시", "금산군", "논산시", "당진시",
+ "보령시", "부여군", "서산시", "서천군", "아산시",
+ "예산군", "천안시", "청양군", "태안군", "홍성군"];
+
+ var chungbuk = ["구/군 선택",
+ "괴산군", "단양군", "보은군", "영동군", "옥천군",
+ "음성군", "제천시", "증평군", "진천군", "청주시",
+ "충주시"];
+
+ var busan = ["구/군 선택",
+ "강서구", "금정구", "기장군", "남구", "동구",
+ "동래구", "부산진구", "북구", "사상구", "사하구",
+ "서구", "수영구", "연제구", "영도구", "중구",
+ "해운대구"];
+
+ var ulsan = ["구/군 선택",
+ "남구", "동구", "북구", "울주군", "중구"];
+
+ var gyeongnam = ["구/군 선택",
+ "거제시", "거창군", "고성군", "김해시", "남해군",
+ "밀양시", "사천시", "산천군", "양산시", "의령군",
+ "진주시", "창녕군", "창원시", "통영시", "하동군",
+ "함안군", "함양군", "합천군"];
+
+ var gyeongbuk = ["구/군 선택",
+ "경산시", "경주시", "고령군", "구미시", "김천시",
+ "문경시", "봉화군", "상주시", "성주군", "안동시",
+ "영덕군", "영양군", "영주시", "영천시", "예천군",
+ "울릉군", "울진군", "의성군", "청도군", "청송군",
+ "칠곡군", "포항시"];
+
+ var daegu = ["구/군 선택",
+ "군위군", "남구", "달서구", "달성군", "동구",
+ "북구", "서구", "수성구", "중구"];
+
+ var gwangju = ["구/군 선택",
+ "광산구", "남구", "동구", "북구", "서구"];
+
+ var jeonnam = ["구/군 선택",
+ "강진군", "고흥군", "곡성군", "광양시", "구례군",
+ "나주시", "담양군", "목포시", "무안군", "보성군",
+ "순천시", "신안군", "여수시", "영광군", "영암군",
+ "완도군", "장성군", "장흥군", "진도군", "함평군",
+ "해남군", "화순군"];
+
+ var jeonbuk = ["구/군 선택",
+ "고창군", "군산시", "김제시", "남원시", "무주군",
+ "부안군", "순창군", "완주군", "익산시", "임실군",
+ "장수군", "전주시", "정읍시", "진안군"];
+
+ var jeju = ["구/군 선택",
+ "구좌읍", "남원읍", "대정읍", "서귀포시", "성산읍",
+ "안덕면", "애월읍", "우도면", "제주시", "조천읍",
+ "추자면", "표선면", "한경면", "한림읍"];
+
+ var target = document.getElementById("Location2");
+
+ if (e.value == "Seoul") var d = seoul;
+ else if (e.value == "Gyeonggi") var d = gyeonggi;
+ else if (e.value == "Incheon") var d = incheon;
+ else if (e.value == "Gangwon") var d = gangwon;
+ else if (e.value == "Daejeon") var d = daejeon;
+ else if (e.value == "Sejong") var d = sejong;
+ else if (e.value == "Chungnam") var d = chungnam;
+ else if (e.value == "Chungbuk") var d = chungbuk;
+ else if (e.value == "Busan") var d = busan;
+ else if (e.value == "Ulsan") var d = ulsan;
+ else if (e.value == "Gyeongnam") var d = gyeongnam;
+ else if (e.value == "Gyeongbuk") var d = gyeongbuk;
+ else if (e.value == "Daegu") var d = daegu;
+ else if (e.value == "Gwangju") var d = gwangju;
+ else if (e.value == "Jeonnam") var d = jeonnam;
+ else if (e.value == "Jeonbuk") var d = jeonbuk;
+ else if (e.value == "Jeju") var d = jeju;
+
+ target.options.length = 0;
+
+ for (x in d) {
+ var opt = document.createElement("option");
+ opt.value = d[x];
+ opt.innerHTML = d[x];
+ target.appendChild(opt);
+ }
+
+ target.options[0].style.display = "none";
+}
\ No newline at end of file
diff --git a/static/javascript/profile.js b/static/javascript/profile.js
new file mode 100644
index 0000000..f062b7f
--- /dev/null
+++ b/static/javascript/profile.js
@@ -0,0 +1,230 @@
+var isEditClicked=false;
+
+//수정 버튼
+function editClick() {
+ isEditClicked = true;
+
+ //수정 버튼 숨기기
+ var editButton = document.getElementById('edit');
+ editButton.style.display = 'none';
+
+ // 숨기기
+ var explainText = document.getElementById('explaintext');
+ explainText.style.display = 'none';
+
+ //input 박스 생성
+ var inputBox = document.createElement('input');
+ inputBox.type = 'text';
+ inputBox.value = explainText.textContent;
+ inputBox.id = 'explaintext';
+ inputBox.className = 'input-box';
+
+ inputBox.onclick = function (event) {
+ event.stopPropagation();
+ };
+
+ //새로운 내용 입력
+ var explainBox2 = document.querySelector('.ExplainContainer2');
+ explainBox2.appendChild(inputBox);
+
+ //수정 전 내용 제거
+ explainBox2.removeChild(explainText); //소개글 완료
+
+ var profileText = document.getElementById('uname');
+ profileText.style.display = 'none';
+
+ var inputBox2 = document.createElement('input');
+ inputBox2.type = 'text';
+ inputBox2.value = profileText.textContent;
+ inputBox2.id = 'uname';
+ inputBox2.className = 'input-box2';
+
+ var emailBox = document.querySelector('.emailbox');
+ emailBox.style.marginTop = '20%';
+
+ inputBox2.onclick = function (event) {
+ event.stopPropagation();
+ };
+
+ var profileBox = document.querySelector('.profilebox');
+ profileBox.appendChild(inputBox2);
+
+ profileBox.removeChild(profileText); //같은 방식으로 닉네임 완료
+}
+
+//사진 수정 버튼 누르면 실행
+function rephotoButtonClickHandler() {
+ if (!isEditClicked) {
+ return; // 수정 버튼을 누르지 않은 경우 작동 안됨
+ }
+ openModal();
+}
+
+//수정 버튼 클릭 이벤트
+document.addEventListener('DOMContentLoaded', function() {
+ var editButton = document.getElementById('edit');
+ editButton.onclick = function() {
+ editClick();
+ };
+ });
+
+
+//사진 수정 버튼 클릭 이벤트
+var rephotoButton = document.getElementById('rephoto');
+rephotoButton.onclick = function () {
+ if (isEditClicked) {
+ rephotoButtonClickHandler();
+ }
+};
+
+//수정 완료 버튼
+function saveClick() {
+ //input박스에 입력한 내용 가져오기
+ var inputBox = document.getElementById('explaintext');
+ var inputValue = inputBox.value;
+
+ //값이 비어있는지 확인
+ if (inputValue.trim() === '') {
+ return;
+ }
+
+ //입력 내용을 출력할 요소
로 설정
+ var explainBox2 = document.querySelector('.ExplainContainer2');
+
+ var pElement = document.createElement('p');
+ pElement.id = 'explaintext';
+ pElement.textContent = inputValue;
+ pElement.style.textAlign = 'right';
+
+ //수정 버튼 화면에 표시
+ var editButton = document.getElementById('edit');
+ editButton.style.display = 'block';
+
+ //완료 버튼 화면에 표시
+ var saveButton = document.getElementById('save');
+ saveButton.style.display = 'block';
+
+ //기존 맨 처음 출력된 요소 제거
+ var existingPElement = document.getElementById('explaintext');
+ if (existingPElement) {
+ explainBox2.removeChild(existingPElement);
+ }
+
+ //새로운 요소 출력
+ explainBox2.appendChild(pElement);
+
+ explainBox2.style.justifyContent = 'flex-end'; //소개글 수정 완료
+
+ var inputBox2 = document.getElementById('uname');
+ var inputValue2 = inputBox2.value;
+
+ if (inputValue2.trim() === '') {
+ return;
+ }
+
+ var profileBox = document.querySelector('.profilebox');
+
+ var pElement2 = document.createElement('p');
+ pElement2.id = 'uname';
+ pElement2.textContent = inputValue2;
+ pElement2.className='input-box3';
+
+ var existingPElement2 = document.getElementById('uname');
+ if (existingPElement2) {
+ profileBox.removeChild(existingPElement2);
+ }
+
+ profileBox.appendChild(pElement2);
+ profileBox.style.justifyContent = 'flex-end'; //같은 방식으로 닉네임 수정 완료
+
+ //바뀐 닉네임을 왼쪽 userbox 프로필에도 결과 출력
+ var profileId = document.querySelector('.name');
+ profileId.textContent = inputValue2;
+
+ //바뀐 소개글을 왼쪽 userbox 프로필에도 결과 출력
+ var profileExplain = document.querySelector('.explain');
+ profileExplain.textContent = inputValue;
+
+ //프로필 이미지를 profile 박스와 왼쪽 프로필 둘 다 변경
+ var mainPhotoBox = document.querySelector('.photo');
+ var userImageBox = document.querySelector('.userImage');
+ var uploadedPhotoUrl = mainPhotoBox.style.backgroundImage;
+
+ mainPhotoBox.style.backgroundImage = uploadedPhotoUrl;
+ mainPhotoBox.style.backgroundSize = 'cover';
+ mainPhotoBox.style.backgroundPosition = 'center';
+ mainPhotoBox.style.backgroundRepeat = 'no-repeat';
+
+ userImageBox.style.backgroundImage = uploadedPhotoUrl;
+ userImageBox.style.backgroundSize = 'cover';
+ userImageBox.style.backgroundPosition = 'center';
+ userImageBox.style.backgroundRepeat = 'no-repeat';
+
+ isEditClicked=false;
+}
+
+//close 버튼 누르면 모달 종료
+function closeModal() {
+ const modalContainer = document.getElementById("modalContainer");
+ modalContainer.style.display = "none";
+}
+
+// 모달 초기화 여부
+var isModalInitialized = false;
+
+// 모달 초기화 함수
+function initializeModal() {
+ if (isModalInitialized) {
+ return;
+ }
+
+ //photo에 있는 사진의 background를 photoimage에 담아 초기 값 주기
+ var mainPhotoBox = document.querySelector('.photo');
+ var photoBox = document.querySelector('.photoImage');
+ var photoBoxStyle = getComputedStyle(mainPhotoBox);
+
+ photoBox.style.backgroundImage = photoBoxStyle.backgroundImage;
+ photoBox.style.backgroundSize = photoBoxStyle.backgroundSize;
+ photoBox.style.backgroundPosition = photoBoxStyle.backgroundPosition;
+ photoBox.style.backgroundRepeat = photoBoxStyle.backgroundRepeat;
+
+ isModalInitialized = true;
+}
+
+// 모달 열기 함수
+function openModal() {
+ const modalContainer = document.getElementById('modalContainer');
+ modalContainer.style.display = 'flex';
+ setTimeout(initializeModal, 0); // 모달이 열린 후에 초기화
+}
+
+//사진 업로드 이벤트 -> input
+function handleFileUpload(event) {
+ var file = event.target.files[0];
+ var reader = new FileReader();
+
+ reader.onload = function (e) {
+ var photoBox = document.querySelector('.photoImage');
+ photoBox.style.backgroundImage = `url(${e.target.result})`;
+ photoBox.style.backgroundSize = 'cover';
+ photoBox.style.backgroundPosition = 'center';
+ photoBox.style.backgroundRepeat = 'no-repeat';
+
+ var modalContainer = document.querySelector('.modal-container');
+ var closeButton = modalContainer.querySelector('#close');
+
+ // 이전에 등록된 이벤트 리스너 제거
+ closeButton.removeEventListener('click', closeModal);
+
+ // 닫기 버튼을 누르면 modal에서 업로드한 사진을 photo에 넣어줌
+ closeButton.addEventListener('click', function () {
+ modalContainer.style.display = 'none';
+ var mainPhotoBox = document.querySelector('.photo');
+ mainPhotoBox.style.backgroundImage = `url(${e.target.result})`;
+ mainPhotoBox.style.backgroundSize = 'cover';
+ mainPhotoBox.style.backgroundPosition = 'center';
+ mainPhotoBox.style.backgroundRepeat = 'no-repeat';
+ });
+ };
+ reader.readAsDataURL(file);
+}
diff --git a/static/javascript/review.js b/static/javascript/review.js
new file mode 100644
index 0000000..8c60459
--- /dev/null
+++ b/static/javascript/review.js
@@ -0,0 +1,124 @@
+function addressKindChange(e) {
+ var seoul = ["구/군 선택",
+ "강남구", "강동구", "강북구", "강서구", "관악구",
+ "광진구", "구로구", "금천구", "노원구", "도봉구",
+ "동대문구", "동작구", "마포구", "서대문구", "서초구",
+ "성동구", "성북구", "송파구", "양천구", "영등포구",
+ "용산구", "은평구", "종로구", "중구", "중랑구"];
+
+ var gyeonggi = ["구/군 선택",
+ "가평군", "고양시", "과천시", "광명시", "광주시",
+ "구리시", "군포시", "김포시", "남양주시", "동두천시",
+ "부천시", "성남시", "수원시", "시흥시", "안산시",
+ "안성시", "안양시", "양주시", "양평군", "여주시",
+ "연천군", "오산시", "용인시", "의왕시", "의정부시",
+ "이천시", "파주시", "평택시", "포천시", "하남시",
+ "화성시"];
+
+ var incheon = ["구/군 선택",
+ "강화군", "계양군", "남동구", "동구", "미추홀구",
+ "부평구", "서구", "연수구", "옹진군", "중구"];
+
+ var gangwon = ["구/군 선택",
+ "강릉시", "고성군", "동해시", "삼척시", "속초시",
+ "양구군", "양양군", "영월군", "원주시", "인제군",
+ "정선군", "철원군", "춘천시", "태백시", "평창군",
+ "홍천군", "화천군", "횡성군"];
+
+ var daejeon = ["구/군 선택",
+ "대덕구", "동구", "서구", "유성구", "중구"];
+
+ var sejong = ["구/군 선택",
+ "고운동", "금남면", "나성동", "다정동", "대평동",
+ "도담동", "반곡동", "부강면", "보람동", "새롬동",
+ "소담동", "소정면", "아름동", "어진동", "연기면",
+ "연동면", "연서면", "장군면", "전동면", "전의면",
+ "조치원읍", "종촌동", "한솔동", "해밀동"];
+
+ var chungnam = ["구/군 선택",
+ "계룡시", "공주시", "금산군", "논산시", "당진시",
+ "보령시", "부여군", "서산시", "서천군", "아산시",
+ "예산군", "천안시", "청양군", "태안군", "홍성군"];
+
+ var chungbuk = ["구/군 선택",
+ "괴산군", "단양군", "보은군", "영동군", "옥천군",
+ "음성군", "제천시", "증평군", "진천군", "청주시",
+ "충주시"];
+
+ var busan = ["구/군 선택",
+ "강서구", "금정구", "기장군", "남구", "동구",
+ "동래구", "부산진구", "북구", "사상구", "사하구",
+ "서구", "수영구", "연제구", "영도구", "중구",
+ "해운대구"];
+
+ var ulsan = ["구/군 선택",
+ "남구", "동구", "북구", "울주군", "중구"];
+
+ var gyeongnam = ["구/군 선택",
+ "거제시", "거창군", "고성군", "김해시", "남해군",
+ "밀양시", "사천시", "산천군", "양산시", "의령군",
+ "진주시", "창녕군", "창원시", "통영시", "하동군",
+ "함안군", "함양군", "합천군"];
+
+ var gyeongbuk = ["구/군 선택",
+ "경산시", "경주시", "고령군", "구미시", "김천시",
+ "문경시", "봉화군", "상주시", "성주군", "안동시",
+ "영덕군", "영양군", "영주시", "영천시", "예천군",
+ "울릉군", "울진군", "의성군", "청도군", "청송군",
+ "칠곡군", "포항시"];
+
+ var daegu = ["구/군 선택",
+ "군위군", "남구", "달서구", "달성군", "동구",
+ "북구", "서구", "수성구", "중구"];
+
+ var gwangju = ["구/군 선택",
+ "광산구", "남구", "동구", "북구", "서구"];
+
+ var jeonnam = ["구/군 선택",
+ "강진군", "고흥군", "곡성군", "광양시", "구례군",
+ "나주시", "담양군", "목포시", "무안군", "보성군",
+ "순천시", "신안군", "여수시", "영광군", "영암군",
+ "완도군", "장성군", "장흥군", "진도군", "함평군",
+ "해남군", "화순군"];
+
+ var jeonbuk = ["구/군 선택",
+ "고창군", "군산시", "김제시", "남원시", "무주군",
+ "부안군", "순창군", "완주군", "익산시", "임실군",
+ "장수군", "전주시", "정읍시", "진안군"];
+
+ var jeju = ["구/군 선택",
+ "구좌읍", "남원읍", "대정읍", "서귀포시", "성산읍",
+ "안덕면", "애월읍", "우도면", "제주시", "조천읍",
+ "추자면", "표선면", "한경면", "한림읍"];
+
+ var target = document.getElementById("Location2");
+
+ if (e.value == "Seoul") var d = seoul;
+ else if (e.value == "Gyeonggi") var d = gyeonggi;
+ else if (e.value == "Incheon") var d = incheon;
+ else if (e.value == "Gangwon") var d = gangwon;
+ else if (e.value == "Daejeon") var d = daejeon;
+ else if (e.value == "Sejong") var d = sejong;
+ else if (e.value == "Chungnam") var d = chungnam;
+ else if (e.value == "Chungbuk") var d = chungbuk;
+ else if (e.value == "Busan") var d = busan;
+ else if (e.value == "Ulsan") var d = ulsan;
+ else if (e.value == "Gyeongnam") var d = gyeongnam;
+ else if (e.value == "Gyeongbuk") var d = gyeongbuk;
+ else if (e.value == "Daegu") var d = daegu;
+ else if (e.value == "Gwangju") var d = gwangju;
+ else if (e.value == "Jeonnam") var d = jeonnam;
+ else if (e.value == "Jeonbuk") var d = jeonbuk;
+ else if (e.value == "Jeju") var d = jeju;
+
+ target.options.length = 0;
+
+ for (x in d) {
+ var opt = document.createElement("option");
+ opt.value = d[x];
+ opt.innerHTML = d[x];
+ target.appendChild(opt);
+ }
+
+ target.options[0].style.display = "none";
+}
\ No newline at end of file
diff --git a/static/javascript/write.js b/static/javascript/write.js
new file mode 100644
index 0000000..e67d6ca
--- /dev/null
+++ b/static/javascript/write.js
@@ -0,0 +1,68 @@
+const modal = document.getElementById("modal");
+const openModalBtn = document.getElementById("open-modal");
+const closeModalBtn = document.getElementById("close-modal");
+const form = document.querySelector('form');
+const submitButton = document.getElementById('submitButton');
+const fileInput = document.getElementById('bizFile');
+const textBox = document.getElementById('textareaContainer');
+
+// 모달창 열기
+openModalBtn.addEventListener("click", (event) => {
+ event.preventDefault(); // 폼 제출 방지
+ modal.style.display = "block";
+});
+
+// 모달창 닫기
+closeModalBtn.addEventListener("click", () => {
+ modal.style.display = "none";
+ setTimeout(handleFileUpload, 0); // 모달 닫힌 후에 이미지 처리
+});
+
+// 폼 제출 이벤트 핸들러
+form.addEventListener('submit', (event) => {
+ event.preventDefault();
+});
+
+// 등록하기 버튼 클릭 이벤트 핸들러
+submitButton.addEventListener('click', () => {
+ form.submit(); // 폼 제출
+});
+
+// 사진 업로드 커스텀 버튼 기능
+fileInput.addEventListener('change', function () {
+ const filename = document.getElementById('fileName');
+ if (this.files[0] == undefined) {
+ filename.innerText = '선택된 파일 없음';
+ return;
+ }
+ filename.innerText = this.files[0].name;
+});
+
+// 이미지 파일 업로드 시 처리
+function handleFileUpload() {
+ const file = fileInput.files[0];
+ const reader = new FileReader();
+
+ reader.onload = function (e) {
+ const imageSrc = e.target.result;
+ const imageElement = document.createElement("img");
+ imageElement.src = imageSrc;
+ textBox.appendChild(imageElement);
+
+ // 캐럿(커서) 위치를 마지막으로 이동
+ textBox.focus();
+ const range = document.createRange();
+ range.selectNodeContents(textBox);
+ range.collapse(false);
+ const selection = window.getSelection();
+ selection.removeAllRanges();
+ selection.addRange(range);
+ };
+
+ if (file) {
+ reader.readAsDataURL(file);
+ }
+}
+
+// 파일 업로드 이벤트 처리
+fileInput.addEventListener("change", handleFileUpload);
diff --git a/templates/.DS_Store b/templates/.DS_Store
new file mode 100644
index 0000000..4591c7d
Binary files /dev/null and b/templates/.DS_Store differ
diff --git a/templates/accounts/login.html b/templates/accounts/login.html
deleted file mode 100644
index 9a049fc..0000000
--- a/templates/accounts/login.html
+++ /dev/null
@@ -1,64 +0,0 @@
-
-
-
-
-
-
-
- LisaMate
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/templates/accounts/login2.html b/templates/accounts/login2.html
new file mode 100644
index 0000000..ee4fe6c
--- /dev/null
+++ b/templates/accounts/login2.html
@@ -0,0 +1,63 @@
+
+
+
+
+
+
+ LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
Hello
+
LISA MATE
+
나의 이사메이트 리사.
+
+
+
+
+
+
Hello
+
LISA MATE
+
나의 이사메이트 리사.
+
+
+
+
LISA MATE
-
-
-
-
-
-
-
-
-
-
-
- USER
-
-
-
아기사자 33
-
LIKEALION@333
-
이사 준비 중입니다!
-
-
-
Schedule
-
-
-
-
\ No newline at end of file
diff --git a/templates/basic2.html b/templates/basic2.html
new file mode 100644
index 0000000..0082e83
--- /dev/null
+++ b/templates/basic2.html
@@ -0,0 +1,126 @@
+
+
+
+
+
+ LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
Checklist
+
|
+
Calendar
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
일
+
월
+
화
+
수
+
목
+
금
+
토
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
일
+
월
+
화
+
수
+
목
+
금
+
토
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/checklist.html b/templates/checklist.html
new file mode 100644
index 0000000..9156500
--- /dev/null
+++ b/templates/checklist.html
@@ -0,0 +1,240 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
부기의
이사 체크리스트
+
+
Lisa가 추천하는 기본 체크리스트 항목
+
부기가 추천하는 기본 체크리스트 항목
+
나의 추가 체크리스트 항목
+
+
+
+
+
이사확정후
+
+
이사직전
+
+
이사당일
+
+
+
+
+
+
+
+
+
+
+
+
+
+
직접 추가하기
+
작성 내용
+
+
날짜 선택
+
+
+
+
+
+
+
+
+
기간 지정
+
이사전
+
이사중
+
이사후
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/criminal.html b/templates/criminal.html
new file mode 100644
index 0000000..58c4ed4
--- /dev/null
+++ b/templates/criminal.html
@@ -0,0 +1,238 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
LISA
+
MATE
+
+
Move Checklist Service
+
+
+
나의 이사메이트 리사.
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
+
정보 게시판
+
후기 게시판
+
|
+
우리동네 게시판
+
+
+
+
+
+
우리동네 게시판
+
우리동네 게시판 > 범죄자 거주정보 > 미리미리 예방합시다!
+
+
+
+
+
Topic
+
제목
+
작성자
+
작성일
+
조회
+
+
+
+
+
공지
+
+
LISA MATE 리사 메이트 이용안내 - 나의 이사메이트 리사.
+
[892]
+
+
+
+
+
+
+
+
페이징?
+
+
+
+
\ No newline at end of file
diff --git a/templates/information.html b/templates/information.html
new file mode 100644
index 0000000..6fd1b57
--- /dev/null
+++ b/templates/information.html
@@ -0,0 +1,230 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
LISA
+
MATE
+
+
Move Checklist Service
+
+
+
나의 이사메이트 리사.
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
+
정보 게시판
+
후기 게시판
+
|
+
우리동네 게시판
+
+
+
+
+
+
정보 게시판
+
정보 게시판 & 후기 게시판 & 우리동네 게시판
+
+
+
+
+
Topic
+
제목
+
작성자
+
작성일
+
조회
+
+
+
+
+
공지
+
+
LISA MATE 리사 메이트 이용안내 - 나의 이사메이트 리사.
+
[892]
+
+
+
+
+
+
+
+
+
+
oo동 월세 너무 비싸네요ㅠㅠ
+
[1]
+
+
+
+
+
+
페이징?
+
+
+
+
\ No newline at end of file
diff --git a/templates/mypage.html b/templates/mypage.html
index c8c7e78..69bba48 100644
--- a/templates/mypage.html
+++ b/templates/mypage.html
@@ -5,9 +5,9 @@
LisaMate
-
+
-
+
diff --git a/templates/ourtown.html b/templates/ourtown.html
new file mode 100644
index 0000000..00a8bf4
--- /dev/null
+++ b/templates/ourtown.html
@@ -0,0 +1,254 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
LISA
+
MATE
+
+
Move Checklist Service
+
+
+
나의 이사메이트 리사.
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
+
정보 게시판
+
후기 게시판
+
|
+
우리동네 게시판
+
+
+
+
+
+
우리동네 게시판
+
우리동네 게시판 > 현황 게시판 > 우리동네는 지금 무슨 일이?
+
+
+
+
+
Topic
+
제목
+
작성자
+
작성일
+
조회
+
+
+
+
+
공지
+
+
LISA MATE 리사 메이트 이용안내 - 나의 이사메이트 리사.
+
[892]
+
+
+
+
+
+
+
+
+
+
+
oo동 앞 산책하기 좋은 장소
+
[10]
+
+
아기사자 33
+
+
+
+
+
+
oo동 앞 산책하기 좋은 장소
+
[10]
+
+
아기사자 33
+
+
+
+
+
+
oo동 앞 산책하기 좋은 장소
+
[10]
+
+
아기사자 33
+
+
+
+
페이징?
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/profile.html b/templates/profile.html
new file mode 100644
index 0000000..5e8815e
--- /dev/null
+++ b/templates/profile.html
@@ -0,0 +1,168 @@
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/review.html b/templates/review.html
new file mode 100644
index 0000000..579ad57
--- /dev/null
+++ b/templates/review.html
@@ -0,0 +1,231 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
+
LISA
+
MATE
+
+
Move Checklist Service
+
+
+
나의 이사메이트 리사.
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
+
정보 게시판
+
후기 게시판
+
|
+
우리동네 게시판
+
+
+
+
+
+
후기 게시판
+
정확하고 솔직한 후기를 확인해보세요!
+
+
+
+
+
Topic
+
제목
+
작성자
+
작성일
+
조회
+
+
+
+
+
공지
+
+
LISA MATE 리사 메이트 이용안내 - 나의 이사메이트 리사.
+
[892]
+
+
+
+
+
+
+
+
+
+
oo동 월세 너무 비싸네요ㅠㅠ
+
[1]
+
+
+
+
+
+
페이징?
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/write.html b/templates/write.html
new file mode 100644
index 0000000..02581de
--- /dev/null
+++ b/templates/write.html
@@ -0,0 +1,192 @@
+
+
+
+
+
+
+
LisaMate
+
+
+
+
+
+
+
+
+
+
+
LISA
+
MATE
+
+
Move Checklist Service
+
+
+
나의 이사메이트 리사.
+
+
+
+
+
+
USER
+
+
+
아기사자 33
+
LIKEALION@333
+
이사 준비 중입니다!
+
+
+
+
+
+
Schedule
+
+
+
+
+
+
+
+
+
글쓰기
+
정보 게시판 & 후기 게시판 & 우리동네 게시판
+
+
+
+
+
+
+
+
+
사진 첨부
+
+
+
+
또는
이곳에 사진 파일을
끌어놓으세요.
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/users/.DS_Store b/users/.DS_Store
index e6dfc64..f7d95e4 100644
Binary files a/users/.DS_Store and b/users/.DS_Store differ
diff --git a/users/__pycache__/__init__.cpython-311.pyc b/users/__pycache__/__init__.cpython-311.pyc
index bf39127..d5567fd 100644
Binary files a/users/__pycache__/__init__.cpython-311.pyc and b/users/__pycache__/__init__.cpython-311.pyc differ
diff --git a/users/__pycache__/admin.cpython-311.pyc b/users/__pycache__/admin.cpython-311.pyc
index cdc0c88..1b0d45e 100644
Binary files a/users/__pycache__/admin.cpython-311.pyc and b/users/__pycache__/admin.cpython-311.pyc differ
diff --git a/users/__pycache__/backends.cpython-311.pyc b/users/__pycache__/backends.cpython-311.pyc
new file mode 100644
index 0000000..17582ec
Binary files /dev/null and b/users/__pycache__/backends.cpython-311.pyc differ
diff --git a/users/__pycache__/models.cpython-311.pyc b/users/__pycache__/models.cpython-311.pyc
index 89b98cf..015ea50 100644
Binary files a/users/__pycache__/models.cpython-311.pyc and b/users/__pycache__/models.cpython-311.pyc differ
diff --git a/users/admin.py b/users/admin.py
index ce3c760..8ccd624 100644
--- a/users/admin.py
+++ b/users/admin.py
@@ -1,6 +1,9 @@
from django.contrib import admin
-from .models import User
+from django.contrib.auth.admin import UserAdmin
+from users.models import User
-@admin.register(User)
-class UserModelAdmin(admin.ModelAdmin):
- pass
+class UsersAdmin(admin.ModelAdmin):
+ list_display = ('id', 'nickname', 'email', 'image', 'introduction')
+ fields = ('nickname', 'email', 'password')
+
+admin.site.register(User, UsersAdmin)
\ No newline at end of file
diff --git a/users/backends.py b/users/backends.py
new file mode 100644
index 0000000..170e1a4
--- /dev/null
+++ b/users/backends.py
@@ -0,0 +1,21 @@
+from django.contrib.auth.backends import BaseBackend
+from django.contrib.auth import get_user_model
+
+UserModel = get_user_model()
+
+class EmailBackend(BaseBackend):
+ def authenticate(self, email=None, password=None):
+ try:
+ user = UserModel.objects.get(email=email)
+ except UserModel.DoesNotExist:
+ return None
+ else:
+ if user.check_password(password):
+ return user
+ return None
+
+ def get_user(self, user_id):
+ try:
+ return UserModel.objects.get(pk=user_id)
+ except UserModel.DoesNotExist:
+ return None
diff --git a/users/migrations/0001_initial.py b/users/migrations/0001_initial.py
index c40a276..c56f0d3 100644
--- a/users/migrations/0001_initial.py
+++ b/users/migrations/0001_initial.py
@@ -1,9 +1,9 @@
-# Generated by Django 4.2.1 on 2023-06-30 19:45
+# Generated by Django 4.2.1 on 2023-07-10 02:28
-import django.contrib.auth.models
import django.contrib.auth.validators
from django.db import migrations, models
import django.utils.timezone
+import users.models
class Migration(migrations.Migration):
@@ -18,6 +18,7 @@ class Migration(migrations.Migration):
migrations.CreateModel(
name='User',
fields=[
+ ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('password', models.CharField(max_length=128, verbose_name='password')),
('last_login', models.DateTimeField(blank=True, null=True, verbose_name='last login')),
('is_superuser', models.BooleanField(default=False, help_text='Designates that this user has all permissions without explicitly assigning them.', verbose_name='superuser status')),
@@ -27,9 +28,10 @@ class Migration(migrations.Migration):
('is_staff', models.BooleanField(default=False, help_text='Designates whether the user can log into this admin site.', verbose_name='staff status')),
('is_active', models.BooleanField(default=True, help_text='Designates whether this user should be treated as active. Unselect this instead of deleting accounts.', verbose_name='active')),
('date_joined', models.DateTimeField(default=django.utils.timezone.now, verbose_name='date joined')),
- ('id', models.CharField(max_length=20, primary_key=True, serialize=False, verbose_name='id')),
- ('email', models.CharField(max_length=20, verbose_name='email')),
- ('introduce', models.TextField(verbose_name='introduce')),
+ ('email', models.EmailField(max_length=254, unique=True)),
+ ('nickname', models.CharField(default='no nickname', max_length=255, verbose_name='닉네임')),
+ ('image', models.ImageField(blank=True, null=True, upload_to='image/', verbose_name='이미지')),
+ ('introduction', models.TextField(default='소개글을 입력하세요.', verbose_name='소개글')),
('groups', models.ManyToManyField(blank=True, help_text='The groups this user belongs to. A user will get all permissions granted to each of their groups.', related_name='user_set', related_query_name='user', to='auth.group', verbose_name='groups')),
('user_permissions', models.ManyToManyField(blank=True, help_text='Specific permissions for this user.', related_name='user_set', related_query_name='user', to='auth.permission', verbose_name='user permissions')),
],
@@ -39,7 +41,7 @@ class Migration(migrations.Migration):
'abstract': False,
},
managers=[
- ('objects', django.contrib.auth.models.UserManager()),
+ ('objects', users.models.UserManager()),
],
),
]
diff --git a/users/migrations/0002_remove_user_introduce_user_introduction_and_more.py b/users/migrations/0002_remove_user_introduce_user_introduction_and_more.py
deleted file mode 100644
index cf6608e..0000000
--- a/users/migrations/0002_remove_user_introduce_user_introduction_and_more.py
+++ /dev/null
@@ -1,32 +0,0 @@
-# Generated by Django 4.2.1 on 2023-07-01 01:43
-
-from django.db import migrations, models
-
-
-class Migration(migrations.Migration):
-
- dependencies = [
- ('users', '0001_initial'),
- ]
-
- operations = [
- migrations.RemoveField(
- model_name='user',
- name='introduce',
- ),
- migrations.AddField(
- model_name='user',
- name='introduction',
- field=models.TextField(default='소개글을 입력하세요.', verbose_name='introduction'),
- ),
- migrations.AlterField(
- model_name='user',
- name='email',
- field=models.EmailField(max_length=254, unique=True, verbose_name='email'),
- ),
- migrations.AlterField(
- model_name='user',
- name='id',
- field=models.CharField(max_length=20, primary_key=True, serialize=False, unique=True),
- ),
- ]
diff --git a/users/migrations/0003_alter_user_id.py b/users/migrations/0003_alter_user_id.py
deleted file mode 100644
index 94bd2e6..0000000
--- a/users/migrations/0003_alter_user_id.py
+++ /dev/null
@@ -1,19 +0,0 @@
-# Generated by Django 4.2.1 on 2023-07-01 01:49
-
-import builtins
-from django.db import migrations, models
-
-
-class Migration(migrations.Migration):
-
- dependencies = [
- ('users', '0002_remove_user_introduce_user_introduction_and_more'),
- ]
-
- operations = [
- migrations.AlterField(
- model_name='user',
- name='id',
- field=models.CharField(max_length=20, primary_key=True, serialize=False, unique=True, verbose_name=builtins.id),
- ),
- ]
diff --git a/users/migrations/0004_alter_user_managers_user_image_alter_user_email_and_more.py b/users/migrations/0004_alter_user_managers_user_image_alter_user_email_and_more.py
deleted file mode 100644
index 155350d..0000000
--- a/users/migrations/0004_alter_user_managers_user_image_alter_user_email_and_more.py
+++ /dev/null
@@ -1,40 +0,0 @@
-# Generated by Django 4.2.1 on 2023-07-03 23:57
-
-from django.db import migrations, models
-import users.models
-
-
-class Migration(migrations.Migration):
-
- dependencies = [
- ('users', '0003_alter_user_id'),
- ]
-
- operations = [
- migrations.AlterModelManagers(
- name='user',
- managers=[
- ('objects', users.models.UserManager()),
- ],
- ),
- migrations.AddField(
- model_name='user',
- name='image',
- field=models.ImageField(blank=True, null=True, upload_to='', verbose_name='이미지'),
- ),
- migrations.AlterField(
- model_name='user',
- name='email',
- field=models.EmailField(blank=True, max_length=254, verbose_name='email address'),
- ),
- migrations.AlterField(
- model_name='user',
- name='id',
- field=models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID'),
- ),
- migrations.AlterField(
- model_name='user',
- name='introduction',
- field=models.TextField(default='소개글을 입력하세요.', verbose_name='소개글'),
- ),
- ]
diff --git a/users/migrations/__pycache__/0001_initial.cpython-311.pyc b/users/migrations/__pycache__/0001_initial.cpython-311.pyc
index 7f9dfbc..0e8d333 100644
Binary files a/users/migrations/__pycache__/0001_initial.cpython-311.pyc and b/users/migrations/__pycache__/0001_initial.cpython-311.pyc differ
diff --git a/users/migrations/__pycache__/0001_initial.cpython-39.pyc b/users/migrations/__pycache__/0001_initial.cpython-39.pyc
deleted file mode 100644
index f6a9042..0000000
Binary files a/users/migrations/__pycache__/0001_initial.cpython-39.pyc and /dev/null differ
diff --git a/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-311.pyc b/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-311.pyc
index 243e47f..a113c2c 100644
Binary files a/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-311.pyc and b/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-311.pyc differ
diff --git a/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-39.pyc b/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-39.pyc
deleted file mode 100644
index 107ea59..0000000
Binary files a/users/migrations/__pycache__/0002_remove_user_introduce_user_introduction_and_more.cpython-39.pyc and /dev/null differ
diff --git a/users/migrations/__pycache__/0003_alter_user_id.cpython-311.pyc b/users/migrations/__pycache__/0003_alter_user_id.cpython-311.pyc
index b20f2e1..29cd4b1 100644
Binary files a/users/migrations/__pycache__/0003_alter_user_id.cpython-311.pyc and b/users/migrations/__pycache__/0003_alter_user_id.cpython-311.pyc differ
diff --git a/users/migrations/__pycache__/0003_alter_user_id.cpython-39.pyc b/users/migrations/__pycache__/0003_alter_user_id.cpython-39.pyc
deleted file mode 100644
index 5baeb8e..0000000
Binary files a/users/migrations/__pycache__/0003_alter_user_id.cpython-39.pyc and /dev/null differ
diff --git a/users/migrations/__pycache__/0004_alter_user_managers_user_image_alter_user_email_and_more.cpython-311.pyc b/users/migrations/__pycache__/0004_alter_user_managers_user_image_alter_user_email_and_more.cpython-311.pyc
index e92d5c4..63149b6 100644
Binary files a/users/migrations/__pycache__/0004_alter_user_managers_user_image_alter_user_email_and_more.cpython-311.pyc and b/users/migrations/__pycache__/0004_alter_user_managers_user_image_alter_user_email_and_more.cpython-311.pyc differ
diff --git a/users/migrations/__pycache__/__init__.cpython-311.pyc b/users/migrations/__pycache__/__init__.cpython-311.pyc
index a764960..b009cdb 100644
Binary files a/users/migrations/__pycache__/__init__.cpython-311.pyc and b/users/migrations/__pycache__/__init__.cpython-311.pyc differ
diff --git a/users/migrations/__pycache__/__init__.cpython-39.pyc b/users/migrations/__pycache__/__init__.cpython-39.pyc
deleted file mode 100644
index e668fdc..0000000
Binary files a/users/migrations/__pycache__/__init__.cpython-39.pyc and /dev/null differ
diff --git a/users/models.py b/users/models.py
index 1673ed8..228ade4 100644
--- a/users/models.py
+++ b/users/models.py
@@ -2,18 +2,32 @@
from django.db import models
class UserManager(DjangoUserManager):
- def create_user(self, username=None, email=None, password=None, **extra_fields):
- if not username:
- raise ValueError('ID는 필수 값입니다.')
+ def create_user(self, email, password=None, **extra_fields):
+ if not email:
+ raise ValueError('이메일은 필수 값입니다.')
if not password:
raise ValueError('비밀번호는 필수 값입니다.')
- if len(password) < 8:
- raise ValueError('비밀번호는 8자 이상이어야 합니다.')
- return self._create_user(username, email, password, **extra_fields)
+ email = self.normalize_email(email)
+ user = self.model(email=email, **extra_fields)
+ user.set_password(password)
+ user.save(using=self._db)
+ return user
+ def create_superuser(self, email, password=None, **extra_fields):
+ extra_fields.setdefault('is_staff', True)
+ extra_fields.setdefault('is_superuser', True)
+ extra_fields.setdefault('username', email) # username 값을 email로 설정
+ return self.create_user(email, password, **extra_fields)
class User(AbstractUser):
- objects = UserManager()
- image = models.ImageField(verbose_name='이미지', null=True, blank=True)
+ email = models.EmailField(unique=True)
+ USERNAME_FIELD = 'email'
+ REQUIRED_FIELDS = ['nickname']
+ nickname = models.CharField(verbose_name='닉네임', max_length=255, default='no nickname')
+ image = models.ImageField(verbose_name='이미지', upload_to='image/', null=True, blank=True)
introduction = models.TextField(verbose_name='소개글', default="소개글을 입력하세요.")
+ objects = UserManager()
+
+ def __str__(self):
+ return self.email
\ No newline at end of file