body { margin:0;padding:0; }
* { font-family: 'Roboto', 'Open Sans', 'Lora', sans-serif; }
button, a, select { outline:none; }
select option { border-radius: 0px !important; }

::-webkit-scrollbar {
  width: 8px; /* 스크롤바 너비 */
}

::-webkit-scrollbar-thumb {
  background-color: #1f2630; /* 스크롤바 핸들 색상 */
  border-radius: 4px; /* 핸들의 둥글기 */
}

::-webkit-scrollbar-thumb:hover {
  background-color: #2d3748; /* 핸들을 호버했을 때 색상 */
}

::-webkit-scrollbar-track {
  background: transparent; /* 스크롤바 트랙 색상 */
}

main { min-height: calc(100vh - 210px) !important;}

.loading {  
    position:fixed;
    width:100%;
    height:100%;
    background-color: rgba(0,0,0,0.3);
}

.loading img {
    position:fixed;
    top:calc(50% - 35px);
    left:calc(50% - 35px);
    padding:20px;
    background-color: rgba(0,0,0,0.7);
    border-radius: 1rem;
}

.gcontainer {
    width:100%;
    max-width: 1280px;
    margin:0 auto;
}

.sky {
    height: 32px;
}

.gtab { position:relative;overflow:hidden;height: 32px; }

.gtab button {
    border-width: 1px;
    border-style: solid;
    border-top-left-radius: 0.4rem;
    border-top-right-radius: 0.4rem;
    margin-top:5px;
    padding:0 10px;
}

.gtab button.active { border-bottom:none; }

.dropdown { display:inline-block;min-width:80px;position: relative; }
.dropdown ul { padding:0;margin:0;border-radius: 0px;position:absolute;left:0;z-index:100; }

.hx60 { height:60px;overflow:hidden; }

.border-last-none:last-child { border:none; }
.input-group input { border-top-left-radius: 0.3rem;border-bottom-left-radius: 0.3rem; }
.input-group button { border-top-right-radius: 0.3rem;border-bottom-right-radius: 0.3rem;border-left:none; }

.t-10 { top:10px; }
.t-15 { top:15px; }
.t-20 { top:20px; }
.t-25 { top:25px; }
.t-30 { top:30px; }
.t-35 { top:35px; }
.t-40 { top:40px; }
.t-45 { top:45px; }
.t-50 { top:50px; }
.t-55 { top:55px; }

.wrap-gray { 
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    min-width: 100vw;
    min-height: 100vh;
    background-color: rgba(0,0,0,0.3); 
    z-index:100;
}

.gtable { border:none; }
table.gtable thead th { min-height: 30px;text-align: center;padding:8px 0; }
table.gtable tbody td { min-height: 30px;text-align: center;padding:8px 0 }
table.gtable tbody tr:last-child { border: none;}
table.gtable tbody tr { cursor:pointer; }

.last-hide:last-child { border:none; }

.w-50 { width:50%; }

.lato-thin {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.lato-light {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.lato-thin-italic {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.lato-light-italic {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.lato-regular-italic {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.lato-bold-italic {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.lato-black-italic {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.roboto-thin {
  font-family: "Roboto", serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", serif;
  font-weight: 900;
  font-style: italic;
}

.playwrite-de-grund-guides-regular {
  font-family: "Playwrite DE Grund Guides", cursive;
  font-weight: 400;
  font-style: normal;
}

.christmas-banner {
  background-image: url('/images/banner/Christmas_bg.png');
  background-size: cover;
  background-position:left 0px bottom -250px;
}

.christmas-banner-mobile {
  background-image: url('/images/banner/Christmas_bg.png');
  background-size: cover;
}

.banner1 {
  background-image: url('/images/thumbnail/review.jpg');
  background-size: cover;
  background-position: center;
}

.banner2 {
  background-image: url('/images/thumbnail/cloud.jpg');
  background-size: cover;
  background-position: center;
}