@font-face {
    font-family: 'Seaside Display';
    src: url('/font/SeasideDisplayMedium.woff2') format('woff2'),
        url('/font/SeasideDisplayMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Seaside Display';
    src: url('/font/SeasideDisplay-Bold.woff2') format('woff2'),
        url('/font/SeasideDisplay-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-1Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-2ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

html{
width:100%;
height:100%;
}

a:link    {color:#000; text-decoration:none;}
a:visited {color:#000;}
a:active  {color:#000;}
a:hover  {color:#000;}
a {outline: none; select-dummy: expression(this.hideFocus=true);}

body {
font-family:'Noto Sans KR',Noto Sans KR,'Nanum Gothic','나눔 고딕',나눔고딕,NanumGothic,Malgun Gothic,'Malgun Gothic','맑은 고딕','Dotum' , sans-serif ;
font-size:0.9vw;
letter-spacing:-1px;
margin:0;
padding:0;
color:#777;
width:100%;
height:100%;
line-height:160%;
background:#fff;
}
* {box-sizing:border-box;}
.animation {
-webkit-transition:all 0.5s ease .1s;
-moz-transition:all 0.5s ease .1s;
-ms-transition:all 0.5s ease .1s;
-o-transition:all 0.5s ease .1s;
transition:all 0.5s ease .1s;
}
.scont .duck_foot {font-size:0.7vw; line-height:1.1vw; text-align:left; background:#f5f4f2; border:#efe8e2 1px solid;
	padding:2vw; padding-left:7vw; margin:4vw 0; color:#999; position:relative;
}
.scont .duck_foot:before {content:''; width:3vw; height:3vw; background:url('/bon/img/feel.png'); background-size:100%;
	position:absolute; top:50%; left:2vw; margin-top:-1.5vw; opacity:0.5;
}
.txt_eng {font-family:'Nanum Square',NanumSquare;}
.mo_view {display:none;}
input, select, textarea {font-family:'Noto Sans KR',Noto Sans KR,'Nanum Gothic','나눔 고딕',나눔고딕,NanumGothic,Malgun Gothic,'Malgun Gothic','맑은 고딕','Dotum' , sans-serif ;}
h1, h2,h3,h4,h5,h6 {padding:0; margin:0; font-weight:normal; }
ul, li, dl, dt, dd {padding:0; margin:0; list-style:none;}
p {margin:0; padding:0;}
img {vertical-align:top; max-width:100%;}
#hd_login_msg, #hd_pop {display:none;}
.pager {position:absolute; z-index:1000; text-align:center; width:100px; top:680px; left:270px; opacity:1;
transition:all 1.0s ease .1s;
}
.pager.on {left:300px; opacity:1;}
.pager span {width:15px; height:15px; background:#fff; display:inline-block !important; text-indent:-9999px; margin:0 5px; cursor:pointer; border-radius:20px; opacity:0.5;}
.pager span.cycle-pager-active {background:#e9b670; opacity:1;}
/* 기본테이블 */
table {border-collapse:collapse;border-spacing:0; width:100%;}
table th, table td {border-bottom:#ddd 1px solid; padding:15px; background:#fff; font-weight:normal;}

.ai_cons {position:fixed; right:2vw; bottom:2vw; z-index:1000; background:#fff; color:#111 !important;
	border-radius:10vw; line-height:2vw; padding:0 1vw; border:#111 1px solid;
}
.eng {font-family: 'Seaside Display'; letter-spacing:0;}

#header {width:100%; position:fixed; z-index:1100; top:0; left:0; transition:all 1.5s ease .1s;}
.mainp #header.off, .mainp .quick.off {top:-100%;}
#header:before {content:''; width:100%; height:5vw; position:absolute; top:0; left:0; opacity:0; 
	transition:all 0.5s ease .1s; z-index:-1; background:#111;
}
#header.view:before {opacity:1;}
#header:hover:before {height:18vw; opacity:1;}
#header .ci {position:absolute; left:3vw; top:1.4vw;}
#header .ci img {height:2.3vw; filter: brightness(100%); transition:all 0.5s ease .1s;}
.mainp #header .ci img, #header.view .ci img {filter:brightness(0) invert(1);}
#header.wh .ci img {filter:unset;}
.mainp #header .gnb>li>a {color:#fff;}
#header .gnb {text-align:center;}
#header .gnb>li {display:inline-block; padding:0 3vw;}
/* #header .gnb>li.t03, #header .gnb>li.t04, #header .gnb>li.t06 {display:none;} */
#header .gnb>li>a {line-height:5vw; font-weight:500; display:block; color:#333; font-size:1vw;}
#header.view .gnb>li>a {color:#fff !important;}
#header.wh .gnb>li>a {color:#333;}
#header .gnb>li ul {position:absolute; text-align:left; padding:10px 0 0 0; max-height:0; overflow:hidden; min-width:100px; font-size:16px; text-align:center; margin-left:-15px;
-webkit-transition:all 0.5s ease .1s;
-moz-transition:all 0.5s ease .1s;
-ms-transition:all 0.5s ease .1s;
-o-transition:all 0.5s ease .1s;
transition:all 0.5s ease .1s;
}
#header .gnb>li ul:before {content:''; height:2px; background:#173e82; position:absolute; top:0; width:0; left:0;
-webkit-transition:all 0.5s ease .1s;
-moz-transition:all 0.5s ease .1s;
-ms-transition:all 0.5s ease .1s;
-o-transition:all 0.5s ease .1s;
transition:all 0.5s ease .1s;
}
#header .gnb>li:hover ul:before {width:100%;}
.soon {opacity:0.5;}
/* .soon ul {display:none;} */
#header.on .gnb>li ul, #header:hover .gnb>li ul {max-height:200px;}
#header .gnb>li ul>li>a {display:block; height:35px; line-height:35px; color:#fff; opacity:0.9;}
#header .gnb>li ul>li>a:hover {opacity:1;}
#header .tel {position:absolute; right:40px; top:26px; color:#39001f; font-size:25px; font-family:font-family:'Nanum Square',NanumSquare; font-weight:600;}
.btn_all {position:absolute; right:50px; top:34px; cursor:pointer; z-index:4; height:26px; display:none;}
.btn_all.close {position:fixed;}
.btn_all.close div.line01, .btn_all.close div.line03 {width:0px;}
.btn_all li div {width:25px; height:2px; background:#333; margin:5px 0;
transition:all 0.5s ease .1s;
}
.btn_all.wh li div {background:#333;}
.btn_all.view li div, .btn_all.close li div {background:#fff;}
.quick {position:fixed; right:3vw; top:1.3vw; z-index:1100; overflow:hidden; transition:all 1.5s ease .1s; height:3.6vw;}
.quick li {float:left; margin-left:1vw; height:100%;}
.quick li a {display:block; height:2.5vw; line-height:2.4vw; font-size:0.9vw; 
	color:#fff; border-radius:10vw;
}
.quick li:first-child a {border:#fff 1px solid; padding:0 1.5vw;}
.quick.view li:first-child a {border:#fff 1px solid !important;}
.quick.view li a {color:#fff !important;}
.quick li+li a span {font-family: 'Seaside Display'; letter-spacing:0; font-size:1.4vw; }
.quick.wh li:first-child a {border:#111 1px solid;}
.quick.wh li a {color:#111;}

.mainp {background:#fff;}
.intro {position:absolute; top:0; left:0; width:100%; height:100%; transition:all 1.5s ease .1s; 
	z-index:1000; background:#111;
}
.intro.off {top:-100%;}
.intro>div {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;}
.intro>div img {filter:brightness(0) invert(1);}
.intro>div ul {width:6vw; height:6vw; position:relative; margin:0 auto 2vw auto;}
/* .intro>div ul li {perspective:0px;} */
.intro>div ul li img {position:absolute; width:46%; margin:-10px; opacity:0; transition:all 2.5s ease .1s;
	transform:rotate(360deg);
}
.intro>div ul li img.on {margin:0; opacity:1; transform:rotate(0);}
.intro>div ul li img.on2 {filter:unset; transition:all 0.9s ease .1s;}
.intro>div ul li img.bi01 {top:0; left:0; width:49%;}
.intro>div ul li img.bi02 {bottom:0; left:0; width:49%;}
.intro>div ul li img.bi03 {top:0; right:0; aspect-ratio: 1 / 1; padding-bottom:0.5vw;}
.intro>div ul li img.bi04 {bottom:0; right:0;}
.intro>div .bi_text {width:13vw; opacity:0; transition:all 1.5s ease .1s; margin-left:2vw;}
.intro>div .bi_text.on {opacity:1; margin-left:0;}
.mcont_wrap {height:100%; overflow:hidden; position:relative; font-size:1vw;}
.mcont_wrap .mcont, .cycle-carousel-wrap {width:100%; height:100%;}
.mcont_wrap .mcont {position:absolute; bottom:-100%; left:0; transition:all 1.5s ease .1s; overflow:hidden;}
.mcont_wrap .cont_wrap h2 {font-size:1vw; color:#fff; opacity:0; transition:all 1s ease .1s; transform:translateX(-5vw);
	margin-bottom:2vw;
}
.mcont_wrap .cont_wrap h2:before {content:''; position:absolute; transition:all 1.5s ease .1s; 
	width:3vw; height:3vw; right:0; top:0; background:#173e82; border-radius:0 100vw 100vw 0;
	display:none;
}
.mcont_wrap .cont_wrap h2 .eng {font-size:4vw; line-height:100%; /* text-transform: uppercase; */}
.mcont_wrap .mcont.on2 .cont_wrap h2 {opacity:1; transform:translateX(0);}
.mcont_wrap .mcont .mt {opacity:0; transform:translateX(-5vw); transition:all 1.5s ease .1s;}
.mcont_wrap .mcont.on3 .mt {opacity:1; transform:translateX(0);}
.mcont_wrap .mcont:before {content:''; position:absolute;
	transition:all 1.5s ease .1s; width: 100%; height:100%; left:0; top:0;
}
.mcont_wrap .mcont.on {bottom:0;}
.mcont_wrap .mcont.off {bottom:100%;}
.mcont_wrap .mcont01 {bottom:0;}
.mcont_wrap .mcont01.off {bottom:100%;}
.mcont_wrap .mcont .cont_wrap {transition:all 1.5s ease .1s; position:absolute; z-index:2;}
.mcont_wrap .mcont01 {background:#000;}
.heroVideo {opacity:0.8; width:100%; pointer-events: none;
		  aspect-ratio: 16/9; /* 자동으로 높이 맞춤 */
		  border: 0; transform:scale(1.5);
}
.mcont_wrap .mcont01 .cont_wrap {top:50%; left:50%; transform:translate(-50%, -50%);}
.mcont_wrap .mcont01 .cont_wrap dl {color:#fff; text-align:center;}
.mcont_wrap .mcont01 dl dd {font-size:3.4vw; line-height:150%; position:relative; font-weight:300;
	overflow:hidden;
}
.mcont_wrap .mcont01 dl dd div {transform:translateY(4vw); transition:all 1.5s ease .1s;}
.mcont_wrap .mcont01 dl dd.on div {transform:translateY(0);}
.mcont_wrap .mcont01 dl dd div span {font-weight:700;}
.mcont_wrap .mcont01 dl dd div img {filter:brightness(0) invert(1); width:37%; margin-top:4vw;}
.mcont_wrap .mcont01 .duck_foot {position:absolute; bottom:2vw; text-align:center; width:100%; left:0;
	color:#fff; opacity:0.5; font-size:0.7vw;
}
.mcont_wrap .mcont02 {background:#000;}
.mcont_wrap .mcont02.off {left:-100%; bottom:0;}
.mcont_wrap .mcont02:before {background:url('/bon/img/mimg01.jpg')center center; background-size:cover; left:0; width:100%; z-index:2;}
/* .mcont_wrap .mcont02:after {background:url('/bon/img/mprem_bg_wh.png')center center; background-size:cover; width:100%;
	content:''; position:absolute; right:0; bottom:0; height:100%; opacity:0.2; filter:blur(5px);
	animation: rotateLoop 40s linear infinite;
}
*/
@keyframes rotateLoop {
    0% {
        transform: scale(1) rotate(360deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
    }
}
.mcont_wrap .mcont02.on2:before {width:60%; height:80%; top:10%;}
/* .mcont_wrap .mcont02.w01 {left:0;} */
.mcont_wrap .mcont02 .cont_wrap {top:50%; right:10vw; transform:translateY(-50%);}
.mcont_wrap .mcont02 .cont_wrap ul li {padding:0.5vw 0; position:relative; overflow:hidden}
.mcont_wrap .mcont02 .cont_wrap ul li:before {content:''; width:0; height:0.5px; background:#fff; position:absolute; top:0; left:0;
	transition: width 1.5s ease;
}
.mcont_wrap .mcont02.on2 .cont_wrap ul li:before {width:100%; transition-delay:1s;}
.mcont_wrap .mcont02 .cont_wrap ul li dl {transform:translateY(-5vw); transition: transform 1.5s ease;}
.mcont_wrap .mcont02.on2 .cont_wrap ul li dl {transform:translateY(0); transition-delay: 1s;}
.mcont_wrap .mcont02 .cont_wrap ul li dl dt {font-size:1vw; color:#fff; font-weight:500;}
.mcont_wrap .mcont03 {background:#edeeef; bottom:0; left:100%;}
.mcont_wrap .mcont03.on {left:0;}
.mcont_wrap .mcont03.off {left:0; bottom:100%;}
.mcont_wrap .mcont03:before {background:url('/bon/img/mloca.jpg')center center; background-size:cover; width:100%; height:60%; top:auto; bottom:0; opacity:0; z-index:2;}
.mcont_wrap .mcont03:after {position:absolute; content:''; background:#111; width:0; height:1px; left:0; bottom:60%;
	transition: width 1.0s ease;
}
.mcont_wrap .mcont03.on2:after {width:100%;}
.mcont_wrap .mcont03.on3:before {right:5vw; opacity:1;}
.mcont_wrap .mcont03 .cont_wrap {top:10vw; left:15vw;}
.mcont_wrap .mcont03 .cont_wrap h2 {color:#111; float:left;}
.mcont_wrap .mcont03 .mt {float:left; margin:1vw 0 0 3vw}
.mcont_wrap .mcont03 .mt div {margin-top:0.5vw; color:#111; font-weight:500; font-size:1.2vw; line-height:160%;}
/* SVG 글자가 이미지 위에 겹치도록 절대 위치 설정 */
.rote_img {
    position: absolute; 
    right:6vw; 
    bottom:10%;
    width:7%; 
    aspect-ratio: 1;
    transition: all 1.0s ease .1s;
	animation: rotateLoop 20s linear infinite;
}
.open {position:absolute; color:#111; z-index:2; right:/* 8 */6.5vw; bottom:13%; text-align:center;}
.open div {font-weight:bold; font-size:1.5vw/* 2.2 */; margin-bottom:0.5vw;}

.rote_img img {
    filter: brightness(0) invert(1); 
    width: 100%; 
    height: 100%;
    display: block;
	background:#ddd; border-radius:1vw 10vw 10vw 1vw;
}

/* 💡 추가되는 SVG 글자 스타일 */
.rote_img .rotating-text {
    position: absolute;
    top:-25%; left:-25%; width:150%; height:150%; /* 이미지보다 살짝 크게 배치 */
    pointer-events: none;
}

.rote_img .rotating-text text {
    fill: #fff; /* 글자 색상 */
    font-size:0.4vw; /* 글자 크기 (SVG 비율에 맞춤) */
    letter-spacing:-0.02vw;
}
.rotating-text .highlight {font-weight:bold;}

/* 스크롤 시 통째로 회전 */
.mcont_wrap .mcont04:after {position:absolute; content:''; background:#111; width:100%;
	height:100%; top:0; left:0; z-index:-2;
}
.mcont_wrap .mcont04.w02 .rote_img { transform: rotate(90deg); }
.mcont_wrap .mcont04.w03 .rote_img { transform: rotate(180deg); }
.mcont_wrap .mcont04.w04 .rote_img { transform: rotate(270deg); }
.mcont_wrap .mcont04 .cont_wrap {top:20%; left:15%;}
.mcont_wrap .mcont04 .cont_wrap h2 div {font-size:6vw; margin-top:0; line-height:100%;}
.mcont_wrap .mcont04 .cycle-slideshow {position:absolute !important; width:100% !important; height:100%; left:0; top:0;}
.mcont_wrap .mcont04 .cycle-slideshow .bg {position:absolute; width:120%; height:120%; left:-10%; top:-10%; opacity:0;
	transition:all 2.0s ease .1s; z-index:-1;
}
.mcont_wrap .mcont04.w01 .cycle-slideshow .c01 .bg,
.mcont_wrap .mcont04.w02 .cycle-slideshow .c02 .bg,
.mcont_wrap .mcont04.w03 .cycle-slideshow .c03 .bg,
.mcont_wrap .mcont04.w04 .cycle-slideshow .c04 .bg {opacity:1; width:100%; height:100%; left:0; top:0;}
.mcont_wrap .mcont04 .cycle-slideshow .c01 .bg {background:url('/bon/img/mprem01.jpg')center center; background-size:cover;}
.mcont_wrap .mcont04 .cycle-slideshow .c02 .bg {background:url('/bon/img/mprem02.jpg')center center; background-size:cover;}
.mcont_wrap .mcont04 .cycle-slideshow .c03 .bg {background:url('/bon/img/mprem03.jpg')center center; background-size:cover;}
.mcont_wrap .mcont04 .cycle-slideshow .c04 .bg {background:url('/bon/img/mprem04.jpg')center center; background-size:cover;}
/* .mcont_wrap .mcont04 .cycle-slideshow>li {position:relative; height:100%; width:100%;} */
.mcont_wrap .mcont04 .cycle-slideshow>li dl {color:#fff; position:absolute; left:65%; bottom:20%;}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dt {opacity:0; transition: all 1.0s ease .1s;}
.mcont_wrap .mcont04.on3:not(.w02) .cycle-slideshow>li.c01 dl dt,
.mcont_wrap .mcont04.w02:not(.w03) .cycle-slideshow>li.c02 dl dt,
.mcont_wrap .mcont04.w03:not(.w04) .cycle-slideshow>li.c03 dl dt,
.mcont_wrap .mcont04.w04:not(.w05) .cycle-slideshow>li.c04 dl dt
{
    opacity:1;
}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dd {opacity:0; transition: all 1.0s ease .1s; padding-left:2vw;}
.mcont_wrap .mcont04.on3:not(.w02) .cycle-slideshow>li.c01 dl dd,
.mcont_wrap .mcont04.w02:not(.w03) .cycle-slideshow>li.c02 dl dd,
.mcont_wrap .mcont04.w03:not(.w04) .cycle-slideshow>li.c03 dl dd,
.mcont_wrap .mcont04.w04:not(.w05) .cycle-slideshow>li.c04 dl dd
{
    opacity: 1; padding-left:0;
}
.mcont_wrap .mcont04:before {
    opacity:0.7;
    
    /* 왼쪽(검은색 100%) -> 가운데(투명 0%) -> 오른쪽(검은색 100%) */
    background: radial-gradient(circle, 
        rgba(0, 0, 0, 0) 0%, 
        rgba(0, 0, 0, 0.4) 50%, 
        rgba(0, 0, 0, 0.8) 80%, 
        rgba(0, 0, 0, 1) 100%
    );
    
    pointer-events: none; /* 뒤에 있는 요소 클릭 방해 금지 */
}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dt+dd {font-size:1.7vw; font-weight:600; margin-bottom:1vw;}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dt span {
    position: absolute;
    display: block;
    
    /* 1. 크기 및 위치 설정 (기존 속성 유지) */
    font-size: 3vw;
    margin: -10vw 0 0 0;
    width: 7vw;
    height: 7vw;
    line-height: 7vw; /* 수직 중앙 정렬 유지 */
    text-align: center;
    
    /* 2. 구멍 뚫린 효과의 핵심 설정 */
    background-color:#fff;       /* 💡 span 전체 배경을 흰색으로 가득 채웁니다. */
    color: #000;                  /* 💡 뚫어버릴 글자는 '완전한 검은색'으로 지정합니다. */
    
    /* 3. 블렌드 모드 적용 */
    mix-blend-mode: lighten;       /* 💡 흰색 배경은 유지하고, 검은색(글자) 부분만 배경과 합성하여 투명하게 만듭니다. */
    
    /* 4. 부가 스타일 (기존 테두리 속성은 블렌드 모드와 겹쳐 어색할 수 있으므로 제거하거나 연하게 처리) */
    border: none;                 /* 원하시면 제거 */
    border-radius:1vw 10vw 10vw 1vw;
}
.mcont_wrap .mcont05 {background:#f7f2e4;}
.mcont_wrap .mcont05:before {background:url('/bon/img/contact_bg.jpg')center center; background-size:cover; opacity:0.7;
	opacity:0.5;
}
.mcont_wrap .mcont05.w02 {bottom:20% !important;}
.mcont_wrap .mcont05 .cont_wrap {left:50%; transform:translateX(-50%); top:15%;}
.mcont_wrap .mcont05 .cont_wrap h2 {color:#111; text-align:center;}
.mcont_wrap .mcont05 ul {padding:0 32%; text-align:center; transform:translateY(-50%); top:65%;
	position:relative; color:#333; opacity:0; transition: all 1.0s ease .1s; font-size:0.8vw;
}
.mcont_wrap .mcont05.on3 ul {opacity:1; top:58%;}
.mcont_wrap .mcont05 ul li {overflow:hidden;}
/* .mcont_wrap .mcont05 ul li:first-child img {padding:0 3vw;} */
.mcont_wrap .mcont05 ul li>div {float:left; width:50%; padding-top:1vw;}
.mcont_wrap .mcont05 ul li>div span {color:#111; font-weight:700;}
.mcont_wrap .mcont05 ul li>div a {border:#111 1px solid; color:#111; padding:0.2vw 1vw;
	display:inline-block; font-size:0.8vw; border-radius:10vw; margin:0.3vw 0.2vw 0 0.2vw;
}

.mcont_wrap .mcont05 #footer {position:fixed; bottom:0; left:0; width:100%; transition: all 1.5s ease .1s;
	transform: translateY(100%); border-top:0;
}
.mcont_wrap .mcont05.w02 #footer {transform: translateY(0);}
#footer {background:#fff; padding:2vw 3vw; color:#999; border-top:#dee2ec 1px solid;}
#footer .wrap {width:100%; font-size:0.8vw; position:relative; line-height:170%; overflow:hidden;}
#footer .wrap dt {font-size:0.9vw; color:#111; font-weight:500;}
#footer .wrap dd>div>span {color:#111; margin-right:0.5vw; font-weight:500;}
#footer .wrap .footer_bi {float:left;}
#footer .wrap .duck_foot, #footer .wrap .copy {font-size:0.6vw;}
#footer .wrap .duck_foot {line-height:140%; margin-top:5px}
#footer .wrap .copy {text-transform: uppercase; font-family: 'Seaside Display'; letter-spacing:0;
	position:absolute; right:0; bottom:0;
}
#footer .wrap .line {display:inline-block; width:0.5px; height:10px; background:#333; margin:0 7px; opacity:0.5;}
#footer .wrap .footer_part {position:absolute; right:0; bottom:0; width:26vw;}

.simg {height:35vh; top:0; text-align:center; position:relative;
	background:#f7f2e4; overflow:hidden;
}
.simg:before {content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    background: url('/bon/img/simg.jpg')center center; background-size:cover;
    opacity:0.5; animation: shrinkImage 2.5s forwards;
}
@keyframes shrinkImage {
    0% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}
.simg h2 {font-size:3vw; text-transform: uppercase; color:#111; font-family: 'Seaside Display'; letter-spacing:0;
	position:absolute; bottom:0; width:100%; line-height:100%;
}
.simg h2 span {display:block; font-size:1vw; margin-bottom:1vw;}
.tab {text-align:center; border:#dee2ec 1px solid; border-left:0; border-right:0; overflow:hidden;
	padding:0 15%;
}
/* .tab:before, .tab:after {content:''; width:100%; height:1px; background:#dee2ec; position:absolute; left:0;}
.tab:after {top:3vw;} */
.tab li {position:relative; float:left;}
.tab li:before {content:''; width:0.5px; height:40%; background:#dee2ec; position:absolute; left:0; top:30%;}
.tab li:first-child:before {display:none;}
.tab li a {display:block; line-height:3vw; font-weight:500; color:#999; padding:0 2vw;}
.busip .tab li {width:20%;}
.danp .tab li {width:50%;}
.famp .tab li {width:20%;}
.appp .tab li {width:33.3%;}
.salep .tab li {width:33.3%;}
.prp .tab li, .wishp .tab li, .pressp .tab li {width:50%;}
.sub01p .tab li.st01 a,
.sub02p .tab li.st02 a,
.sub03p .tab li.st03 a,
.sub04p .tab li.st04 a,
.sub05p .tab li.st05 a
{color:#111;}
.tab02 {overflow:hidden; margin:-2vw 0 3vw 0; border-bottom:#ddd 1px solid;}
.famp.sub01p .tab02 {margin-bottom:5vw;}
.tab02 li {float:left; text-align:center; cursor:pointer; line-height:3vw; 
	border-left:0; font-size:0.9vw; position:relative;
}
.appp.sub01p .tab02 li {width:33.3%;}
.appp.sub03p .tab02 li {width:20%;}
.famp.sub01p .tab02 li {width:16.6%; font-family: 'Seaside Display'; font-size:1vw;}
.famp.sub02p .tab02 li {width:33.3%; font-family: 'Seaside Display'; font-size:1vw;}
.tab02 li a {display:block; height:100%; border-bottom:#ddd 1px solid;}
.ssub01p .tab02 li.st01 a,
.ssub02p .tab02 li.st02 a,
.ssub03p .tab02 li.st03 a,
.ssub04p .tab02 li.st04 a,
.ssub05p .tab02 li.st05 a,
.tab02 li.on, .tab02 li.on a {color:#173e82;}
.tab02 li.on:before,
.ssub01p .tab02 li.st01:before,
.ssub02p .tab02 li.st02:before,
.ssub03p .tab02 li.st03:before,
.ssub04p .tab02 li.st04:before,
.ssub05p .tab02 li.st05:before
{content:''; width:100%; height:2px; background:#173e82; position:absolute; left:0; bottom:0;}
.prp.sub01p .tab02 li {width:50%;}
.prp.sub02p .tab02 li {width:33.3%;}

.scont, #scont {width:70%; margin:5vw auto !important; /* text-align:center; */}
.pressp .scont {text-align:left;}
.busip.sub01p.ssub01p .scont img+img {margin-top:3vw;}
.busip.sub01p.ssub02p .scont {width:65%;}
.scont h3 {color:#111; text-align:center; font-size:2vw; font-weight:300; line-height:150%; margin-bottom:4vw; 
	letter-spacing:0; z-index:2; position:relative; font-family: 'Paperozi';
}
.scont h3 span {font-weight:500; color:#173e82;}

.busip.sub01p .scont ul.info_table {display:flex; flex-wrap:wrap; gap:1.5vw; padding:0; list-style:none;
	text-align:left; position:relative; width:100%; margin:3.5vw 0 0 0; left:0; bottom:auto; gap:2.2vw 1.5vw;
}
.busip.sub01p .scont ul.info_table li {width: calc((100% - 3vw) / 3); padding:0; margin:0;}
.busip.sub01p .scont ul.info_table li dl dt {font-size:1vw; font-weight:500; color:#111;}
.busip.sub01p .scont ul.info_table li dl dt+dd {margin-top:1vw; padding-top:1vw; border-top:#333 1px solid;}
.busip.sub01p .scont ul.info_table li dl dd span {font-size:0.7vw;}

.busip.sub02p .scont {width:85%;}
.busip.sub02p .scont h3 {margin-bottom:-2vw;}
.busip.sub02p .scont img+img, .busip.sub02p .scont .duck_foot {width:70%;}
.busip.sub02p .scont .duck_foot {margin-left:auto; margin-right:auto;}
.busip.sub03p .scont h3 span {font-family: 'Seaside Display'; font-size:4vw;}
.busip.sub03p .scont .sc01 ul {display: flex; text-align:center; gap:2vw; flex-wrap: wrap;}
.busip.sub03p .scont .sc01 ul li {flex: 0 0 calc(50% - 1vw);	word-break: keep-all; position:relative;}
.busip.sub03p .scont .sc01 ul li:before {content:'이미지컷'; position:absolute; right:1vw; bottom:1vw;
	font-size:0.6vw; color:#fff; opacity:0.7;
}
.busip.sub03p .scont .sc01 ul li+li+li {margin-top:4vw;}
.busip.sub03p .scont .sc01 ul li .label {font-family: 'Seaside Display'; font-size:0.9vw; padding:1.5vw 0 0.5vw 0;
	width:100%; color:#555; border-radius:3vw 3vw 0 0; background:none; border:#173e82 3px solid; border-bottom:0;
	letter-spacing:0;
}
.busip.sub03p .scont .sc01 ul li dl {width:50%; margin-left:25%; margin-bottom:2vw;}
.busip.sub03p .scont .sc01 ul li dl dt {font-family: 'Paperozi'; font-size:1.3vw; line-height:130%;
	margin:1vw 0; font-weight:600; color:#173e82;
}
.busip.sub03p .scont .sc01 ul li dl dt div {color:#000;}
.busip.sub03p .scont .sc01 ul li img {border-radius:0 0 3vw 3vw;}
.busip.sub05p .scont {background:#fff; width:100%; margin:0 !important; position:relative;}
.busip.sub05p .scont:before {content:''; position:absolute; width:100%; height:100%; top:0; left:0;
	background:#ece8e0; background-size:cover; opacity:0.5;
}
.busip.sub05p .scont .sc {position:relative; z-index:2;}
.busip.sub05p .scont ul {
    display: flex; text-align:center;
    align-items: stretch;
    width:80%; margin:0 auto; padding:7vw 0;
}
.busip.sub05p .scont ul li:first-child {
	width:50%;
}
.busip.sub05p .scont ul li:first-child img {
    display: block;
    width: 100%;
    height: auto;
}
.busip.sub05p .scont ul li:last-child {
    width:40%;
    color:#111; padding-left:3vw;
    display: flex;
    flex-direction: column;   /* 내부에 있는 h2, div를 세로로 나열 */
    justify-content: center;  /* ★ 늘어난 높이 안에서 수직(세로) 중앙 정렬 */
}
.busip.sub05p .scont ul li:last-child h2 {
    margin-top: 0;
    margin-bottom: 15px;
}
.busip.sub05p .scont ul li:last-child div {border-top:#c3bbb7 1px solid;
    margin:0.1vw 0; text-align:left; padding:1vw 0; position:relative;
}
.busip.sub05p .scont ul li:last-child div+div {border-bottom:#c3bbb7 1px solid;}
.busip.sub05p .scont ul li:last-child span {display:block; font-size:1vw; font-weight:600;}
.busip.sub05p .scont ul li:last-child a {border:#111 1px solid; position:absolute; width:4.5vw;
	line-height:2vw; padding:0 1vw; font-size:0.7vw; right:4.8vw; text-align:center; border-radius:10vw;
	bottom:0.6vw;
}
.busip.sub05p .scont ul li:last-child a+a {right:0;}

.famp.sub01p .scont .tabcon>div {background:#173e82; border-radius:10vw; padding:2vw 0;
	color:#fff; text-align:center; font-size:3vw; font-family:'Seaside Display'; letter-spacing:0; margin-bottom:2vw;
	display:none;
}
/* .famp.sub01p .scont .tabcon>img {padding:0 15%;} */
.famp.sub02p .scont .tabcon {overflow:hidden;}
.famp.sub02p .scont iframe {border:0; width:100%; height:45vw;}

.salep.sub03p .scont {width:80%;}
.salep.sub03p .scont .sc01 a {width:30%; line-height:4vw; margin:3vw 0 0 35%; padding:0 2vw;
	display:inline-block; background:#173e82; color:#fff; font-size:1vw; position:relative;
}
.salep.sub03p .scont .sc01 a img {height:2vw; filter:brightness(0) invert(1); position:absolute;
	right:2vw; top:50%; transform:translateY(-50%);
}

/*게시판*/
.wishp #scont {font-size:0.85vw;}
/* #bo_w, #content {width:1200px; margin:50px auto;} */

/*모바일*************************************************************/
@media all and (max-width:1099px) {

/* 공통 */
html, body {
    /* 당겨서 새로고침 및 오버스크롤(바운스) 효과를 완전히 차단합니다 */
    overscroll-behavior-y: contain;
}
.mo_view {display:block;}
.pc_view {display:none;}
body {font-size:13px;}
#cont_wrap {width:100%; min-height:100px; margin:0 auto; padding:0; max-width:900px;}
.view_mo {display:block;}
#contp {width:100%; padding:70px 15px 15px 15px;}
.nav {display:none;}
.scont .duck_foot {font-size:9px; line-height:12px; padding:7px; padding-left:50px; margin:30px 0 0 0;}
.scont .duck_foot:before {width:20px; height:20px; left:15px; margin-top:-10px;}

/* 헤더 */
#header {height:50px;}
#header:before {height:50px;}
#header .ci {left:15px; line-height:60px; top:12px;}
#header .ci img {height:26px;}
#header .gnb {position:fixed; top:50px; width:100%; background:#111;
	padding:30px; z-index:-1; left:-100%; transition:all 0.5s ease .1s;
}
#header .gnb:before {content:''; position:fixed; width:100%; height:100%; top:0; left:0; display:none;
	background:#111; opacity:0.9;
}
#header .gnb.on:before {display:block;}
#header .gnb.on {left:0; z-index:1;}
#header .gnb li {display:block; position:relative; z-index:1;}
#header .gnb li a {color:#fff !important; height:50px; line-height:50px; border-top:#444 1px solid; 
	letter-spacing:5px; display:block; font-size:14px;
}
#header .gnb li:first-child a {border-top:0;}
#header .gnb>li ul {display:none;}

.quick {top:auto; bottom:50px; height:auto; right:20px; display:none;}
.quick.on {display:block;}
.quick li {margin-left:15px;}
.quick li a {font-size:13px; color:#fff !important; height:35px; line-height:35px;}
.quick li:first-child a {border:#fff 1px solid !important; padding:0 15px !important;}
.quick li+li a span {font-size:13px;}

.btn_all {position:fixed; right:15px; top:13px; z-index:1100; display:block;}
.mainp .btn_all div {background:#fff;}
.btn_all.view div {background:#111;}

.rote_img {width:60px; bottom:40px; right:25px;}
.rote_img .rotating-text text {font-size:7px;}
.open {font-size:12px; line-height:17px; right:/* 34 */30px; bottom:52px;}
.open div {font-size:16px; margin-bottom:0;}

.intro>div {transform:translate(-50%, -50%) scale(2.5);}
.mcont_wrap {font-size:12px;}
.mcont_wrap .cont_wrap h2 {font-size:12px;}
.mcont_wrap .cont_wrap h2 .eng,
.mcont_wrap .mcont04 .cont_wrap h2 div {font-size:30px;}
.mcont_wrap .mcont01 .cont_wrap {transform:translate(-50%, -150%) scale(2.5);}
.mcont_wrap .mcont01 .heroVideo {position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: calc(100vw * 9 / 16); 
    min-width: 177.77vh; /* 세로가 꽉 채워질 수 있도록 비율상 최소 가로폭 강제 (16/9 = 1.7777) */
    min-height: 100vh;
    transform: translate(-50%, -50%);
    scale: 1.05;
    pointer-events:none;
}
.mcont_wrap .mcont01 .duck_foot {font-size:9px; padding:0 15px;}
.mcont_wrap .mcont02.on2:before {width:100%; height:30%; top:60px;}
.mcont_wrap .mcont02 .cont_wrap {right:0; width:100%; padding:15px; top:auto; bottom:0;
	transform:unset;
}
.mcont_wrap .mcont02 .cont_wrap ul li {padding:7px 0;}
.mcont_wrap .mcont02 .cont_wrap ul li dl dt {font-size:12px;}
.mcont_wrap .mcont03:before {height:40%;}
.mcont_wrap .mcont03:after {bottom:40%;}
.mcont_wrap .mcont03 .cont_wrap {top:30%; transform:translateY(-50%); left:10%;}
.mcont_wrap .mcont03 .cont_wrap h2 {float:unset;}
.mcont_wrap .mcont03 .mt {float:unset; margin:0;}
.mcont_wrap .mcont03 .mt div {font-size:17px;}
.mcont_wrap .mcont04 .cont_wrap {left:10%;}
.mcont_wrap .mcont04 .cycle-slideshow>li dl {left:10%;}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dt+dd {font-size:17px; margin-bottom:7px;}
.mcont_wrap .mcont04 .cycle-slideshow>li dl dt span {width:50px; height:50px; line-height:50px;
	margin-top:-70px; font-size:20px;
}
.mcont_wrap .mcont05 .cont_wrap {transform:translate(-50%, -50%); top:20%;}
.mcont_wrap .mcont05 ul {padding:0 15px; font-size:12px; width:100%; display:block;
	top:auto; bottom:0; transform:unset; position:absolute;
}
.mcont_wrap .mcont05.on3 ul {top:auto; bottom:20px;}
.mcont_wrap .mcont05 ul li {width:100%;}
.mcont_wrap .mcont05 ul li:last-child {padding:15px 0 0 0; text-align:left;}
.mcont_wrap .mcont05 ul li:last-child div {padding:10px 0; float:unset; width:100%; overflow:hidden;}
.mcont_wrap .mcont05 ul li:last-child span {font-size:14px;}
.mcont_wrap .mcont05 ul li:last-child a {font-size:10px; width:49%; padding:7px 10px; float:left; margin:7px 0 0 0;}
.mcont_wrap .mcont05 ul li:last-child a+a {float:right;}

.simg {height:140px}
.simg h2 {font-size:20px;}
.simg h2 span {font-size:12px; margin:3px 0 10px 0;}

.tab {padding:0;}
.tab li a {font-size:12px; line-height:40px;}
.famp .tab li {width:33.3%;}
.famp .tab li+li+li+li {width:50%;}

.tab02 {margin:0 0 30px 0;}
.tab02 li {font-size:12px !important; line-height:40px;}

.simg:before {background:url(/bon/img/simg.jpg) center bottom; background-size:cover;}

.scont, #scont {width:100%; margin:0 !important; padding:30px 15px;}
.scont h3 {font-size:15px; margin-bottom:15px;}

.busip.sub01p .scont ul.info_table {gap:0;}
.busip.sub01p .scont ul.info_table li:first-child {margin-top:0;}
.busip.sub01p .scont ul.info_table li {width:100%; margin-top:15px;}
.busip.sub01p .scont ul.info_table li dl dt {font-size:14px;}
.busip.sub02p .scont {width:100%;}
.busip.sub02p .scont img+img, .busip.sub02p .scont .duck_foot {width:100%;}
.busip.sub03p .scont h3 span {font-size:30px;}
.busip.sub03p .scont .sc01 ul {gap:0;}
.busip.sub03p .scont .sc01 ul li {flex:unset; margin-top:50px !important;}
.busip.sub03p .scont .sc01 ul li:first-child {margin-top:20px !important;}
.busip.sub03p .scont .sc01 ul li .label {font-size:12px; padding:5px 10px; width:100%; color:#173e82;
	border-radius:3vw 3vw 0 0; background:none; border:#173e82 2px solid; border-bottom:0;
}
.busip.sub03p .scont .sc01 ul li img {border-radius:0 0 3vw 3vw;}
.busip.sub03p .scont .sc01 ul li:nth-child(2n) .label {left:auto; right:0;}
.busip.sub03p .scont .sc01 ul li:before {font-size:7px; right:10px; bottom:10px;}
.busip.sub03p .scont .sc01 ul li dl {width:100%; margin:0; padding:15px 0;}
.busip.sub03p .scont .sc01 ul li dl dt {font-size:17px; line-height:25px;}
.busip.sub05p .scont ul {width:100%; display:block; padding:0;}
.busip.sub05p .scont ul li {width:100% !important;}
.busip.sub05p .scont ul li:last-child {padding:15px 0 0 0;}
.busip.sub05p .scont ul li:last-child div {padding:10px 0;}
.busip.sub05p .scont ul li:last-child span {font-size:14px;}
.busip.sub05p .scont ul li:last-child a {font-size:10px; width:auto; right:0; padding:7px 10px;
	bottom:33px;
}
.busip.sub05p .scont ul li:last-child a+a {bottom:7px;}

.famp.sub02p .scont iframe {height:400px;}

.salep.sub03p .scont {width:100%;}
.salep.sub03p .scont .sc01 a {width:60%; line-height:40px; margin:20px 0 0 20%; padding:0 15px; font-size:14px;}
.salep.sub03p .scont .sc01 a img {height:20px;	right:15px;}

.pressp .scont .tbl_head01 table thead {display:none;}

#footer {padding:20px 15px;}
#footer dl.wrap {font-size:12px; line-height:130%;}
#footer .wrap dt {font-size:14px; margin-bottom:5px;}
#footer dl.wrap dd>div {margin-top:5px;}
#footer .wrap .duck_foot, #footer .wrap .copy {font-size:10px; margin:10px 0 0 0;
	position:relative;
}
#footer .wrap .duck_foot br {display:none;}
#footer .wrap .footer_part {position:relative; right:auto; bottom:auto; width:80%;}
#footer .wrap .line {display:block; border:0; line-height:0; margin:-7px 0 0 0; width:0;}

}