
@font-face {
    font-family: 'AppleSDGothicNeoSB';
    src: url(/common/front/img/event/font/AppleSDGothicNeoSB.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoSB.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoB';
    src: url(/common/front/img/event/font/AppleSDGothicNeoB.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoB.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoL';
    src: url(/common/front/img/event/font/AppleSDGothicNeoL.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoL.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoR';
    src: url(/common/front/img/event/font/AppleSDGothicNeoR.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoR.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoEB';
    src: url(/common/front/img/event/font/AppleSDGothicNeoEB.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoEB.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoM';
    src: url(/common/front/img/event/font/AppleSDGothicNeoM.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoM.woff) format('woff');
    }
    @font-face {
    font-family: 'AppleSDGothicNeoT';
    src: url(/common/front/img/event/font/AppleSDGothicNeoT.woff2) format('woff2'),
        url(/common/front/img/event/font/AppleSDGothicNeoT.woff) format('woff');
    }
    :root { 
        --main-color: #5f0580;
        --txt-color: #0e0e0e;
        /* --main-fonts: 'Roboto', 'Noto Sans KR', sans-serif; */
        --main-fonts: Pretendard,'Noto Sans KR', sans-serif;
        --main-bfonts: Pretendard,'Noto Sans KR', sans-serif;
        --main-letter-spacing: -.5px;
    } 
    #buy_lay_wrap {
        bottom: 45px !important;
    }
    ul, li {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    div {
        box-sizing: border-box;
    }
    a {
        text-decoration: none;
        color: #191919;
    }
    a:visited, a:hover {
        text-decoration: none;
    }
#header {
    position: relative;
    border-bottom: 1px solid #ebebeb;
}
#header.scroll {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 9999;
}
.titleName {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.back, .titleName {
    display: none;
    font-family: 'AppleSDGothicNeoSB';
    font-size: 15px;
}
.back img {
    width: 20px;
    height: 20px;
}
ul#menu > li {
    position: relative;
    padding: 10px 14px;
    border-bottom: 1px solid #ebebeb;
    text-align: left;
}
ul#menu > li .sub_cate {
    width: 100%;
    background: #f3f3f3;
    margin-top: 10px;
    padding: 15px 10px;
    box-sizing: border-box;
}
ul#menu > li .sub_cate > li > a {
    font-family: 'AppleSDGothicNeoSB';
    font-size: 12px;
    padding: 7px 0;
    display: block;
}
ul#menu > li > a {
    font-family: 'AppleSDGothicNeoSB';
    font-size: 13px;
    position: relative;
}
ul#menu > li > a.on {
    color: #9fc391;
}
ul#menu > li > a.on::after {
    content: '';
    width: 5px;
    height: 5px;
    background: #9fc391;
    border-radius: 3px;
    position: absolute;
    top: 2px;
    right: -8px;
}
ul#menu li .ct_op{
    display:inline-block;
    text-indent:-999px;
    background:url(/common/image/arrow/cate_op.gif) no-repeat 10px 50% ;
    height:40px;  
    width:32px;
    position:absolute; 
    top:0;
    right:5px;
    border:none;
}

ul#menu li .ct_cl {background-position:-11px 50%} 
ul#menu .sub_cate{display:none}

ul#menu .cate_tab {
    display: flex;
}
ul#menu .cate_tab li {
    width: calc(100% / 2);
    position: relative;
    color: #727272;
    text-align: center;
    padding: 10px 0; 
}
ul#menu .cate_tab li a {
    font-family: 'AppleSDGothicNeoSB';
    color: #727272; 
    font-size: 12px;
}
ul#menu .cate_tab li::after {
    position: absolute;
    top: 50%;
    right: -1px;
    transform: translate(0,-50%);
    content: '';
    width: 1px;
    height: 10px;
    background: #ebebeb;
}
ul#menu .cate_tab li:last-child::after {
    display: none;
}
ul#menu .subLi {
    background: #f3f3f3;
    color: #727272;
    font-size: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'AppleSDGothicNeoSB';
    font-size: 12px;
}
 ul#menu .subLi span {
    color: #727272;
    font-size: 12px;
    font-family: 'AppleSDGothicNeoSB';
}
ul#menu .subLi a {
    display: block;
    padding: 2px 8px;
    color: #a4a4a4;
    margin-left: 10px;
    font-size: 11px;
    font-family: 'AppleSDGothicNeoM';
    border-radius: 50px;
    border: 1px solid #e6e6e6;
}
ul#menu .welcome {
    display: block;
    font-family: 'Roboto','AppleSDGothicNeoSB';
    font-size: 14px;
    color: #191919; 
    overflow: hidden; 
    text-overflow: ellipsis;
    white-space: nowrap; 
    width: 100%;
}#header {
    width: 100%;
}
#header.scroll {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 9999;
}
label {
    margin-bottom: 0;
}
/* HEADER HAMBURGER */
.visuallyHidden {
	position: absolute; 
	overflow: hidden; 
	clip: rect(0 0 0 0); 
	height: 1px; width: 1px; 
	margin: -1px; padding: 0; border: 0; 
}
#header .ham .hamburger {
	margin: 0 auto;
	margin-top: 00px;
	width: 20px;
	height: 16px;
	position: relative;
	cursor: pointer;
}

#header .ham .hamburger .bar {
	padding: 0;
	width: 20px;
	height: 2px;
	background-color: #191919;
	display: block;
	border-radius: 0px;
	transition: all 0.3s ease-in-out;
	position: absolute; 
}
	
#header .ham .bar1 {
	top: 0;
}

#header .ham .bar2,
#header .ham .bar3 {
	top: 7px; 
}

#header .ham .bar3 {
	right: 0;
}

#header .ham .bar4 {
	bottom: 0;
}
#header .ham .hamburger4 .bar4 {
	top: 7px;
}

#header .ham .hamburger4 .bar5 {
	bottom: 0px;
}

#header .ham .hamburger4 .bar {
	transition: all 0.3s ease-in-out, transform 0.3s ease-in-out 0.3s;
}

#header .ham .hamburger4 .bar2 {
	width: 1px;
	transform: rotate(90deg);
	left: 13.5px;
}

#header .ham .hamburger4 .bar3 {
	width: 1px;
	left: 13.5px;
	
} 

#header .ham .checkbox4:checked + label > .hamburger4 > .bar1{
	top: 7px;
	background-color: transparent;
}

#header .ham .checkbox4:checked + label > .hamburger4 > .bar2{
	left: 0px;
	width: 20px;
	transform: rotate(45deg);
}

#header .ham .checkbox4:checked + label > .hamburger4 > .bar3{
	left: 0;
	width: 20px;
	transform: rotate(-45deg);
}

#header .ham .checkbox4:checked + label > .hamburger4 > .bar4{
	background-color: transparent;
}

#header .ham .checkbox4:checked + label > .hamburger4 > .bar5{
	bottom: 13.5px;
	background-color: transparent; 
}
#header .gnb_top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px;
	position: relative;
    max-width: 720px;
    margin: 0 auto;
	box-sizing: border-box;
}
#header .gnb_top a img {
	height: 13px;
}
#menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 80%; 
    height: 100%;
    box-shadow: 0 0 10px #cecece;
    z-index: 99;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
    transform-origin: 0 0;
    transform: translate(-200%,0);
	max-width: 570px;
    transition: transform .5s cubic-bezier(0.77,0.2,0.05,1.0);
}
#header .ham .checkbox4:checked ~ ul {
    transform: none; 
} 
#container .topTitle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px; 
    padding-bottom: 5px;
    border-bottom: 2px solid #191919;
}
#container .topTitle p {
    font-family: 'AppleSDGothicNeoB';
    font-size: 15px;
    color: #191919;
}
#container .topTitle a {
    font-family: 'AppleSDGothicNeoSB';
    font-size: 13px;
    color: #6d6e71;
} 