@charset "UTF-8";
@import url(fonts.css);
/* reset */
* {margin:0;padding:0;box-sizing: border-box;-webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
html, body {width:100%; overflow-x: hidden; -webkit-text-size-adjust: none; -ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select:none;}
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, textarea, radio, select, p, button {margin:0; padding:0}
body, th, td, button, input, select, textarea { font-family: 'Pretendard',AppleSDGothicNeo-Regular,"Helvetica Neue",Roboto,Helvetica, Arial, sans-serif; font-size:22px; line-height: 1.4; color:#161C26; font-weight:normal; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
a {color: inherit; text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); -webkit-tap-highlight-color: transparent;}
a:hover, a:active, a:focus {text-decoration: none; outline: 0;}
table {border-collapse:collapse; border-spacing:0;}
caption, legend {overflow:hidden; width:0; height:0; text-indent:-9999em; line-height:0; font-size:0}
img {display: block; border: 0; vertical-align: top;}
input, select, textarea {vertical-align: middle;}
select { -webkit-appearance: none; -moz-appearance: none;appearance: none; }
select::-ms-expand { display:none; }
ul, ol, li {list-style: none;}
button {background: none; border: none; box-sizing: border-box; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); -webkit-tap-highlight-color: transparent;}
em, address {font-style:normal}
input {padding: 16px 0; border: none; border-radius: 10px;}
textarea {border: 1px solid #ccc; padding: 4px 16px;}
i {background-repeat: no-repeat; background-position: center; display: inline-block; vertical-align: top;}
table { border-collapse: collapse; border-spacing: 0; width: 100%;}
caption {overflow: hidden;width: 0;height: 0;font-size: 0; line-height: 0;}
th, td { vertical-align: middle;}

body {background: #fff; min-width: 1400px; margin: 0 auto; text-align: center;}
h2 {display: inline-block; margin: 0 auto 80px; padding: 25px 50px; font-size: 42px; line-height: 50px; color: #fff; background-color: #161C26; border-radius: 60px;}
.inner {max-width: 1400px; margin: 0 auto;}
.orange {color: #FF571F;}
.orange2 {color: #ff915b;}
.white {color: #fff;}
.f-28 {font-size: 24px;}
div.fp-watermark { display: none;}
.mo {display: none;}
.pc {display: block;}

/* 메인 이미지 */
.logo {position: absolute; top: 40px; right: 40px; z-index: 5;}
.main-visual {position: relative; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.9);}
.main-visual::after {content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; animation: main 1s cubic-bezier(0.2, 0.25, 0.25, 1) 5s forwards;}
@keyframes main {
	0% {
		background-color: transparent;
	}
	100% {
		background-color: rgba(0, 0, 0, 0.2);
	}
}
.main-visual video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;}
.arr-down {position: absolute; bottom: 8px; z-index: 2; left: 50%; transform: translateX(-50%); animation: bounce-up-down 2s infinite;}
.main-visual img, .sub-visual img, .event-form img {margin: 0 auto;}

/* 서브 이미지 */
.sub-visual {padding: 120px 0; position: relative;}
.sub-visual .txt-01 {color: #545964; font-size: 30px;}
.sub-visual .txt-02 {color: #161C26; font-size: 50px; font-weight: 600; margin: 80px 0 100px;}
.sub-visual .txt-03 {color: #FF571F; font-size: 100px; font-family: 'cafe';}
.sub-visual .spoon-01 {position: absolute;top: 8%;right: 50%;margin-right: -600px;width: 200px;height: 268px;background: url(../images/img_spoon_r.png) no-repeat;background-size: 100% auto; animation: bounce-up 3s infinite;}
.sub-visual .spoon-02 {position: absolute;top: 45%;left: 50%;margin-left: -720px;width: 240px;height: 314px;background: url(../images/img_spoon_l.png) no-repeat;background-size: 100% auto; animation: bounce-down 3s infinite;} 
.sub-visual .okman-01 {position: absolute;bottom: 120px;right: 50%;margin-right: -650px;width: 300px;height: 396px;background: url(../images/img_okman_01.png) no-repeat;background-size: 100% auto;} 
@keyframes bounce-down {
  0%, 100% {
    transform: translateY(0);
    animation-timing-function: ease-in;
  }
  50% {
    transform: translateY(-40px);
    animation-timing-function: ease-out;
  }
}
@keyframes bounce-up {
  0%, 100% {
    transform: translateY(0);
    animation-timing-function: ease-in;
  }
  50% {
    transform: translateY(40px);
    animation-timing-function: ease-out;
  }
}
.tab {padding: 40px;}
.tab ul {display: flex; flex-direction: row; align-items: center; justify-content: center;}
.tab li a {padding: 10px 30px; font-size: 28px; font-weight: 600; line-height: 40px; color: #ff571f; border-radius: 60px;}
.tab li.on a {background-color: #161C26; color: #fff;}
.tab li a:hover {background-color: #E9EBF0;}

.tab.fixed {position: fixed; top: 0; left: 0; right: 0; background: rgba(255,255,255,0.7); backdrop-filter: blur(15px); z-index: 10; transform: none;}

/* 이벤트 01 */
.event-form {padding: 120px 0;}
.event-01 {background-color: #F1F3F5;}
.title {font-family: 'cafe'; font-size: 100px; line-height: 110px; color: #FF571F; margin: 30px 0 80px;}
.sub-title {font-family: 'cafe'; font-size: 60px; line-height: 70px; color: #161C26;}
.txt {position: relative; font-size: 34px; line-height: 50px; font-weight: 600; margin-bottom: 80px;}
.orange-list {display: flex; gap: 40px; justify-content: center; align-items: center; font-weight: 600;}
.orange-list li {display: flex; gap: 16px; flex-direction: column; align-items: center; padding: 24px; width: 400px; height: 400px; border-radius: 24px; background-color: #fff; box-shadow: 2px 2px 16px 0px rgba(0, 0, 0, 0.05);}
.black-form {color: #fff; display: inline-block; font-size: 28px; font-weight: 600; padding: 0 20px; border-radius: 60px; height: 60px; line-height: 60px; background-color: #161C26;}
.event-01 .txt-event {margin-top: 40px; font-size: 28px; color: #545964;}
.btn {transition: ease-in-out 0.3s; border-radius: 24px; background: #ff571f; color: #fff; font-family: 'cafe'; font-size: 50px; width: 600px; height: 140px; margin-top: 100px;}
.btn:active, .btn:hover {transform: scale(0.95) !important; background-color: #E64813;}
.btn.btn-gray:active, .btn.btn-gray:hover {background-color: #C8CBD5;}

/* 이벤트 02 */
.event-02 {padding: 120px 0 0;}
.orange-list.flex-column {flex-direction: column; gap: 40px;}
.event-02 .orange-list .list-04 {width: 600px; height: 600px;}
.orange-form {color: #fff; display: inline-block; text-align: center; font-size: 36px; font-weight: 600; border-radius: 80px; width: 280px; height: 80px; line-height: 80px; background-color: #ff571f; margin-bottom: 60px;}
.orange-form-02 {color: #fff; display: inline-block; text-align: center; font-size: 36px; font-weight: 600; border-radius: 80px; width: 280px; height: 80px; line-height: 80px; background-color: #ff571f; margin: 80px 0 60px;}
.orange-title {margin: 100px 0 75px;}
.orange-title img {margin: 0 auto;}
.sns-form {position: relative; background-color: #ff571f; color: #fff; padding: 80px 0;}
.sns-form > p {font-family: 'cafe'; font-size: 50px; line-height: 60px;}
.sns-form > img {margin: 40px auto;}
.sns-form .bottom {font-size: 28px; line-height: 40px;}
.event-02 .orange-list li.list-01, .event-02 .orange-list li.list-02, .event-02 .orange-list li.list-03 {width: 350px; height: 350px;}
.event-02 .orange-list li.list-01 p, .event-02 .orange-list li.list-02 p, .event-02 .orange-list li.list-03 p {height: 90px; display: flex; align-items: center;}
.bg-gray {background: #F1F3F5; padding: 120px 0;}

.img-banner {display: block; padding: 0 16px 120px;}
.img-banner img {margin: 0 auto; max-width: 100%;}

/* 읏수저 만나보기 */
.table {background: #fff; border: 2px solid #B2B7C0; border-radius: 32px; overflow: hidden; width: 1200px; margin: 0 auto;}
.table thead tr th {height: 80px; color: #545964; border-left: 1px solid #D3D8E4; border-top: 1px solid #D3D8E4;}
.table tr th {font-size: 32px; font-weight: 600;}
.table tr th img {margin: 0 auto;}
.table tr td {font-size: 28px; font-weight: 500;}
.table tbody tr th, .table tbody tr td {height: 140px; padding: 20px;  color: #545964; border-right: 1px solid #D3D8E4; border-top: 1px solid #D3D8E4; word-break: keep-all;}
.table thead tr:first-child th {border-top: none;}
.table thead tr th:first-child {border-left: none;}
.table th:last-child, .table td:last-child {border-right: none;}
.table td.border-right {border-right: 1px solid #D3D8E4;}
.table tr th {background: #F1F3F5;}
.table span {font-size: 20px; display: block; color: #6C7080;}
.event-form .img-place {width: 160px; height: 160px; position: absolute; top: -72px; right: 50%; margin-right: -580px;}

/* 읏수저랑 함께 놀기 */
.event-04 .txt {font-family: 'cafe'; font-size: 120px; line-height: 140px;}
.event-04 .txt p + p {margin-top: 60px;}
.store-form {font-size: 38px; max-width: 1050px; margin: 0 auto; text-align: left; line-height: 70px; font-weight: 600;}
.store-form dl {display: flex; align-items: flex-end; gap: 30px;}
.store-form dl + dl {margin-top: 30px;}
.store-form dt {color: #161C26; display: flex; justify-content: center; align-items: center; width: 200px; height: 80px; background: #E9EBF0; border-radius: 40px;}
.event-form .img-popup {width: 300px; height: 300px; position: absolute; top: -120px; left: 50%; margin-left: -550px;}

/* 이벤트 안내 */
.i-info {width: 24px; height: 24px; background: url(../images/ico_info.png) no-repeat; background-size: 100% auto;}
.info-form {background-color: #F1F3F5; padding:60px; color: #545964; font-size: 20px; text-align: left;}
.info-form .inner {max-width: 1200px;}
.line-list {display: flex; flex-direction: column; gap: 4px;}
.line-list li {position: relative; padding-left: 16px;}
.line-list li::before {content: ''; width: 6px; height: 1px; position: absolute; left: 0; top: 12px; background-color: #545964;}

/* 팝업 */
.popup {display: none;}
.dim {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.64)}
.popup-container {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 9999; padding: 30px 40px 40px;border-radius: 40px;background: #fff;}
.popup-container .btn-close {position: absolute; top: 30px; right: 30px; width: 40px; height: 40px;}
.popup-header {font-size: 26px;}
.popup-header img {margin: 0 auto;}
.popup-header p {margin: 30px 0;}
.popup-header .sub-title {font-size: 54px; line-height: 64px;}
.popup-header .txt {margin: 0;}
.popup-contents {text-align: left;background: #F7F7F9;border-radius: 20px;padding: 30px;width: 740px; height: 480px;overflow-y: auto;}
.popup-contents.flex-center {display: flex; align-items: center; justify-content: center; flex-direction: column;}
.popup-footer {margin-top: 30px;display: flex;gap: 14px;justify-content: center;}
.popup .btn {width: 230px; height: 70px; font-size: 32px; background: #ff571f; border-radius: 16px; margin: 0;}
.popup .btn.btn-large {width: 300px;}
.popup .btn.btn-gray {background: #E9EBF0; color: #4D5764;}
.popup .btn img {margin: 0 auto;}
.input-form {display: flex; gap: 8px; flex-direction: column;}
div.input-form + div.input-form {margin-top: 40px;}
.popup input {width: 580px;height: 68px;padding: 0 20px;color: #161C26;font-size: 26px;}
.popup input::placeholder {color: #b8b8b8;}
.popup .input-group {margin-top: 30px; display: flex;}
.popup .radio input {position:absolute; top:0; left:-9999px}
.popup .radio label {display:flex; align-items:center; gap:12px; cursor:pointer;}
.popup .radio label::before {content:''; display:block; width:48px; height:48px; background-repeat:no-repeat; background-size:100% auto;}
.popup .radio label::before {background-image:url(../images/radio.png);}
.popup .radio input:checked + label:before {background-image:url(../images/radio_on.png);}
.popup .radio + .radio {margin-left:30px;}
.popup .table {width: 100%; border-radius: 20px; overflow: hidden; margin: 10px 0 20px;}
.popup .table thead tr th {text-align:center; padding:10px 20px; height: auto; color: #161C26; font-size: 20px;}
.popup .table tbody tr td {padding:10px 20px; word-break:keep-all; height: auto; color: #161C26; font-size: 20px;}

.popup.popup-teaser .popup-container {background: #000; width: 100vw; height: 100vh; top: 0; left: 0; transform: none; display: flex; align-items: center; justify-content: center;}
.popup.popup-teaser .popup-container .logo {position: absolute; top: 24px; right: 24px;}
.popup.popup-teaser .popup-container .left {float: left;}
.popup.popup-teaser .popup-container .right {float: left; text-align: center; color: #fff;}
.popup.popup-teaser .popup-container .right .txt-03 {font-size: 100px; line-height: 120px; font-family: 'cafe';  color: #ff571f;}
.popup.popup-teaser .popup-container .right img {margin-bottom: 30px;}

/* footer 0613 cho 추가 */
.footer {background:#555;padding: 40px 0; text-align: left; color:#fff}
.footer .inner {max-width: 1200px;}
.footer .logo {position: static; margin-bottom: 20px;}

/* 0620 cho 추가 */
.event-01 .bottom-02 {margin: 30px 0 0;}
.sns-list {display: flex; gap: 10px; justify-content: center; align-items: center; margin: 60px 0;}
.sns-list li a {display: block; transition: ease-in-out 0.3s;}
.sns-list li a:hover, .sns-list li a:active, .sns-list li a:focus {transform: translateY(-20px);}
.sns-form .bottom-02 {font-size: 22px; margin: 30px 0 60px;}
.event-form .img-okspoon {position: absolute; top: -200px; left: 50%; margin: 0 0 0 -650px;}
@keyframes bounce-up-down {
  0%, 100% {
    transform: translateY(0);
    animation-timing-function: ease-in;
  }
  50% {
    transform: translateY(-10px);
    animation-timing-function: ease-out;
  }
}
@keyframes scale {
  0%, 100% {
    transform: scale(0.9); /* 0704 cho 수정 */
    animation-timing-function: ease-in;
  }
  50% {
    transform: scale(1);
    animation-timing-function: ease-out;
  }
}
.event-02 .bottom-02 {font-size: 22px; margin: 30px 0 0;}


/* 특별 이벤트 */ /* 0704 cho 추가 */
.event-01.event-special {background: linear-gradient(180deg,#FFFAE4 62%, #FFF09D 62%);;}
.event-01.event-special .bottom-02 { margin: 100px 16px 0;}
.event-special .img-point-01 {background: url(../images/img_point_01.png) no-repeat; background-size: 100% auto; width: 100px; height: 100px; position: absolute; left: 50%; margin-top: 230px; margin-left: -380px; animation: scale 3s infinite;}
.event-special .img-point-02 {background: url(../images/img_point_02.png) no-repeat; background-size: 100% auto; width: 140px; height: 140px; position: absolute; left: 50%; margin-left: 260px; animation: scale 3s infinite;}

/* 0711 cho 추가 */
.img-map {margin: 80px 0 40px;}
.img-map img {max-width: 100%;}
.txt-map {font-size: 35px;}
.floating {position: fixed; animation: bounce-up-down 2s infinite; right: 15%; bottom: 10%; width: 160px; height: 170px; z-index: 1;}
.floating img {width: 100%; height: auto;}

@media screen and (max-width: 1400px) {
  .mo {display: block;}
  .pc {display: none;}
  body {min-width: 100%; font-size: 20px;}
  
  .logo {top: 24px; right: 24px;}
  h2 {margin: 0 auto 40px; font-size: 22px; line-height: 30px; padding: 16px 30px;}
  .tab {padding: 36px 24px;}
  .tab li a {padding: 10px 20px; font-size: 18px; line-height: 30px;}
  .tab li.on a {background-color: #161C26; color: #fff;}
  .sub-visual, .event-form, .bg-gray {padding: 60px 0;}
  .sub-visual .txt-01 {font-size: 20px;}
  .sub-visual .txt-02 {font-size: 30px; margin: 30px 0 40px;}
  .sub-visual .txt-03 {font-size: 60px;}
  .sub-visual .spoon-01 {top: 8%;right: 50%;margin-right: -340px;width: 120px;height: 162px;}
  .sub-visual .spoon-02 {top: 45%;left: 50%;margin-left: -420px;width: 150px;height: 200px;} 
  .sub-visual .okman-01 {bottom: 60px;right: 50%;margin-right: -400px;width: 200px;height: 264px;}
  .sub-visual img {width: 500px;}
  .title {font-size: 50px; line-height: 60px; margin: 8px 0 40px;}
  .sub-title {font-size: 30px; line-height: 40px;}
  .txt {font-size: 24px; line-height: 32px; margin: 0 0 50px; word-break: keep-all; font-weight: 500;}
  .txt img {max-width: 100%; margin: 0 auto 30px;}
  .orange-list {padding: 0 24px; gap: 24px;}
  .orange-list li {width: 50%;padding: 16px;height: auto;}
  .orange-list img {max-width: 80%;}
  .black-form {font-size: 18px;height: 36px;line-height: 36px;}
  .event-01 .list-03 {width: 100%; margin-top: 10px; padding: 20px 0;}
  .event-01 .txt-event {font-size: 20px; margin-top: 20px;}
  .btn {margin-top: 40px; width: 300px; height: 80px; font-size: 30px;}
  .sns-form {padding: 40px 24px;}
  .sns-form > p {font-size: 30px; line-height: 40px;}
  .sns-form img {width: 100%;}
  .sns-form .bottom {font-size: 20px;}
  .sub-txt {font-size: 24px; margin: 30px 0;}
  .orange-title {margin: 40px 0 20px;}
  .orange-title img {width: 140px;}
  .orange-list.flex-column {gap: 16px;}
  .event-02 {padding: 60px 0 0;}
  .event-02 .orange-list {word-break: keep-all; align-items: stretch}
  .event-02 .orange-list li.list-01, .event-02 .orange-list li.list-02, .event-02 .orange-list li.list-03 {width: 33.33%; height: auto;}
  .event-02 .orange-list .list-04 {width: 100%;}
  .orange-form {font-size: 20px; width: 160px; line-height: 50px; height: 50px; margin-bottom: 30px;}
  .orange-form-02 {font-size: 20px; width: 160px; line-height: 50px; height: 50px; margin: 40px 0 30px;}
  .event-02 .orange-list .list-05 {width: 100%;}
  .event-03, .event-04 {padding: 60px 24px;}
  .table {width: 100%; border-radius: 16px;}
  .table span {display: block;}
  .table thead tr th, .table tr th {font-size: 20px;  padding: 16px 20px;}
  .table tr td {font-size: 18px; padding: 16px 20px;}
  .table tbody tr th, .table tbody tr td, .table thead tr th {height: auto;}
  .table tr th img {width: 80px;}
  .event-03 .orange2 {font-size: 16px;}
  .event-04 .txt {font-size: 60px; line-height: 70px;}
  .event-04 .txt p + p {margin-top: 30px;}
  .store-form {font-size: 24px; line-height: 1.4;}
  .store-form dl {gap: 8px; flex-direction: column; align-items: center; text-align: center;}
  .store-form dt {background-size: 100% auto; width: 80px; height: 38px;}
  .info-form {font-size: 14px; line-height: 20px; padding: 24px;}
  .i-info {width: 20px; height: 20px;}
  .event-form .img-place {width: 80px;height: 80px;position: absolute;top: -32px;right: 50%;margin-right: -290px;}
  .event-form .img-popup {width: 200px;height: 200px;position: absolute;top: -34px;left: 50%;margin-left: -350px;}
  .img-banner {padding: 0 16px 60px;}

  .popup-container {padding: 30px;}
  .popup-header {font-size: 24px;}
  .popup-header .sub-title {font-size: 40px; line-height: 50px;}
  .f-28 {font-size: 22px;}
  .popup-contents {width: 620px;}
  .popup .btn {font-size: 30px; height: 64px; width: 210px;}
  .popup .btn.btn-large {width: 280px;}
  .popup input {width: 540px; height: 60px; font-size: 24px;}

  .popup.popup-teaser .popup-container {background: #000; max-width: 100vw; height: 100vh; top: 0; left: 0; transform: none;}
  .popup.popup-teaser .popup-container .left img {width: 200px;}
  .popup.popup-teaser .popup-container .right .txt-03 {font-size: 70px; line-height: 90px;}
  .popup.popup-teaser .popup-container .right img {width: 500px;}
  .popup.popup-teaser .popup-container .right p {font-size: 24px;}

  /* footer 0613 cho 추가 */
  .line-list li::before {top: 8px;}
  .footer {padding: 24px; font-size: 14px; line-height: 20px; word-break: keep-all;}
  .footer .logo {margin-bottom: 10px; width: 100px;}
  .footer .logo img {width: 100%;}

  /* 0620 cho 추가 */
  .event-01 .bottom-02 {margin: 30px 0 0;}
  .sns-list {gap: 2px; margin: 20px 0;}
  .sns-list li a:hover, .sns-list li a:active, .sns-list li a:focus {transform: translateY(-10px);}
  .sns-form .bottom {line-height: 30px;}
  .sns-form .bottom-02 {font-size: 16px; margin: 16px 0 24px;}
  .event-form .img-okspoon {top: -145px; margin: 0 0 0 -360px; width: 150px; height: 150px;}
  .event-02 .bottom-02 {font-size: 16px; margin: 16px 0 0;}

  /* 0704 cho 추가 */
  .event-01.event-special .bottom-02 { margin: 60px 16px 0;}
  .event-special .img-point-01 {margin-left: -40%;}
  .event-special .img-point-02 { margin-left: 25%;}

  /* 0711 cho 추가 */
  .img-map {margin: 30px 0 20px;}
  .txt-map {font-size: 22px;}
  .floating {right: 5%; bottom: 10%; width: 120px; height: 128px;}
}

@media screen and (max-width: 768px) {
  body {min-width: 100%; font-size: 16px;}
  .logo {top: 16px; right: 16px;}
  .logo img {height: 28px;}
  .arr-down {display: none;}
  h2 {margin: 0 auto 30px; font-size: 20px; padding: 8px 20px;}
  .main-visual {width: auto; height: auto; background: none;}
  .main-visual video {position: relative; height: auto;}
  .sub-visual .txt-01 {font-size: 18px;}
  .sub-visual .txt-02 {font-size: 22px; margin: 30px 0 40px;}
  .sub-visual .txt-03 {font-size: 36px;}
  .sub-visual .okman-01 {position: relative; margin: 40px auto 0; right: 0; bottom: 0; width: 150px; height: 200px;}
  .txt {font-size: 18px; line-height: 28px; word-break: keep-all; font-weight: 500; padding: 0 16px;}
  .txt p br {display: none;}
  .title {font-size: 36px; line-height: 50px; margin: 8px 0 30px; letter-spacing: -1px;}
  .sub-title {font-size: 22px; line-height: 30px; letter-spacing: -1px;}
  .sub-visual img {width: 300px;}
  .tab {padding: 10px 16px;}
  .tab li a {padding: 6px 8px; font-size: 16px;}
  .orange-list {padding: 0 16px; gap: 8px;}
  .orange-list li {padding: 16px 8px; letter-spacing: -1px;}
  .orange-form {font-size: 18px; width: 130px; height: 42px; line-height: 42px;}
  .orange-form-02 {font-size: 18px; width: 130px; height: 42px; line-height: 42px;}
  .sns-form > p {font-size: 22px; letter-spacing: -1px;}
  .sns-form > img {margin: 30px 0;}
  .sns-form .bottom {width: 100%; font-size: 14px; line-height: 28px;}
  .sub-txt {font-size: 22px; margin: 30px 0;}
  .sub-txt br {display: none;}
  .event-01 .txt-event {font-size: 14px;}
  .event-02 .orange-list {flex-direction: column;}
  .event-02 .orange-list li.list-01, .event-02 .orange-list li.list-02, .event-02 .orange-list li.list-03, .event-02 .orange-list li.list-04, .event-02 .orange-list li.list-05 {width: 100%; height: auto;}
  /* .table br {display: none;} */ /* 250623 cho 수정 */
  .table thead tr th, .table tr th {font-size: 16px;  padding: 8px 10px;}
  .table tbody tr th, .table tbody tr td, .table thead tr th {font-size: 14px; padding: 8px 10px;}
  .table tr th img {width: 45px;}
  .table span {font-size: 12px;}
  .event-04 .txt {font-size: 36px; line-height: 50px;}
  .event-04 .txt p + p {margin-top: 16px;}
  .store-form {font-size: 20px; line-height: 1.4;}
  .store-form dl {gap: 8px; flex-direction: column; align-items: center; text-align: center;}
  .store-form dt {background-size: 100% auto; width: 80px; height: 38px;}
  .info-form {font-size: 12px; line-height: 18px; padding: 24px;}
  .i-info {width: 18px; height: 18px;}
  .btn {margin-top: 40px; width: 200px; height: 60px; font-size: 22px; border-radius: 16px;}
  .event-form .img-place, .event-form .img-popup, .sub-visual .spoon-01, .sub-visual .spoon-02 {display: none;}
  .img-banner {padding: 0 0 40px;}  

  .popup-container {border-radius: 16px; max-width: 1000px; width: auto; padding: 20px; top: 50%; left: 20px; right: 20px; transform: translateY(-50%);}
  .popup-container .btn-close {top: 10px; right: 10px; width: 24px; height: 24px;}
  .popup-container .btn-close img {width: 20px;}
  .popup-header {font-size: 16px; letter-spacing: -1px;}
  .popup-header .sub-title {font-size: 24px; line-height: 30px;}
  .popup-header p {margin: 24px 0;}
  .popup-contents {padding: 16px; font-size: 14px; width: 100%; height: auto; max-height: 300px;}
  .f-28 {font-size: 16px;}
  .popup .table {border-radius: 12px;}
  .popup .table thead tr th, .popup .table tbody tr td {padding: 6px 8px; font-size: 14px;}
  .popup .radio label::before {width:30px; height:30px;}
  .input-form {gap: 8px;}
  div.input-form + div.input-form {margin-top: 16px;}
  .popup input {width: 100%; height: 40px; padding: 0 10px; font-size: 18px; border-radius: 6px;}
  .popup-footer {margin-top: 20px;}
  .popup .btn {width: 120px; height: 54px; font-size: 20px;}
  .popup .btn img {width: 40px;}
  .popup .btn.btn-large {width: 200px;}
  .popup .btn.btn-large img {width: 100px;}

  .popup.popup-teaser .popup-container {background: #000; max-width: 100vw; height: 100vh; top: 0; left: 0; right:0; bottom:0; transform: none; flex-direction: column; border-radius: 0; padding: 0;}
  .popup.popup-teaser .popup-container .logo {top: 16px; right: 16px; height: 28px;}
  .popup.popup-teaser .popup-container .logo img {height: 100%;}
  .popup.popup-teaser .popup-container .left, .popup.popup-teaser .popup-container .right {float: none;}
  .popup.popup-teaser .popup-container .left img {width: 100px;}
  .popup.popup-teaser .popup-container .right {margin: 0 auto;}
  .popup.popup-teaser .popup-container .right img {width: 280px;}
  .popup.popup-teaser .popup-container .right .txt-03 {font-size: 34px; line-height: 50px;}
  .popup.popup-teaser .popup-container .right p {font-size: 16px;}

  /* 0620 cho 추가 */
  .event-01 .bottom-02 {margin: 20px 0 0; font-size: 14px; letter-spacing: -0.5px;}
  .sns-list {flex-wrap: wrap;}
  .sns-list li {width: 100px;}
  .sns-form > p {line-height: 30px;}
  .sns-form .bottom {line-height: 22px;}
  .sns-form .bottom-02 {font-size: 14px; margin: 24px 0; letter-spacing: -0.5px;}
  .event-form .img-okspoon {position: static; margin: 20px auto; width: 100px; height: 100px;}
  .table tbody tr th, .table tbody tr td, .table thead tr th {word-break: break-all;}
  .event-02 .bottom-02 {font-size: 14px; margin: 24px 0 0;}

  /* 0704 cho 추가 */
  .event-01.event-special .bottom-02 { margin: 30px 16px 0;}
  .event-special .img-point-01 {margin-left: -40%; width: 50px; z-index: 1;}
  .event-special .img-point-02 { margin-left: 24%; width: 80px; z-index: 1;}
  .event-special .orange-list li {width: 100%;}

  /* 0711 cho 추가 */
  .txt-map {font-size: 18px;}
  .floating {right: 16px; bottom: 16px; width: 100px; height: 106px;}
}