@charset "utf-8";

/*font*/

/*spoqahan-sans-neo*/
@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 300;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 400;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 500;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 700;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeoLight";
    font-weight: 300;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.woff2") format("woff2"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.woff") format("woff"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoL.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeoMedium";
    font-weight: 500;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff2") format("woff2"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff") format("woff"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeoBold";
    font-weight: 700;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff2") format("woff2"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff") format("woff"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.ttf") format("truetype");
}

/* HakgyoansimKkokkoma */
@font-face {
    font-family: 'TTHakgyoansimKkokkomaR';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2402_keris@1.0/TTHakgyoansimKkokkomaR.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/*reset*/
*{padding:0; margin:0; text-decoration:none; list-style:none; box-sizing:border-box;}
body {overflow-x:hidden; zoom:1;}
ul, ol{list-style-type:none;}
img,fieldset{border:none;}
body, input, textarea, select, button, table{font-size:13px; color:#666; font-family:"SpoqaHanSansNeo", "Apple SD Gothic Neo", Helvetica, sans-serif, Arial;}
a{text-decoration:none; color:#666; }
a:link, a:visited{text-decoration:none; color:#666; /*outline: none!important;*/}
a:hover, a:active{text-decoration:none; color:#666; /*outline: none!important;*/}
input{border:0;}
select{vertical-align: top;height:24px;border:1px solid #c5c5c5;}
iframe{border: 0; margin: 0; padding: 0;}
button {overflow: visible; padding: 0; margin: 0px; background: none; border: 0;}

/*common*/
#wrap{margin: 0 auto; max-width: 1920px; min-width: 1440px;}

/*brown gnb*/
.emergency_relief_cnts_top { height: 30px; }
.CampaignList ul {padding: 6px 14px !important;}
.CampaignList ul li {margin-bottom: 7px;}

/*sns_area*/
.sns_area{ padding:47px 0 62px; border-top:3px solid #f8f6f3;}
.sns_area h3{font-weight: normal; display: inline-block; font-size: 16px; color: #4e4e4e; vertical-align: middle; margin-right:8px;}
.sns_area .div_inner {margin: 0 auto; height: 100%; text-align: center;}
.sns_area > .div_inner > a{display: inline-block; margin-left: 14px; vertical-align: middle; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s;}

/*footer*/
#footer {width: 100%; height: auto; background: #fffbf7; border-top: 2px solid #ed425a;}
#footer .inner {width: 1000px; margin: 0 auto; position: relative; min-height: 72px; padding-top: 22px;}

/*content*/
.content_area{overflow:hidden;}
.div_sec{max-width:1920px; min-width:1440px; font-family: 'NanumSquareNeo'; letter-spacing:-0.04em; line-height:1.66;}
.div_sec img.center_img{position: relative; top: 0; left: 50%; margin-left:-960px; display: block; max-width: none;}
.div_sec img.btn_img{display:block; width:100%; height:100%;}
.div_sec img{display:block;}
.div_sec .screen_out {overflow: hidden; position: absolute; width: 0; height: 0; line-height: 0; text-indent: -9999px;}
.div_sec .div_inner{position: absolute; top: 0; bottom:0; left: 50%; margin-left: -720px; width: 1440px;}

/*.div_sec .btn_hover{filter: brightness(1); transition: filter .3s ease; will-change: filter;}
.div_sec .btn_hover:hover{filter: brightness(0.9);}*/

.div_sec.area01{position:relative; z-index:1;}
.div_sec.area01 .a1_title01{position:absolute; top:205px; right:78px; display: block;}
.div_sec.area01 .a1_title02{position:absolute; top:275px; right:68px; display: block;}
.div_sec.area01 .a1_logo{position:absolute; top:368px; right:-4px; display: block; width: 490px; height: 250px;}
.div_sec.area01 .a1_logo span{display:block; position:absolute; top:0; left:0;}
.div_sec.area01 .a1_logo span.t_line{overflow:hidden; width:0; height:250px; transition:0.6s 0.5s ease;}
.div_sec.area01 .a1_logo.on span.t_line {width:100%;}
.div_sec.area01 .a1_logo span.t_line img{transform: none; left: 0; width:490px; height:250px;}
.div_sec.area01 .a1_text{position:absolute; top:654px; right:34px; text-align:center; font-family: 'NanumSquareNeoExtraBold'; font-size:35px; color:#302c2b; letter-spacing:-0.065em; line-height:1.6;}

.div_sec.area02{position:relative; margin-top:-128px; z-index:3;}
.div_sec.area02 .div_movie{position:absolute; top:200px; left:50%; margin-left:-618px; display:block; width:1242px; }
.div_sec.area02 .div_movie .load_movie{position: relative; padding-bottom: 56.25%; overflow: hidden; max-width: 100%; height: auto;}
.div_sec.area02 .div_movie .load_movie iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.div_sec.area02 .a2_btn01{position:absolute; top:940px; left:50%; transform:translateX(-50%); padding:0 100px; display: block; width:max-content; height:85px; line-height:85px; font-family:'NanumSquareNeoBold'; font-size:25px; color:#fff; letter-spacing:-0.04em; background:url('/webPub/sc_2024/subin/images/btn_bg_green.jpg'); border-radius:42px;}

.div_sec.area02 .blend-mode{mix-blend-mode: hard-light;}
.div_sec.area02 .a2_rainbow{overflow:hidden; position:absolute; top:74px; left:-240px; width:0; transition:1s;}
.div_sec.area02 .a2_rainbow img{width:534px;}
.div_sec.area02 .a2_rainbow.on{width:534px;}

.div_sec.area02 .a2_left01{position:absolute; top:585px; left:-50px;}
.div_sec.area02 .a2_left02{position:absolute; top:778px; left:-160px;}
.div_sec.area02 .a2_left03{position:absolute; top:805px; left:-50px;}
.div_sec.area02 .a2_left04{position:absolute; top:924px; left:20px;}
.div_sec.area02 .a2_left05{position:absolute; top:960px; left:128px;}

.div_sec.area02 .a2_right01{position:absolute; top:128px; right:122px;}
.div_sec.area02 .a2_right02{position:absolute; top:332px; right:8px;}
.div_sec.area02 .a2_right03{position:absolute; top:203px; right:-67px;}
.div_sec.area02 .a2_right04{position:absolute; top:172px; right:-184px;}

.div_sec.area02 .a2_fam{position:absolute; top:477px; right:-227px;}
.div_sec.area02 .a2_cloud{position:absolute; top:719px; right:-266px;}

.div_sec.area03{position:relative; margin-top:-150px; z-index:2;}
.area03 .a3_title{position:absolute; top:162px; left:-32px; margin-top:230px; font-family:'TTHakgyoansimKkokkomaR'; font-weight:bold; font-size:80px; color:#77583f; letter-spacing:-0.03em; line-height:1.375; text-align:right;}
.area03 .a3_text{position:absolute; top:643px; left:96px; font-size:27px; color:#030101; text-align:right;}
.area03 .a3_text span{ font-family: 'NanumSquareNeoBold';}
.area03 .a3_frame{position:absolute; top:230px; right:-20px;}
.area03 .a3_frame > img{filter: drop-shadow(4px 5px 3px rgb(0,0,0,0.3));}
.area03 .a3_frame .tape_img{overflow:hidden; position:absolute; top:-65px; left:203px; width:0px; transition:0.5s 1s;}
.area03 .a3_frame .tape_img img{display:block; width:414px;}
.area03 .a3_frame.aos-animate .tape_img{width:414px;}

.div_sec.area04{position:relative; margin-top:-180px; z-index:1;}
.area04 .a4_text{position:absolute; top:324px; right:100px; font-size:27px; color:#ffffff; text-align:left;}
.area04 .a4_text span{ font-family: 'NanumSquareNeoExtraBold';}

.div_sec.area05{position:relative; margin-top:-122px; z-index:2;}
.area05 .a5_frame01{position:absolute; top:109px; left:14px;}
.area05 .a5_frame01 > img{filter: drop-shadow(4px 5px 3px rgb(0,0,0,0.3));}
.area05 .a5_frame01 .tape_img{overflow:hidden; position:absolute; top:-66px; left:118px; width:0px; transition:0.5s .8s;}
.area05 .a5_frame01 .tape_img img{display:block; width:332px;}
.area05 .a5_frame01.aos-animate .tape_img{width:380px;}

.area05 .a5_frame02{position:absolute; top:642px; left:48px;}
.area05 .a5_frame02 > img{filter: drop-shadow(4px 5px 3px rgb(0,0,0,0.3));}
.area05 .a5_frame02 .tape_img{overflow:hidden; position:absolute; top:-47px; left:158px; width:0px; transition:0.5s .8s;}
.area05 .a5_frame02 .tape_img img{display:block; width:380px;}
.area05 .a5_frame02.aos-animate .tape_img{width:380px;}

.area05 .a5_text{position:absolute; top:497px; right:35px; font-size:27px; color:#030101; text-align:left;}
.area05 .a5_text span{ font-family: 'NanumSquareNeoExtraBold';}

.div_sec.area06{position:relative; margin-top:-208px; z-index:1;}
.area06 .a6_title{position:absolute; top:286px; left:853px; font-family:'TTHakgyoansimKkokkomaR'; font-weight:bold; font-size:80px; color:#ffffff; letter-spacing:-0.03em; line-height:1.375; text-align:left; text-shadow: 2px 2px 3px rgba(0,0,0,0.4);}
.area06 .a6_text{position:absolute; top:528px; right:-20px; font-size:27px; color:#ffffff; text-align:left; text-shadow: 2px 2px 3px rgba(0,0,0,0.4);}
.area06 .a6_text span{ font-family: 'NanumSquareNeoExtraBold';}
.area06 .a6_frame{position:absolute; top:920px; left:863px;}
.area06 .a6_frame > img{filter: drop-shadow(4px 5px 3px rgb(0,0,0,0.3));}

.div_sec.area07{position:relative; z-index:1;}
.area07 .a7_title{position:absolute; top:168px; left:32px; font-family:'TTHakgyoansimKkokkomaR'; font-weight:bold; font-size:80px; color:#77583f; letter-spacing:-0.03em; line-height:1.375; text-align:right;}
.area07 .a7_text{position:absolute; top:640px; left:22px; font-size:27px; color:#030101; text-align:right;}
.area07 .a7_text span{ font-family: 'NanumSquareNeoExtraBold';}

.div_sec.area08{position:relative; z-index:1;}

.div_sec.area09{position:relative; margin-top:-254px; z-index:2;}
.area09 .a9_title{position:absolute; top:405px; left:0px; width:100%; font-family:'TTHakgyoansimKkokkomaR'; font-weight:bold; font-size:90px; color:#77583f; letter-spacing:-0.05em; line-height:1.222; text-align:center;}
.area09 .a9_text{position:absolute; top:670px; left:0px; width:100%; font-size:27px; color:#030101; text-align:center;}
.area09 .a9_text span{font-family: 'NanumSquareNeoBold';}
.area09 .a9_text span.a9_text_red{font-family: 'NanumSquareNeoExtraBold'; color:#bf2518;}
.area09 .a9_btn01{position:absolute; top:1126px; left:50%; transform:translateX(-50%); padding:0 38px; display: block; width:max-content; height:85px; line-height:85px; font-family:'NanumSquareNeoBold'; font-size:25px; color:#fff; letter-spacing:-0.04em; background:url('/webPub/sc_2024/subin/images/btn_bg_red.jpg'); border-radius:42px;}

.div_sec.area10{position:relative; z-index:1;}
.area10 .a10_left{position:absolute; top:134px; left:51px; padding-right:31px; width:670px; border-right:1px solid #717171;}
.area10 .a10_left .a10_text01{margin-bottom:64px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:35px; color:#ffffff; text-align:center; text-decoration: underline; text-underline-position: under; text-decoration-thickness: from-font;}
.area10 .a10_left .a10_text02{margin-bottom:7px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:35px; color:#ffffff; text-align:center; line-height:1.6;}
.area10 .a10_left .a10_text03{margin-bottom:16px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:71px; color:#ffffff; text-align:center; text-decoration: underline; text-underline-position: under; text-underline-offset: 3px; text-decoration-thickness: from-font;}
.area10 .a10_left .a10_text04{margin-bottom:65px; width:100%; font-size:20px; color:#ffffff; text-align:center; letter-spacing:-0.06em;}
.area10 .a10_left .a10_text05{margin-bottom:14px; width:100%; font-size:27px; color:#ffffff; text-align:center;}
.area10 .a10_left .a10_text05 span{font-family: 'NanumSquareNeoExtraBold'; text-decoration: underline; text-underline-position: under; text-decoration-thickness: from-font;}
.area10 .a10_left .a10_text06{margin-bottom:10px; width:100%; font-size:20px; color:#ffffff; text-align:center;}

.area10 .a10_right{position:absolute; top:134px; right:48px; width:670px;}
.area10 .a10_right .a10_text01{margin-bottom:10px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:35px; color:#ffffff; text-align:center; text-decoration: underline; text-underline-position: under; text-decoration-thickness: from-font;}
.area10 .a10_right .a10_graph{margin-bottom:10px; width:100%; height:318px; text-align:center;}

@property --p{
  syntax: '<number>';
  inherits: true;
  initial-value: 0;
}

.area10 .a10_right .a10_graph .pie {margin-top:40px; --p:100; --b:52px; --c:#282a2d; --w:272px; width:var(--w); aspect-ratio:1; position:relative; display:inline-grid; background:url('/webPub/sc_2024/subin/images/graph.png')no-repeat center;}
.area10 .a10_right .a10_graph.aos-animate .pie{animation:p 1s .5s both;}
.area10 .a10_right .a10_graph .pie:before{content:""; position:absolute; border-radius:48%; inset:0; transform: scaleX(-1);
	background:radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat, conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
	-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
	mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));}
.area10 .a10_right .a10_graph .pie span{position:absolute; bottom:1px; left:1px; opacity:0; transition:.5s 1.5s;}
.area10 .a10_right .a10_graph.aos-animate .pie span{opacity:1;}
.area10 .a10_right .a10_graph .no-round:before {background-size:0 0,auto;}
.area10 .a10_right .a10_graph .no-round:after {content:none;}

@keyframes p {
  to{--p:0}
}

.area10 .a10_right .a10_text02{margin-bottom:32px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:16px; color:#ffffff; text-align:center; letter-spacing:-0.065em; line-height:1.437;}
.area10 .a10_right .a10_text03{margin-bottom:10px; width:100%; font-size:27px; color:#ffffff; text-align:center;}
.area10 .a10_right .a10_text03 span{font-family: 'NanumSquareNeoExtraBold'; text-decoration: underline; text-underline-position: under; text-decoration-thickness: from-font;}

.div_sec.area11{position:relative; z-index:1;}
.area11 .div_inner{margin-left:-850px; width:1700px; }
.area11 .a11_text01{position:absolute; top:195px; left:0px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:40px; color:#000101; text-align:center; line-height:1.75;}
.area11 .a11_text02{position:absolute; top:265px; left:0px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:40px; color:#bf2518; text-align:center; line-height:1.75; text-decoration: underline; text-underline-position: under; text-underline-offset: 1px; text-decoration-thickness: from-font;}

.area11 .s11_wrap{position:absolute; top:390px; left:50%; margin-left:-561.5px; width:1123px;}
.area11 .slider11_area{overflow: hidden;}
.area11 .swiper-slide{}
.area11 .swiper-slide span > img{margin:10px 10px; filter: drop-shadow(1px 2px 3px rgb(0,0,0,0.3));}
.area11 .swiper-button-next {right: -170px !important; color:#fff !important; margin-top:-47px; width: 31px; height: 56px; background: url('/webPub/sc_2024/subin/images/img11_next_btn.png');}
.area11 .swiper-button-prev{left: -170px !important; color:#fff !important; margin-top:-47px;  width: 31px; height: 56px; background: url('/webPub/sc_2024/subin/images/img11_prev_btn.png');}

.div_sec.area12{position:relative; margin-top:-138px; z-index:2;}
.area12 .a12_text01{position:absolute; top:1174px; left:0px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:40px; color:#000101; text-align:center; line-height:1.75;}
.area12 .a12_text02{position:absolute; top:1244px; left:0px; width:100%; font-family: 'NanumSquareNeoExtraBold'; font-size:40px; color:#bf2518; text-align:center; line-height:1.75;}
.area12 ul.a12_cont{position: absolute; top: 1375px; width: 100%; display:flex; justify-content: space-between;}
.area12 ul.a12_cont li > img{filter: drop-shadow(1px 2px 3px rgb(0,0,0,0.3));}
.area12 .a12_text03{position:absolute; top:1656px; left:0px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:24px; color:#221815; text-align:center; line-height:1.458;}

.div_sec.area13{position:relative; margin-top:-150px; z-index:3;}
.area13 .div_inner{margin-left:-850px; width:1700px; }
.area13 .a13_text01{position:absolute; top:250px; left:0px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:52px; color:#000000; text-align:center; line-height:1.75; text-decoration: underline; text-underline-position: under; text-decoration-thickness: from-font;}
.area13 .a13_text02{position:absolute; top:360px; left:0px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:40px; color:#222222; text-align:center; line-height:1.75;}
.area13 .a13_text02 span{font-family: 'NanumSquareNeoExtraBold';}

.area13 .meal_area{position:absolute; left:50%; bottom:176px; margin-left:-628px; width:1256px;}
.area13 .meal_set_area{position: absolute; top: 570px; width: 100%;}
.area13 .meal_set_area .kover10{position:absolute; bottom:450px; left:565px; padding:5px; width:126px; height:55px; line-height:47px; font-family: 'nanumsquare'; font-size:40px; font-weight: 600; color: #fff; text-align: center; transition:0.4s; opacity:0; background: rgba(0,0,0,0.5); border-radius: 16px;}
.area13 .meal_set_area .kover10.on{opacity:1;}
.area13 .meal_set_area ul.setkul{width:50%;}
.area13 .meal_set_area ul li{position: absolute; transition:0.4s; transform: translateY(-20px); opacity:0;}
.area13 .meal_set_area ul.setkul li{left:505px;}
.area13 .meal_set_area ul li.on{transform: translateY(0); opacity:1;}
.area13 .meal_set_area ul li.pos1{bottom:0px;}
.area13 .meal_set_area ul li.pos2{bottom:35px;}
.area13 .meal_set_area ul li.pos3{bottom:70px;}
.area13 .meal_set_area ul li.pos4{bottom:105px;}
.area13 .meal_set_area ul li.pos5{bottom:140px;}
.area13 .meal_set_area ul li.pos6{bottom:175px;}
.area13 .meal_set_area ul li.pos7{bottom:210px;}
.area13 .meal_set_area ul li.pos8{bottom:245px;}
.area13 .meal_set_area ul li.pos9{bottom:280px;}
.area13 .meal_set_area ul li.pos10{bottom:315px;}
.area13 .meal_set_area ul li .meal_txt{position:absolute; top:54px; left:240px;}

.area13 .meal_count_area{position: absolute; bottom:0px; width:100%;}
.area13 .meal_count_area .k_food{position:absolute; bottom:147px; right:320px; width:164px; height:96px; background:#fff;}
.area13 .meal_count_area input{padding: 0 70px 0 0; width:100%; height:100%; line-height:97px; font-family: 'NanumSquareNeoBold'; font-size:26px; font-weight:700; color:#222222; text-align:right; outline: none;}
.area13 .meal_count_area input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;}
.area13 .meal_count_area button{cursor:pointer;}
.area13 .meal_count_area button.btn_plus{position: absolute; top: 12px; right: 16px;}
.area13 .meal_count_area button.btn_minus{position: absolute; bottom: 12px; right: 16px;}
.area13 .meal_count_area button img{display:block;}

.area13 .meal_result{position:absolute; left:50%; bottom:20px; margin-left:-582px; width:1177px; font-family: 'NanumSquareNeoBold'; font-size:29px; font-weight:700; color:#da281f; text-align:center;}
.area13 .meal_result span.meal_num{}
.area13 .meal_result span.meal_price{margin-left:70px;}

.area13 .meal_btn01{position:absolute; bottom:42px; left:50%; transform:translateX(-50%); padding:0 56px; display: block; width:max-content; height:92px; line-height:92px; font-family:'NanumSquareNeoBold'; font-size:30px; color:#fff; letter-spacing:-0.04em; background:url('/webPub/sc_2024/subin/images/btn_bg_green.jpg'); border-radius:46px;}

.div_sec.area14{padding:50px 0; background:#f7f7f7;}
.area14 p{font-family: 'NanumSquareNeo'; font-size:20px; text-align:center; color: #000000;}

.float_area {position:fixed; right: -300px; top: 27%; z-index:10; opacity:0; transition:.5s;}
.float_area.on{right:3%; opacity:1}
.float_area a.float_btn{position:relative; display:block; width:206px; height:66px; line-height:66px; font-family: 'NanumSquareNeo'; font-size:24px; text-align:center; color: #fff; background:#bf2518; border-radius: 0 0 5px 5px;}
.float_area a.float_btn img{position:absolute; top:-164px; left:0;}

/*subin3*/
#PageSubin3 .div_sec.area01 .a1_title01{position:absolute; top:205px; right:112px; display: block;}
#PageSubin3 .area12 .a12_text02{position:absolute; top:1244px; left:0px; width:max-content; font-family: 'NanumSquareNeoExtraBold'; font-size:40px; color:#bf2518; text-align:center; line-height:1.75;}

#PageSubin3 .area13 .meal_area{position:absolute; left:50%; bottom:318px; margin-left:-628px; width:1256px;}
#PageSubin3 .area13 .meal_btn01{position:absolute; bottom:170px; left:50%; transform:translateX(-50%); padding:0 56px; display: block; width:max-content; height:92px; line-height:92px; font-family:'NanumSquareNeoBold'; font-size:30px; color:#fff; letter-spacing:-0.04em; background:url('/webPub/sc_2024/subin/images/btn_bg_green.jpg'); border-radius:46px;}
#PageSubin3 .area13 .a13_text03{position:absolute; bottom:84px; left:0px; width:100%; font-family: 'NanumSquareNeo'; font-size:20px; color:#000000; text-align:center; line-height:1.75}

/*subin4*/
#PageSubin4 .float_area {position:fixed; right: -300px; top: 60%; z-index:10; opacity:0; transition:1s;}
#PageSubin4 .float_area.on{right:1.2%; opacity:1}
#PageSubin4 .float_area .meal_set_area{position:relative;}
#PageSubin4 .float_area .meal_set_area .kover10{position:absolute; bottom:326px; left:76px; padding:0 5px; width:70px; height:40px; line-height:42px; font-family: 'nanumsquare'; font-size:20px; font-weight: 600; color: #fff; text-align: center; transition:0.4s; opacity:0; background: rgba(0,0,0,0.5); border-radius: 16px;}
#PageSubin4 .float_area .meal_set_area .kover10.on{opacity:1;}
#PageSubin4 .float_area .meal_set_area ul.setkul{width:50%;}
#PageSubin4 .float_area .meal_set_area ul li{position: absolute; transition:0.4s; transform: translateY(-20px); opacity:0;}
#PageSubin4 .float_area .meal_set_area ul.setkul li{left:38px;}
#PageSubin4 .float_area .meal_set_area ul li.on{transform: translateY(0); opacity:1;}
#PageSubin4 .float_area .meal_set_area ul li.pos1{bottom:40px;}
#PageSubin4 .float_area .meal_set_area ul li.pos2{bottom:62px;}
#PageSubin4 .float_area .meal_set_area ul li.pos3{bottom:84px;}
#PageSubin4 .float_area .meal_set_area ul li.pos4{bottom:106px;}
#PageSubin4 .float_area .meal_set_area ul li.pos5{bottom:128px;}
#PageSubin4 .float_area .meal_set_area ul li.pos6{bottom:150px;}
#PageSubin4 .float_area .meal_set_area ul li.pos7{bottom:172px;}
#PageSubin4 .float_area .meal_set_area ul li.pos8{bottom:194px;}
#PageSubin4 .float_area .meal_set_area ul li.pos9{bottom:216px;}
#PageSubin4 .float_area .meal_set_area ul li.pos10{bottom:238px;}
#PageSubin4 .float_area .meal_count_area{position:relative; padding:18px 10px; width:100%; background:#ffffff; display: flex; flex-direction: column; align-items: center;}
#PageSubin4 .float_area .meal_count_area .k_food{display: flex; justify-content: space-between; width:134px; height:45px; background:#fff; border: 1px solid #777;}
#PageSubin4 .float_area .meal_count_area input{padding: 0; width:61px; height:100%; line-height:97px; font-family: 'nanumsquare'; font-size:20px; font-weight:700; color:#222222; text-align:center; outline: none; border-left: 1px solid #777; border-right: 1px solid #777;}
#PageSubin4 .float_area .meal_count_area input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;	}
#PageSubin4 .float_area .meal_count_area button{cursor:pointer;}
#PageSubin4 .float_area .meal_count_area button.btn_plus{width:35px; height:43px;}
#PageSubin4 .float_area .meal_count_area button.btn_minus{width:35px; height:43px;}
#PageSubin4 .float_area .meal_count_area button img{display:block; width:100%;}
#PageSubin4 .float_area .meal_count_area .meal_result{padding-top: 18px; font-family:'nanumsquare'; font-size: 14px; font-weight: bold; color: #da281f; letter-spacing: -0.04em; line-height: 1; transform: skew(0.1deg);}
#PageSubin4 .float_area .meal_count_area .meal_result span.v_bar{color:#b6b6b6; font-weight: normal;}
#PageSubin4 .float_area .mbtn_area a.meal_btn01{position:relative; display:block; width:224px; height:58px; line-height: 58px; font-family: 'NanumSquare'; font-size:20px; text-align:center; color: #fff; background:#01b2aa; letter-spacing:-0.04em}

/*subin5*/
#PageSubin5 .div_sec.area01 .div_inner{margin-left: -660px; width: 1320px;}
#PageSubin5 .div_sec.area01 .a1_title01{position:absolute; top:87px; left:400px; right:auto; display: block; font-family: 'NanumSquareNeo'; font-size:24px; color:#302c2b; text-decoration:underline; text-decoration-thickness: 1px; text-underline-position: under; letter-spacing:-0.025em; line-height:1;}
#PageSubin5 .div_sec.area01 .a1_title02{position:absolute; top:84px; left:107px; right:auto; display: block;}
#PageSubin5 .div_sec.area01 .a1_logo{position:absolute; top:143px; left:78px; right:auto; display: block; width: 266px; height: 140px;}
#PageSubin5 .div_sec.area01 .a1_logo span{display:block; position:absolute; top:0; left:0;}
#PageSubin5 .div_sec.area01 .a1_logo span.t_line{overflow:hidden; width:0; height:140px; transition:0.6s 0.5s ease;}
#PageSubin5 .div_sec.area01 .a1_logo.on span.t_line {width:100%;}
#PageSubin5 .div_sec.area01 .a1_logo span.t_line img{transform: none; left: 0; width:266px; height:140px;}
#PageSubin5 .div_sec.area01 .a1_text{position:absolute; top:128px; left:394px; right:auto; text-align:left; font-family: 'NanumSquareNeoBold'; font-size:34px; color:#302c2b; letter-spacing:-0.065em; line-height:1.558;}

#PageSubin5 .area01 .meal_area {overflow:hidden; position: absolute; right: 32px; top: 84px; width: 461px; border-radius:20px; box-shadow: 6px 6px 28.13px 0.87px rgba(0, 0, 0, 0.21);}
#PageSubin5 .area01 .meal_set_area{position: absolute; top: 317px; width: 100%;}
#PageSubin5 .area01 .meal_set_area .kover5{position:absolute; bottom:193px; right:147px; width:48px; height:48px; line-height:48px; font-family: 'nanumsquare'; font-size:18px; font-weight: 600; color: #fff; text-align: center; transition:0.4s; opacity:0; background: #da291c; border-radius: 50%; border:2px solid #fff; z-index:10;}
#PageSubin5 .area01 .meal_set_area .kover5.on{opacity:1;}
#PageSubin5 .area01 .meal_set_area ul.setkul{width:50%;}
#PageSubin5 .area01 .meal_set_area ul li{position: absolute; transition:0.4s; transform: translateY(-20px); opacity:0;}
#PageSubin5 .area01 .meal_set_area ul.setkul li{left:148px;}
#PageSubin5 .area01 .meal_set_area ul li.on{transform: translateY(0); opacity:1;}
#PageSubin5 .area01 .meal_set_area ul li.pos1{bottom:0px;}
#PageSubin5 .area01 .meal_set_area ul li.pos2{bottom:35px;}
#PageSubin5 .area01 .meal_set_area ul li.pos3{bottom:70px;}
#PageSubin5 .area01 .meal_set_area ul li.pos4{bottom:105px;}
#PageSubin5 .area01 .meal_set_area ul li.pos5{bottom:140px;}
#PageSubin5 .area01 .meal_set_area ul li .meal_txt{position:absolute; top:25px; left:170px; filter: drop-shadow(0px -1px 1px white);}

#PageSubin5 .area01 .meal_count_area{position: absolute; bottom:0px; width:100%;}
#PageSubin5 .area01 .meal_count_area .k_food{position:absolute; bottom:200px; left:275px; width:116px; height:68px; background:#fff;}
#PageSubin5 .area01 .meal_count_area input{padding: 0 56px 0 0; width:100%; height:100%; line-height:68px; font-family: 'NanumSquareNeoBold'; font-size:18px; font-weight:700; color:#222222; text-align:right; outline: none;}
#PageSubin5 .area01 .meal_count_area input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;}
#PageSubin5 .area01 .meal_count_area button{cursor:pointer;}
#PageSubin5 .area01 .meal_count_area button.btn_plus{position: absolute; top: 9px; right: 16px;}
#PageSubin5 .area01 .meal_count_area button.btn_minus{position: absolute; bottom: 9px; right: 16px;}
#PageSubin5 .area01 .meal_count_area button img{display:block;}

#PageSubin5 .area01 .meal_result{position:absolute; left:0; bottom:146px; width:100%; font-family: 'NanumSquareNeoBold'; font-size:22px; font-weight:700; color:#da281f; text-align:center; line-height:1;}
#PageSubin5 .area01 .meal_result span.meal_num{}
#PageSubin5 .area01 .meal_result span.meal_price{margin-left:36px;}

#PageSubin5 .area01 .meal_btn01{position:absolute; bottom:0; left:0; display: block; width:100%; height:97px; line-height:97px; font-family:'NanumSquareNeoBold'; font-size:30px; color:#fff; letter-spacing:-0.04em; text-align:center; background:#da291c;}