@charset 'UTF-8'; #header {position:relative;background:#fff;height:5rem;} #header .topbar {line-height:5rem;color:#222;font-size:2rem; text-align:center;} #header .topbar a {display:inline-block;background-size:100% auto;background-repeat:no-repeat;background-position:center;vertical-align:middle;} #header .topbar .logo_daum {width:7.6rem;background-image:url(../images/logo_daum.png); text-indent:-99999px;} #header .topbar .logo_kor {margin-top:-0.5rem;width:15.6rem; background-image:url(../images/logo_kor_b.png); text-indent:-99999px;} #header .topbar b {font-weight:800;} #font_size {font-weight: 200; font-size: 1.3rem;} /*공통*/ #main {position:relative;} section{position:relative;text-align:center; overflow:hidden;} .content {position:relative;padding-top:11rem;width:100%; max-width:130rem;margin:0 auto;} .content h3 {display:inline-block;margin:0 auto; font-size:3rem; color:#fff; font-weight:700;border:0.2rem solid rgba(255,255,255,.6); border-radius:5rem; line-height:5rem;padding:0 3rem;} .content h2 {font-size:7rem; font-weight:700; line-height:1;padding:2rem 0;} .content h2 b {font-weight:900;} .inner {position:relative; color:#fff; text-align:center;} /*bt_top*/ .bt_top {position:fixed; right:3rem;bottom:2rem;display:flex;justify-content:center;align-items:center;width:70px;height:70px;background:rgba(15,21,48,0.7); border-radius:50%; cursor:pointer; z-index:20;opacity:0;} .bt_top span {display:block;width:100%;height:100%;background:url(../images/bt_top.png)no-repeat center; text-indent:-99999px;} .bt_top.active {opacity:1;} /*키비*/ #mVisual {position:relative;background:url(../images/event/visual_bg.jpg) top center no-repeat;height:92.6rem;} #mVisual .tx {position:absolute;top:21rem; left:0; right:0;z-index:5;} #mVisual .tx h4 {display:block; background:url(../images/event/expo_logo.png) center no-repeat; background-size:100%; width:9.5rem; height:9.7rem; text-indent:-9999px; margin:0 auto 2.4rem;} #mVisual .tx h3, #mVisual .tx h2 {color:#fff; line-height:1;} #mVisual .tx h3 {font-size:4rem;font-weight:700; padding-bottom:2rem; } #mVisual .tx h3.rk {font-size:3.4rem;} #mVisual .tx h3.rk b {font-weight:800;} #mVisual .tx h2 {font-size:9rem;} #mVisual .tx h2 i{display:block; font-weight:900; font-size:11rem;} #mVisual .tx h2 b {font-weight:900;line-height:1.2} #mVisual .tx h2 span {display:block; font-weight:800;} #mVisual .tx .tx_bigtop10 {padding:3rem 0 1rem; font-size:3.8rem; color:#00adba;font-weight:900;} #mVisual .tx .tx_bigtop10 i {font-weight:300;letter-spacing:-0.06em;} #mVisual .tx .tx_info {font-size:2.6rem; color:#fff; font-weight:400;} #mVisual .visual_shadow {position:absolute;left:0;right:0;top:0;bottom:0;width:100%; height:100%;background:url(../images/event/visual_shadow.png) center no-repeat; background-size:cover; z-index:4;} #mVisual .visual_platform {position:absolute; left:calc(50% - 24.6rem);bottom:5.3rem; width:59.2rem; height:12.4rem; background:url(../images/event/visual_platform.png) center no-repeat; background-size:100%; z-index:3; } #mVisual .panorama {position:absolute;top:0; bottom:0; left:0; right:0;z-index:1;} #mVisual .panorama .roller_wrapper {overflow:hidden;margin:0;height:100%;perspective:140rem;} #mVisual .panorama .roller {transform-style:preserve-3d;animation:rotate 70s linear infinite;} #mVisual .panorama .roller, .roller * { position:absolute; top:28rem; left:50%;} #mVisual .panorama .slice { margin: -60vh -4vw; width:12rem;height:104rem; backface-visibility: hidden; background:url('../images/event/b_roll.jpg'); background-size:600rem 100%;} #mVisual .panorama .slice:nth-child(1) {transform:rotateY(0deg) translateZ(-90rem); background-position:0 100%;} #mVisual .panorama .slice:nth-child(2) {transform:rotateY(-7.2deg) translateZ(-90rem); background-position:-12rem 100%;} #mVisual .panorama .slice:nth-child(3) {transform:rotateY(-14.4deg) translateZ(-90rem); background-position:-24rem 100%;} #mVisual .panorama .slice:nth-child(4) {transform:rotateY(-21.6deg) translateZ(-90rem); background-position:-36rem 100%;} #mVisual .panorama .slice:nth-child(5) {transform:rotateY(-28.8deg) translateZ(-90rem); background-position:-48rem 100%;} #mVisual .panorama .slice:nth-child(6) {transform:rotateY(-36deg) translateZ(-90rem); background-position:-60rem 100%;} #mVisual .panorama .slice:nth-child(7) {transform:rotateY(-43.2deg) translateZ(-90rem); background-position:-72rem 100%;} #mVisual .panorama .slice:nth-child(8) {transform:rotateY(-50.4deg) translateZ(-90rem); background-position:-84rem 100%;} #mVisual .panorama .slice:nth-child(9) {transform:rotateY(-57.6deg) translateZ(-90rem); background-position:-96rem 100%;} #mVisual .panorama .slice:nth-child(10) {transform:rotateY(-64.8deg) translateZ(-90rem); background-position:-108rem 100%;} #mVisual .panorama .slice:nth-child(11) {transform:rotateY(-72deg) translateZ(-90rem); background-position:-120rem 100%;} #mVisual .panorama .slice:nth-child(12) {transform:rotateY(-79.2deg) translateZ(-90rem); background-position:-132rem 100%;} #mVisual .panorama .slice:nth-child(13) {transform:rotateY(-86.4deg) translateZ(-90rem); background-position:-144rem 100%;} #mVisual .panorama .slice:nth-child(14) {transform:rotateY(-93.6deg) translateZ(-90rem); background-position:-156rem 100%;} #mVisual .panorama .slice:nth-child(15) {transform:rotateY(-100.8deg) translateZ(-90rem); background-position:-168rem 100%;} #mVisual .panorama .slice:nth-child(16) {transform:rotateY(-108deg) translateZ(-90rem); background-position:-180rem 100%;} #mVisual .panorama .slice:nth-child(17) {transform:rotateY(-115.2deg) translateZ(-90rem); background-position:-192rem 100%;} #mVisual .panorama .slice:nth-child(18) {transform:rotateY(-122.4deg) translateZ(-90rem); background-position:-204rem 100%;} #mVisual .panorama .slice:nth-child(19) {transform:rotateY(-129.6deg) translateZ(-90rem); background-position:-216rem 100%;} #mVisual .panorama .slice:nth-child(20) {transform:rotateY(-136.8deg) translateZ(-90rem); background-position:-228rem 100%;} #mVisual .panorama .slice:nth-child(21) {transform:rotateY(-144deg) translateZ(-90rem); background-position:-240rem 100%;} #mVisual .panorama .slice:nth-child(22) {transform:rotateY(-151.2deg) translateZ(-90rem); background-position:-252rem 100%;} #mVisual .panorama .slice:nth-child(23) {transform:rotateY(-158.4deg) translateZ(-90rem);background-position:-264rem 100%;} #mVisual .panorama .slice:nth-child(24) {transform:rotateY(-165.6deg) translateZ(-90rem);background-position:-276rem 100%;} #mVisual .panorama .slice:nth-child(25){transform:rotateY(-172.8deg) translateZ(-90rem);background-position:-288rem 100%;} #mVisual .panorama .slice:nth-child(26){transform:rotateY(-180deg) translateZ(-90rem);background-position:-300rem 100%;} #mVisual .panorama .slice:nth-child(27){transform:rotateY(-187.2deg) translateZ(-90rem);background-position:-312rem 100%;} #mVisual .panorama .slice:nth-child(28){transform:rotateY(-194.4deg) translateZ(-90rem);background-position:-324rem 100%;} #mVisual .panorama .slice:nth-child(29){transform:rotateY(-201.6deg) translateZ(-90rem);background-position:-336rem 100%;} #mVisual .panorama .slice:nth-child(30){transform:rotateY(-208.8deg) translateZ(-90rem);background-position:-348rem 100%;} #mVisual .panorama .slice:nth-child(31){transform:rotateY(-216deg) translateZ(-90rem);background-position:-360rem 100%; } #mVisual .panorama .slice:nth-child(32){transform:rotateY(-223.2deg) translateZ(-90rem);background-position:-372rem 100%;} #mVisual .panorama .slice:nth-child(33){transform:rotateY(-230.4deg) translateZ(-90rem);background-position:-384rem 100%;} #mVisual .panorama .slice:nth-child(34){transform:rotateY(-237.6deg) translateZ(-90rem);background-position:-396rem 100%;} #mVisual .panorama .slice:nth-child(35){transform:rotateY(-244.8deg) translateZ(-90rem);background-position:-408rem 100%;} #mVisual .panorama .slice:nth-child(36){transform:rotateY(-252deg) translateZ(-90rem);background-position:-420rem 100%;} #mVisual .panorama .slice:nth-child(37){transform:rotateY(-259.2deg) translateZ(-90rem);background-position:-432rem 100%;} #mVisual .panorama .slice:nth-child(38){transform:rotateY(-266.4deg) translateZ(-90rem);background-position:-444rem 100%;} #mVisual .panorama .slice:nth-child(39){transform:rotateY(-273.6deg) translateZ(-90rem);background-position:-456rem 100%;} #mVisual .panorama .slice:nth-child(40){transform:rotateY(-280.8deg) translateZ(-90rem);background-position:-468rem 100%;} #mVisual .panorama .slice:nth-child(41){transform:rotateY(-288deg) translateZ(-90rem); background-position:-480rem 100%;} #mVisual .panorama .slice:nth-child(42){transform:rotateY(-295.2deg) translateZ(-90rem);background-position:-492rem 100%;} #mVisual .panorama .slice:nth-child(43){transform:rotateY(-302.4deg) translateZ(-90rem);background-position:-504rem 100%;} #mVisual .panorama .slice:nth-child(44){transform:rotateY(-309.6deg) translateZ(-90rem);background-position:-516rem 100%;} #mVisual .panorama .slice:nth-child(45){transform:rotateY(-316.8deg) translateZ(-90rem);background-position:-528rem 100%;} #mVisual .panorama .slice:nth-child(46){transform:rotateY(-324deg) translateZ(-90rem);background-position:-540rem 100%;} #mVisual .panorama .slice:nth-child(47){transform:rotateY(-331.2deg) translateZ(-90rem);background-position:-552rem 100%;} #mVisual .panorama .slice:nth-child(48){transform:rotateY(-338.4deg) translateZ(-90rem);background-position:-564rem 100%;} #mVisual .panorama .slice:nth-child(49){transform:rotateY(-345.6deg) translateZ(-90rem);background-position:-576rem 100%;} #mVisual .panorama .slice:nth-child(50){transform:rotateY(-352.8deg) translateZ(-90rem);background-position:-588rem 100%;} @keyframes rotate{ 0% {transform: rotateY(0);} 100% {transform: rotateY(360deg);} } /*메이킹필름*/ #mVideo {position:relative;background:#0e2b56 url(../images/event/mvideo_bg.jpg) right top no-repeat; width:100%; height:auto; /*height:0; padding-top:56.25%;*/ /*비율16:9 기준 :: 56.25 = 9 ÷ 16 x 100 */} #mVideo h2 {display:block; font-size:6rem;font-weight:700; line-height:1;padding:11rem 0 6rem; display:none;}/*안보이게 수정*/ #mVideo .videoWrap{position:relative; width:135rem; height:76rem; margin:10rem auto; } #mVideo .videoWrap .bt_control { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:11rem; height:11rem; background:url(../images/event/video_bt_stop.png); text-indent:-9999px; z-index:10; opacity:0; -webkit-opacity:0; transition:all ease-in-out 0.3s; -webkit-transition:all ease-in-out 0.3s; -webkit-transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1); transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1); background-size:100%;} #mVideo .videoWrap .bt_control.bt_play { background-image:url(../images/event/video_bt_play.png); } #mVideo .videoWrap .bt_control.bt_stop { background-image:url(../images/event/video_bt_stop.png); } #mVideo .videoWrap:hover .bt_control { opacity:1; -webkit-opacity:1; } #mVideo .videoWrap iframe {position:absolute; top:0; left:0; width:100%; height:100%;} #mVideo .videoWrap video {width:100%;min-width:100%;height:auto; object-fit:cover;} #mVideo .videoWrap .info {position:absolute; bottom:2rem; right:2rem; display:flex; align-items:center; z-index:30;} #mVideo .videoWrap .info span {display:inline-block; /*padding-right:2rem;*/font-size:2.8rem; color:#f0f0f0; font-weight:700; } #mVideo .videoWrap .info a {display:inline-block; width:6.6rem; height:6.6rem; border:2px solid #f0f0f0; border-radius:50%; background-position:center; background-repeat:no-repeat; background-size:60%; text-indent:-999999px;} #mVideo .videoWrap .info a.soff {background-image:url(../images/event/sound_off.png);} #mVideo .videoWrap .info a.son {background-image:url(../images/event/sound_on.png);} /*이벤트*/ #mEvent {background:#141a2b url(../images/event/evt_bg.jpg) center top no-repeat;padding-bottom:10rem;} #mEvent .ev_tx {position:relative;padding-bottom:8.5rem;} #mEvent .ev_tx p {font-size:2.4rem;} #mEvent .ev_tx p.b {font-weight:800;} #mEvent .ev_info {position:relative;margin-bottom:5rem;text-align:left;} #mEvent .ev_info dl {display:flex; flex-wrap:wrap; align-items:flex-start; padding-bottom:1rem;} #mEvent .ev_info dl dt {display:inline-block; background:#fff; color:#040714;width:13rem;text-align:center;border-radius:3rem;margin-right:1.5rem;} #mEvent .ev_info dl dd {display:inline-block;} #mEvent .ev_info dl dt, #mEvent .ev_info dl dd {font-size:2.6rem;font-weight:700;line-height:4.5rem;} #mEvent .ev_info .step {line-height:1.4;font-size:2.2rem; font-weight:500;} #mEvent .ev_info .step span {display:inline; padding-right:1.5rem;font-style: italic;font-weight:700;} #mEvent .ev_info .stx {display:inline; padding-left:1rem; font-size:1.8rem;font-weight:300;color:rgba(255,255,255,.8);} #mEvent .ev_info dl.guide {position:absolute;top:0;left:calc(50% + 3rem); } #mEvent .giveaway {position:relative;padding-bottom:6rem;} #mEvent .giveaway ul {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start;} #mEvent .giveaway ul li{position:relative; display:inline-block;width:24rem;} #mEvent .giveaway .giftBox {position:relative;width:100%;height:24rem;background:#fff; background-size:cover; background-position:center; border-radius:50%; overflow:hidden;} #mEvent .giveaway ul li:nth-child(1) .giftBox {background-image:url(../images/event/gift01.jpg);} #mEvent .giveaway ul li:nth-child(2) .giftBox {background-image:url(../images/event/gift02.jpg);} #mEvent .giveaway ul li:nth-child(3) .giftBox {background-image:url(../images/event/gift03.jpg);} #mEvent .giveaway ul li:nth-child(4) .giftBox {background-image:url(../images/event/gift04.jpg);} #mEvent .giveaway ul li:nth-child(5) .giftBox {background-image:url(../images/event/gift05.jpg);} #mEvent .giveaway .num {position:absolute;left:0; top:0; width:8rem;height:9rem;background:url(../images/event/num_bg.png) center no-repeat; background-size:100%; z-index:2;} #mEvent .giveaway .num span{display:block;line-height:8rem; font-weight:800;font-size:2.6rem;} #mEvent .giveaway .tx {padding:0;} #mEvent .giveaway .tx h4 {font-size:2.4rem; font-weight:800; line-height:2;} #mEvent .giveaway .tx span {font-size:2rem; font-weight:500;} #mEvent .giveaway .tx span i {display:block;} /* #mEvent .giveaway p {padding:2.5rem 0 0 0;text-align:center;} #mEvent .giveaway p span {display:inline-block;font-size:1.6rem; color:rgba(255,255,255,.5);} #mEvent .giveaway p span + span {padding-left:1rem;} */ /*경품 자세히보기*/ #mEvent .giveaway .bt_detail {display:inline-block;background:#fff;color:#ccc; border-radius:5rem; padding:0.3rem 1rem; margin-top:0.5rem;color:#141a2a; font-size:1.8rem; font-weight:700;} #mEvent .giveaway .consult {position:relative;padding:2rem 4.5rem 0; } #mEvent .giveaway .consult ul {width:100%;display:flex; flex-wrap:wrap; justify-content:center;align-items:flex-start;} #mEvent .giveaway .consult ul li {position:relative; width:49%;text-align:left;} #mEvent .giveaway .consult ul li p {position:relative; font-size:1.6rem; padding:0 0 0 1.5rem;color:rgba(255,255,255,.8);text-align:left;line-height:1;padding-bottom:0.5rem;} #mEvent .giveaway .consult ul li p::before {content:'*';position:absolute;left:0;top:0; } #mEvent .giveaway .consult ul li span {position:relative;display:block;color:rgba(255,255,255,.5);padding-left:2rem; } #mEvent .giveaway .consult ul li span::before {content:'-';position:absolute;left:0.5rem;top:0;} #mEvent .giveaway .consult ul li + li {text-align:right;} #mEvent .giveaway .consult ul li + li p {display:inline-block;} #mEvent .evtWrap {position:relative;background:#252b4b;border-radius:3rem;padding:5rem 6rem 1rem;} #mEvent .evtWrap .step01Wrap {position:relative;margin-bottom:5rem;} #mEvent .evtWrap .step01Wrap::before {content:'';position:absolute;left:4rem;top:0;background:#727caf;width:0.2rem;height:100%;} #mEvent .evtWrap .step01Wrap::after {content:'';position:absolute;left:3.5rem;bottom:0;background:#727caf;width:1.2rem;height:12px;border-radius:50%;} #mEvent .evtWrap dl {position:relative; display:flex; flex-wrap:wrap; align-items:flex-start;margin-bottom:2rem;z-index:2;} #mEvent .evtWrap dl dt {width:8rem;height:8rem; background:#fff;border-radius:50%; color:#1e202c;line-height:1;} #mEvent .evtWrap dl dt span {display:block;font-size:1.8rem; font-weight:400;padding-top:1.5rem;} #mEvent .evtWrap dl dt b {display:block;font-size:3rem; font-weight:800;} #mEvent .evtWrap dl dd {width:calc(100% - 11rem);margin-left:3rem; line-height:8rem;font-size:3.6rem; font-weight:700;text-align:left;} #mEvent .evtWrap dl:nth-child(2) {margin-bottom:4rem;} #mEvent .evtWrap dl:nth-child(2) dt, #mEvent .evtWrap dl:nth-child(3) dt {background:#252b4b;color:#fff;line-height:8rem;font-size:2.6rem;font-weight:600; border:2px dashed #727caf;} #mEvent .evtWrap dl:nth-child(2) ul, #mEvent .evtWrap dl:nth-child(3) ul {display:flex; flex-wrap:wrap;} #mEvent .evtWrap dl:nth-child(2) li { position:relative; width:calc(50% - 0.5rem);} #mEvent .evtWrap dl:nth-child(2) li:first-child {margin-right:1rem;} #mEvent .evtWrap dl:nth-child(3) li { position:relative; width:calc(25% - 0.75rem);margin:0 1rem 1rem 0;height:8rem;} #mEvent .evtWrap dl:nth-child(3) li:nth-child(4), #mEvent .evtWrap dl:nth-child(3) li:nth-child(8) {margin-right:0;} #mEvent input[type="radio"] {display:none;} #mEvent input[type="radio"] + label { position:absolute;left:0;right:0;top:0; height:8rem; display:block; background:#fff; border-radius:5px; cursor:pointer; color:#222;font-size:30px; font-weight:400;text-align:center;} #mEvent input[type="radio"]:checked + label{ background:#00adba; color:#fff; font-weight:800;} #mEvent .evtWrap .step02Wrap {position:relative;} #mEvent .evtWrap .step02Wrap ul {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start;} #mEvent .evtWrap .step02Wrap ul li {position:relative;width:calc(20% - 0.8rem);margin:0 1rem 4rem 0;} #mEvent .evtWrap .step02Wrap ul li:nth-child(5), #mEvent .evtWrap .step02Wrap ul li:nth-child(10) {margin-right:0;} #mEvent .evtWrap .step02Wrap ul li .shorts {position:relative;width:100%;max-height:40.5rem;overflow:hidden; margin-bottom:1rem; border-radius:0.5rem;} #mEvent .evtWrap .step02Wrap ul li p.shtx {position:relative; margin:0 auto; width:95%;margin:0 auto;border:0.2rem solid rgba(255,255,255,.6);border-radius:3rem;} #mEvent .evtWrap .step02Wrap ul li p.shtx span {position:relative;display:inline-block;line-height:5.5rem;font-size:2.4rem;font-weight:800;padding-right:3rem;} #mEvent .evtWrap .step02Wrap ul li p.shtx span::after {content:'';position:absolute;top:50%;right:0; transform:translateY(-50%);width:1.9rem; height:1.8rem; background:url(../images/event/bt_shorts_i.png) center no-repeat;} #mEvent .evtWrap .step02Wrap ul li .bt_shorts {display:block;position:absolute;left:0;right:0;top:0;bottom:0; z-index:10;} /* 이벤트 수치 */ #mEvent .e_count_wrap {position:relative; text-align:center;padding:4rem 0 0;} #mEvent .e_count_wrap .e_count {display:inline-block;background:#fff; border-radius:5rem; line-height:1; font-size:2.4rem; color:#1b2039; font-weight:500; padding:1.1rem 4rem 1.0rem;} #mEvent .e_count_wrap .e_count span i {position:relative; top:0.15rem;display:inline-block;font-family: 'GmarketSansBold';font-size:3.6rem;font-weight:900;letter-spacing:0; color:#1947ba;} #mEvent .e_count_wrap .e_count b {font-weight:800;font-size:2.6rem;} /*TOP10순위*/ #mtop10 {background:#141a2b url(../images/event/top10_bg.jpg) center top no-repeat;height:101.5rem; display:none !important;} #mtop10 .top10List {position:relative; } #mtop10 .top10List .selectBox {position:relative; padding-top:2rem; text-align:center;} #mtop10 .top10List .selectBox dl { position:relative; display:inline-block; width:33rem; height:5.5rem; line-height:5.5rem; vertical-align:top; margin-right:4.3rem; z-index:1; } #mtop10 .top10List .selectBox dl dt { position:absolute; top:0; left:0; font-size:2.2rem; color:rgba(255,255,255,.7); font-weight:800; } #mtop10 .top10List .selectBox dl dd { margin-left:5rem; } #mtop10 .top10List .selectBox dl dd:after { content:''; position:absolute; top:50%; right:30px; margin-top:-0.6rem; width:1.9rem; height:1.3rem; background:url(../images/event/select_arrow.png); } #mtop10 .top10List .selectBox dl dd select { width:100%; height:5.5rem; border:0; padding-left:3rem; background:#fff; border-radius:0.5rem; font-size:2.2rem; color:#152334; font-weight:800; appearance:none; -webkit-appearance:none; } #mtop10 .top10List .selectBox dl:nth-child(3) {width:36.5rem;margin-right:0;} #mtop10 .top10List .selectBox dl:nth-child(3) dd { margin-left:8.5rem; } #mtop10 .top10List .listBox {position:absolute; left:calc(50% - 65rem); top:17.5rem;width:100%;} #mtop10 .top10List .listBox .event_slide_wrapper{position:relative; width:100%;border:1px solid #FF;height:100%;} #mtop10 .top10List .listBox .swiper-container { position:absolute; left:-4rem; top:-1rem; padding:1rem 0 0 4rem; width: 200%; height: 46.352rem; } #mtop10 .top10List .listBox .swiper-slide { text-align: center; font-size: 18px; width: 25.5rem !important; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #mtop10 .top10List .listBox .swiper-slide .imgbox {width:100%;height:100%; border-radius:3rem; overflow:hidden;} #mtop10 .top10List .listBox .swiper-slide .ranking {position:absolute;left:-4rem;top:-1rem;width:8.4rem;height:8.4rem; border-radius:1rem; background:#424558;overflow:hidden; } #mtop10 .top10List .listBox .swiper-slide .ranking.on {background:#1947ba;} #mtop10 .top10List .listBox .swiper-slide .ranking span {display:block; padding-top:0.6rem; font-family: 'GmarketSansBold'; line-height:8.4rem; color:#fff; font-size:6.4rem;letter-spacing:-0.07em; } #mtop10 .top10List .listBox .swiper-slide .bt_top10 {position:absolute;left:0;right:0;top:0;bottom:0; z-index:3} /*랭킹*/ #ranking {background:#141a2b url(../images/event/evt_bg.jpg) center top no-repeat;padding-bottom:10rem;} #ranking .top10List {position:relative;} #ranking .top10List .selectBox {position:relative; padding-top:2rem; text-align:center;margin-bottom:11rem;} #ranking .top10List .selectBox dl { position:relative; display:inline-block; width:33rem; height:5.5rem; line-height:5.5rem; vertical-align:top; margin-right:4.3rem; z-index:1; } #ranking .top10List .selectBox dl dt { position:absolute; top:0; left:0; font-size:2.2rem; color:rgba(255,255,255,.7); font-weight:800; } #ranking .top10List .selectBox dl dd { margin-left:5rem; } #ranking .top10List .selectBox dl dd:after { content:''; position:absolute; top:50%; right:30px; margin-top:-0.6rem; width:1.9rem; height:1.3rem; background:url(../images/event/select_arrow.png); } #ranking .top10List .selectBox dl dd select { width:100%; height:5.5rem; border:0; padding-left:3rem; background:#fff; border-radius:0.5rem; font-size:2.2rem; color:#152334; font-weight:800; appearance:none; -webkit-appearance:none; } #ranking .top10List .selectBox dl:nth-child(3) {width:36.5rem;margin-right:0;} #ranking .top10List .selectBox dl:nth-child(3) dd { margin-left:8.5rem; } #ranking .top10List .listBox {position:relative;width:100%; max-width:114.3rem; margin:0 auto;} #ranking .top10List .listBox ul {display:flex; flex-wrap:wrap; justify-content:center;} #ranking .top10List .listBox ul li {position:relative;width:calc(25% - 4.5rem);margin-bottom:6rem;} #ranking .top10List .listBox ul li + li {margin-left:6rem;} #ranking .top10List .listBox ul li:nth-child(1), #ranking .top10List .listBox ul li:nth-child(2), #ranking .top10List .listBox ul li:nth-child(3){width:calc(33.3% - 5.86rem);} #ranking .top10List .listBox ul li:nth-child(2), #ranking .top10List .listBox ul li:nth-child(3) {margin-left:8.8rem;} #ranking .top10List .listBox ul li:nth-child(4), #ranking .top10List .listBox ul li:nth-child(8) {margin-left:0;} #ranking .top10List .listBox ul li a {display:block; position:absolute;left:0;right:0;top:0;bottom:0;z-index:10;} #ranking .top10List .listBox ul li .num {display:flex;justify-content:center; position:absolute;left:-3.2rem; top:-3.2rem; width:7.7rem; height:7.7rem;background:#5d647a;border-radius:50%;overflow:hidden; z-index:9;} #ranking .top10List .listBox ul li .num span {display:block;position:relative; top:1.4rem;color:#fff; font-family: 'GmarketSansBold'; font-size:4.2rem;} #ranking .top10List .listBox ul li .t10_img {position:relative;width:100%;border-radius:1.5rem;overflow:hidden;} #ranking .top10List .listBox ul li .t10_img .img_area {position:relative;width:100%;height:100%;} #ranking .top10List .listBox ul li .t10_img .img_area img {transition: 0.5s;} #ranking .top10List .listBox ul li .t10_img .info {position:absolute;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,0.8); display:flex; flex-wrap:wrap;flex-direction:column;align-content:center;justify-content:center; opacity:0;} #ranking .top10List .listBox ul li .t10_img .info p{color:#fff;font-size:2.8rem;font-weight:700;padding:1rem;} #ranking .top10List .listBox ul li .t10_img .info span{display:block;color:#fff;font-size:2rem;} #ranking .top10List .listBox ul li .t10_img .info .show_shorts {margin:3rem auto 0;border:0.2rem solid rgba(255,255,255,.6);border-radius:3rem;padding:0 2rem;} #ranking .top10List .listBox ul li .t10_img .info .show_shorts > span {position:relative; display:inline-block; line-height:4rem;font-size:2rem; font-weight:800;color:#fff; padding-right:3rem;} #ranking .top10List .listBox ul li .t10_img .info .show_shorts > span::after {content:'';position:absolute;top:50%;right:0; transform:translateY(-50%);width:1.9rem; height:1.8rem; background:url(../images/event/bt_shorts_i.png) center no-repeat;} #ranking .top10List .listBox ul li:hover .t10_img .info {opacity:1;transition: 0.5s;} #ranking .top10List .listBox ul li:hover .t10_img .img_area img { transform: scale(1.05); transition: 0.5s;} #ranking .top10List .listBox ul li:nth-child(1) .num, #ranking .top10List .listBox ul li:nth-child(2) .num, #ranking .top10List .listBox ul li:nth-child(3) .num {left:-5.8rem;top:-4.2rem; width:13rem;height:17.4rem;background:transparent center center/100%;} #ranking .top10List .listBox ul li:nth-child(1) .num {background-image:url(../images/event/i_medal01.png);} #ranking .top10List .listBox ul li:nth-child(2) .num {background-image:url(../images/event/i_medal02.png);} #ranking .top10List .listBox ul li:nth-child(3) .num {background-image:url(../images/event/i_medal03.png);} #ranking .top10List .listBox ul li:nth-child(1) .num span, #ranking .top10List .listBox ul li:nth-child(2) .num span, #ranking .top10List .listBox ul li:nth-child(3) .num span {top:3.2rem;font-size:5.6rem;} #ranking .top10List .listBox ul li:nth-child(1) .num span, #ranking .top10List .listBox ul li:nth-child(2) .num span {color:#141a2b;} /*당첨자*/ #winner {background:#0f1d45 url(../images/event/top10_bg.jpg) center top no-repeat;padding-bottom:10rem;} #winner dl.tx {} #winner dl.tx dt, #winner dl.tx dd {display:inline-block;vertical-align:top;text-align:left;font-size:2rem;} #winner .winnerList {position:relative;width:100%; max-width:114.3rem; margin:0 auto;} #winner .winnerList .bt_detail {display:inline-block;background:#fff;color:#ccc; border-radius:5rem; padding:0.3rem 1rem; margin:0.5rem 0 0 1rem;color:#141a2a; font-size:1.8rem; font-weight:700;} #winner .winnerList .search_box {background:#0a122a;border-radius:1.5rem;} #winner .winnerList .search_box dl {display:flex; flex-wrap:wrap;align-content:center;justify-content:center; padding:2rem 0; text-align:center;margin:2rem 0;} #winner .winnerList .search_box dl dt, #winner .winnerList .search_box dl dd {display:inline-block;} #winner .winnerList .search_box dl dt {color:#fff;font-size:2.8rem; line-height:5.5rem; padding-right:2rem;} #winner .winnerList .search_box input {width:20rem;height:5.5rem;border-radius:0.5rem;border:none;padding:1rem; font-size:2.4rem; font-weight:700;} #winner .winnerName {position:relative; /*height:70rem;*/ overflow-y:auto;} #winner .winnerName dl {width:100%;max-width:110rem; margin:0 auto 2rem;} #winner .winnerName dl dt, #winner .winnerName dl dd {color:#fff;} #winner .winnerName dl dt {display:block;padding:0 0 1.5rem; font-size:2.4rem; font-weight:400;text-align:left;} #winner .winnerName dl dt span {display:inline-block; padding-right:1.5rem;font-weight:800;} #winner .winnerName dl dd ul {display:flex;flex-wrap:wrap;} #winner .winnerName dl dd ul > li {width:10%; margin-bottom:1.5rem; font-size:1.8rem;} #winner .winnerName dl dd ul > li span {display:block;} #cardnews {background:url(../images/event/cardnews_bg.jpg) center top no-repeat;height:69.5rem;} #cardnews h2 {font-size:6rem;} #cardnews .list {position:relative;padding-top:3.5rem;} #cardnews .list ul {display:flex; flex-wrap:wrap; justify-content:space-between;} #cardnews .list ul li {position:relative; width:calc(25% - 0.75rem);} #cardnews .list ul li .imgbox {width:100%;} #cardnews .list ul li p{background:rgba(0,0,0,.6);width:100%; height:5rem; line-height:5rem; overflow:hidden; font-size:2rem; font-weight:700;} #cardnews .list ul li a {display:block; position:absolute; top:0; bottom: 0; left:0; right:0; text-indent:-99999px;} #cardnews .list ul li a::after {content:'';position:absolute; bottom:6rem; right:0.5rem; width:5.3rem; height:5.3rem; background:rgba(255,255,255,.8) url(../images/event/bt_more.png) no-repeat center; border-radius:50%;} /* sns공유 */ #share { background:#141a2b; height:23.5rem; } #share .content {height:100%; padding:0;} #share .inner {display:flex; justify-content:center; align-items:center;flex-direction:column;height:100%; } #share .tx {display:inline-block;padding-right:5.4rem;} #share .tx span{display:block; padding-bottom:1.5rem;color:#fff;font-size:3.2rem; line-height:1.2;font-weight:500;} #share .tx span br{display:none;} #share .sns {display:inline-block;background:url(../images/event/sns.png) left center no-repeat;background-size:100%;} #share .sns ul {position:relative; font-size:0; } #share .sns ul li{display:inline-block;width:8rem;height:8rem;margin-right:1.3rem;} #share .sns ul li:last-child {margin-right:0;} #share .sns ul li a {display:block;width:100%; height:100%;text-indent:-99999px;} .all_count {background:#f1f1f1;height:17rem;} .all_count .content {padding-top:5.5rem;text-align:center;} .all_count .content p {font-size:3rem;color:#222;font-weight:500;} .all_count .content p span {display:inline-block;padding-right:1px;font-weight:700;} .all_count .content p .visitor i, .all_count .content p .apply i {font-family: 'GmarketSansBold';font-size:4.4rem;} .all_count .content p .visitor i {color:#1947ba;} .all_count .content p .apply i {color:#00adba;} .all_count .content p br {display:none;} footer {padding:4.2rem 0 ; background:#040714;} footer .content {padding:0; font-size:1.8rem; line-height:1.5; color:rgba(255,255,255,.6); text-align:center;} /* popup */ html.on { height:100%; overflow:hidden; } .pu_bg { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.85); z-index:98; display:none; } .pu_bg.top { z-index:100;} .pu { position:fixed; top:calc(50% + 1rem); left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); z-index:99; display:none; } .pu.top {z-index:101;} .pu .bt_close { position:absolute; top:0; right:-6.4rem; width:5.2rem; height:5.3rem; background:url(../images/event/bt_close.png) no-repeat 0 0; text-indent:-9999px; background-size:100%; } /*경품 자세히보기 내용*/ .pu_detail { width:65rem; background:#fff;} .pu_detail .box {padding:2rem;} .pu_detail .box p {font-weight:700;font-size:2.6rem;text-align:center; color:#fff;padding:1.5rem; background:#0e2b56;} .pu_detail .box ul {margin:1rem 0;} .pu_detail .box ul li {position:relative;width:100%; padding:1rem 0 0 1.2rem;font-size:1.8rem;font-weight:500;color:#444;} .pu_detail .box ul li::before {content:'·'; position:absolute; left:0;top:1rem;} .pu_detail .box ul li span {position:relative;display:block; padding:0 0 0 1.2rem;} .pu_detail .box ul li span::before {content:'-'; position:absolute; left:0;top:0;} .pu_detail .box i {color:#ff3535} /* 숏츠 평가하기 */ .pu_event_info { width:105.7rem; height:80rem; } .pu_event_info .p_con { position:relative; background:#f7f7f7; border-radius:1rem; overflow:hidden;} .pu_event_info .p_con h2 {position:relative; background:#141a2b; color:#fff; text-align:center; font-size:3rem; line-height:6.3rem;font-weight:500;} .pu_event_info .p_con .shorts_video {position:absolute; top:8rem;left:2rem;width:40.1rem;height:71.5rem; background:#000;} .pu_event_info .p_con .shorts_video iframe, .pu_event_info .p_con .shorts_video video {width:100%;height:100%;} .pu_event_info .p_con .shorts_video a {display:block;position:absolute; right:1rem; bottom:1rem; width:4.6rem; height:4.6rem; background:rgba(0,0,0,.5);/*border:2px solid #f0f0f0;*/ border-radius:50%; background-position:center; background-repeat:no-repeat; background-size:60%; text-indent:-999999px; z-index:20;} .pu_event_info .p_con .shorts_video a.soff {background-image:url(../images/event/sound_off.png);} .pu_event_info .p_con .shorts_video a.son {background-image:url(../images/event/sound_on.png);} .pu_event_info .p_con .largeView {display:none; } .pu_event_info .p_con .content {max-width:62.5rem; margin-left:43rem;padding:2rem;} .pu_event_info .p_con .info {position:relative;} .pu_event_info .p_con .info dl {margin-bottom:2rem;} .pu_event_info .p_con .info dl dt {font-size:1.8rem;color:#999;font-weight:700;} .pu_event_info .p_con .info dl dd {font-size:2rem;color:#222; height:5rem; overflow-y:auto;} .pu_event_info .p_con .info dl + dl dd {height:4rem;} .pu_event_info .p_con .rating {position:relative;} .pu_event_info .p_con .rating h3 {text-align:left; font-size:2.4rem; color:#222; line-height:1; border:0;padding:1rem 0;} .pu_event_info .p_con .rating h3 span {font-size:2rem; color:#666;font-weight:400;} .pu_event_info .p_con .rating .ratingBox {position:relative;} .pu_event_info .p_con .rating .ratingBox dl {width:100%;padding-bottom:1rem; display:flex; justify-content:flex-start;align-items:center;} .pu_event_info .p_con .rating .ratingBox dl:last-child {padding-bottom:3rem;} .pu_event_info .p_con .rating .ratingBox dl dt, .pu_event_info .p_con .rating .ratingBox dl dd {display:inline-block;} .pu_event_info .p_con .rating .ratingBox dl dt {width:18rem; height:10rem; line-height:10rem; background:#dae5ef; font-size:2.4rem; color:#1947ba; font-weight:800;border-radius:1rem; text-align:center;} .pu_event_info .p_con .rating .ratingBox dl dd {padding-left:2rem;} .pu_event_info .p_con .rating .ratingBox dl dd ul {display:flex;} .pu_event_info .p_con .rating .ratingBox dl dd ul li {display:inline-block; padding:0 0.5rem 1rem;} .pu_event_info .p_con .rating .ratingBox dl dd ul li i {display:block; width:5.1rem; height:4.9rem; background:url(../images/event/i_star.png) no-repeat center center; background-size:100%; text-indent:-9999px;} .pu_event_info .p_con .rating .ratingBox dl dd ul li.active i {background-image:url(../images/event/i_star_active.png);} .pu_event_info .p_con .rating .ratingBox p {font-size:1.8rem; font-weight:500; } .pu_event_info .p_con .rating .messageBox {} .pu_event_info .p_con .rating .messageBox textarea {width:100%; padding:1rem; border:1px solid #1947ba;border-radius:0.5rem; height:13rem; font-size:2rem; color:#222;} .pu_event_info .p_con .bt_dbform {display:block; height:8rem; width:35rem; background:#1947ba; margin:3rem auto;border-radius:5rem; text-align:center;} .pu_event_info .p_con .bt_dbform span {color:#fff; font-size:3rem; font-weight:800; line-height:8rem;} /* DB입력 */ .pu_event_db { width:65rem; height:80rem; } .pu_event_db .p_con { position:relative; background:#f7f7f7; border-radius:1rem; overflow:hidden;} .pu_event_db .p_con .content {max-width:65rem;padding:3rem;} .pu_event_db .p_con .rating {position:relative;} .pu_event_db .p_con .rating .ratingBox {position:relative;} .pu_event_db .p_con .rating .ratingBox dl {width:100%;padding-bottom:1rem; display:flex; justify-content:flex-start;} .pu_event_db .p_con .rating .ratingBox dl dt, .pu_event_db .p_con .rating .ratingBox dl dd {display:inline-block;} .pu_event_db .p_con .rating .ratingBox dl dt {width:14rem; height:3.244rem; line-height:3.244rem; background:#dae5ef; font-size:2rem; color:#1947ba; font-weight:800;border-radius:1rem; text-align:center;} .pu_event_db .p_con .rating .ratingBox dl dd {padding-left:1rem;} .pu_event_db .p_con .rating .ratingBox dl dd ul {display:flex;} .pu_event_db .p_con .rating .ratingBox dl dd ul li {display:inline-block; padding:0 0.25rem;} .pu_event_db .p_con .rating .ratingBox dl dd ul li i {display:block; width:3.1rem; height:3.2rem; background:url(../images/event/i_star.png) no-repeat center center; background-size:100%; text-indent:-9999px;} .pu_event_db .p_con .rating .ratingBox dl dd ul li.active i {background-image:url(../images/event/i_star_active.png);} .pu_event_db .p_con .rating .ratingBox p {font-size:1.8rem; font-weight:500; } .pu_event_db .p_con .rating .scoreBox {position:absolute;right:0;top:0; border:0.4rem solid #1947ba; border-radius:1rem; background:#fff; width:21rem;height:10.9rem; display:flex; flex-wrap:wrap; align-items:center; align-content:center;} .pu_event_db .p_con .rating .scoreBox p {position:relative;display:inline-block;color:#1947ba;text-align:center;} .pu_event_db .p_con .rating .scoreBox .tit {padding:2rem;font-size:2.2rem; font-weight:700;} .pu_event_db .p_con .rating .scoreBox .score {top:0.3rem; width:10rem; font-size:2.3rem; font-weight:600;} .pu_event_db .p_con .rating .scoreBox .score i {font-size:6rem;font-family: 'GmarketSansBold';} .pu_event_db .p_con .rating .messageBox {position:relative;} .pu_event_db .p_con .rating .messageBox h3 {font-size:1.8rem; color:#1947ba; font-weight:700; border:0;padding:1rem 0 0.5rem; line-height:1;} .pu_event_db .p_con .rating .messageBox .message {width:100%; height:8.2rem; background:#f7f7f7; padding:0; border:1px solid #1947ba;border-radius:0.5rem; font-size:1.8rem; color:#222;} .pu_event_db .p_con .rating .messageBox .message .box {height:calc(100% - 1.5rem); margin:1rem; overflow-y:auto; overflow-x:hidden;} .pu_event_db .p_con .dbform {position:relative;padding-top:2rem;} .pu_event_db .p_con .dbform dl {padding-bottom:1rem;} .pu_event_db .p_con .dbform dl dt {font-size:2rem; color:#222; font-weight:700;padding-bottom:0.5rem;} .pu_event_db .p_con .dbform dl dd {display:flex; justify-content:space-between; align-items:center; } .pu_event_db .p_con .dbform input {height:5.4rem;line-height:5.4rem;width:100%;border:1px solid #aaa;padding:0 1rem; border-radius:0.5rem;} .pu_event_db .p_con .dbform dl.hp input {width:30%;} .pu_event_db .p_con .dbform .line {border:1px solid #aaa;background:#fff;} .pu_event_db .p_con .dbform .box {height:12.4rem; margin:1rem; overflow-y:auto;} .pu_event_db .p_con .dbform .box p {font-weight:700; font-size:1.8rem; color:#222;padding-bottom:1rem;} .pu_event_db .p_con .dbform .box th, td {font-size:1.4rem; padding:0.5rem; color:#444; font-weight:400; text-align:left; vertical-align:top; /*background: #f0f0f0;*/} .pu_event_db .p_con .dbform .box th {width:34%; font-weight:700;font-size:1.6rem;} .pu_event_db .p_con .dbform .checks {text-align:center;} .pu_event_db .p_con .dbform .checks label {font-size:1.8rem; font-weight:400; cursor:pointer;} .pu_event_db .p_con .dbform .checks input[type="checkbox"] { position:absolute;top:0;left:0; opacity:0; -webkit-opacity:0; } .pu_event_db .p_con .dbform .checks input[type="checkbox"] + label:after { content:' '; display:inline-block; width:2.6rem; height:2.6rem; line-height:3.3rem; margin:-0.4rem 0 0 1rem; text-align:center; vertical-align:middle; background:url(../images/event/cb.png) no-repeat 0 0; background-size:cover; } .pu_event_db .p_con .dbform .checks input[type="checkbox"]:checked + label:after { background-image:url(../images/event/cb_on.png);} .pu_event_db .p_con .bt_participate_done {display:block; height:8rem; width:35rem; background:#141a2b; margin:0 auto;border-radius:5rem; margin-top:2rem;text-align:center;} .pu_event_db .p_con .bt_participate_done span {color:#fff; font-size:3rem; font-weight:800; line-height:8rem;} .pu_event_done { width:60rem; background:#1947ba; } .pu_event_done .ph{position:relative;width:100%;height:38.9rem;} .pu_event_done .btn a { display:block; line-height:96px; text-align:center; font-size:30px; color:#fff; font-weight:800; letter-spacing:10px; } input[type=text], input[type=password], textarea {-webkit-box-sizing:border-box; box-sizing:border-box; font-size:2rem;} /* 슬라이드 카드뉴스 팝업*/ #pu_cn .swiper-container {width: 80rem; height: 80rem; } #pu_cn .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #pu_cn .swiper-slide img {width:100%;} #pu_cn .swiper-button-next {background-image:url("../images/event/next_w.png"); width:6.1rem; height:6rem; background-size:cover; right:-8rem; left:auto;} #pu_cn .swiper-button-prev {background-image:url("../images/event/prev_w.png"); width:6.1rem; height:6rem; background-size:cover; left:-8rem; right:auto;} #pu_cn .swiper-container-horizontal>.swiper-pagination-progress {top:auto;bottom:0;height:1rem;} #pu_cn .swiper-pagination-progress .swiper-pagination-progressbar {background:#00adba;} #pu_cn .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {opacity:.25;} #pu_cn .p_con.yt01 iframe {width:110rem;height:61.9rem;} #pu_cn .p_con.yt02 {width:48rem;height:85.3rem;} #pu_cn .p_con.yt02 iframe, #pu_cn .p_con.yt02 video {width:100%;height:100%;} #pu_cn .p_con.yt02 a {display:block;position:absolute; right:2rem; bottom:2rem; width:4.6rem; height:4.6rem;/* border:2px solid #f0f0f0;*/ background:rgba(0,0,0,.7); border-radius:50%; background-position:center; background-repeat:no-repeat; background-size:60%; text-indent:-999999px; z-index:20;} #pu_cn .p_con.yt02 a.soff {background-image:url(../images/event/sound_off.png);} #pu_cn .p_con.yt02 a.son {background-image:url(../images/event/sound_on.png);} #scrollbar ::-webkit-scrollbar { width: 4px; height: 5px;} #scrollbar ::-webkit-scrollbar-track {background-color: rgba(255,255,255,.1); border-radius: 35px;} #scrollbar ::-webkit-scrollbar-thumb { background-color: rgba(255,255,255,.2); border-radius: 35px;} input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } @media all and (max-width: 1400px) { html { font-size: 58%; } /*메이킹필름*/ #mVideo .inner {display:none;} #mVideo .videoWrap{width:100%;height:0; padding-top:56.25%; margin:0;} /*비율16:9 기준 :: 56.25 = 9 ÷ 16 x 100 */ #mVideo .videoWrap .info span {display:block;} #mtop10 .top10List .listBox {left:calc(50% - 60rem);} #mtop10 .top10List .listBox .swiper-container {padding:1rem 0 0 4.5rem;} } @media all and (max-width: 1280px) { .content {width:96%;} #mEvent .giveaway ul {justify-content:center;} #mEvent .giveaway ul li {width:21rem;} #mEvent .giveaway ul li + li {margin-left:1rem;} #mEvent .giveaway .giftBox {height:21rem;} #mtop10 .top10List .selectBox dl {margin-right:2.3rem;} #mtop10 .top10List .listBox {left:calc(50% - 52rem);} #share .tx {padding-right:3.4rem;} #share .tx span {font-size:3rem;} } @media all and (max-width: 1080px) { #header {height:9.3056vw;} #header .topbar {line-height:9.3056vw;font-size:2.7778vw;} #header .topbar .logo_daum {width:10.5556vw;} #header .topbar .logo_kor {margin-top:-0.6944vw;width:21.6667vw;} /*공통*/ .content {padding-top:15.2778vw;width:100%;max-width:94.4444vw;} .content h3 {font-size:3.8889vw;line-height:6.9444vw;padding:0 4.1667vw;} .content h2 {font-size:9.7222vw; padding:2.7778vw 0;} .content h2 b {display:block; padding:0.5rem 0 0;} #mVisual {height:128.6111vw; background-size:cover;} #mVisual .tx {top:29.1667vw;} #mVisual .tx h4 {width:13.1944vw; height:13.4722vw; margin:0 auto 3.3333vw;} #mVisual .tx h3 {font-size:5.5556vw;padding-bottom:2.7778vw; } #mVisual .tx h3.rk {font-size:4.7222vw;} #mVisual .tx h2 {font-size:12.5vw;} #mVisual .tx h2 i{font-size:15.2778vw;} #mVisual .tx .tx_bigtop10 {padding:4.1667vw 0 1.3889vw; font-size:5.2778vw;} #mVisual .tx .tx_info {font-size:3.6111vw; } #mVisual .visual_shadow {background-image:url(../images/event/visual_shadow.png); } #mVisual .visual_platform {left:calc(50% - 34.1667vw);bottom:7.3611vw; width:82.2222vw; height:17.2222vw; } #mVisual .panorama .roller_wrapper {perspective:194.4444vw;} #mVisual .panorama .roller, .roller * { top:30.2vh;} #mVisual .panorama .slice { width:16.6667vw;height:144.4444vw;background-size:833.3333vw 100%;} #mVisual .panorama .slice:nth-child(1) {transform:rotateY(0deg) translateZ(-125.0000vw); background-position:0 100%;} #mVisual .panorama .slice:nth-child(2) {transform:rotateY(-7.2deg) translateZ(-125.0000vw); background-position:-125.0000vw 100%;} #mVisual .panorama .slice:nth-child(3) {transform:rotateY(-14.4deg) translateZ(-125.0000vw); background-position:-33.3333vw 100%;} #mVisual .panorama .slice:nth-child(4) {transform:rotateY(-21.6deg) translateZ(-125.0000vw); background-position:-50vw 100%;} #mVisual .panorama .slice:nth-child(5) {transform:rotateY(-28.8deg) translateZ(-125.0000vw); background-position:-66.6667vw 100%;} #mVisual .panorama .slice:nth-child(6) {transform:rotateY(-36deg) translateZ(-125.0000vw); background-position:-83.3333vw 100%;} #mVisual .panorama .slice:nth-child(7) {transform:rotateY(-43.2deg) translateZ(-125.0000vw); background-position:-100.0000vw 100%;} #mVisual .panorama .slice:nth-child(8) {transform:rotateY(-50.4deg) translateZ(-125.0000vw); background-position:-116.6667vw 100%;} #mVisual .panorama .slice:nth-child(9) {transform:rotateY(-57.6deg) translateZ(-125.0000vw); background-position:-133.3333vw 100%;} #mVisual .panorama .slice:nth-child(10) {transform:rotateY(-64.8deg) translateZ(-125.0000vw); background-position:-150.0000vw 100%;} #mVisual .panorama .slice:nth-child(11) {transform:rotateY(-72deg) translateZ(-125.0000vw); background-position:-166.6667vw 100%;} #mVisual .panorama .slice:nth-child(12) {transform:rotateY(-79.2deg) translateZ(-125.0000vw); background-position:-183.3333vw 100%;} #mVisual .panorama .slice:nth-child(13) {transform:rotateY(-86.4deg) translateZ(-125.0000vw); background-position:-200.0000vw 100%;} #mVisual .panorama .slice:nth-child(14) {transform:rotateY(-93.6deg) translateZ(-125.0000vw); background-position:-216.6667vw 100%;} #mVisual .panorama .slice:nth-child(15) {transform:rotateY(-100.8deg) translateZ(-125.0000vw); background-position:-233.3333vw 100%;} #mVisual .panorama .slice:nth-child(16) {transform:rotateY(-108deg) translateZ(-125.0000vw); background-position:-250.0000vw 100%;} #mVisual .panorama .slice:nth-child(17) {transform:rotateY(-115.2deg) translateZ(-125.0000vw); background-position:-266.6667vw 100%;} #mVisual .panorama .slice:nth-child(18) {transform:rotateY(-122.4deg) translateZ(-125.0000vw); background-position:-283.3333vw 100%;} #mVisual .panorama .slice:nth-child(19) {transform:rotateY(-129.6deg) translateZ(-125.0000vw); background-position:-300.0000vw 100%;} #mVisual .panorama .slice:nth-child(20) {transform:rotateY(-136.8deg) translateZ(-125.0000vw); background-position:-316.6667vw 100%;} #mVisual .panorama .slice:nth-child(21) {transform:rotateY(-144deg) translateZ(-125.0000vw); background-position:-333.3333vw 100%;} #mVisual .panorama .slice:nth-child(22) {transform:rotateY(-151.2deg) translateZ(-125.0000vw); background-position:-350.0000vw 100%;} #mVisual .panorama .slice:nth-child(23) {transform:rotateY(-158.4deg) translateZ(-125.0000vw);background-position:-366.6667vw 100%;} #mVisual .panorama .slice:nth-child(24) {transform:rotateY(-165.6deg) translateZ(-125.0000vw);background-position:-383.3333vw 100%;} #mVisual .panorama .slice:nth-child(25){transform:rotateY(-172.8deg) translateZ(-125.0000vw);background-position:-400.0000vw 100%;} #mVisual .panorama .slice:nth-child(26){transform:rotateY(-180deg) translateZ(-125.0000vw);background-position:-416.6667vw 100%;} #mVisual .panorama .slice:nth-child(27){transform:rotateY(-187.2deg) translateZ(-125.0000vw);background-position:-433.3333vw 100%;} #mVisual .panorama .slice:nth-child(28){transform:rotateY(-194.4deg) translateZ(-125.0000vw);background-position:-450.0000vw 100%;} #mVisual .panorama .slice:nth-child(29){transform:rotateY(-201.6deg) translateZ(-125.0000vw);background-position:-466.6667vw 100%;} #mVisual .panorama .slice:nth-child(30){transform:rotateY(-208.8deg) translateZ(-125.0000vw);background-position:-483.3333vw 100%;} #mVisual .panorama .slice:nth-child(31){transform:rotateY(-216deg) translateZ(-125.0000vw);background-position:-500.0000vw 100%; } #mVisual .panorama .slice:nth-child(32){transform:rotateY(-223.2deg) translateZ(-125.0000vw);background-position:-516.6667vw 100%;} #mVisual .panorama .slice:nth-child(33){transform:rotateY(-230.4deg) translateZ(-125.0000vw);background-position:-533.3333vw 100%;} #mVisual .panorama .slice:nth-child(34){transform:rotateY(-237.6deg) translateZ(-125.0000vw);background-position:-550.0000vw 100%;} #mVisual .panorama .slice:nth-child(35){transform:rotateY(-244.8deg) translateZ(-125.0000vw);background-position:-566.6667vw 100%;} #mVisual .panorama .slice:nth-child(36){transform:rotateY(-252deg) translateZ(-125.0000vw);background-position:-583.3333vw 100%;} #mVisual .panorama .slice:nth-child(37){transform:rotateY(-259.2deg) translateZ(-125.0000vw);background-position:-600.0000vw 100%;} #mVisual .panorama .slice:nth-child(38){transform:rotateY(-266.4deg) translateZ(-125.0000vw);background-position:-616.6667vw 100%;} #mVisual .panorama .slice:nth-child(39){transform:rotateY(-273.6deg) translateZ(-125.0000vw);background-position:-633.3333vw 100%;} #mVisual .panorama .slice:nth-child(40){transform:rotateY(-280.8deg) translateZ(-125.0000vw);background-position:-650.0000vw 100%;} #mVisual .panorama .slice:nth-child(41){transform:rotateY(-288deg) translateZ(-125.0000vw); background-position:-666.6667vw 100%;} #mVisual .panorama .slice:nth-child(42){transform:rotateY(-295.2deg) translateZ(-125.0000vw);background-position:-683.3333vw 100%;} #mVisual .panorama .slice:nth-child(43){transform:rotateY(-302.4deg) translateZ(-125.0000vw);background-position:-700.0000vw 100%;} #mVisual .panorama .slice:nth-child(44){transform:rotateY(-309.6deg) translateZ(-125.0000vw);background-position:-716.6667vw 100%;} #mVisual .panorama .slice:nth-child(45){transform:rotateY(-316.8deg) translateZ(-125.0000vw);background-position:-733.3333vw 100%;} #mVisual .panorama .slice:nth-child(46){transform:rotateY(-324deg) translateZ(-125.0000vw);background-position:-750.0000vw 100%;} #mVisual .panorama .slice:nth-child(47){transform:rotateY(-331.2deg) translateZ(-125.0000vw);background-position:-766.6667vw 100%;} #mVisual .panorama .slice:nth-child(48){transform:rotateY(-338.4deg) translateZ(-125.0000vw);background-position:-783.3333vw 100%;} #mVisual .panorama .slice:nth-child(49){transform:rotateY(-345.6deg) translateZ(-125.0000vw);background-position:-758.3333vw 100%;} #mVisual .panorama .slice:nth-child(50){transform:rotateY(-352.8deg) translateZ(-125.0000vw);background-position:-816.6667vw 100%;} #mVideo .videoWrap .info {bottom:2.7778vw; right:2.7778vw;} #mVideo .videoWrap .info span {font-size:3.8889vw;} #mVideo .videoWrap .info a {width:9.1667vw; height:9.1667vw;} /*이벤트*/ #mEvent {background-image:url(../images/event/evt_bg_mo.jpg); background-size:cover;} #mEvent .ev_tx {padding-bottom:5.5556vw;} #mEvent .ev_tx p {font-size:3.1944vw;} #mEvent .ev_info {margin-bottom:5.5556vw;} #mEvent .ev_info dl dt {width:18.0556vw;} #mEvent .ev_info dl dt, #mEvent .ev_info dl dd {font-size:3.6111vw;line-height:6.25vw;} #mEvent .ev_info .step {font-size:3.0556vw;} #mEvent .ev_info .stx {padding-left:1.3889vw; font-size:2.5vw;} #mEvent .ev_info dl dt {border-radius:5vw;} #mEvent .ev_info dl.guide {position:relative;left:0; } #mEvent .giveaway {padding-bottom:8.3333vw;} #mEvent .giveaway ul li{width:29.1667vw;} #mEvent .giveaway ul li + li {margin-left:2.0833vw;} #mEvent .giveaway ul li:nth-child(4) {margin-left:0;} #mEvent .giveaway ul li:nth-child(4), #mEvent .giveaway ul li:nth-child(5) {margin-top:4.1667vw;} #mEvent .giveaway .giftBox {height:29.1667vw;} #mEvent .giveaway .num {width:10.6944vw;height:11.9444vw;} #mEvent .giveaway .num span{line-height:11.9444vw;font-size:3.333vw;} #mEvent .giveaway .tx {padding:0;} #mEvent .giveaway .tx h4 {font-size:3.333vw;} #mEvent .giveaway .tx span {font-size:2.7778vw; } /* #mEvent .giveaway p {padding:5.5556vw 0 0 0;} #mEvent .giveaway p span {display:block;font-size:2.22vw; } #mEvent .giveaway p span + span {padding:0;} */ #mEvent .giveaway .bt_detail {border-radius:5vw; font-size:3vw;} #mEvent .giveaway .consult {width:90%; margin:0 auto; padding:2.7778vw 0 0; } #mEvent .giveaway .consult ul {width:100%;display:flex; flex-wrap:wrap; justify-content:center;align-items:flex-start;} #mEvent .giveaway .consult ul li {width:100%;} #mEvent .giveaway .consult ul li p {font-size:2.7778vw; padding:0 0 0 2.0833vw; padding-bottom:0.6944vw;} #mEvent .giveaway .consult ul li span {padding-left:2.7778vw; font-size:2.7778vw} #mEvent .giveaway .consult ul li span::before {left:0.6944vw;} #mEvent .giveaway .consult ul li + li {text-align:left;padding-top:1vw;margin:0;} #mEvent .giveaway .consult ul li + li p {display:block;} #mEvent .evtWrap {border-radius:4.1667vw;padding:6.9444vw 2.7778vw 1.3889vw;} #mEvent .evtWrap .step01Wrap {margin-bottom:6.9444vw;} #mEvent .evtWrap .step01Wrap::before {top:1.3889vw;left:4.0278vw;width:0.2778vw;height:97%} #mEvent .evtWrap .step01Wrap::after {left:3.4vw;width:1.6667vw;height:1.6667vw;} #mEvent .evtWrap dl {margin-bottom:2.7778vw;} #mEvent .evtWrap dl dt {width:8.3333vw;height:8.3333vw; margin-top:1.3889vw; } #mEvent .evtWrap dl dt span {font-size:2.5vw; padding-top:1.2vw;} #mEvent .evtWrap dl dt b {font-size:3.3333vw; } #mEvent .evtWrap dl dd {width:calc(100% - 10.3333vw);margin-left:1.3889vw; line-height:11.1111vw;font-size:3.8889vw; } #mEvent .evtWrap dl:nth-child(2) {margin-bottom:4rem;} #mEvent .evtWrap dl:nth-child(2) dt, #mEvent .evtWrap dl:nth-child(3) dt {line-height:8.3333vw;font-size:3.0556vw; top:1.5vw;border-width:0.2778vw;} #mEvent .evtWrap dl:nth-child(2) li { width:calc(50% - 0.6944vw); height:11.1111vw;} #mEvent .evtWrap dl:nth-child(2) li:first-child {margin-right:1.3889vw;} #mEvent .evtWrap dl:nth-child(3) li { width:calc(25% - 1.0417vw);margin:0 1.3889vw 1.3889vw 0;height:11.1111vw} #mEvent input[type="radio"] + label { height:11.1111vw; border-radius:5px; font-size:4.1667vw;} #mEvent .evtWrap .step02Wrap ul li {width:calc(50% - 0.6944vw);margin:0 0 5.5556vw 0;} #mEvent .evtWrap .step02Wrap ul li:nth-child(even) {margin-left:1.3889vw;} #mEvent .evtWrap .step02Wrap ul li .shorts {max-height:78.8889vw;margin-bottom:1.3889vw; border-radius:0.6944vw;} #mEvent .evtWrap .step02Wrap ul li p.shtx {border-width:0.2778vw;border-radius:5vw;} #mEvent .evtWrap .step02Wrap ul li p.shtx span {line-height:9.7222vw;font-size:4.1667vw;padding-right:4.1667vw;} #mEvent .evtWrap .step02Wrap ul li p.shtx span::after {width:2.6389vw; height:2.5vw; background-size:100%;} /* 이벤트 수치 */ #mEvent .e_count_wrap {padding:5.5556vw 0 0;} #mEvent .e_count_wrap .e_count {border-radius:7vw; font-size:3.3333vw;padding:2.7778vw 5.5556vw;} #mEvent .e_count_wrap .e_count span {display:block;padding-bottom:0.6944vw;} #mEvent .e_count_wrap .e_count span i {top:0.2083vw;font-size:5vw;} #mEvent .e_count_wrap .e_count b {font-size:3.6111vw;} /*TOP10순위*/ #mtop10 {background-image:url(../images/event/top10_bg_mo.jpg);height:177.0833vw; background-size:cover;} #mtop10 .top10List .selectBox dl, #mtop10 .top10List .selectBox dl:nth-child(3) {width:90%; height:9.7222vw; line-height:9.7222vw;margin:0 0 1.3889vw;} #mtop10 .top10List .selectBox dl dt { font-size:3.8889vw; } #mtop10 .top10List .selectBox dl dd, #mtop10 .top10List .selectBox dl:nth-child(3) dd { margin-left:16.6667vw; } #mtop10 .top10List .selectBox dl dd:after { right:4.1667vw; margin-top:-0.8333vw; width:2.6389vw; height:1.8056vw; background-size:cover;} #mtop10 .top10List .selectBox dl dd select {height:9.7222vw;font-size:4.1667vw;} #mtop10 .top10List .listBox {position:relative; left:8.3333vw; top:9.7222vw;} #mtop10 .top10List .listBox .swiper-container { left:-2.7778vw; top:-1.3889vw; padding:1.3889vw 0 0 2.7778vw; height: 64.3778vw; } #mtop10 .top10List .listBox .swiper-slide { width: 35.4167vw !important; /*margin-right:6.9444vw !important;*/} #mtop10 .top10List .listBox .swiper-slide .imgbox {border-radius:4.1667vw;} #mtop10 .top10List .listBox .swiper-slide .ranking {left:-2.7778vw;top:-1.3889vw;width:11.6667vw;height:11.6667vw; border-radius:1.3889vw; } #mtop10 .top10List .listBox .swiper-slide .ranking span {padding-top:0.8333vw;line-height:11.6667vw; font-size:8.8889vw;} #cardnews {background-image:url(../images/event/cardnews_bg_mo.jpg);height:162.9167vw; background-size:cover;} #cardnews h2 {font-size:8.3333vw;} #cardnews .list {padding-top:4.8611vw;} #cardnews .list ul li {width:calc(50% - 0.6944vw); margin-bottom:2vw;} #cardnews .list ul li p{height:6.9444vw; line-height:6.9444vw; font-size:3.0556vw;} #cardnews .list ul li a::after {bottom:8vw; right:1.5vw; width:7.3611vw; height:7.3611vw; background-size:60%;} #ranking {background-image:url(../images/event/evt_bg_mo.jpg); background-size:cover;padding-bottom:13.889vw;} #ranking .top10List .selectBox {margin-bottom:15.2778vw;} #ranking .top10List .selectBox dl, #ranking .top10List .selectBox dl:nth-child(3) {width:90%; height:9.7222vw; line-height:9.7222vw;margin:0 0 1.3889vw;} #ranking .top10List .selectBox dl dt { font-size:3.8889vw; } #ranking .top10List .selectBox dl dd, #ranking .top10List .selectBox dl:nth-child(3) dd { margin-left:16.6667vw; } #ranking .top10List .selectBox dl dd:after { right:4.1667vw; margin-top:-0.8333vw; width:2.6389vw; height:1.8056vw; background-size:cover;} #ranking .top10List .selectBox dl dd select {height:9.7222vw;font-size:4.1667vw; padding-left:3vw;} #ranking .top10List .listBox ul li {width:calc(50% - 3.6944vw);margin-bottom:8.3333vw;} #ranking .top10List .listBox ul li:nth-child(even) {margin-left:2.8889vw !important;} #ranking .top10List .listBox ul li:nth-child(odd) {margin-left:0 !important;} #ranking .top10List .listBox ul li:nth-child(1), #ranking .top10List .listBox ul li:nth-child(2), #ranking .top10List .listBox ul li:nth-child(3){width:calc(50% - 3.6944vw);} #ranking .top10List .listBox ul li:nth-child(2), #ranking .top10List .listBox ul li:nth-child(3) {margin-left:2.8889vw;} #ranking .top10List .listBox ul li:nth-child(4), #ranking .top10List .listBox ul li:nth-child(8) {margin-left:0;} #ranking .top10List .listBox ul li .t10_img {border-radius:1.5rem;} #ranking .top10List .listBox ul li .t10_img .info {position:absolute;top:auto;height:7vw;opacity:1;display:none;} #ranking .top10List .listBox ul li .t10_img .info p{display:none;} #ranking .top10List .listBox ul li .t10_img .info span{font-size:2.7778vw;} #ranking .top10List .listBox ul li .t10_img .info .show_shorts {display:none;} #ranking .top10List .listBox ul li .num {left:-3vw; top:-4.4444vw; width:10.5vw; height:10.5vw;} #ranking .top10List .listBox ul li .num span {top:1.8vw;font-size:6.4vw;} #ranking .top10List .listBox ul li:nth-child(1) .num, #ranking .top10List .listBox ul li:nth-child(2) .num, #ranking .top10List .listBox ul li:nth-child(3) .num {left:-5vw;top:-6vw; width:13.8889vw;height:18.6111vw;} #ranking .top10List .listBox ul li:nth-child(1) .num span, #ranking .top10List .listBox ul li:nth-child(2) .num span, #ranking .top10List .listBox ul li:nth-child(3) .num span {top:3.5vw;font-size:6.4vw;} #winner {background-image:url(../images/event/top10_bg_mo.jpg); background-size:cover;padding-bottom:13.889vw;} #winner dl.tx dt, #winner dl.tx dd {font-size:2.6316vw;} #winner .winnerList .search_box dl {flex-direction:column; padding:2.7778vw 0; margin:2.7778vw 0;} #winner .winnerList .search_box dl dt {display:block; font-size:3.8889vw;padding:0 0 0.5vw;line-height:2;} #winner .winnerList .search_box input {width:80%;height:8.3333vw;font-size:3.8889vw;} #winner .winnerList .bt_detail {border-radius:5vw; font-size:3vw;margin-left:1vw;} #winner .winnerName dl {margin-bottom:2.0833vw} #winner .winnerName dl dt {padding:0 0 2.0833vw;font-size:3.3333vw;} #winner .winnerName dl dt span {padding-right:2.0833vw;} #winner .winnerName dl dd ul > li {width:20%; font-size:3vw; margin-bottom:2.0833vw;} /* sns공유 */ #share {height:38.8889vw; } #share .inner {flex-direction:column;} #share .tx {display:block;padding:0;} #share .tx span{font-size:4.1667vw; } #share .tx span br {display:block;} #share .sns {display:block;} #share .sns ul li{width:11.1111vw;height:11.1111vw;margin-right:1.8056vw;} .all_count {height:23.6111vw;} .all_count .content {padding-top:5.6389vw;} .all_count .content p {font-size:4.1667vw;} .all_count .content p .visitor i, .all_count .content p .apply i {font-size:6.1111vw;} .all_count .content p br {display:block;} footer {padding:5.8333vw 0; } footer .content {font-size:2.5vw;} } @media all and (max-width: 1180px) { /* popup */ .pu .bt_close { top:-6vw; right:0; width:5.2222vw; height:5.3511vw; } #pu_cn .p_con.yt01 iframe {width:100rem;height:55.9rem;} #pu_cn .p_con.yt02 {width:40.5vw;height:72.2vw;} } @media all and (max-width: 980px) { .mo {display:inline-block;} /* popup */ /*.pu {transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0);top:8.2vw;}*/ .pu .bt_close { top:-8vw; right:0; width:7.2222vw; height:7.3611vw; } .pu_detail {width:95%;} .pu_detail .box ul li {font-size:3.0556vw;} #pu_cn .p_con.yt02 a {width:7.1667vw; height:7.1667vw;} /* 숏츠 평가하기 */ .pu_event_info { width:95%;max-width:90.2778vw; height:auto; } .pu_event_info .p_con h2 {font-size:4.1667vw; line-height:8.75vw; position:absolute;top:76vw;left:0;right:0;} .pu_event_info .p_con .shorts_video {position:relative; top:auto;left:auto;width:100%; height:76vw; margin:0 auto;} .pu_event_info .p_con .shorts_video iframe, .pu_event_info .p_con .shorts_video video {width:100%;height:100%;} .pu_event_info .p_con .shorts_video a {width:9.1667vw; height:9.1667vw;right:12.8vw;bottom:2vw;border:0.2778vw solid #f0f0f0;} .pu_event_info .p_con .largeView { right:2.7778vw !important; text-indent:inherit !important; display:flex !important; flex-direction:column; justify-content:center;} .pu_event_info .p_con .largeView span {font-size:2.5vw; line-height:1.2;display:block;color:#fff; text-align:center; } .pu_event_info .p_con .content {max-width:100%; margin-left:0; margin-top:8.75vw; padding:2.7778vw;} .pu_event_info .p_con .info dl {margin-bottom:2.7778vw;} .pu_event_info .p_con .info dl dt {font-size:2.5vw;} .pu_event_info .p_con .info dl dd {font-size:2.7778vw; max-height:6.9444vw;} .pu_event_info .p_con .rating h3 {font-size:3.3333vw;padding-bottom:0.9vw;} .pu_event_info .p_con .rating h3 span {font-size:2.7778vw; } .pu_event_info .p_con .rating .ratingBox dl {padding-bottom:1.2vw} .pu_event_info .p_con .rating .ratingBox dl:last-child {padding-bottom:1.2vw} .pu_event_info .p_con .rating .ratingBox dl dt {width:25vw; height:11.1111vw; line-height:11.1111vw;font-size:3.3333vw;} .pu_event_info .p_con .rating .ratingBox dl dd {padding-left:2.7778vw;} .pu_event_info .p_con .rating .ratingBox dl dd ul li {display:inline-block; padding:0 0.6944vw 1.3889vw;} .pu_event_info .p_con .rating .ratingBox dl dd ul li i {width:7.0833vw; height:6.8056vw;} .pu_event_info .p_con .rating .ratingBox p {font-size:2.5vw;} .pu_event_info .p_con .rating .messageBox textarea {padding:1.3889vw;height:11.8889vw; font-size:2.7778vw;} .pu_event_info .p_con .bt_dbform {height:11.1111vw; width:48.6111vw; border-radius:6.9444vw; margin:1rem auto 0;} .pu_event_info .p_con .bt_dbform span {font-size:4.1667vw; line-height:11.1111vw;} /* DB입력 */ .pu_event_db { width:95%;max-width:90.2778vw; height:auto; } .pu_event_db .p_con { border-radius:1.3889vw; } .pu_event_db .p_con .content {max-width:100%;padding:4.1667vw;} .pu_event_db .p_con .rating .ratingBox dl dt {width:19.4444vw; height:4.5056vw; line-height:4.5056vw;font-size:2.7778vw; border-radius:1.3889vw;} .pu_event_db .p_con .rating .ratingBox dl dd {padding-left:1.3889vw;} .pu_event_db .p_con .rating .ratingBox dl dd ul {display:flex;} .pu_event_db .p_con .rating .ratingBox dl dd ul li {padding:0 0.3472vw;} .pu_event_db .p_con .rating .ratingBox dl dd ul li i {width:4.3056vw; height:4.4444vw;} .pu_event_db .p_con .rating .ratingBox p {font-size:2.5vw;} .pu_event_db .p_con .rating .scoreBox {width:30.5556vw;height:auto; display:flex; flex-wrap:nowrap; align-items:center; flex-direction:column;} .pu_event_db .p_con .rating .scoreBox p {display:block;} .pu_event_db .p_con .rating .scoreBox .tit {width:100%; padding:1vw;font-size:2.7778vw;} .pu_event_db .p_con .rating .scoreBox .tit br {display:none;} .pu_event_db .p_con .rating .scoreBox .score {width:100%; top:0; font-size:3.1944vw;} .pu_event_db .p_con .rating .scoreBox .score i {font-size:8.3333vw; } .pu_event_db .p_con .rating .messageBox h3 {font-size:2.5vw;} .pu_event_db .p_con .rating .messageBox .message {height:11.3889vw;font-size:2.5vw;} .pu_event_db .p_con .dbform {padding-top:2.7778vw;} .pu_event_db .p_con .dbform dl {padding-bottom:1.3889vw;} .pu_event_db .p_con .dbform dl dt {font-size:2.7778vw;padding-bottom:0.6944vw;} .pu_event_db .p_con .dbform input {height:7.5vw;line-height:7.5vw; } .pu_event_db .p_con .dbform .box {height:17.2222vw; margin:1.3889vw; padding:1.3889vw;} .pu_event_db .p_con .dbform .box p {font-size:2.5vw; padding-bottom:1.3889vw;} .pu_event_db .p_con .dbform .box th, td {font-size:1.9444vw; padding:0.5rem; } .pu_event_db .p_con .dbform .box th {width:34%;font-size:2.2222vw;} .pu_event_db .p_con .dbform .checks label {font-size:3.2vw;} .pu_event_db .p_con .dbform .checks input[type="checkbox"] + label:after { width:5.6111vw; height:5.6111vw; line-height:4.5833vw; margin:-0.5556vw 0 0 1.3889vw; } .pu_event_db .p_con .bt_participate_done {height:11.1111vw; width:48.6111vw; border-radius:6.9444vw; margin-top:2.7778vw;} .pu_event_db .p_con .bt_participate_done span {font-size:4.1667vw;line-height:11.1111vw;} .pu_event_done { width:90%; } .pu_event_done .ph{width:100%;height:auto;} .pu_event_done .btn a {line-height:11.1111vw; font-size:4.1667vw; } /* 슬라이드 카드뉴스 팝업*/ #pu_cn .swiper-container {width: 83.3333vw; height: 83.3333vw; } #pu_cn .swiper-slide img {width:100%;} #pu_cn .swiper-button-next {width:8.3333vw; height:8.3333vw; right:-5vw; } #pu_cn .swiper-button-prev { width:8.3333vw; height:8.3333vw;left:-5vw;} #pu_cn .p_con.yt01 iframe {width:90.4444vw;height:51.0vw;} #pu_cn .p_con.yt02 {width:74vw;height:132.3889vw;} } /**/ @media all and (max-width: 912px) { @#mVisual .panorama .roller, .roller * { top:42.8889vw;} } /*ipad air*/ @media all and (max-width: 820px) { @#mVisual .panorama .roller, .roller * { top:42.8889vw;} } /*i mini*/ @media all and (max-width: 768px) { @#mVisual .panorama .roller, .roller * { top:38.8889vw;} } /**/ @media all and (max-width: 540px) { #@mVisual .panorama .roller, .roller * { top:40.8889vw;} } /*xr Gs20*/ @media all and (max-width: 414px) { #@mVisual .panorama .roller, .roller * { top:64.8889vw;} } /*pixel*/ @media all and (max-width: 393px) { @#mVisual .panorama .roller, .roller * { top:64.8889vw;} } /*pro*/ @media all and (max-width: 390px) { #@mVisual .panorama .roller, .roller * { top:64.8889vw;} } /*i se*/ @media all and (max-width: 375px) { #@mVisual .panorama .roller, .roller * { top:52.8889vw;} } /*G8*/ @media all and (max-width: 360px) { ##mVisual .panorama .roller, .roller * { top:59.8889vw;} } /*g Fold*/ @media all and (max-width: 280px) { ##mVisual .panorama .roller, .roller * { top:69.8889vw;} }