/* BASIC css start */
html {
  scroll-behavior: smooth;
}

#overlay_layer {
  display: none;
}

/* max-width 초기화 */
#layout_body {
  max-width: none !important;
}

.top-area {
  /*max-width: 1140px;*/
  margin: 0 auto;
}
.header__line-banner{
    margin: 0 auto;
}

.wrap {
  position: relative;
  width: 100%;
  min-width: 1140px;
}
.wrap * {
  font-family: YoonGothic !important;
}
.wrap img {
    max-width: none;
    margin:0 auto;
    display:block;
}

/*-------------------------------------*/

.btns{display:block; width:938px; margin:120px auto 0px; position:relative;}


/*slider next,prev btn*/
.slideWrap .swiper-container .swiper-button-next, .slideWrap .swiper-container .swiper-button-prev{width:37px; height:57px; top:48%;}
.slideWrap .swiper-container .swiper-button-next{background:url("/design/skinfood/event/DY5_5-arrwR.png") no-repeat center; background-size:cover; right:calc(50% - 539px);}
.slideWrap .swiper-container .swiper-button-prev{background:url("/design/skinfood/event/DY5_5-arrwL.png") no-repeat center; background-size:cover; left:calc(50% - 539px);}
.slideWrap .swiper-button-next:after, .slideWrap .swiper-button-prev:after{display:none;}

#box2Slider .swiper-button-next{background:url("/design/skinfood/event/DY5_2-arrwR.png") no-repeat center; background-size:cover;}
#box2Slider .swiper-button-prev{background:url("/design/skinfood/event/DY5_2-arrwL.png") no-repeat center; background-size:cover;}


/*slider pagination*/
.slideWrap .swiper-container{overflow:visible !important;}
.swiper-container .swiper-pagination{bottom:-60px !important; left:0px !important;}
.swiper-container .swiper-pagination .swiper-pagination-bullet{width:25px; height:25px; border-radius:50%; background:#ffffff; margin:0 6px !important; opacity:1 !important;}

#box2Slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#000000;}
#box3Slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#000000;}
#box5Slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#000000;}

#box2Slider .swiper-pagination{bottom:-60px !important;}
#box3Slider .swiper-pagination{bottom:-77px !important;}
#box5Slider .swiper-pagination{bottom:-65px !important;}

/*4 items slider*/
.slideWrap .grid4-slider ul li{position:relative;}
.slideWrap .grid4-slider ul li a{display:block; width:463px; height:49.5%; opacity:0;}
.slideWrap .grid4-slider ul li a:nth-child(2){position:absolute; top:0; left:calc(50% - 470px); background:red;}
.slideWrap .grid4-slider ul li a:nth-child(3){position:absolute; top:0; right:calc(50% - 470px); background:blue;}
.slideWrap .grid4-slider ul li a:nth-child(4){position:absolute; bottom:0px; left:calc(50% - 470px); background:green;}
.slideWrap .grid4-slider ul li a:nth-child(5){position:absolute; bottom:0px; right:calc(50% - 470px); background:orange;}

/*2 items slider*/
.slideWrap .grid2-slider ul li{position:relative;}
.slideWrap .grid2-slider ul li a{display:block; width:938px; height:50%; opacity:0;}
.slideWrap .grid2-slider ul li a:nth-child(2){position:absolute; top:0; left:calc(50% - 938px/2); background:red;}
.slideWrap .grid2-slider ul li a:nth-child(3){position:absolute; bottom:0; left:calc(50% - 938px/2); background:blue;}

/*on header fixed*/
#box2.fixed{padding-top:130px;}

/*target point*/
.posrel{position:relative;}
#tar1{position:absolute; top:-100px; left:0; display:block; width:100%; height:0;}
#tar2{position:absolute; top:-100px; left:0; display:block; width:100%; height:0;}
#tar3{position:absolute; top:-100px; left:0; display:block; width:100%; height:0;}
#tar4{position:absolute; top:-100px; left:0; display:block; width:100%; height:0;}
#tar5{position:absolute; top:-100px; left:0; display:block; width:100%; height:0;}

/*intro*/
#intro{height:1438px; background:url("/design/skinfood/event/DY5_1-bg.jpg") no-repeat center; background-size:cover; overflow:hidden; position:relative;}
#intro img{display:block; margin:0 auto;}
#intro .top{margin:35px auto 0;}
#intro .tit{position:relative; margin:100px auto 0;}

#box1Slider{margin:100px auto 0;}
#box1Slider ul.swiper-wrapper{transition-timing-function : linear;}
#box1Slider ul.swiper-wrapper li.swiper-slide{width:auto; margin:0 9px;}

/*header*/
#header{text-align:center; display:flex; background:#ffffff; width:100%; justify-content:center; position:static; opacity:1;}
#header.fixed{position:fixed; top:0; left:0; z-index:9999;}
#header a.menu{position:relative;}
#header a.menu:after{content:""; display:block; width:1px; height:100px; background:#c1c1c1; position:absolute; top:17px; right:0;}
#header a.menu:nth-last-child(1):after{display:none;}
#header a.menu img{height:131px;}
#header a.menu img:nth-child(2){position:absolute; top:0; left:0; opacity:0;}
#header a.menu.select img:nth-child(1){opacity:0;}
#header a.menu.select img:nth-child(2){opacity:1;}

/*box2*/
#box2{height:1917px; background:url("/design/skinfood/event/DY5_2-bg.jpg") no-repeat center; background-size:cover; overflow:hidden; position:relative;}
#box2 .tit{padding:230px 0 103px;}

/*box3*/
#box3{height:2214px; background:url("/design/skinfood/event/DY5_3-bg.jpg") no-repeat center; background-size:cover; overflow:hidden;}
#box3 .tit{padding:230px 0 86px;}

#box3 .countdown{text-align:center; padding:0 0 85px;}
#box3 .countdown p{display:inline-block;}
#box3 .countdown p span{display:inline-block; color:#fff; font-weight:600; font-size:68px; padding:30px 0;}
#box3 .countdown p.hours span, #box3 .countdown p.mins span, #box3 .countdown p.secs span{background:rgba(0, 0, 0, 1); width:116px; border-radius:33px; margin:0 5px; line-height:1;}
#box3 .countdown p.dash span{margin:0 5px; color:#000; line-height:1;}

#box3 .slideWrap ul.slideTab{display:flex; flex-wrap:wrap; width:936px; height:126px; margin:0 auto; background:url("/design/skinfood/event/DY5_3-tab1.png") no-repeat center; background-size:cover;}
#box3 .slideWrap ul.slideTab li{flex-basis:25%; padding:30px 0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; cursor:pointer; border-radius:80px;}
#box3 .slideWrap ul.slideTab li p{width:100%; text-align:center; font-size:36px; line-height:1; color:#fff;}
#box3 .slideWrap ul.slideTab li p span{display:block; width:100%; text-align:center; font-size:42px; line-height:1; font-weight:bold; padding-top:6px;}

#box3Slider{height:830px;}
#box3Slider ul li a{z-index:2; border-radius:0px; width:468px; height:100%; opacity:0;}
#box3Slider ul li a:nth-child(3){left:calc(50% - 0px);}
#box3Slider ul li.first p.tags > img.tag1{display:block;}
#box3Slider ul li p.tags{display:none; width:934px; height:100%; background:rgba(0,0,0,0.55); position:absolute; top:0; left:calc(50% - 942px/2 + 4px); border-bottom-left-radius:42px; border-bottom-right-radius:42px; z-index:3;}
#box3Slider ul li p.tags > img{margin:auto; display:none;}

#box3Slider ul li.blurr > img{filter: blur(4px); -webkit-filter: blur(4px);}
#box3Slider ul li.blurr p.tags{display:flex;}

#box3 .btns a{display:none;}
#box3 .btns a:nth-child(1){display:block;}

/*box4*/
#box4{height:2203px; background:url("/design/skinfood/event/DY5_4-bg.jpg") no-repeat center; background-size:cover; overflow:hidden;}
#box4 .tit{padding:215px 0 118px;}
#box4 .prds{position:relative;}
#box4 .prds a{display:block; width:465px; height:50%; opacity:0;}
#box4 .prds a:nth-child(2){position:absolute; top:0; left:calc(50% - 470px); background:red;}
#box4 .prds a:nth-child(3){position:absolute; top:0; right:calc(50% - 470px); background:blue;}
#box4 .prds a:nth-child(4){position:absolute; bottom:0; left:calc(50% - 470px); background:green;}
#box4 .prds a:nth-child(5){position:absolute; bottom:0; right:calc(50% - 470px); background:orange;}

/*box5*/
#box5{height:2000px; background:url("/design/skinfood/event/DY5_5-bg.jpg") no-repeat center; background-size:cover; overflow:hidden;}
#box5 img.tit{padding:248px 0 116px;}
#box5Slider ul li a{display:block; margin:0 auto; width:940px;}

/*box6*/
#box6{height:2489px; background:url("/design/skinfood/event/DY5_6-bg.jpg") no-repeat center; background-size:cover; overflow:hidden;}
#box6 img.tit{padding:230px 0 119px;}
#box6 .prds{position:relative;}
#box6 .prds a{display:block; width:465px; height:50%; opacity:0;}
#box6 .prds a:nth-child(2){position:absolute; top:0; left:calc(50% - 470px); background:red;}
#box6 .prds a:nth-child(3){position:absolute; top:0; right:calc(50% - 470px); background:blue;}
#box6 .prds a:nth-child(4){position:absolute; bottom:0; left:calc(50% - 470px); background:green;}
#box6 .prds a:nth-child(5){position:absolute; bottom:0; right:calc(50% - 470px); background:orange;}
#box6 .btns{margin:133px auto 0;}

/*box7*/
#box7 a{display:block;}
#box7 a:nth-child(1){background:#ff6b80;}
#box7 a:nth-child(2){background:#ffdad6;}
#box7 a:nth-child(3){background:#fff3de;}

/*caution*/
#caution{position:relative; background:#0e0e0e;}
#caution img{display:block; margin:0 auto;}


/* BASIC css end */