@charset "euc-kr";


/* setting */
#eventWrap { width: 100%; text-align: center; position: relative; overflow:hidden; font-family:'NotoSans KR'; } 
#eventWrap .inner { position: relative; width:1080px; margin: 0 auto; line-height: 1.4; z-index: 1; } 
#eventWrap img { border: 0 none; vertical-align: top; } 


/* support_link */
.support_link { background: #eaf2ff; } 
.support_link .pass_list li h4 { color: #3f56ff; } 
.support_link { padding: 160px 0;} 
.support_link h3 { color:#111; font-size:58px; font-weight:700; letter-spacing:-.8px; } 
.support_link .pass_list { max-width:1000px; width:100%; margin:55px auto 0; overflow:hidden; } 
.support_link .pass_list li {display:table; float:left; width:48%; border-top:3px solid #0f0f0f; border-bottom:1px solid #0f0f0f; box-sizing:border-box; padding:30px 25px; margin-bottom:30px; } 
.support_link .pass_list li:nth-child(even) { float:right; } 
.support_link .pass_list li h4 {display:table-cell;vertical-align:middle;font-size:28px;text-align:left;width:calc(100% - 148px);} 
.support_link .pass_list li a { display:table-cell; vertical-align:middle; float:right; text-align:right; width:148px; } 
.support_link .pass_list li h4 span { display:block; color:#000; font-size:20px; line-height:120%; font-weight:500; } 


/*visual*/
.visual { overflow: initial !important; padding: 130px 0 0 0; background-image: url('https://image.megagong.net/m/2023/1107_pass/gong/main_bg.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; } 
.visual h3 { margin: 0 -240px; } 
.visual h3 .coupon { margin-bottom: -230px; } 
.visual h3 .text { color: #fff; font-size: 30px; font-weight: 300; letter-spacing: 0.8px; } 
.visual h3 .text b { font-weight: 900; } 
.visual h3 .due { position: absolute; top: 536px; left: 50%; transform: translate(-50%, 0); } 
.visual h3 .due span { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 390px; height: 56px; margin: 0 auto; margin-bottom: 17px; color: #fff; font-size: 24px; font-weight: bold; background-color: #3f56ff; border-radius: 40px; } 
.visual h3 .due p { color: #050b73; font-size: 22px; font-weight: bold; letter-spacing: 5px; } 


/*con1*/
.con1 { padding: 290px 0 116px; } 
.con1 .coupon { margin-top: 90px; text-align:center; } 
.con1 .coupon p { margin-top: 20px; color:#b1b1b1; font-size:14px; line-height:120%; font-weight:300; } 
.con1 h4 { position:relative; } 
.con1 h4:before { content:""; display:block; width:100%; height:1px; background:#222; position:absolute; top:23px; left:0; z-index:-1; } 
.con1 h4 span { display:inline-block; width:390px; height:45px; line-height:45px; font-size:22px; border-radius:21px; background:#222; color:#fff; text-align:center; } 
.con1 .process { margin-top: 39px; margin-bottom: 74px; overflow:hidden; } 
.con1 .process li { float:left; height:186px; box-sizing:border-box; } 
.con1 .process li.box { display:table; width:30%; border-radius:8px; background: #d8e6ff; padding:30px 0; } 
.con1 .process li.box dl { display:table-cell; vertical-align:top; color:#000; font-size:18px; } 
.con1 .process li.box dt { font-weight:700; } 
.con1 .process li.box dd { margin-top:15px; line-height:120%; } 
.con1 .process li.box dd b { color: #3f56ff; font-weight:700; } 
.con1 .process li.box dd span { display: inline-block; margin-top: 8px; color: #555555; font-size: 16px; font-weight: 300; } 
.con1 .process li.bullet { width:5%; position:relative; } 
.con1 .process li.bullet img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); } 
.con1 h6 { margin-bottom: 25px; color: #3f56ff; font-size: 30px; font-weight: 900; } 


/*oxÄûÁî*/
.oxBox { width:100%; overflow:hidden; height:655px; box-sizing:border-box; border:6px solid #000; border-radius:35px; color:#000; font-weight:700; } 
.oxBox > div { width:100%; height:100%; display:table; box-sizing:border-box; padding:80px 130px; } 
.oxBox > div > div { display:table-cell; vertical-align:middle; } 
.oxBox a.oxBtn { display:block; margin:auto; width:400px; height:80px; border-radius:38px; background:#3f56ff; text-align:center; color:#fff; line-height:80px; font-size:26px; font-weight:700; } 
#eventWrap .oxBox a.oxBtn img { vertical-align:middle; height:20px; margin:-2px 0 0 14px; } 


/*½ÃÀÛp*/
.oxBox .start { background:url(https://img.megagong.net/m/2022/0905_pass/total/gong/bg_ox.png) repeat; } 
.oxBox .start p { display:table-cell; vertical-align:middle; } 


/*¹®Á¦p*/
.question .count { margin-left:20px; text-align:left; vertical-align:middle; font-size:28px; } 
.question .count b { color:#3f56ff; } 
.question .count b i { font-style:normal; } 
.question .txt { margin-top:20px; width:100%; height:180px; background:#f1f2f2; border-radius:18px; display:table; } 
.question .txt span { display:table-cell; vertical-align:middle; font-size:28px; line-height:120%; } 
.question .btn { margin-top:20px; } 
.question .btn li { display:inline-block; vertical-align:middle; font-size:32px; } 
.question .btn li.vs { width:163px; } 
.question .btn li button { width:320px; height:180px; border-radius:18px; background:#f1f2f2; font-size:0; } 
.question .btn li button.o { background:#f1f2f2 url(https://img.megagong.net/m/2022/0905_pass/total/gong/btn_o.png) no-repeat center; } 
.question .btn li button.o:hover,
.question .btn li button.o.on { background:#3f56ff url(https://img.megagong.net/m/2022/0905_pass/total/gong/btn_o_on.png) no-repeat center; } 
.question .btn li button.x { background:#f1f2f2 url(https://img.megagong.net/m/2022/0905_pass/total/gong/btn_x.png) no-repeat center; } 
.question .btn li button.x:hover,
.question .btn li button.x.on { background:#3f56ff url(https://img.megagong.net/m/2022/0905_pass/total/gong/btn_x_on.png) no-repeat center; } 


/*°á°úp*/
.result { text-align:center; } 
.result .tit { font-size:34px; } 
.result .tit dt { font-size:45px; } 
.result .tit dd { font-size:34px; line-height:120%; } 
.result .tit dd b { color:#3f56ff; } 
.result .tit dd.stit { color:#b1b1b1; font-size:14px; line-height:120%; font-weight:300; margin-top:20px; } 
.result .tit dd.stit span { color:#3f56ff; } 
.result .answer { margin-top:60px; } 
.result .answer dt { font-size:32px; line-height:120%; font-weight:700; } 
.result .answer dt b { color:#3f56ff; } 
.result .answer dd { margin-top:15px; font-size:21px; line-height:130%; font-weight:400; } 
.result .answer dd a { color: #3f56ff !important; } 
.result p { margin-top:30px; } 
.result_txt { text-align:right; margin-top: 20px; color: #4b4b4b; font-size: 12px; font-weight:300; line-height: 1; } 


/*À¯ÀÇ»çÇ×*/
.con_evt { background:#f9f9f9; } 
.con_evt h4 { background:#000; color:#fff; font-size:18px; font-weight:700; text-align:center; line-height:50px; } 
.con_evt ul { text-align:left; padding: 58px 0; } 
.con_evt li { position:relative; padding-left:10px; color: #222222; margin-top: 6.3px; font-weight: 200; } 
.con_evt li:before { content:"-"; position:absolute; top:0; left:0; } 
.con_evt li:first-child { margin-top:0; } 


@media (max-width: 1200px){
    #eventWrap .inner { width: 97%; } 
    #eventWrap img { max-width: 100% } 
 
    /*visual*/
    .visual { padding: 10vw 0 0 0; } 
    .visual h3 { margin: 0 auto; } 
    .visual h3 .due { top: 37vw; } 
    .visual h3 .due span { margin-bottom: 12px; } 
    .visual h3 .due p { letter-spacing: 4px; } 

    /*con1*/
    .con1 { padding: 21vw 0 10vw 0; } 
    .con1 .coupon { margin-top:5vw; } 
    .con1 .coupon img { max-width:520px; width:50%; } 
    .con1 .coupon p { margin-top:15px; font-size:12px; } 
    .con1 .process { margin-top:3vw; margin-bottom: 5vw; } 
    .con1 .process li { height: 140px; } 
    .con1 .process li.box { padding: 18px 0 10px 0; } 
    .con1 .process li.box dl { font-size:18px; } 
    .con1 .process li.box dd { margin-top:10px; font-size:15px; } 
    .con1 .process li.box dd span { font-size:12px; } 
    
    /*oxÄûÁî*/
    .oxBox { height:450px; min-height:450px; border-radius:15px; border-width:3px; } 
    .oxBox > div { padding:20px; } 
    .oxBox a.oxBtn { max-width:200px; width:50%; height:60px; border-radius:30px; line-height:60px; font-size:20px; } 
    #eventWrap .oxBox a.oxBtn img { height:16px; margin:-2px 0 0 10px; } 

    /*¹®Á¦p*/
    .question .count { margin-left:0; font-size:20px; } 
    .question .count img { width:26px; } 
    .question .txt { margin-top:10px; height:140px; border-radius:12px; } 
    .question .txt span { font-size:18px; } 
    .question .btn { margin-top:3vw; } 
    .question .btn li { width:42%; } 
    .question .btn li.vs { width:14%; font-size:25px; } 
    .question .btn li button { width:100%; height:180px; border-radius:12px; } 
    
    /*°á°úp*/
    .result .tit { font-size:28px; } 
    .result .tit dt { font-size:38px; } 
    .result .tit dd { font-size:28px; } 
    .result .tit dd.stit { font-size:14px; margin-top:20px; } 
    .result .answer { margin-top:60px; } 
    .result .answer dt { font-size:25px; } 
    .result .answer dd { margin-top:15px; font-size:18px; } 
    .result p { margin-top:30px; } 
    .result_txt { margin-top:10px; font-size:12px; } 

    /*À¯ÀÇ»çÇ×*/
    .con_evt h4 { font-size:18px; line-height:40px; } 
    .con_evt ul { padding:4vw 0; } 
    .con_evt li { padding-left:10px; margin-top:3px; } 

    .support_link { padding: 10vw 0; } 
	.support_link h3 {font-size: 3.6vw;} 
	.support_link .pass_list { margin:5vw auto 0; } 
	.support_link .pass_list li { width:48%; padding:15px; margin-bottom:15px; } 
	.support_link .pass_list li h4 {font-size: 2.3vw;width:60%;} 
	.support_link .pass_list li a { width:80%; } 
    .support_link .pass_list li h4 span{font-size: 0.8em;}

}

@media (max-width: 992px){
    /*visual*/
    .visual h3 .text { font-size: 20px; } 
    .visual h3 .due span { width: 340px; height: 50px; font-size: 18px; } 
    .visual h3 .due p { font-size: 18px; } 

    /*con1*/
    .con1 { padding: 28vw 0 10vw 0; } 
    .con1 h4 span { font-size: 18px; } 
}

@media (max-width: 768px){
    /*visual*/
    .visual h3 .text { font-size: 18px; } 
    .visual h3 .due span { width: 250px; height: 50px; margin-bottom: 5px; font-size: 16px; } 
    .visual h3 .due p { font-size: 16px; letter-spacing: 2px; } 
    .visual h3 .coupon { width: 90vw; margin-bottom: -15vw; } 
    .visual h3 .due span { height: 40px; } 

    /*con1*/
    .con1 { padding: 15vw 0 10vw 0; } 
    .con1 .process li { height:170px; } 
    .con1 .process li.box { border-radius:8px; padding:30px 0; } 
    .con1 .process li.box dl { font-size:18px; } 
    .con1 h6 { margin-bottom: 10px; font-size: 24px; } 

    .support_link h3 {margin-bottom: 7vw;font-size: 32px;} 
	.support_link .pass_list li h4 span{}
}

@media (max-width:640px){
    /*visual*/
    .visual h3 .text { font-size: 14px; } 
    .visual h3 .due span { width: 200px; height: 40px; font-size: 13px; } 
    .visual h3 .due p { font-size: 13px; letter-spacing: 1px; } 

    /*con1*/
    .con1 h4:before { top:17px; } 
    .con1 h4 span { width:240px; height:40px; line-height:40px; font-size:15px; } 
    .con1 .process li { height: 120px; } 
    .con1 .process li.box { padding:15px 0; } 
    .con1 .process li.box dl { font-size:15px; } 
    .con1 .process li.box dd { margin-top:5px; font-size:12px; } 
    .con1 .process li.bullet img { width:10px; } 
    .con1 h6 { font-size: 18px; } 
    
    /*¹®Á¦p*/
    .question .btn li button.o,
    .question .btn li button.o:hover,
    .question .btn li button.o.on,
    .question .btn li button.x,
    .question .btn li button.x:hover,
    .question .btn li button.x.on { background-size:40%; } 

    /*°á°úp*/
    .result .tit { font-size:22px; } 
    .result .tit dt { font-size:38px; } 
    .result .tit dd { font-size:28px; } 
    .result .tit dd.stit { font-size:11px; margin-top:10px; } 
    .result .answer { margin-top:15px; } 
    .result .answer dt { font-size:20px; } 
    .result .answer dd { margin-top:5px; font-size:15px; } 
    .result p { margin-top:10px; } 
    .result_txt { margin-top:10px; font-size:12px; } 

    /*À¯ÀÇ»çÇ×*/
    .con_evt h4 { font-size:17px; } 

    .support_link h3 {font-size: 5vw;} 
	.support_link .pass_list { margin:3vw auto 0; } 
	.support_link .pass_list li { width:48%; padding:10px; margin-bottom:10px; } 
	.support_link .pass_list li h4 {font-size: 3.6vw;width:100%;display:block;float:none;text-align:center;} 
	.support_link .pass_list li a {display:block;float:none;width: 100%;margin: 11px auto 0;height: 9vw;padding: 0px 22%;overflow:hidden;background: #000;box-sizing: border-box;} 
	.support_link .pass_list li a img { width:100%; margin-top:-1.2vw; } 
}

@media (max-width: 480px){
    /*visual*/
    .visual h3 .text { font-size: 12px; } 
    .visual h3 .due span { width: 185px; height: 35px; } 
    .visual h3 .due p { letter-spacing: 0px; } 

    /*con1*/
    .con1 .process li.box dd { font-size: 11px; } 
    .con1 .process li.box dd span { font-size: 9px; } 

    /*oxÄûÁî*/
    .oxBox a.oxBtn { max-width:170px; width:65%; height:40px; border-radius:13px; line-height:40px; font-size:15px; } 
    #eventWrap .oxBox a.oxBtn img { height:13px; margin:-3px 0 0 5px; } 

    /*¹®Á¦p*/ 
    .question .txt span { font-size:16px; } 
}

@media (max-width: 360px) {
    /*con1*/
    .con1 h4:before { top:17px; } 
    .con1 h4 span { width: 210px; height: 35px; line-height: 35px; font-size: 13px; } 
    .con1 .process li { height: 104px; } 
    .con1 .process li.box { padding:15px 0; } 
    .con1 .process li.box dl { font-size:12px; } 
    .con1 .process li.box dd { margin-top:5px; font-size:10px; } 
    .con1 .process li.bullet img { width:10px; } 
}