.

.env

@@ -60,4 +60,4 @@ VITE_PUSHER_PORT="${PUSHER_PORT}"
 VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"
 VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
 
-MOVIE_API="http://192.168.0.100:1050"
+MOVIE_API="http://192.168.0.10:1050"

public/css/auth/passwords.css

@@ -1,75 +1,4 @@
-#passwordEmail,
-#passwordReset,
-#passwordConfirm {
-  background: #0f0f0f;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  height: 100vh;
-}
-#passwordEmail a,
-#passwordReset a,
-#passwordConfirm a {
-  text-decoration: none;
-}
-#passwordEmail header,
-#passwordReset header,
-#passwordConfirm header {
-  font-family: "Open-Sans-Extrabold";
-  font-size: 37px;
-  font-weight: bolder;
-  margin: 1.6rem 0;
-}
-#passwordEmail header a,
-#passwordReset header a,
-#passwordConfirm header a {
-  color: #d3d629;
-}
-#passwordEmail header a:hover, #passwordEmail header a:focus,
-#passwordReset header a:hover,
-#passwordReset header a:focus,
-#passwordConfirm header a:hover,
-#passwordConfirm header a:focus {
-  color: #a8aa2f;
-}
-#passwordEmail main,
-#passwordReset main,
-#passwordConfirm main {
-  max-width: 400px;
-  padding: 10px;
-}
-#passwordEmail main h5,
-#passwordReset main h5,
-#passwordConfirm main h5 {
-  font-weight: bold;
-  margin-bottom: 0.9rem;
-}
-#passwordEmail main form div:last-child a,
-#passwordReset main form div:last-child a,
-#passwordConfirm main form div:last-child a {
-  color: #0066c0;
-}
-#passwordEmail main form div:last-child a:hover, #passwordEmail main form div:last-child a:focus,
-#passwordReset main form div:last-child a:hover,
-#passwordReset main form div:last-child a:focus,
-#passwordConfirm main form div:last-child a:hover,
-#passwordConfirm main form div:last-child a:focus {
-  color: #00558c;
-  text-decoration: underline;
-}
-#passwordEmail main hr,
-#passwordReset main hr,
-#passwordConfirm main hr {
+#passwordEmail,#passwordReset,#passwordConfirm{background:#0f0f0f;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:100vh}#passwordEmail a,#passwordReset a,#passwordConfirm a{text-decoration:none}#passwordEmail header,#passwordReset header,#passwordConfirm header{font-family:"Open-Sans-Extrabold";font-size:37px;font-weight:bolder;margin:1.6rem 0}#passwordEmail header a,#passwordReset header a,#passwordConfirm header a{color:#d3d629}#passwordEmail header a:hover,#passwordEmail header a:focus,#passwordReset header a:hover,#passwordReset header a:focus,#passwordConfirm header a:hover,#passwordConfirm header a:focus{color:#a8aa2f}#passwordEmail main,#passwordReset main,#passwordConfirm main{max-width:400px;padding:10px}#passwordEmail main h5,#passwordReset main h5,#passwordConfirm main h5{font-weight:bold;margin-bottom:.9rem}#passwordEmail main form div:last-child a,#passwordReset main form div:last-child a,#passwordConfirm main form div:last-child a{color:#0066c0}#passwordEmail main form div:last-child a:hover,#passwordEmail main form div:last-child a:focus,#passwordReset main form div:last-child a:hover,#passwordReset main form div:last-child a:focus,#passwordConfirm main form div:last-child a:hover,#passwordConfirm main form div:last-child a:focus{color:#00558c;text-decoration:underline}#passwordEmail main hr,#passwordReset main hr,#passwordConfirm main hr{margin:.5rem 0 .9rem 0;border-color:#888}#passwordEmail main footer,#passwordReset main footer,#passwordConfirm main footer{text-align:center;font-size:11px;color:#6c6c6c;background:rgba(0,0,0,0);border:0;padding:0}{
   margin: 0.5rem 0 0.9rem 0;
   border-color: #888;
 }

public/css/desktop/account/modify.css

@@ -1,4 +1,32 @@
-#accountModify{position:relative}#accountModify>dl{margin-bottom:1.5rem}#accountModify>dl dt{font-size:17px;margin-bottom:10px}#accountModify>dl dd{font-size:13px}#accountModify form{margin-bottom:0}#accountModify form table{border:none}#accountModify form table tbody tr th hr{margin:.6rem 0}#accountModify form table tbody tr td{text-align:left}#accountModify form table tbody tr td #btnChangeEmail{text-decoration:none}#accountModify form table tbody tr td #btnChangeEmail:hover,#accountModify form table tbody tr td #btnChangeEmail:focus{text-decoration:underline}#accountModify form table tbody tr td hr{margin:.3rem 0}s {
+#accountModify {
+  position: relative;
+}
+#accountModify > dl {
+  margin-bottom: 1.5rem;
+}
+#accountModify > dl dt {
+  font-size: 17px;
+  margin-bottom: 10px;
+}
+#accountModify > dl dd {
+  font-size: 13px;
+}
+#accountModify form {
+  margin-bottom: 0;
+}
+#accountModify form table {
+  border: none;
+}
+#accountModify form table tbody tr th hr {
+  margin: 0.6rem 0;
+}
+#accountModify form table tbody tr td {
+  text-align: left;
+}
+#accountModify form table tbody tr td #btnChangeEmail {
+  text-decoration: none;
+}
+#accountModify form table tbody tr td #btnChangeEmail:hover, #accountModify form table tbody tr td #btnChangeEmail:focus {
   text-decoration: underline;
 }
 #accountModify form table tbody tr td hr {

public/css/desktop/account/post.css

@@ -1,46 +1,4 @@
-@charset "UTF-8";
-/* 작성 게시글 */
-#accountPost {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-#accountPost table caption {
-  caption-side: top;
-  color: #bbbbbb;
-}
-#accountPost table tr th, #accountPost table tr td {
-  text-align: center;
-}
-#accountPost table thead tr th {
-  background: #133a46;
-}
-#accountPost table tbody tr:hover, #accountPost table tbody tr:focus {
-  background-color: #1a1e21;
-}
-#accountPost table tbody tr th, #accountPost table tbody tr td {
-  text-align: center;
-  vertical-align: middle;
-}
-#accountPost table tbody tr td {
-  font-size: 13px;
-}
-#accountPost table tbody tr td label {
-  margin-right: 5px;
-}
-#accountPost table tbody tr td label a {
-  color: #cbd5e0;
-}
-#accountPost table tbody tr td del, #accountPost table tbody tr td a {
-  font-size: 14px;
-  font-weight: normal;
-  color: #b3b3b3;
-}
-#accountPost table tbody tr td var {
-  color: #aa0000;
-  font-style: normal;
-  margin-left: 3px;
-  letter-spacing: -1px;
-  vertical-align: middle;
+#accountPost{-webkit-box-sizing:border-box;box-sizing:border-box}#accountPost table caption{caption-side:top;color:#bbb}#accountPost table tr th,#accountPost table tr td{text-align:center}#accountPost table thead tr th{background:#133a46}#accountPost table tbody tr:hover,#accountPost table tbody tr:focus{background-color:#1a1e21}#accountPost table tbody tr th,#accountPost table tbody tr td{text-align:center;vertical-align:middle}#accountPost table tbody tr td{font-size:13px}#accountPost table tbody tr td label{margin-right:5px}#accountPost table tbody tr td label a{color:#cbd5e0}#accountPost table tbody tr td del,#accountPost table tbody tr td a{font-size:14px;font-weight:normal;color:#b3b3b3}#accountPost table tbody tr td var{color:#a00;font-style:normal;margin-left:3px;letter-spacing:-1px;vertical-align:middle}#accountPost table tbody tr td i{color:#cbd5e0;margin-left:3px;vertical-align:-1px}#accountPost table tbody tr td span{font-size:10px;margin-left:3px;vertical-align:middle} middle;
 }
 #accountPost table tbody tr td i {
   color: #cbd5e0;

public/css/desktop/board/write.css

@@ -1,47 +1,4 @@
-@charset "UTF-8";
-/* 게시판 작성 / 게시판 수정 */
-#boardWrite,
-#boardEdit {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  padding: calc(var(--bs-gutter-x) * 0.5);
-}
-#boardWrite > h5,
-#boardEdit > h5 {
-  font-weight: bold;
-  margin-bottom: 0;
-}
-#boardWrite .head,
-#boardEdit .head {
-  margin-bottom: 10px;
-}
-#boardWrite .body,
-#boardEdit .body {
-  margin: 0 -10px;
-}
-> #boardWrite .body form table:not(:first-child),
-> #boardEdit .body form table:not(:first-child) {
-  border: none;
-}
-#boardWrite .body form table tr,
-#boardEdit .body form table tr {
-  overflow: hidden;
-}
-#boardWrite .body form table tr th, #boardWrite .body form table tr td,
-#boardEdit .body form table tr th,
-#boardEdit .body form table tr td {
-  text-align: initial;
-  vertical-align: middle;
-}
-#boardWrite .body form table tr th,
-#boardEdit .body form table tr th {
-  font-weight: normal;
-}
-#boardWrite .body form table tr th label,
-#boardEdit .body form table tr th label {
-  margin-bottom: 0;
-}
-#boardWrite .body form table tr td,
+#boardWrite,#boardEdit{-webkit-box-sizing:border-box;box-sizing:border-box;padding:calc(var(--bs-gutter-x)*.5)}#boardWrite>h5,#boardEdit>h5{font-weight:bold;margin-bottom:0}#boardWrite .head,#boardEdit .head{margin-bottom:10px}#boardWrite .body,#boardEdit .body{margin:0 -10px}>#boardWrite .body form table:not(:first-child),>#boardEdit .body form table:not(:first-child){border:none}#boardWrite .body form table tr,#boardEdit .body form table tr{overflow:hidden}#boardWrite .body form table tr th,#boardWrite .body form table tr td,#boardEdit .body form table tr th,#boardEdit .body form table tr td{text-align:initial;vertical-align:middle}#boardWrite .body form table tr th,#boardEdit .body form table tr th{font-weight:normal}#boardWrite .body form table tr th label,#boardEdit .body form table tr th label{margin-bottom:0}#boardWrite .body form table tr td,#boardEdit .body form table tr td{padding:7px}#boardWrite .foot,#boardEdit .foot{margin-top:10px}#boardWrite .captcha,#boardEdit .captcha{max-width:280px}body form table tr td,
 #boardEdit .body form table tr td {
   padding: 7px;
 }

public/css/desktop/movie/trailer.css

@@ -1,4 +1,37 @@
-#movieTrailer>h5{font-weight:bold}#movieTrailer .trailer-list>div>img{width:100%;cursor:pointer}#movieTrailer .trailer-list>div>img:hover,#movieTrailer .trailer-list>div>img:focus{outline:1px solid #0a7bb9}#movieTrailer .trailer-list dl{margin-top:10px}#movieTrailer .trailer-list dl dt a{font-size:15px;text-decoration:none}#movieTrailer .trailer-list dl dt a:hover,#movieTrailer .trailer-list dl dt a:focus{text-decoration:underline}#movieTrailer .trailer-list dl dd{margin-top:8px}#movieTrailer .trailer-list dl dd var{display:inline-block;padding-left:0}#movieTrailer .trailer-list dl dd sub{font-size:15px;font-weight:500;margin-right:5px}#movieTrailer #trailerModal .modal-content .modal-header,#movieTrailer #trailerModal .modal-content .modal-body{background:#000;border:0}#movieTrailer #trailerModal .modal-content .modal-body{padding:0}ontent .modal-body {
+#movieTrailer > h5 {
+  font-weight: bold;
+}
+#movieTrailer .trailer-list > div > img {
+  width: 100%;
+  cursor: pointer;
+}
+#movieTrailer .trailer-list > div > img:hover, #movieTrailer .trailer-list > div > img:focus {
+  outline: 1px solid #0a7bb9;
+}
+#movieTrailer .trailer-list dl {
+  margin-top: 10px;
+}
+#movieTrailer .trailer-list dl dt a {
+  font-size: 15px;
+  text-decoration: none;
+}
+#movieTrailer .trailer-list dl dt a:hover, #movieTrailer .trailer-list dl dt a:focus {
+  text-decoration: underline;
+}
+#movieTrailer .trailer-list dl dd {
+  margin-top: 8px;
+}
+#movieTrailer .trailer-list dl dd var {
+  display: inline-block;
+  padding-left: 0;
+}
+#movieTrailer .trailer-list dl dd sub {
+  font-size: 15px;
+  font-weight: 500;
+  margin-right: 5px;
+}
+#movieTrailer #trailerModal .modal-content .modal-header,
+#movieTrailer #trailerModal .modal-content .modal-body {
   background: #000;
   border: 0;
 }

public/css/mobile/account/comment.css

@@ -1,4 +1,59 @@
-#accountComment{-webkit-box-sizing:border-box;box-sizing:border-box}#accountComment table{margin-bottom:0}#accountComment table caption{caption-side:top;color:#bbb}#accountComment table tr th,#accountComment table tr td{text-align:center}#accountComment table thead tr th{background:#133a46}#accountComment table tbody tr td{vertical-align:middle}#accountComment table tbody tr td p{margin-bottom:5px}#accountComment table tbody tr td p a{font-size:.8rem;font-weight:normal;text-decoration:none}#accountComment table tbody tr td p var{color:#a00;font-style:initial;font-size:.813rem;vertical-align:bottom;letter-spacing:-1px}#accountComment table tbody tr td p i{color:#cbd5e0;margin-left:5px;vertical-align:-2px}#accountComment table tbody tr td p:last-child{margin-bottom:0}#accountComment table tbody tr td ul{margin:0;padding:0}#accountComment table tbody tr td ul li{display:inline-block;font-size:.75rem}#accountComment table tbody tr td ul li:after{content:"·";padding:0 3px 0 7px}#accountComment table tbody tr td ul li:last-child:after{content:"";padding:0}#accountComment table tbody tr td:first-child{text-align:center}#accountComment table tbody tr td:last-child{text-align:left}: 0 3px 0 7px;
+@charset "UTF-8";
+/* 작성 댓글 */
+#accountComment {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+#accountComment table {
+  margin-bottom: 0;
+}
+#accountComment table caption {
+  caption-side: top;
+  color: #bbbbbb;
+}
+#accountComment table tr th, #accountComment table tr td {
+  text-align: center;
+}
+#accountComment table thead tr th {
+  background: #133a46;
+}
+#accountComment table tbody tr td {
+  vertical-align: middle;
+}
+#accountComment table tbody tr td p {
+  margin-bottom: 5px;
+}
+#accountComment table tbody tr td p a {
+  font-size: 0.8rem;
+  font-weight: normal;
+  text-decoration: none;
+}
+#accountComment table tbody tr td p var {
+  color: #aa0000;
+  font-style: initial;
+  font-size: 0.813rem;
+  vertical-align: bottom;
+  letter-spacing: -1px;
+}
+#accountComment table tbody tr td p i {
+  color: #cbd5e0;
+  margin-left: 5px;
+  vertical-align: -2px;
+}
+#accountComment table tbody tr td p:last-child {
+  margin-bottom: 0;
+}
+#accountComment table tbody tr td ul {
+  margin: 0;
+  padding: 0;
+}
+#accountComment table tbody tr td ul li {
+  display: inline-block;
+  font-size: 0.75rem;
+}
+#accountComment table tbody tr td ul li:after {
+  content: "·";
+  padding: 0 3px 0 7px;
 }
 #accountComment table tbody tr td ul li:last-child:after {
   content: "";

public/css/mobile/account/loginLog.css

@@ -1,23 +1,4 @@
-#accountLoginLog {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-#accountLoginLog table {
-  margin-bottom: 0;
-  min-width: 580px;
-}
-#accountLoginLog table caption {
-  caption-side: top;
-  color: #bbbbbb;
-}
-#accountLoginLog table tr th, #accountLoginLog table tr td {
-  text-align: center;
-}
-#accountLoginLog table thead tr th {
-  background: #133a46;
-}
-#accountLoginLog table tbody tr td {
-  text-align: center;
+#accountLoginLog{-webkit-box-sizing:border-box;box-sizing:border-box}#accountLoginLog table{margin-bottom:0;min-width:580px}#accountLoginLog table caption{caption-side:top;color:#bbb}#accountLoginLog table tr th,#accountLoginLog table tr td{text-align:center}#accountLoginLog table thead tr th{background:#133a46}#accountLoginLog table tbody tr td{text-align:center;vertical-align:middle;border:none;font-size:13px} text-align: center;
   vertical-align: middle;
   border: none;
   font-size: 13px;

public/css/mobile/account/modify.css

@@ -1,39 +1,4 @@
-#accountModify {
-  position: relative;
-}
-#accountModify > dl {
-  margin-bottom: 1.5rem;
-}
-#accountModify > dl dt {
-  font-size: 17px;
-  margin-bottom: 10px;
-}
-#accountModify > dl dd {
-  font-size: 13px;
-}
-#accountModify form {
-  margin-bottom: 0;
-}
-#accountModify form table {
-  border: none;
-}
-#accountModify form table tbody tr th {
-  color: #b3b3b3;
-}
-#accountModify form table tbody tr th hr {
-  color: #ccc;
-  margin: 0.6rem 0;
-}
-#accountModify form table tbody tr td {
-  text-align: left;
-}
-@media (max-width: 576px) {
-  #accountModify form table tbody tr td #btnConfirmEmail,
-  #accountModify form table tbody tr td #btnCancelEmail {
-    margin-bottom: 5px;
-  }
-}
-#accountModify form table tbody tr td input[type=file] {
+#accountModify{position:relative}#accountModify>dl{margin-bottom:1.5rem}#accountModify>dl dt{font-size:17px;margin-bottom:10px}#accountModify>dl dd{font-size:13px}#accountModify form{margin-bottom:0}#accountModify form table{border:none}#accountModify form table tbody tr th{color:#b3b3b3}#accountModify form table tbody tr th hr{color:#ccc;margin:.6rem 0}#accountModify form table tbody tr td{text-align:left}@media(max-width: 576px){#accountModify form table tbody tr td #btnConfirmEmail,#accountModify form table tbody tr td #btnCancelEmail{margin-bottom:5px}}#accountModify form table tbody tr td input[type=file]{width:inherit}#accountModify form table tbody tr td hr{margin:.3rem 0}rm table tbody tr td input[type=file] {
   width: inherit;
 }
 #accountModify form table tbody tr td hr {

public/css/mobile/board/write.css

@@ -1,33 +1,4 @@
-@charset "UTF-8";
-/* 게시판 작성 / 게시판 수정 */
-#boardWrite,
-#boardEdit {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  padding: calc(var(--bs-gutter-x) * 0.5);
-}
-#boardWrite > h5,
-#boardEdit > h5 {
-  font-weight: bold;
-  margin-bottom: 0;
-}
-#boardWrite .head,
-#boardEdit .head {
-  margin-bottom: 10px;
-}
-#boardWrite .body,
-#boardEdit .body {
-  margin: 0 -10px;
-}
-> #boardWrite .body form table:not(:first-child),
-> #boardEdit .body form table:not(:first-child) {
-  border: none;
-}
-#boardWrite .body form table tr,
-#boardEdit .body form table tr {
-  overflow: hidden;
-}
-#boardWrite .body form table tr td,
+#boardWrite,#boardEdit{-webkit-box-sizing:border-box;box-sizing:border-box;padding:calc(var(--bs-gutter-x)*.5)}#boardWrite>h5,#boardEdit>h5{font-weight:bold;margin-bottom:0;color:#f1f1f1}#boardWrite hr,#boardEdit hr{border-color:#eee}#boardWrite .head,#boardEdit .head{margin-bottom:10px}#boardWrite .body,#boardEdit .body{margin:0 -10px}>#boardWrite .body form table:not(:first-child),>#boardEdit .body form table:not(:first-child){border:none}#boardWrite .body form table tr,#boardEdit .body form table tr{overflow:hidden}#boardWrite .body form table tr td,#boardEdit .body form table tr td{padding:7px;text-align:initial;vertical-align:middle}#boardWrite .foot,#boardEdit .foot{margin-top:10px} form table tr td,
 #boardEdit .body form table tr td {
   padding: 7px;
   text-align: initial;

public/css/mobile/document.css

@@ -1,11 +1,3 @@
-#document h4 {
-  margin-bottom: 0;
-}
-#document blockquote {
-  text-align: justify;
-  word-break: break-all;
-}
-#document blockquote img {
-  max-width: 100%;
+#document h4{margin-bottom:0}#document blockquote{text-align:justify;word-break:break-all}#document blockquote img{max-width:100%;height:100%}-width: 100%;
   height: 100%;
 }

public/css/mobile/main.css

@@ -1,95 +1,4 @@
-@charset "UTF-8";
-#main {
-  padding: 0;
-}
-
-#banners {
-  position: relative;
-  min-height: 420px;
-  max-height: 300px;
-  --swiper-navigation-color: #fff;
-  --swiper-pagination-color: #fff;
-}
-#banners .swiper-wrapper {
-  min-height: inherit;
-  max-height: inherit;
-}
-#banners .swiper-wrapper .swiper-slide {
-  min-height: inherit;
-  max-height: inherit;
-  border-bottom: 1px solid #333;
-  background-size: cover;
-  background-repeat: no-repeat;
-}
-#banners .swiper-wrapper .swiper-slide .swiper-cover {
-  min-height: inherit;
-  max-height: inherit;
-  color: #F5F5F5;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  padding: 5% 12%;
-}
-#banners .swiper-wrapper .swiper-slide .swiper-cover .title {
-  font-size: 2em;
-  font-weight: bold;
-}
-#banners .swiper-wrapper .swiper-slide .swiper-cover .subtitle {
-  font-size: 1.2em;
-  font-weight: 500;
-  margin-bottom: 10px;
-}
-#banners .swiper-wrapper .swiper-slide .swiper-cover img {
-  width: 100%;
-  max-width: 220px;
-}
-
-#notice h5,
-#review h5 {
-  margin-bottom: 0;
-}
-#notice a,
-#review a {
-  text-decoration: none;
-}
-#notice a:hover, #notice a:focus,
-#review a:hover,
-#review a:focus {
-  text-decoration: underline;
-}
-#notice table tr td span,
-#review table tr td span {
-  font-size: 14px;
-  color: #a5a5a5;
-  padding-right: 5px;
-}
-#notice table tr td a,
-#review table tr td a {
-  font-size: 13px;
-}
-#notice table tr td a:hover, #notice table tr td a:focus,
-#review table tr td a:hover,
-#review table tr td a:focus {
-  text-decoration: underline;
-}
-#notice table tr td small,
-#review table tr td small {
-  font-size: 13px;
-  color: #bbbbbb;
-}
-
-#trending .ratio-2x3 {
-  --bs-aspect-ratio: 150%;
-}
-#trending .ratio-2x3 img {
-  -o-object-fit: cover;
-     object-fit: cover;
+#main{padding:0}#banners{position:relative;min-height:420px;max-height:300px;--swiper-navigation-color: #fff;--swiper-pagination-color: #fff;margin-top:-10px}#banners .swiper-wrapper{min-height:inherit;max-height:inherit}#banners .swiper-wrapper .swiper-slide{min-height:inherit;max-height:inherit;border-bottom:1px solid #333;background-size:cover;background-repeat:no-repeat}#banners .swiper-wrapper .swiper-slide .swiper-cover{min-height:inherit;max-height:inherit;color:#f5f5f5;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:5% 12%}#banners .swiper-wrapper .swiper-slide .swiper-cover .title{font-size:2em;font-weight:bold}#banners .swiper-wrapper .swiper-slide .swiper-cover .subtitle{font-size:1.2em;font-weight:500;margin-bottom:10px}#banners .swiper-wrapper .swiper-slide .swiper-cover img{width:100%;max-width:220px}#notice h5,#review h5{margin-bottom:0}#notice a,#review a{text-decoration:none}#notice a:hover,#notice a:focus,#review a:hover,#review a:focus{text-decoration:underline}#notice table tr td span,#review table tr td span{font-size:14px;color:#a5a5a5;padding-right:5px}#notice table tr td a,#review table tr td a{font-size:13px}#notice table tr td a:hover,#notice table tr td a:focus,#review table tr td a:hover,#review table tr td a:focus{text-decoration:underline}#notice table tr td small,#review table tr td small{font-size:13px;color:#bbb}#trending .ratio-2x3{--bs-aspect-ratio: 150%}#trending .ratio-2x3 img{-o-object-fit:cover;object-fit:cover;border:1px solid #4d0404}#trending .ratio-2x3 img:hover,#trending .ratio-2x3 img:focus{-webkit-transform:scale(1.02);transform:scale(1.02)}#trending var{padding:1px 0}#trendingModal .modal-body dl dt{color:#fff;font-weight:bold;margin-bottom:15px}#trendingModal .modal-body dl dd{color:#f1f1f1}object-fit: cover;
   border: 1px solid #4d0404;
 }
 #trending .ratio-2x3 img:hover, #trending .ratio-2x3 img:focus {

public/css/mobile/movie/rank copy.css

@@ -0,0 +1,6 @@
+#movieRank>h5{font-weight:bold;color:#f1f1f1;text-align:center;padding:.938rem 0 0 0}#movieRank hr{border-color:#eee}#movieRank .rank-list a.poster-img .ratio-2x3{--bs-aspect-ratio: 150%}#movieRank .rank-list a.poster-img img{-o-object-fit:cover;object-fit:cover}#movieRank .rank-list a.poster-img img:hover,#movieRank .rank-list a.poster-img img:focus{outline:1px solid #0a7bb9}#movieRank .rank-list dl{margin-top:10px}#movieRank .rank-list dl dt a{font-size:15px;text-decoration:none}#movieRank .rank-list dl dt a:hover,#movieRank .rank-list dl dt a:focus{text-decoration:underline}#movieRank .rank-list dl dd{margin-top:8px}#movieRank .rank-list dl dd span{font-size:13px}#movieRank .rank-list dl dd {
+  margin-top: 8px;
+}
+#movieRank .rank-list dl dd span {
+  font-size: 13px;
+}

public/css/mobile/movie/rank.css

@@ -1,4 +1,4 @@
-#movieRank>h5{font-weight:bold}#movieRank .rank-list a.poster-img .ratio-2x3{--bs-aspect-ratio: 150%}#movieRank .rank-list a.poster-img img{-o-object-fit:cover;object-fit:cover}#movieRank .rank-list a.poster-img img:hover,#movieRank .rank-list a.poster-img img:focus{outline:1px solid #0a7bb9}#movieRank .rank-list dl{margin-top:10px}#movieRank .rank-list dl dt a{font-size:15px;text-decoration:none}#movieRank .rank-list dl dt a:hover,#movieRank .rank-list dl dt a:focus{text-decoration:underline}#movieRank .rank-list dl dd{margin-top:8px}#movieRank .rank-list dl dd span{font-size:13px} dl dd {
+#movieRank>h5{font-weight:bold;text-align:center;padding:.938rem 0 0 0}#movieRank .rank-list a.poster-img .ratio-2x3{--bs-aspect-ratio: 150%}#movieRank .rank-list a.poster-img img{-o-object-fit:cover;object-fit:cover}#movieRank .rank-list a.poster-img img:hover,#movieRank .rank-list a.poster-img img:focus{outline:1px solid #0a7bb9}#movieRank .rank-list dl{margin-top:10px}#movieRank .rank-list dl dt a{font-size:15px;text-decoration:none}#movieRank .rank-list dl dt a:hover,#movieRank .rank-list dl dt a:focus{text-decoration:underline}#movieRank .rank-list dl dd{margin-top:8px}#movieRank .rank-list dl dd span{font-size:13px}rank-list dl dd {
   margin-top: 8px;
 }
 #movieRank .rank-list dl dd span {

public/css/mobile/movie/search.css

@@ -1,4 +1,38 @@
-table tr th{color:#b3b3b3}#movieSearch>h5{font-weight:bold}#movieSearch .search-list a.poster-img .ratio-2x3{--bs-aspect-ratio: 150%}#movieSearch .search-list a.poster-img img{-o-object-fit:cover;object-fit:cover}#movieSearch .search-list a.poster-img img:hover,#movieSearch .search-list a.poster-img img:focus{outline:1px solid #0a7bb9}#movieSearch .search-list dl{margin-top:10px}#movieSearch .search-list dl dt a{font-size:15px;text-decoration:none}#movieSearch .search-list dl dt a:hover,#movieSearch .search-list dl dt a:focus{text-decoration:underline}#movieSearch .search-list dl dd{margin-top:5px}#movieSearch .search-list dl dd var{display:inline-block;padding-left:0}#movieSearch .search-list dl dd sub{font-size:15px;font-weight:500;margin-right:5px}ing-left: 0;
+table tr th {
+  color: #b3b3b3;
+}
+
+#movieSearch > h5 {
+  font-weight: bold;
+  text-align: center;
+  padding: 0.938rem 0 0 0;
+}
+#movieSearch .search-list a.poster-img .ratio-2x3 {
+  --bs-aspect-ratio: 150%;
+}
+#movieSearch .search-list a.poster-img img {
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+#movieSearch .search-list a.poster-img img:hover, #movieSearch .search-list a.poster-img img:focus {
+  outline: 1px solid #0a7bb9;
+}
+#movieSearch .search-list dl {
+  margin-top: 10px;
+}
+#movieSearch .search-list dl dt a {
+  font-size: 15px;
+  text-decoration: none;
+}
+#movieSearch .search-list dl dt a:hover, #movieSearch .search-list dl dt a:focus {
+  text-decoration: underline;
+}
+#movieSearch .search-list dl dd {
+  margin-top: 5px;
+}
+#movieSearch .search-list dl dd var {
+  display: inline-block;
+  padding-left: 0;
 }
 #movieSearch .search-list dl dd sub {
   font-size: 15px;

public/css/mobile/movie/trailer.css

@@ -1,4 +1,4 @@
-#movieTrailer>h5{font-weight:bold}#movieTrailer .trailer-list>div>img{width:100%;cursor:pointer}#movieTrailer .trailer-list>div>img:hover,#movieTrailer .trailer-list>div>img:focus{outline:1px solid #0a7bb9}#movieTrailer .trailer-list dl{margin-top:10px}#movieTrailer .trailer-list dl dt a{font-size:15px;text-decoration:none}#movieTrailer .trailer-list dl dt a:hover,#movieTrailer .trailer-list dl dt a:focus{text-decoration:underline}#movieTrailer .trailer-list dl dd{margin-top:8px}#movieTrailer .trailer-list dl dd var{display:inline-block;padding-left:0}#movieTrailer .trailer-list dl dd sub{font-size:15px;font-weight:500;margin-right:5px}#movieTrailer #trailerModal .modal-content .modal-header,#movieTrailer #trailerModal .modal-content .modal-body{background:#000;border:0}#movieTrailer #trailerModal .modal-content .modal-body{padding:0}ontent .modal-body {
+#movieTrailer>h5{font-weight:bold;text-align:center;padding:.938rem 0 0 0}#movieTrailer .trailer-list>div>img{width:100%;cursor:pointer}#movieTrailer .trailer-list>div>img:hover,#movieTrailer .trailer-list>div>img:focus{outline:1px solid #0a7bb9}#movieTrailer .trailer-list dl{margin-top:10px}#movieTrailer .trailer-list dl dt a{font-size:15px;text-decoration:none}#movieTrailer .trailer-list dl dt a:hover,#movieTrailer .trailer-list dl dt a:focus{text-decoration:underline}#movieTrailer .trailer-list dl dd{margin-top:8px}#movieTrailer .trailer-list dl dd var{display:inline-block;padding-left:0}#movieTrailer .trailer-list dl dd sub{font-size:15px;font-weight:500;margin-right:5px}#movieTrailer #trailerModal .modal-content .modal-header,#movieTrailer #trailerModal .modal-content .modal-body{background:#000;border:0}#movieTrailer #trailerModal .modal-content .modal-body{padding:0} .modal-content .modal-body {
   background: #000;
   border: 0;
 }

resources/sass/_variables.scss

@@ -1,6 +1,3 @@
-
-@use 'sass:meta' as meta; 
-
 // app.scss (select2 import 전에!)
 $border-color: #333 !default; // Bootstrap의 Sass 변수 (필요 시)
 $input-border-color: #4c4c4c !default;
@@ -8,6 +5,7 @@ $input-border-color: #4c4c4c !default;
 // select2-bootstrap-5-theme가 참조하는 변수가 있다면 그걸 hex로 오버라이드
 $select2-border-color: #4c4c4c !default; // (패키지 변수명 확인 필요)
 
+$body-bg: #0f0f0f;
 $body-color: #f1f1f1;
 $font-family-base: "Nanum-Square-Neo-Regular";
 $font-family-sans-serif: "Nanum-Square-Neo-Regular";
@@ -61,18 +59,18 @@ $pagination-bg: #000;
 $pagination-border-color: #333;
 $pagination-border-radius: 0;
 
-$pagination-active-bg: #0f0f0f;
+$pagination-active-bg: #182840;
 $pagination-active-color: #f1f1f1;
 $pagination-active-border-color: #333;
 
-$pagination-hover-bg: #0f0f0f;
+$pagination-hover-bg: #182840;
 $pagination-hover-color: #fff;
 $pagination-hover-border-color: #333;
 
 $pagination-disabled-bg: #282828;
 $pagination-disabled-border-color: #333;
 
-$pagination-focus-bg: #0f0f0f;
+$pagination-focus-bg: #182840;
 $pagination-focus-color: #f1f1f1;
 $pagination-focus-box-shadow: none;
 

resources/sass/common/reset.scss

@@ -22,6 +22,14 @@ label {
     cursor: pointer;
 }
 
+h5 {
+    color: #f1f1f1;
+}
+
+hr {
+    border-color: #eee;
+}
+
 a {
     text-decoration: none;
 

resources/sass/mobile/board/index.scss

@@ -8,6 +8,11 @@
     .board-name {
         font-weight: bold;
         margin-bottom: 0;
+        color: #f1f1f1;
+    }
+
+    hr {
+        border-color: #eee;
     }
 
     /* 게시판 목록 */
@@ -29,6 +34,7 @@
 
                     span {
                         font-size: 15px;
+                        color: #f1f1f1;
                     }
 
                     select {

resources/sass/mobile/board/view.scss

@@ -8,6 +8,7 @@
         h5 {
             font-weight: bold;
             margin-bottom: 0;
+            color: #f1f1f1;
         }
     }
 

resources/sass/mobile/board/write.scss

@@ -7,6 +7,11 @@
     > h5 {
         font-weight: bold;
         margin-bottom: 0;
+        color: #f1f1f1;
+    }
+
+    hr {
+        border-color: #eee;
     }
 
     .head {

resources/sass/mobile/layout.scss

@@ -44,6 +44,8 @@
 
     #navbarMenu {
         max-width: 290px;
+        background: #0f0f0f;
+        color: #b7b8ba;
 
         .offcanvas-header {
 
@@ -59,15 +61,11 @@
                 .dropdown {
                     height: inherit;
 
-                    .dropdown-menu {
-                        background-color: #fff;
-                        
-                        .dropdown-item {
-                            color: #333;
+                    .dropdown-item {
+                        color: #333;
 
-                            &:active {
-                                background: none;
-                            }
+                        &:active {
+                            background: none;
                         }
                     }
                 }
@@ -88,10 +86,6 @@
                     }
                 }
             }
-        }
-
-        .offcanvas-footer {
-            padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
 
             .ad-coupang {
                 height: auto;
@@ -100,13 +94,36 @@
 
                 small {
                     font-size: 11px;
-                    color: #bbbbbb;
+                    color: #b7b8ba;
                     line-height: 15px;
                     margin-top: 10px;
                     display: block;
                 }
             }
 
+            table {
+                width: 100%;
+
+                caption {
+                    caption-side: top;
+                    padding: 0 0;
+                    color: #b7b8ba;
+                }
+
+                tr {
+                    th {
+                        text-align: left;
+                        padding: 3px 0;
+                        font-weight: inherit;
+                    }
+
+                    td {
+                        text-align: right;
+                        padding: 3px 0;
+                    }
+                }
+            }
+
             address {
                 color: #8d8d8d;
                 font-size: 0.7rem;
@@ -120,7 +137,7 @@
 
 #main {
     flex-grow: 1;
-    background: #000;
+    background: #0f0f0f;
     padding: 10px 0;
 
     // 내 정보 네비
@@ -146,10 +163,10 @@
 }
 
 footer {
-    background: #000;
+    background: #0f0f0f;
     text-align: center;
     border-top: 1px solid #3d3d3d;
-    padding: 15px 16px 0 16px;
+    padding: 15px 16px 0 20px;
 
     small {
         font-size: 12px;
@@ -159,11 +176,11 @@ footer {
         display: block;
     }
 
-    // 하단
     address {
-        color: #7c7c7c;
-        padding: 8px 16px 0 16px;
-        font-size: 13px;
+        color: #839900;
+        font-size: 0.7rem;
+        margin-bottom: 0;
+        text-align: center;
     }
 }
 
@@ -173,10 +190,9 @@ footer {
     color: #c1c1c1;
 }
 
-.pagination {
+div.pagination {
     width: 100%;
-    overflow-x: auto;
-    
+
     > ul {
         width: inherit;
         display: flex;

resources/sass/mobile/main.scss

@@ -9,6 +9,7 @@
     max-height: 300px;
     --swiper-navigation-color: #fff;
     --swiper-pagination-color: #fff;
+    margin-top: -10px;
 
     .swiper-wrapper {
         min-height: inherit;

resources/sass/mobile/movie/rank.scss

@@ -1,6 +1,8 @@
 #movieRank {
     > h5 {
         font-weight: bold;
+        text-align: center;
+        padding: 0.938rem 0 0 0;
     }
 
     .rank-list {

resources/sass/mobile/movie/review.scss

@@ -9,6 +9,12 @@
             font-weight: normal;
         }
     }
+
+    > h5 {
+        font-weight: bold;
+        text-align: center;
+        padding: 0.938rem 0 0 0;
+    }
 }
 
 // 평점·후기 show

resources/sass/mobile/movie/search.scss

@@ -9,6 +9,8 @@ table {
 #movieSearch {
     > h5 {
         font-weight: bold;
+        text-align: center;
+        padding: 0.938rem 0 0 0;
     }
 
     .search-list {

resources/sass/mobile/movie/trailer.scss

@@ -1,6 +1,8 @@
 #movieTrailer {
     > h5 {
         font-weight: bold;
+        text-align: center;
+        padding: 0.938rem 0 0 0;
     }
 
     .trailer-list {

resources/sass/sub.scss

@@ -1,32 +0,0 @@
-// Fonts
-@import "common/font";
-
-// Variables
-@import 'variables';
-
-// Bootstrap
-@import 'bootstrap/scss/bootstrap';
-
-// Common
-@import 'common/reset';
-
-// 로그인
-@import 'common/auth/login';
-
-// 회원가입
-@import 'common/auth/register';
-
-// 비밀번호 재설정, 변경 처리
-@import 'common/auth/passwords';
-
-// 이메일 주소 확인
-@import 'common/auth/verify';
-
-// Jquery-ui
-@import url('jquery-ui/themes/base/all.css');
-@import url('jquery-ui/themes/base/datepicker.css');
-
-body {
-    background-color: #f0f0f0;
-}
-

resources/views/mobile/layouts/app.blade.php

@@ -85,7 +85,7 @@
         <nav class="navbar">
             <div class="container-fluid">
                 <button type="button" class="navbar-toggler" data-bs-toggle="offcanvas" data-bs-target="#navbarMenu" aria-controls="navbarMenu">
-                    <span class="navbar-toggler-icon"></span>
+                    <i class="fa-solid fa-bars"></i>
                 </button>
                 <a href="/" class="navbar-brand" target="_self">
                     {{ config('app.name') }}
@@ -139,14 +139,14 @@
                         @if($topMenu)
                         @php
                             $buildSubMenu = function ($categories) use (&$buildSubMenu, $subMenu) {
-                                $html = '<ul>';
+                                $html = '<ul class="dropdown-menu">';
                                 foreach ($categories as $cate) {
                                     $meta = $subMenu[$cate->id];
                                     $hasClass = "";
                                     if($meta->hasChildren) {
                                         $hasClass = 'class="has-children"';
                                     }
-                                    $html .= sprintf('<li %s><a href="%s" class="dropdown-item" target="%s" %s>%s</a>', $hasClass, $meta->url, $meta->target, $meta->custom, $meta->name);
+                                    $html .= sprintf('<li %s><a href="%s" class="dropdown-item" target="%s" %s>%s <small>($d)</small></a>', $hasClass, $meta->url, $meta->target, $meta->custom, $meta->name, $meta->postCount);
                                     $html .= $buildSubMenu($cate->children);
                                     $html .= '</li>';
                                 }
@@ -155,38 +155,54 @@
                             };
                         @endphp
                         @foreach($topMenu[0] as $row)
-                            <a href="{{ $row->url }}" target="{{ $row->target }}" {{ $row->custom }} class="nav-link @if(!$row->isLeaf) dropdown-toggle @endif"
-                               @if(!$row->isLeaf) data-bs-toggle="dropdown" role="button" aria-expanded="false" data-bs-offset="10,-5" @endif>
-                                {{ $row->name }}
-                            </a>
-                            @if($row->hasChildren)
-                                <ul class="dropdown-menu">
-                                    @foreach($row->children as $mn)
-                                        @php $meta = $subMenu[$mn->id]; @endphp
-                                        <li @if($meta->hasChildren) class="has-children" @endif>
-                                            <a href="{{ $meta->url }}" class="dropdown-item" target="{{ $meta->target }}" {{ $meta->custom }}>{{ $meta->name }}</a>
-                                            @if($meta->hasChildren)
-                                                @php echo $buildSubMenu($mn->children) @endphp
-                                            @endif
-                                        </li>
-                                    @endforeach
-                                </ul>
-                            @endif
+                            <div class="dropdown">
+                                <a href="{{ $row->url }}" target="{{ $row->target }}" {{ $row->custom }} class="nav-link @if(!$row->isLeaf) dropdown-toggle @endif"
+                                   @if(!$row->isLeaf) data-bs-toggle="dropdown" role="button" aria-expanded="false" data-bs-offset="0,-25" @endif>
+                                   {{ $row->name }} @if($row->board_id) <small>({{ $row->postCount }})</small> @endif
+                                </a>
+                                @if($row->hasChildren)
+                                    <ul class="dropdown-menu">
+                                        @foreach($row->children as $mn)
+                                            @php $meta = $subMenu[$mn->id]; @endphp
+                                            <li @if($meta->hasChildren) class="has-children" @endif>
+                                                <a href="{{ $meta->url }}" class="dropdown-item" target="{{ $meta->target }}" {{ $meta->custom }}>{{ $meta->name }}({{ $meta->postCount }})</a>
+                                                @if($meta->hasChildren)
+                                                    @php echo $buildSubMenu($mn->children) @endphp
+                                                @endif
+                                            </li>
+                                        @endforeach
+                                    </ul>
+                                @endif
+                            </div>
                         @endforeach
                         @endif
                     </div>
                 </nav>
-            </div>
-            <div class="offcanvas-footer">
-                 <!-- 쿠팡 광고 -->
+
+                <!-- 쿠팡 광고 -->
                 <div class="ad-coupang">
                     <iframe src="https://coupa.ng/cdvhzK" width="100%" height="75" frameborder="0" scrolling="no" referrerpolicy="unsafe-url"></iframe>
                     <iframe src="https://ads-partners.coupang.com/widgets.html?id=637907&template=carousel&trackingCode=AF0305179&subId=&width=100&height=140" width="100%" height="140" frameborder="0" scrolling="no" referrerpolicy="unsafe-url"></iframe>
                     <small>
-                        쿠팡 파트너스의 활동은 공정거래위원회의 심사지침에 따라 추천, 보증인인 파트너스 회원과 당사의 경제적 이해관계에 대하여 공개하여야 합니다.
+                        쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
                     </small>
                 </div>
                 <hr/>
+                <table>
+                    <caption>방문자 수</caption>
+                    <tr>
+                        <th>오늘</th>
+                        <td>{{ $visitorTodayCount }}</td>
+                    </tr>
+                    <tr>
+                        <th>어제</th>
+                        <td>{{ $visitorYesterdayCount }}</td>
+                    </tr>
+                    <tr>
+                        <th>누적</th>
+                        <td>{{ $visitorTotalCount }}</td>
+                    </tr>
+                </table>
                 <address>&copy; Copyright 2022 {{ config('company_name') }}</address>
             </div>
         </div>
@@ -199,13 +215,15 @@
 
     {{-- 하단 --}}
     <footer id="footer">
-        <small>
-            영화 내용에 대한 저작권 및 법적 책임은 영화진흥위원회, TMDB에 있습니다.
-        </small>
-
-        <address>
-            &copy; Copyright 2022 {{ config('company_name') }}
-        </address>
+        <div class="container-fluid">
+            <div class="row text-center text-md-start">
+                <div class="col ps-4 pe-4 pb-4">
+                    <address>
+                        &copy; Copyright 2022 {{ config('company_name') }}
+                    </address>
+                </div>
+            </div>
+        </div>
     </footer>
 
     @stack('scripts')