/* font */
@font-face {
    font-family: 'HGGGothicssiP80gA';
    src: url('../font/HGGGothicssiP80gA.ttf') format('truetype'),
         url('../font/HGGGothicssiP80gA.svg') format('svg'),
         url('../font/HGGGothicssiP80gA.woff') format('woff'),
         url('../font/HGGGothicssiP80gA.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
  }

/* all */
body{margin: 0; padding: 0; overflow-anchor: none;}
a{display: block;}
img{display: block; margin: 0 auto;}
.inner{width: 100%; max-width: 1200px; margin: 0 auto;}
.inner02{width: 100%; max-width: 982px; margin: 0 auto;}
.rel{position: relative;}
.ab{position: absolute;}
.off{display: none;}
.topInner{display: none;}

/*상단 슬라이드 화살표 더 갈 곳 없을때*/
.slick-disabled{opacity: 0.5}

@media screen and (max-width: 640px){
.pc, .onlyPc{display: none !important;}
.mobile{display: block !important;}
.flex{display: flex !important;}
.w100{width: 100%;}
.w90{width: 90%;}
.fixTop ul{width: 100%; white-space: nowrap;}
.inner{overflow-x: scroll;}

/* fix */
.fix{position: fixed; z-index: 30 !important;}
.fixTop{left: 0; top: 0; width: 100%; height: 18.750vw; background:#011230 url('../images/top_bg.png') no-repeat left top; background-size: cover;}
#event02{height:18.750vw;}
.fixTop .topInner{overflow-x: scroll;}
.fixTop ul{padding: 0; display: flex; justify-content: center; margin: 3.594vw auto 0; overflow: hidden;
  white-space: nowrap; text-overflow: ellipsis; padding-bottom: 2.8vw;}
.fixTop ul{direction: ltr;width:110%;}
.fixTop ul::after{content: ''; display: block; visibility: hidden; clear: both;}
.fixTop ul li{display: block; float: left;}
.fixTop ul li img{width: 33.125vw;}
.fixTop ul li:not(:last-child){margin-right: 2.656vw;}
.fixRight{right: 5%; top: 30.733vw; z-index: 41;}
.fixRight div{ padding-bottom: 6px; background: url('../images/arrow_bottom.png') no-repeat bottom 8px center; cursor: pointer; width: 18vw; height: 19.063vw; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px; text-align: center;}
.fixRight div.mobile{display: flex !important; align-items: center; justify-content: center;}
.fixRight div.on{padding-bottom: 16px; height: 84.063vw; background: url('../images/arrow_top.png') no-repeat bottom 8px center; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px;}
.fixRight div.mobile.on{display: flex !important; align-items: center; flex-direction: column; align-content: center; justify-content: space-around;}
.fixRight div span{font-family: 'HGGGothicssiP80gA'; font-size: 3.438vw; color: #ffffff; }
.fixRight div.on span{padding-top: 2vw;}
.fixRight div a{display: none;}
.fixRight div.on a{display: block;}
.fixRight div a:last-of-type{margin-bottom: 6px;}
.fixRight div.on a img{width: 70%; max-width: 98px;}
.fixBottom{left: 0; bottom: 0; width: 100%; background-color: #0043ad;}
.fixBottom a{width: 100%; height: 12.5vw;}
.fixBottom a img{left: 50%; top: 50%; transform: translate(-50%, -50%); width: 64.094vw;}

.logoArea{display: flex;}
.logoArea a.pc {display: none;}
.logoArea a{position: absolute; left: 4.688vw; top: 4.177vw; z-index: 9; width: 13.396vw;}
.logoArea img{width: 26.563vw;}
.main video{width: 100%;}

header{display: none;}

.wrap{margin-top: 18.750vw;}

section:not(.main):not(.watchArea):not(.global):not(.colorArea):not(.event):not(.tabArea):not(.paddingNo), footer:not(.paddingNo){padding-left: 3.125vw !important; padding-right: 3.125vw !important;}

.sec03{background-color: #ffe81d; padding: 6.563vw 0; border-top: 1.563vw solid #fff; border-bottom: 1.563vw solid #fff;}
.sec03 img{margin: 0; width: 65.969vw;}
/* .sec03 img:first-of-type{padding-left: 35px; width: 55.235vw;} */
.sec03 img:last-of-type{position: absolute; right: 0; top: -0.437vw; width: 25.438vw;}

.watchArea{border-bottom: 10px solid #fff;}

.sec04, .sec05{padding: 9.456vw 0 4.965vw;}

.sec04{background-color: #17a6ff; height: 93.750vw;}
.sec04 div.mobile a{left: 50%; transform: translate(-50%, 0);}
.sec04 div.mobile a.call01{top: 3vw;}
.sec04 div.mobile a.call02{top: 50vw;}

.sec05{background-color: #1566e6;}
.sec05.purple{background-color: #6460f2;}
.sec05 a{position: absolute; bottom: 100px;}
.sec05 a:first-of-type{left: 50%; bottom: 76.625vw; transform: translate(-50%, 0);}
.sec05 a:last-of-type{left: 50%; bottom: 16.625vw; transform: translate(-50%, 0);}
.sec05 a:first-of-type img, .sec05 a:last-of-type img{width: 54.875vw;}

footer{background-color: #dddddd; padding:0 10px; margin-bottom:40px;}
}

/* 유튜브, 카카오톡 버튼 전용 */
@media screen and (min-width: 641px) and (max-width: 1025px){
.sec05 a {position: absolute; bottom: 9.756vw !important;}
.sec05 a:first-of-type{left: 6.829vw !important;}
.sec05 a:last-of-type{right: 6.829vw !important;}
.sec05 a img{width: 35.512vw;}
}
  
@media screen and (min-width: 641px) and (max-width: 1269px){
.mobile, .onlyPc{display: none !important;}
.w100{width: 100%;}
.w90{width: 90%;}

/* luckyPop */
.luckyPop{position: fixed; left: 0; top: 0; z-index: 50; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9);}
.luckyPop > div{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 50.787vw;}
.luckyPop > div img{width: 100%;}
.luckyPop > div .luckyBtn p{height: 68px; cursor: pointer;}
.luckyPop > div .luckyBtn p:first-of-type{float: left; width: 40%; background: url('../images/pop_allDay.png') no-repeat left top; background-size: contain; text-indent: -9999px;}
.luckyPop > div .luckyBtn p:last-of-type{float: right; width: 12%; background: url('../images/pop_close.png') no-repeat right top 10px; background-size: contain; text-indent: -9999px;}

/* fix */
.fix{position: fixed; z-index: 30;}
.fixTop{left: 0; top: 0; width: 100%; height: 6.929vw; background: url('../images/top_bg.png') no-repeat left top; background-size: cover;}
#event02{height:6.929vw;}
.fixTop .topInner{width: 68%; margin: 0 auto; position: relative;}
.fixTop .topInner button{position: absolute; top: 1.050vw; border: none; text-indent: -9999px; cursor: pointer; width: 1.155vw; height: 1.785vw;}
.fixTop .topInner button:first-of-type{left: -2.2vw; background: url('../images/topSlide_arrow_left.png') no-repeat center; background-size: contain;}
.fixTop .topInner button:last-of-type{right: -1.260vw; background: url('../images/topSlide_arrow_right.png') no-repeat center; background-size: contain;}
.fixTop .logoAdd{left: 3.7vw; top: 50%; transform: translate(0, -50%);}
.fixTop ul{margin: 0 auto; margin-top: 1.5vw; padding: 0; width: 92.5%; padding-bottom: 0.4vw;}
.fixTop ul li{display: block;}
.fixTop ul li img{margin: 0; width: 95%;}
.fixTop ul div{height: 4vw;}
.fixRight{right: 5%; top: 30.733vw; z-index: 11;}
.fixRight div{display: flex; align-items: center; justify-content: center; padding-bottom: 6px; background: url('../images/arrow_bottom.png') no-repeat bottom 8px center; cursor: pointer; width: 9.693vw; height: 9.693vw; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px; text-align: center;}
.fixRight div.on{background: url('../images/arrow_top.png') no-repeat bottom 8px center; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px;     display: flex;
  flex-direction: column; justify-content: space-around;}
.fixRight div span{font-family: 'HGGGothicssiP80gA'; font-size: 1.891vw; color: #ffffff; }
.fixRight div.on span{padding-top: 1vw;}
.fixRight div.on{height: 39.063vw;}
.fixRight div a{display: none;}
.fixRight div.on a{display: block;}
.fixRight div a:last-of-type{margin-bottom: 6px;}
.fixRight div.on a img{width: 70%; max-width: 98px;}
.fixBottom{left: 0; bottom: 0; width: 100%; background-color: #0043ad;}
.fixBottom a{width: 100%; height: 6.299vw;}
.fixBottom a img{left: 50%; top: 50%; transform: translate(-50%, -50%); width: 30.426vw;}

.main .logoArea{display: flex; justify-content: flex-end;}
.main .logoArea a.mo {display: none;}
.main .logoArea a{position: absolute; right: 11.820vw; top: 4.177vw; z-index: 9; width: 13.396vw;}
.main .logoArea a img{width: 13.396vw;}
.main video{width: 100%;}

header{display: none;}

.wrap{margin-top: 6.619vw;}

section:not(.main):not(.paddingNo), footer{padding-left: 1.575vw !important; padding-right: 1.575vw !important;}

.sec03{background-color: #ffe81d; padding: 40px 0; border-top: 10px solid #fff; border-bottom: 10px solid #fff;}
.sec03 img{margin: 0;}
.sec03 img:first-of-type{padding-left: 35px; width: 55.235vw;}
.sec03 img:last-of-type{position: absolute; right: 0; top: -5.437vw; width: 15.603vw;}

.sec04, .sec05{padding: 9.456vw 0 4.965vw;}

.sec04{background-color: #17a6ff;}

.sec05{background-color: #1566e6;}
.sec05.purple{background-color: #6460f2;}
.sec05 a{position: absolute; bottom: 100px;}
.sec05 a:first-of-type{left: 70px;}
.sec05 a:last-of-type{right: 70px;}

footer{background-color: #dddddd; padding: 9.449vw 0 7.559vw; margin-bottom:3.299vw;}
}

@media screen and (max-width: 1700px){
  .logoAdd{display: none;}
}

@media screen and (min-width: 1270px){
.mobile{display: none !important;}

/* luckyPop */
.luckyPop{position: fixed; left: 0; top: 0; z-index: 50; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9);}
.luckyPop > div{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 645px;}
.luckyPop > div .luckyBtn p{height: 68px; cursor: pointer;}
.luckyPop > div .luckyBtn p:first-of-type{float: left; width: 40%; background: url('../images/pop_allDay.png') no-repeat left top; text-indent: -9999px;}
.luckyPop > div .luckyBtn p:last-of-type{float: right; width: 12%; background: url('../images/pop_close.png') no-repeat right top 10px; text-indent: -9999px;}

/* fix */
.fix{position: fixed; z-index: 10;}
.fixTop{left: 0; top: 0; width: 100%; height: 4.7vw; background:#011230 url('../images/top_bg.png') no-repeat left top; background-size: cover;}
#event02{height:4.7vw;}
.fixTop .topInner{width: 68%; margin: 0 auto; position: relative;}
.fixTop .topInner button{position: absolute; top: 1.050vw; border: none; text-indent: -9999px; cursor: pointer; width: 1.155vw; height: 1.785vw;}
.fixTop .topInner button:first-of-type{left: -2vw; background: url('../images/topSlide_arrow_left.png') no-repeat center; background-size: contain;}
.fixTop .topInner button:last-of-type{right: -2vw; background: url('../images/topSlide_arrow_right.png') no-repeat center; background-size: contain;}
.fixTop .logoAdd{left: 3.7vw; top: 50%; transform: translate(0, -50%);}
.fixTop ul{margin: 0 auto; margin-top: 0.4vw; padding: 0; width: 93%; padding-bottom: 0.4vw;}
.fixTop ul li{display: block; width: 14.751vw !important; height: 3.78vw;}
.fixTop ul li:not(:first-of-type){margin-left: 1.05vw;}
.fixTop ul li a{width: 100%; height: 100%;}
.fixTop ul li img{margin: 0; width: 100%; height: inherit;}
.fixTop ul div{height: 4vw;}
.fixRight{right: 10.50%; top: 390px; z-index: 11;}
.fixRight div{padding-bottom: 6px; background: url('../images/arrow_bottom.png') no-repeat bottom 8px center; cursor: pointer; width: 123px; height: 123px; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px; padding-top: 25px; text-align: center;}
.fixRight div.on{background: url('../images/arrow_top.png') no-repeat bottom 8px center; background-color: rgba(14,90,209,0.8); border: 2px solid #498aec; box-sizing: border-box; border-radius: 10px;}
.fixRight div span{font-family: 'HGGGothicssiP80gA'; font-size: 24px; color: #ffffff; }
.fixRight div.on{height: 440px;}
.fixRight div a{display: none;}
.fixRight div.on a{display: block;}
.fixRight div a:first-of-type{margin-top: 12px;}
.fixRight div a:not(:last-of-type){margin-bottom: 10px;}
.fixRight div a:last-of-type{margin-bottom: 6px;}
.fixRight div.on a img{width: 60%; max-width: 98px;}
.fixBottom{left: 0; bottom: 0; width: 100%; background-color: #0043ad;}
.fixBottom a{width: 100%; height: 80px;}
.fixBottom a img{left: 50%; top: 50%; transform: translate(-50%, -50%);}

.main .logoArea{display: flex; justify-content: flex-end;}
.main .logoArea a.mo {display: none;}
.main .logoArea a{position: absolute; right: 150px; top: 53px; z-index: 9;}
.main video{width: 100%;}

header{display: none;}

.wrap{margin-top: 4.619vw;}

.aMore{width: 480px; margin: 0 auto;}

.sec03{background-color: #ffe81d; padding: 40px 0; border-top: 10px solid #fff; border-bottom: 10px solid #fff;}
.sec03 img{margin: 0;}
.sec03 img:first-of-type{padding-left: 35px;}
.sec03 img:last-of-type{position: absolute; right: 0; top: -69px;}

.sec04, .sec05{padding: 120px 0 63px;}

.sec04{background-color: #17a6ff;}

.sec05{background-color: #1566e6;}
.sec05.purple{background-color: #6460f2;}
.sec05 a{position: absolute; bottom: 100px;}
.sec05 a:first-of-type{left: 70px;}
.sec05 a:last-of-type{right: 70px;}

footer{background-color: #dddddd; padding: 120px 0 96px; margin-bottom: 78px;}
}
