@charset "utf-8";

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400&display=swap");


*{ margin:0;padding:0;list-style:none; border:0;background:none; text-decoration:none; }
img{ max-width:100%; vertical-align:top; }
html, body{height:100%;/* padding: 0 0 50px 0; */}

.img_hidden{ position: absolute;left:-9999px;top:0; }
.img_hidden img{ width:1px; }

.smile_box{ font-family:'Noto Sans KR','돋움',sans-serif;background: url(../img/background_bg.png) 0 0 no-repeat;background-size: cover;}
.smile_box .in{overflow: hidden;position: relative;}
.smile_box .tit{ display: block; padding: 31.9792vw 37.9167vw 0;}
.smile_box .tit img{  }

.smile_box .rolling_box{padding: 2.1875vw 33.1625vw 16.7708vw;}
.smile_box .rolling_box .box_tit{ display: inline-block; position: relative; left:0px; margin-bottom:15px;}
.smile_box .rolling_box .box_tit .down_tit{ height:40px;position: relative;z-index: 2; }
.smile_box .rolling_box .box_tit .balloon{ height:73px; position: absolute;left:100%;bottom:0; margin:0 0 -7px -10px; z-index: 1; display: none;}

.smile_box .rolling_box .rolling_area{ position: relative; padding-bottom:20px; }
.smile_box .rolling_box .rolling_area .swiper-slide{}
.smile_box .rolling_box .rolling_area .swiper-slide a{ display: block; position: relative; }
.smile_box .rolling_box .rolling_area .swiper-slide a img{ position: relative;z-index: 1; }
.smile_box .rolling_box .rolling_area .swiper-slide a:before{ content:"";display: block;width:24px;height:24px;background:url(../img/btn_down.png) 0 0 no-repeat; background-size:100%; position: absolute;right:5px;bottom:5px; z-index: 2; }
.smile_box .swiper-container-horizontal>.swiper-scrollbar{ height:3px;}

.smile_box .swiper-scrollbar{ background:rgba(255,255,255,0.3); }
.smile_box .swiper-scrollbar-drag{ background:rgba(255,255,255,0.8); }


.smile_pop{position: fixed;left:0;top:0;right:0;bottom:0;z-index: 1000;display: none;/* padding-top: 100px; */}
.smile_pop .smile_dim{ background:rgba(0,0,0,0.6);position: absolute;left:0;top:0;right:0;bottom:0;z-index: 1; }
.smile_pop .in{position: absolute;left:50%;top:50%;transform:translate(-50%,-50%);width: calc( 100% - 46px );z-index: 2;}
.smile_pop .in .img{position: relative;height: 78vh;}
.smile_pop .in .img img{position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;object-fit: cover;height: 100%;}
.smile_pop .in .btn_down{ width:100%;padding:12px 0 17PX;text-align:center; font-size:14px;color: #fff; display: block;background: linear-gradient(to right, #4234ec, #99008e);}
.smile_pop .in .btn_down:after{ content:"";display: inline-block;width:15px;height:18px;background:url(../img/down_blit.png) 0 0 no-repeat; background-size:100%; margin-left:13px;position: relative;top:3px;}

.smile_pop .in .balloon_box{ background:url(../img/bg_balloon.png) 0 0 no-repeat;text-align:center; position: absolute;left:10px;right:10px;bottom:15px; background-size:100% 100%;}
.smile_pop .in .balloon_box p{ padding:12px 0 20px; font-size:11px;line-height:20px; letter-spacing:-1px; }
.smile_pop .in .balloon_box p strong{  display: block;font-size:11px;line-height:20px; font-weight:bold;letter-spacing:-1px; }


.smile_pop .in .close{position:relative;display: block;overflow: hidden; width:20px;height:20px;line-height:1000px;background:url(../img/btn_close.png) 0 0 no-repeat; background-size:100%; position: absolute;right:0;top:-30px;}

.allDownBtn{/* padding: 7.9688vw 34.2708vw 5.2083vw; */}
/* bottom */

#bottom{position:fixed;left:0;bottom:0;width:100%;height:50px;z-index:99;background:#1a1a1a}

#bottom .btm_back{display:block;float:left;width:49px;height:50px;margin-left:6px;background:url("../../images/sp_bottom.png") no-repeat -6px 0;background-size:360px 100px;text-indent:-9999em}

#bottom .btm_back:active{background:url("../../images/sp_bottom.png") no-repeat -6px -50px;background-size:360px 100px}

#bottom .btm_home{display:block;float:left;width:49px;height:50px;background:url("../../images/sp_bottom.png") no-repeat -55px 0;background-size:360px 100px;text-indent:-9999em}

#bottom .btm_home:active{background:url("../../images/sp_bottom.png") no-repeat -55px -50px;background-size:360px 100px}

#bottom .btm_r{display:block;float:right;margin-right:12px;padding:0 12px;line-height:50px;font-size:1em;font-weight:bold;color:#333;text-align:center}

#bottom .btm_r:active{color:#666}

#bottom .on{color:#fff;text-align:center}

#bottom .on:active{color:#666}

#bottom .btm_one{display:block;width:100%;line-height:50px;font-size:1em;font-weight:bold;color:#fff;text-align:center}

#bottom .btm_one:active{color:#666}

#bottom .btm_refresh{display:block;float:left;width:49px;height:50px;background:url("../../images/sp_bottom.png") no-repeat -104px 0;background-size:360px 100px;text-indent:-9999em}

#bottom .btm_refresh:active{background:url("../../images/sp_bottom.png") no-repeat -104px -50px;background-size:360px 100px}

@media screen and (max-width:380px) {
  .smile_box .rolling_box{  }
  .smile_box .tit + .rolling_box{ }
  .smile_box .rolling_box .box_tit{  }
  .smile_box .rolling_box .box_tit .down_tit{ height:32px; }
  .smile_box .rolling_box .box_tit .balloon{ height:60px; }
  .smile_pop .in{ width: calc( 100% - 60px ); }
  .smile_pop .in .balloon_box{ left:0;right:0; }
  .smile_pop .in .balloon_box p{ font-size:10px; }

  .profiles.smile_pop .in .close{ top:-30px;right:0; }
}

@media screen and (max-height:570px) {
  .smile_pop .in .close{ top:0;right:-25px; }
}

.photoArea{}
.photoArea ul{display: flex;}
.photoArea ul>li{width: 100%;margin-right: 2.4479vw;/* border: 0.4167vw solid #fff; *//* border-radius: 1vw; */position: relative;/* overflow: hidden; */}
.photoArea ul>li:last-child{margin-right: 0;}
.photoArea ul>li a{display: block;width: 100%;position: relative;/* top: -6px; *//* border: 1px solid #fff; */z-index: 1;/* border-radius: 0 0 1vw 1vw; *//* overflow: hidden; */position: absolute;bottom: 0;left: 0;width: 100%;height: 5vw;z-index: 20;}
.photoArea ul>li img{width: 100%;display: block;}
.photoArea ul>li>img{/* border: 0.4167vw solid #fff; *//* border-radius: 0.5vw; */z-index: 10;position: relative;width: 15.5208vw;/* height: 34.3750vw; */position: relative;}
.allDownBtn{display: block;position: relative;z-index: 99;position: absolute;bottom: 4vw;height: 4vw;left: 50%;width: 33vw;transform: translateX(-50%);z-index: 1000;}
.allDownBtn a{display: block;width: 100%;}