movie/public/css/desktop/layout.css

html,body{min-width:1024px;height:100vh}@supports(-webkit-touch-callout: none){html,body{height:-webkit-fill-available}}#app{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap}#header{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:60px;min-height:60px;background:#012a4f;border-bottom:1px solid #444}#header article:nth-of-type(1){-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:left}#header article:nth-of-type(1) a{font-size:30px;font-family:"Open-Sans-Extrabold";color:#e8e8e8}#header article:nth-of-type(1) a:hover,#header article:nth-of-type(1) a:focus,#header article:nth-of-type(1) a:active{color:#fff;text-decoration:none}#header article:nth-of-type(2){-webkit-box-flex:.5;-ms-flex-positive:.5;flex-grow:.5;height:70%}#header article:nth-of-type(2) form{position:relative;display:block;height:100%}#header article:nth-of-type(2) form::after{display:block;clear:both;content:""}#header article:nth-of-type(2) form input{float:left;width:90%;height:inherit;border-width:1px 0 1px 1px;border-top-left-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px;border-color:#444;padding-left:8px;font-weight:normal;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}#header article:nth-of-type(2) form input::-ms-clear,#header article:nth-of-type(2) form input::-ms-reveal{display:none;width:0;height:0}#header article:nth-of-type(2) form input::-webkit-search-decoration,#header article:nth-of-type(2) form input::-webkit-search-cancel-button,#header article:nth-of-type(2) form input::-webkit-search-results-button,#header article:nth-of-type(2) form input::-webkit-search-results-decoration{display:none}#header article:nth-of-type(2) form input:hover,#header article:nth-of-type(2) form input:focus,#header article:nth-of-type(2) form input:active{outline:none}#header article:nth-of-type(2) form button{float:left;width:10%;max-width:35px;height:inherit;border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0;border-width:1px 1px 1px 0;border-color:#444;padding:0;cursor:pointer;background:#fff}#header article:nth-of-type(2) form button:hover,#header article:nth-of-type(2) form button:focus,#header article:nth-of-type(2) form button:active{background:#eee}#header article:nth-of-type(3){-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}#header article:nth-of-type(3) ul{-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#header article:nth-of-type(3) ul li{color:hsla(0,0%,100%,.7)}#header article:nth-of-type(3) ul li a{height:initial}#header article:nth-of-type(3) ul li span{vertical-align:middle}#header article:nth-of-type(3) ul li .dropdown{background:rgba(0,0,0,0)}#header article:nth-of-type(3) ul li .dropdown .dropdown-menu{background:#f1f1f1}#header article:nth-of-type(3) ul li .dropdown .dropdown-menu .dropdown-item{color:#0f0f0f}#aside{background:#151723;border-bottom:1px solid #333}#aside #nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;gap:10px}#aside #nav>a.nav-link{padding:10px 0;color:#bbb}#aside #nav>a.nav-link:hover,#aside #nav>a.nav-link:focus{font-weight:bold;color:#bbb}#aside #nav ul{margin-bottom:auto}#aside #nav ul li.active a{font-weight:bold;color:#bbb}#aside #nav ul li a{line-height:24px;color:#bbb}#aside #nav ul li a:hover,#aside #nav ul li a:focus{font-weight:bold;color:#bbb}#main{position:relative;background:#0d0d0d;padding:20px 10px 50px 10px}footer{background:#000;text-align:center;border-top:1px solid #3d3d3d}footer .ad-coupang{padding:15px 16px 0 16px;height:auto;margin-top:auto;line-height:0}footer .ad-coupang small{padding-top:20px;font-size:12px;color:#bbb;line-height:15px;margin-top:10px;display:block}footer address{color:#7c7c7c;padding:8px 16px 0 16px;font-size:13px}.pagination{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0;margin:0}.pagination ul{margin:0;padding:0}.pagination ul li a:hover,.pagination ul li a:focus,.pagination ul li a:active{text-decoration:none}  color: #bbbbbb;
}
#aside #nav ul {
  margin-bottom: auto;
}
#aside #nav ul li.active a {
  font-weight: bold;
  color: #bbbbbb;
}
#aside #nav ul li a {
  line-height: 24px;
  color: #bbbbbb;
}
#aside #nav ul li a:hover, #aside #nav ul li a:focus {
  font-weight: bold;
  color: #bbbbbb;
}

/* 메인 */
#main {
  position: relative;
  background: #0d0d0d;
  padding: 20px 10px 50px 10px;
}

footer {
  background: #000;
  text-align: center;
  border-top: 1px solid #3d3d3d;
}
footer .ad-coupang {
  padding: 15px 16px 0 16px;
  height: auto;
  margin-top: auto;
  line-height: 0;
}
footer .ad-coupang small {
  padding-top: 20px;
  font-size: 12px;
  color: #bbbbbb;
  line-height: 15px;
  margin-top: 10px;
  display: block;
}
footer address {
  color: #7c7c7c;
  padding: 8px 16px 0 16px;
  font-size: 13px;
}

.pagination {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  margin: 0;
}
.pagination ul {
  margin: 0;
  padding: 0;
}
.pagination ul li a:hover, .pagination ul li a:focus, .pagination ul li a:active {
  text-decoration: none;
}