﻿body {
}

ul, li {
    list-style: none;
}

.slide {
    width: 750px;
    height: 400px;
    position: absolute;
    top: 89px;
    left: 70px;
    overflow-x: hidden;
}

.slide ul {
    transition: 1s;
    width: 1500px;
}

.slide li {
    width: 120px;
    height: 95px;
    margin: 37px 5px 0px 0px;
    transition: 1s;
    background-repeat: no-repeat;
    float: left;
}

.slide li span {
    position: relative;
    top: 10px;
    font-family: 돋움;
    font-size: 13px;
    color: #7f7f7f;
    font-weight: bold;
    letter-spacing: -0.4px;
    transition: 1s;
    width: 100%;
}

.slide li img {
    cursor: pointer;
    transition: 1s;
    width: 115px;
    height: auto;
    box-shadow: 5px 5px 5px #8C8085;
    border-radius: 5px;
}

.slide li p {
    display: block;
    height: 0px;
    overflow-x: hidden;
    margin-top: 5px;
}

.slide li p img {
    height: 0px;
}

.slide input {
    display: none;
}

/* 슬라이드 조작 */
#pos1:checked ~ ul {
    margin-left: 250px;
}

#pos1:checked ~ ul li:nth-child(1) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos1:checked ~ ul li:nth-child(1) span {
    display: none;
    transition: 1s;
}

#pos1:checked ~ ul li:nth-child(1) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos1:checked ~ ul li:nth-child(1) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos1:checked ~ ul li:nth-child(1) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos2:checked ~ ul {
    margin-left: 125px;
}

#pos2:checked ~ ul li:nth-child(2) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos2:checked ~ ul li:nth-child(2) span {
    display: none;
    transition: 1s;
}

#pos2:checked ~ ul li:nth-child(2) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos2:checked ~ ul li:nth-child(2) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos2:checked ~ ul li:nth-child(2) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos3:checked ~ ul {
    margin-left: 0px;
}

#pos3:checked ~ ul li:nth-child(3) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos3:checked ~ ul li:nth-child(3) span {
    display: none;
    transition: 1s;
}

#pos3:checked ~ ul li:nth-child(3) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos3:checked ~ ul li:nth-child(3) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos3:checked ~ ul li:nth-child(3) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos4:checked ~ ul {
    margin-left: -125px;
}

#pos4:checked ~ ul li:nth-child(4) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos4:checked ~ ul li:nth-child(4) span {
    display: none;
    transition: 1s;
}

#pos4:checked ~ ul li:nth-child(4) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos4:checked ~ ul li:nth-child(4) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos4:checked ~ ul li:nth-child(4) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos5:checked ~ ul {
    margin-left: -250px;
}

#pos5:checked ~ ul li:nth-child(5) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos5:checked ~ ul li:nth-child(5) span {
    display: none;
    transition: 1s;
}

#pos5:checked ~ ul li:nth-child(5) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos5:checked ~ ul li:nth-child(5) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos5:checked ~ ul li:nth-child(5) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos6:checked ~ ul {
    margin-left: -375px;
}

#pos6:checked ~ ul li:nth-child(6) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos6:checked ~ ul li:nth-child(6) span {
    display: none;
    transition: 1s;
}

#pos6:checked ~ ul li:nth-child(6) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos6:checked ~ ul li:nth-child(6) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos6:checked ~ ul li:nth-child(6) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos7:checked ~ ul {
    margin-left: -500px;
}

#pos7:checked ~ ul li:nth-child(7) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos7:checked ~ ul li:nth-child(7) span {
    display: none;
    transition: 1s;
}

#pos7:checked ~ ul li:nth-child(7) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos7:checked ~ ul li:nth-child(7) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos7:checked ~ ul li:nth-child(7) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos8:checked ~ ul {
    margin-left: -625px;
}

#pos8:checked ~ ul li:nth-child(8) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos8:checked ~ ul li:nth-child(8) span {
    display: none;
    transition: 1s;
}

#pos8:checked ~ ul li:nth-child(8) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos8:checked ~ ul li:nth-child(8) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos8:checked ~ ul li:nth-child(8) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos9:checked ~ ul {
    margin-left: -750px;
}

#pos9:checked ~ ul li:nth-child(9) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos9:checked ~ ul li:nth-child(9) span {
    display: none;
    transition: 1s;
}

#pos9:checked ~ ul li:nth-child(9) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos9:checked ~ ul li:nth-child(9) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos9:checked ~ ul li:nth-child(9) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#pos10:checked ~ ul {
    margin-left: -875px;
}

#pos10:checked ~ ul li:nth-child(10) {
    width: 186px;
    height: 144px;
    margin: 0px 34px 0px 32px;
    border-radius: 4px;
    transition: 1s;
}

#pos10:checked ~ ul li:nth-child(10) span {
    display: none;
    transition: 1s;
}

#pos10:checked ~ ul li:nth-child(10) img {
    width: 180px;
    transition: 1s;
    box-shadow: none;
}

#pos10:checked ~ ul li:nth-child(10) p {
    transition: 1s;
    width: 186px;
    height: 85px;
}

#pos10:checked ~ ul li:nth-child(10) p img {
    transition: 1s;
    height: auto;
    width: 95%;
    float: left;
}

#img1 {
    position: absolute;
    top: 40px;
    right: 25px;
}

#img2 {
    position: absolute;
    top: 40px;
    right: 25px;
    display: none;
}

#img3 {
    position: absolute;
    top: 40px;
    right: 25px;
    display: none;
}

#menu_sms {
    position: absolute;
    top: 40px;
    right: 223px;
    width: 99px;
    height: 25px;
    z-index: 100;
}

#menu_mms {
    position: absolute;
    top: 40px;
    right: 124px;
    width: 99px;
    height: 25px;
    z-index: 100;
}

#menu_lms {
    position: absolute;
    top: 40px;
    right: 25px;
    width: 99px;
    height: 25px;
    z-index: 100;
}

#btn_left {
    position: absolute;
    top: 145px;
    left: 15px;
    z-index: 10;
}

#btn_right {
    position: absolute;
    top: 145px;
    right: 25px;
    z-index: 10;
}

#banner_num_01 {
    position: absolute;
    z-index: 10;
    top: 289px;
    right: 86px;
    display: block;
}

#banner_num_02 {
    position: absolute;
    z-index: 10;
    top: 289px;
    right: 69px;
    display: none;
}

#banner_event_name {
    position: absolute;
    z-index: 10;
    top: 288px;
    right: 233px;
    display: block;
}

#banner_event_image01 {
    position: absolute;
    z-index: 10;
    top: 310px;
    right: 15px;
    display: block;
    cursor: pointer;
}

#banner_event_image02 {
    position: absolute;
    z-index: 10;
    top: 310px;
    right: 15px;
    display: none;
    cursor: pointer;
    display: none;
}

#banner_price {
    position: absolute;
    z-index: 10;
    top: 308px;
    left: 42px;
    cursor: pointer;
}