/* Pretendard */
@font-face {font-family: 'Pretendard'; font-weight: 100; font-style: normal; src: url('/font/Pretendard-Thin.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 200; font-style: normal; src: url('/font/Pretendard-ExtraLight.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 300; font-style: normal; src: url('/font/Pretendard-Light.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 400; font-style: normal; src: url('/font/Pretendard-Regular.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 500; font-style: normal; src: url('/font/Pretendard-Medium.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 600; font-style: normal; src: url('/font/Pretendard-SemiBold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 700; font-style: normal; src: url('/font/Pretendard-Bold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 800; font-style: normal; src: url('/font/Pretendard-ExtraBold.woff') format('woff');}
@font-face {font-family: 'Pretendard'; font-weight: 900; font-style: normal; src: url('/font/Pretendard-Black.woff') format('woff');}
/* Outfit */
@font-face {font-family: 'Outfit'; font-weight: 100; font-style: normal; src: url('/font/Outfit-Thin.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 200; font-style: normal; src: url('/font/Outfit-ExtraLight.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 300; font-style: normal; src: url('/font/Outfit-Light.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 400; font-style: normal; src: url('/font/Outfit-Regular.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 500; font-style: normal; src: url('/font/Outfit-Medium.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 600; font-style: normal; src: url('/font/Outfit-SemiBold.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 700; font-style: normal; src: url('/font/Outfit-Bold.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 800; font-style: normal; src: url('/font/Outfit-ExtraBold.woff2') format('woff2');}
@font-face {font-family: 'Outfit'; font-weight: 900; font-style: normal; src: url('/font/Outfit-Black.woff2') format('woff2');}
/* Playfair Display */
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-Regular.woff') format('woff'); font-weight: 400; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-Italic.woff') format('woff'); font-weight: 400; font-style: italic;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-Medium.woff') format('woff'); font-weight: 500; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-MediumItalic.woff') format('woff'); font-weight: 500; font-style: italic;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-SemiBoldItalic.woff') format('woff'); font-weight: 600; font-style: italic;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-Bold.woff') format('woff'); font-weight: 700; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-BoldItalic.woff') format('woff'); font-weight: 700; font-style: italic;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-ExtraBold.woff') format('woff'); font-weight: 800; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-ExtraBoldItalic.woff') format('woff'); font-weight: 800; font-style: italic;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-Black.woff') format('woff'); font-weight: 900; font-style: normal;}
@font-face {font-family: 'Playfair Display'; src: url('/font/PlayfairDisplay-BlackItalic.woff') format('woff'); font-weight: 900; font-style: italic;}

:root {
    --font-pre : 'Pretendard', serif;
    --font-out : 'Outfit', serif;
    --font-playDis : 'Playfair Display', serif;
    --font-play : 'PlayfairDisplay', serif;

    --font-color : #A08C74;
    --bg-color : #A18C74;
    --bg-color-op : rgba(160, 140, 116, 0.80);
}

* {word-break:keep-all !important; font-family: var(--font-pre);}

.fc-w {color: #fff !important;}
.fc-m {color: var(--font-color) !important;}
.f-pre {font-family: var(--font-pre) !important;}
.f-out {font-family: var(--font-out) !important;}
.f-playDis {font-family: var(--font-playDis) !important;}
.f-play {font-family: var(--font-play) !important;}

.cu-p {cursor: pointer;}
.uppercase {text-transform: uppercase;}


.pc {display: block !important;}
.mob {display: none !important;}

.ta-l {text-align: left;}
.ta-c {text-align: center;}
.ta-r {text-align: right;}

.flex {display: flex; align-items: center;}
.flex-jb {display: flex; align-items: center; justify-content: space-between;}
.flex-jc {display: flex; align-items: center; justify-content: center;}
.flex-je {display: flex; align-items: center; justify-content: flex-end;}

.mt_10 {margin-top: .62rem;}
.mt_15 {margin-top: .94rem;}
.mt_16 {margin-top: 1rem;}
.mt_20 {margin-top: 1.25rem;}
.mt_30 {margin-top: 1.875rem;}
.mt_40 {margin-top: 2.5rem;}
.mt_60 {margin-top: 3.75rem;}
.mt_64 {margin-top: 4rem;}
.mt_70 {margin-top: 4.375rem;}
.mt_80 {margin-top: 5rem !important;}
.mt_100 {margin-top: 6.25rem;}
.mt_110 {margin-top: 6.875rem;}

.pb_0 {padding-bottom: 0 !important;}
.pt_0 {padding-top: 0 !important;}
.pr_0 {padding-right: 0 !important;}
.mt_0 {margin-top: 0 !important;}
.mb_0 {margin-bottom: 0 !important;}

.inner1820 {width: 100%; max-width: 113.75rem; margin: 0 auto;}
.inner1600 {width: 100%; max-width: 100rem; margin: 0 auto;}

/* header */
#header {height: 4.5rem; position: fixed; top: 0; left: 0; width: 100%; z-index: 100;}
#header.fixed {background: rgba(160, 140, 116, 0.80);}
#header .inner1820 {position: relative; height: 100%;}
#header .gnb {gap: 3.125rem;}
#header .gnb a {display: block; line-height: 4.5rem; color: #FFF; font-family: var(--font-out); font-size: 1rem; font-weight: 400; letter-spacing: -0.025rem;}
#header .logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
#header .logo img {width: 9.652rem;}
#header .hd_right {gap: 8.41rem;}
#header .hd_until {gap: 0.9375rem;}
#header .hd_until img {width: 2rem;}

/* all menu */
.all_menu {position:fixed; visibility: hidden; opacity: 0; width:100%; height: 0; overflow: hidden; z-index:5000; background: rgba(161, 140, 116, 0.90); transition: all .4s;}
.all_menu.on {opacity: 1; height:100dvh; visibility: visible;}
.all_menu_close {position:absolute; right:1.88rem ; top: 1.88rem; width:2rem; cursor:pointer;}
.all_menu_close img {width:100%; filter: invert(1);}
.all_menu .logo {padding-top: 3.75rem; text-align: center;}
.all_menu .logo img {width: 10.8125rem;}
.all_menu .inner {height: 100%; max-width: 100%; padding: 0 1.87rem 0 8.75rem;}
.all_menu .inner {height: 100%; max-width: 100%; padding: 0 1.88rem;}
.all_menu_list{margin-top: 4.88rem; max-height: calc(100% - 4.625rem - 7.06rem - 3.75rem); overflow: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;}
.all_menu_list::-webkit-scrollbar {width: 0.1875rem;}
.all_menu_list::-webkit-scrollbar-track {background: rgba(255, 255, 255, 0.2); border-radius: 0.625rem;}
.all_menu_list::-webkit-scrollbar-thumb {background: #fff; border-radius: 0.625rem;}
.all_menu_list .in {max-width: 102.5625rem; margin: 0 auto; width: 100%; /* display:flex; flex-wrap: wrap; */ gap: 6.25rem 0; gap: 6.25rem 12.5rem; display: grid; grid-template-columns: repeat(4,1fr);}
/* .all_menu_list dl {width:25%;} */
.all_menu_list dt {margin-bottom: 2.3125rem; color: #fff; font-family: var(--font-playDis); font-size: 1.5rem; font-weight: 600; line-height: 133%; letter-spacing: -0.05rem; text-transform: uppercase;}
.all_menu_list dd + dd {margin-top: 0.75rem;}
.all_menu_list dd a {color: #fff; font-size: 1rem; font-weight: 400; line-height: 150%; text-transform: uppercase;}
.all_menu_list dl dd a:hover {text-decoration: underline; text-underline-offset: 3px;}
.head_bg {display: none;}

/* quick */
#quick {position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 99;}
#quick a {display: flex; align-items: center; justify-content: center; border-radius: 100%; width: 3.75rem; aspect-ratio: 1/1;}
#quick a + a {margin-top: 0.625rem;}
#quick a img {width: 1.875rem;}
#quick a.naver {background: #00B916;}
#quick a.chat {border: 0.7px solid #BEBEBE; background: #93897D;}
#quick a.kakao {background: #F1DF09;}

/* footer */
#footer {background: #111;}
#footer a,
#footer span,
#footer strong,
#footer span:hover,
#footer strong:hover,
#footer a:link,
#footer a:visited,
#footer a:hover,
#footer a:active,
#footer .ft_network .cont strong a {text-decoration: none !important; text-decoration-line: none !important; border: 0 !important; box-shadow: none !important;}
#footer * {color: #fff;}
#footer .ft_top {height: 5.26rem; border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
#footer .ft_top .inner1820 {height: 100%;}
#footer .ft_use {gap: 1.875rem;}
#footer .ft_use a {font-size: 0.875rem; font-weight: 400; letter-spacing: -0.0125rem; opacity: .6;}
#footer .ft_bot {padding: 2.43rem 0 3.12rem; gap: 4.94rem; align-items: flex-start;}
#footer .ft_right {width: calc(100% - 2.41rem - 0.80rem);}
#footer .logo img {width: 9.5625rem;}
#footer .ft_info li {display: flex; gap: 1.05469rem;}
#footer .ft_info li span {font-size: 0.875rem; font-weight: 400; line-height: 143%; letter-spacing: -0.0125rem;}
#footer .ft_tel {margin-top: 2.5rem; gap: 0.9375rem;}
#footer .ft_tel p {display: flex; align-items: flex-end; gap: 0.75rem; font-size: 0.875rem; font-weight: 400; line-height: 143%; letter-spacing: -0.0125rem;}
#footer .ft_tel p strong {font-size: 2rem; font-weight: 700; font-family: var(--font-out); letter-spacing: -0.03563rem; line-height: 125%;}
#footer .ft_addr {margin-top: 3.13rem; align-items: flex-end;}
#footer .ft_network {display: flex; gap: 1.75rem;}
#footer .ft_network .tit {font-family: var(--font-out); font-size: 1.25rem; font-weight: 700; letter-spacing: -0.03163rem;}
#footer .ft_network .cont {display: flex; gap: 6.6875rem;}
#footer .ft_network .cont strong {display: block; font-size: 1rem; font-weight: 600; line-height: 150%;}
#footer .ft_network .cont p {margin-top: 0.8125rem; font-size: 0.875rem; font-weight: 400; line-height: 143%; letter-spacing: -0.0125rem; opacity: .8;}
#footer .ft_network .cont p span {display: block;}
#footer .addr_right > .flex {gap: 1.87rem; align-items: flex-end; justify-content: flex-end;}
#footer .ft_site {position: relative; width: 15.6875rem;}
#footer .ft_site .open {font-family: var(--font-out); font-size: 0.875rem; font-weight: 400; letter-spacing: -0.03163rem; padding: 0.625rem 1.25rem; width: 100%; display: flex; align-items: center; justify-content: space-between; border: 1px solid rgba(253, 253, 253, 0.80); cursor: pointer;}
#footer .ft_site .open .img {width: 1rem; display: block; aspect-ratio: 1/1; background: url(/img/ft_Plus.svg) no-repeat center/cover;}
#footer .ft_site.on .open .img {background-image: url(/img/ft_minus.svg);}
#footer .ft_site ul{position: absolute; width: 100%; bottom: calc(100% + 0.625rem); background: #000; display: none; border: 1px solid #FFF;}
#footer .ft_site ul li a {font-size: 1rem; font-weight: 400; line-height: 2.5rem; display: block; padding: 0 1.25rem;}
#footer .ft_site ul li a:hover {background: #fff; color: #6D6D6D;}
#footer .copy {margin-top: 1.94rem; font-family: var(--font-out);}
#footer .copy span,
#footer .copy {text-align: right; color: #8E8E8E; font-size: 0.9375rem; font-weight: 400; line-height: 150%; letter-spacing: -0.03163rem;}


/* common   */
#main .moveBtn {display: inline-flex; align-items: center; justify-content: center; padding: 0 2rem; position: relative; height: 3.75rem; background: var(--bg-color); overflow: hidden;}
#main .moveBtn span {color: #fff; font-size: 1.25rem; font-weight: 600; position: relative; z-index: 2; transition: all .3s;}
#main .moveBtn .btn_fill {position: absolute; display: block; width: 0px; height: 0px; transform: translate(-50%, -50%); border-radius: 50%; background: #fff; transition: width 0.65s, height 0.65s;}
#main .moveBtn:hover span {color: #000;}
#main .moveBtn:hover .btn_fill {width: 50rem; height: 50rem;}
#main .sec {padding: 7.5rem 0;}
#main img.ob-img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .main_tit {margin-bottom: 3.75rem;}
#main .main_tit h3 {font-family: var(--font-playDis); font-size: 3.875rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.05rem;}
#main .main_tit p {margin-top: 2.5rem; font-size: 1.25rem; font-weight: 400; line-height: 1.45; letter-spacing: -0.025rem; opacity: 0.5;}

/* visual */
#main .visual {overflow: hidden; position: relative; height: 59.375rem;}
#main .visual .swiper-slide {overflow: hidden; position: relative;}
#main .visual .visual_slide_link {display: block; position: relative; width: 100%; height: 100%; color: inherit; text-decoration: none; outline: none;}
#main .visual .visual_slide_link:focus-visible {outline: 2px solid #fff; outline-offset: 2px;}
#main .visual .swiper-slide .vis_img {display: block; position: relative; width: 100%; height: 100%;}
#main .visual .swiper-slide .vis_img img {width: 100%; height: 100%; object-fit: cover; object-position: center; -webkit-transform: scale(1.2); transform: scale(1.2);}
#main .visual .swiper-slide[class*=active] .vis_img img {-webkit-transform: scale(1); transform: scale(1); transition: all 10s;}
#main .visual .txts {top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute; z-index: 1; width: 100%; color: #fff;}
#main .visual .txts h2 {-webkit-filter: blur(10px); filter: blur(10px); opacity: 0; font-size: 3.125rem; font-weight: 500; line-height: 115%; letter-spacing: -0.0625rem;}
#main .visual .txts .subTitle {margin-top: 2.5rem; font-size: 1.25rem; font-weight: 400; line-height: 145%;}
#main .visual .txts p {position: relative; opacity: 0;}
#main .visual .txts .moveBtn {margin-top: 2.5rem; opacity: 0;}
#main .visual .swiper-slide[class*=active] .txts h2 {-webkit-filter: blur(0); filter: blur(0); opacity: 1; transition: all 1.5s;}
#main .visual .swiper-slide[class*=active] .txts p {top: 0; opacity: 1; transition: all 1s .5s;}
#main .visual .swiper-slide[class*=active] .txts .moveBtn {opacity: 1; transition: all 1s 1s;}
#main .visual .controls {gap: 1.75rem; transform: translateX(-50%); position: absolute; left: 50%; bottom: 3.13rem; z-index: 1;}
#main .visual .pager {gap: 1.5625rem; width: auto !important;}
#main .visual .pager span {display: block; width: 0.3125rem; height: 0.3125rem; margin: 0; border-radius: 100%; background-color: #fff; cursor: pointer; transition: all 0.3s; opacity: 1;}
#main .visual .pager span[class*=active] {width: 0.9375rem; height: 0.9375rem; background: transparent; border: 2px solid #fff;}
#main .visual .playBox {position: relative; width: 2.5rem; aspect-ratio: 1/1;}
#main .visual .progress {width: 100%; height: 100%; border-radius: 100%; border: 1px solid rgba(255, 255, 255, 0.50); position: relative;}
#main .visual .progress svg {--progress: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-90deg); width: calc(100% + .5rem); height: calc(100% + .5rem); fill: none; stroke: #fff; stroke-width: 1px; stroke-dashoffset: calc(125.6px * (1 - var(--progress))); stroke-dasharray: 125.6;}
#main .visual .btns {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
#main .visual .btns button {display: none; align-items: center; justify-content: center; width: 100%; height: 100%; border: 0; background: none; outline: none;}
#main .visual .btns button img {width: 0.875rem;}
#main .visual .btns button.active {display: flex;}
/* sec01 */
#main .sec01 .flex-jb {/* gap: 9.375rem; */ padding: 0 3.125rem;}
#main .sec01 .item {display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0 3.12rem; gap: 1.25rem;}
#main .sec01 .item span em {color: var(--font-color); font-family: var(--font-playDis); font-size: 1.5rem; font-weight: 500; line-height: 3.75;}
#main .sec01 .item img {width: 6.6875rem;}
#main .sec01 .item .cnt {align-items: flex-end;}
#main .sec01 .item .cnt img {width: 2.08563rem;}
#main .sec01 .item .cnt strong {font-family: var(--font-playDis); font-size: 5.375rem; font-weight: 400; line-height: 1.04; letter-spacing: -0.0625rem; display: block;}
#main .sec01 .item:nth-child(1) .cnt strong {min-width: 15.5rem;}
#main .sec01 .item:nth-child(2) .cnt strong {min-width: 16rem;}
#main .sec01 .item:nth-child(2) .cnt img {margin-left: -1.5rem;}
#main .sec01 .item:nth-child(3) .cnt strong {min-width: 12rem;}
#main .sec01 .item p {margin-top: calc(2.5rem - 1.25rem); font-size: 1.375rem; font-weight: 400; line-height: 1.45;}
/* sec02 */
#main .sec02 .inner1820 {gap: 2.5rem;}
#main .sec02 .left {width: 42.7%; aspect-ratio: 1.085/1;}
#main .sec02 .right {width: 57.3%; display: grid; grid-template-columns: repeat(2,1fr); gap: 2.5rem;}
#main .sec02 .left .item {aspect-ratio: 1.48/1;}
#main .sec02 .left a {width: 100%; height: 100%; display: block;}
#main .sec02 .item {position: relative;}
#main .sec02 .item a::after {content: ""; width: 100%; height: 6.875rem; background: rgba(160, 140, 116, 0.80); position: absolute; bottom: 0; left: 0; transition: all .3s;}
#main .sec02 .item .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: 1.5625rem 1.875rem; z-index: 1;}
#main .sec02 .item .txt strong {font-size: 1.625rem; font-weight: 600; line-height: 1; letter-spacing: -0.0625rem;}
#main .sec02 .item .txt p {margin-top: .63rem; font-size: 1.25rem; font-weight: 600; letter-spacing: -0.03125rem; line-height: 1.25; font-family: var(--font-play);}
#main .sec02 .item:hover a::after {height: 100%;}
/* sec03 */
#main .sec03 {height: 59.375rem; background: url(/img/sec03_bg.jpg) no-repeat center/cover; display: flex; align-items: center; justify-content: center;}
#main .sec03 h2 {font-size: 3.875rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.05rem;}
#main .sec03 strong {display: block; font-size: 1.75rem; font-weight: 700; line-height: 1.29;}
#main .sec03 p {font-size: 1.25rem; font-weight: 400; line-height: 1.45; letter-spacing: -0.025rem;}
/* sec04 */
#main .sec04 ul {gap: 1.6875rem; display: flex;}
#main .sec04 ul li {flex: 1;}
#main .sec04 ul li.tit {padding: 2.5rem; background: var(--bg-color);}
#main .sec04 ul li.tit .txt {display: flex; align-items: flex-start; justify-content: space-between; flex-direction: column; height: 100%;}
#main .sec04 ul li.tit .txt p {font-size: 2rem; font-weight: 600; line-height: 1.25;}
#main .sec04 ul li.tit .txt strong {font-size: 3.25rem; font-weight: 600; opacity: .1; letter-spacing: -.05rem; line-height: 1.15; text-transform: uppercase;}
#main .sec04 ul li.cont {padding: 3.37rem 1.88rem; background: #F5F5F5; display: flex; align-items: flex-start; flex-direction: column; gap: 1.25rem;}
#main .sec04 ul li.cont .tit span {font-size: 1.25rem; display: block; font-weight: 600; line-height: 1.25; letter-spacing: -0.03125rem; text-transform: uppercase;}
#main .sec04 ul li.cont .tit strong {margin-top: .62rem; font-size: 1.625rem; font-weight: 600; line-height: 1; letter-spacing: -0.0625rem; display: block;}
#main .sec04 ul li.cont p {font-size: 1.125rem; font-weight: 400; line-height: 1.5; opacity: 0.5; min-height: 5.0625rem;}
#main .sec04 ul li.cont .img {width: 100%;}
#main .sec04 ul li.cont .moveBtn {width: 100%;}
#main .sec04 ul li.cont .moveBtn .btn_fill {background: #616161;}
#main .sec04 ul li.cont .moveBtn:hover span {color: #fff;}
/* sec05 */
#cursor_div{position: fixed; left: 0; top: 0; pointer-events: none; z-index:1000;}
.cursor{display:flex; justify-content:center; align-items:center; width: 0px; height: 0px; border-radius:100%; background: rgba(159, 159, 159, 0.50); backdrop-filter: blur(5px); justify-content: space-between; transition:all 0.3s; transform: translate(-50%, -50%);}
.cursor.on{width: 12.5rem; height: 12.5rem; padding: 1.06rem;}
.cursor span{font-size: 0; font-weight: 700; color:#fff; transition:all 0.3s; font-family: var(--font-playDis);}
.cursor.on span{font-size: 1.875rem;}
.cursor img{width:0; transition:all 0.3s;}
.cursor.on img{width:0.47169rem;}

#main .sec05 {background: #F5F5F5;}
#main .sec05 .swiper-wrapper {padding-left: var(--side-padding);}
#main .sec05 .swiper-slide {width: 34.0625rem; margin-right: 1.6875rem; background: #fff;}
#main .sec05 .swiper-slide .img {width: 100%; position: relative;}
#main .sec05 .swiper-slide .svgBox {width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden;}
#main .sec05 .swiper-slide .svgBox::after,
#main .sec05 .swiper-slide .svgBox::before {content: ""; position: absolute; transition: all .5s; background-repeat: no-repeat; background-size: contain; background-position: center; filter: grayscale(1) brightness(.5);}
#main .sec05 .swiper-slide:hover .svgBox::after,
#main .sec05 .swiper-slide:hover .svgBox::before {filter: none;}
#main .sec05 .swiper-slide .img img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .sec05 .swiper-slide .img::after {content: ""; width: 100%; height: 11.9375rem; opacity: 0.8; background: linear-gradient(180deg, rgba(99, 90, 86, 0.00) 31.15%, #635A56 88.74%); position: absolute; left: 0; bottom: 0; transition: all .5s;}
#main .sec05 .swiper-slide .txt {padding: 2rem 2.38rem;}
#main .sec05 .swiper-slide .txt p {font-family: var(--font-play); font-size: 1.25rem; font-weight: 600; line-height: 125%; letter-spacing: -0.03125rem; text-transform: uppercase;}
#main .sec05 .swiper-slide .txt strong {display: block; margin-top: 0.625rem; font-size: 1.625rem; font-weight: 600; line-height: 1; letter-spacing: -0.0625rem;}
#main .sec05 .swiper-slide .txt .flex {margin-top: 3.19rem; gap: 1.09rem;}
#main .sec05 .swiper-slide .txt .flex span {font-size: 1.125rem; font-weight: 500; line-height: 138%; letter-spacing: -0.0625rem; min-width: fit-content;}
#main .sec05 .swiper-slide .txt .flex .line {display: block; width: 100%; height: 0.0625rem; background: #000;}
#main .sec05 .slide1:hover .img::after {background: linear-gradient(180deg, rgba(238, 141, 31, 0.00) 0%, #EE8D1F 100%);}
#main .sec05 .slide1 .svgBox::before {width: 17.125rem; height: 24.8125rem; top: -11rem; left: -3rem; background-image: url(/img/sec05_slide1_svg1.svg);}
#main .sec05 .slide1 .svgBox::after {width: 16.9375rem; height: 22.5625rem; bottom: -12rem; right: -3rem; background-image: url(/img/sec05_slide1_svg2.svg);}
#main .sec05 .slide1:hover .svgBox::before {top: -18rem; left: -9rem;}
#main .sec05 .slide1:hover .svgBox::after {bottom: -12rem; right: -12rem;}
#main .sec05 .slide2:hover .img::after {background: linear-gradient(180deg, rgba(130, 226, 178, 0.00) 31.15%, #82E2B2 88.74%);}
#main .sec05 .slide2 .svgBox::before {width: 18.25rem; height: 18.25rem; top: -6.5rem; left: -6rem; background-image: url(/img/sec05_slide2_svg1.svg); transform: scale(scale(1.2));}
#main .sec05 .slide2 .svgBox::after {width: 7.125rem; height: 15.8445rem; bottom: -2.5rem; right: 1.8rem; background-image: url(/img/sec05_slide2_svg2.svg); transform: scale(1.7);}
#main .sec05 .slide2:hover .svgBox::before {top: -6.5rem; left: -10rem; transform: scale(1);}
#main .sec05 .slide2:hover .svgBox::after {bottom: -.5rem; right: -0.2rem; transform: scale(1);}
#main .sec05 .slide3:hover .img::after {background: linear-gradient(180deg, rgba(231, 156, 172, 0.00) 31.15%, #E79CAC 88.74%);}
#main .sec05 .slide3 .svgBox::before {width: 19.25rem; height: 22.25rem; top: -7rem; left: -13rem; background-image: url(/img/sec05_slide3_svg1.svg);}
#main .sec05 .slide3 .svgBox::after {width: 15rem; height: 25.5rem; bottom: 0.5rem; right: 1.8rem; background-image: url(/img/sec05_slide3_svg2.svg); transform: scale(1.8) rotate(19deg);}
#main .sec05 .slide3:hover .svgBox::before {top: -4rem; left: -10rem; transform: scale(1);}
#main .sec05 .slide3:hover .svgBox::after {bottom: -2.5rem; right: -3rem; transform: scale(1) rotate(0);}
#main .sec05 .slide4:hover .img::after {background: linear-gradient(180deg, rgba(99, 90, 86, 0.00) 31.15%, #635A56 88.74%);}
#main .sec05 .slide4 .svgBox::before {width: 9.61131rem; height: 15.78125rem; top: 5rem; left: 0rem; background-image: url(/img/sec05_slide4_svg1.svg); transform: scale(2);}
#main .sec05 .slide4 .svgBox::after {width: 7.125rem; height: 15.8445rem; bottom: -2rem; right: 1rem; background-image: url(/img/sec05_slide4_svg2.svg); transform: scale(1.5);}
#main .sec05 .slide4:hover .svgBox::before {top: -1rem; left: -1rem; transform: scale(1);}
#main .sec05 .slide4:hover .svgBox::after {bottom: -1rem; right: 0rem; transform: scale(1);}
#main .sec05 .slide5 .svgBox::before {background-image: url(/img/sec05_slide5_svg1.svg);}
#main .sec05 .slide5 .svgBox::after {background-image: url(/img/sec05_slide5_svg2.svg);}
#main .sec05 .slide5:hover .img::after {background: linear-gradient(180deg, rgba(188, 136, 228, 0.00) 0%, #BC88E4 100%);}
#main .sec05 .slide6 .svgBox::before {background-image: url(/img/sec05_slide6_svg1.svg);}
#main .sec05 .slide6 .svgBox::after {background-image: url(/img/sec05_slide6_svg2.svg);}
#main .sec05 .slide6:hover .img::after {background: linear-gradient(180deg, rgba(171, 174, 179, 0.00) 31.15%, #ABAEB3 88.74%);}
#main .sec05 .slide7:hover .img::after {background: linear-gradient(180deg, rgba(231, 200, 156, 0.00) 31.15%, #E7C89C 88.74%);}
#main .sec05 .slide7 .svgBox::before {width: 19.25rem; height: 22.25rem; top: -7rem; left: -13rem; background-image: url(/img/sec05_slide7_svg1.svg);}
#main .sec05 .slide7 .svgBox::after {width: 15rem; height: 25.5rem; bottom: 0.5rem; right: 1.8rem; background-image: url(/img/sec05_slide7_svg2.svg); transform: scale(1.8) rotate(19deg);}
#main .sec05 .slide7:hover .svgBox::before {top: -4rem; left: -10rem; transform: scale(1);}
#main .sec05 .slide7:hover .svgBox::after {bottom: -2.5rem; right: -3rem; transform: scale(1) rotate(0);}
#main .sec05 .slide8:hover .img::after {background: linear-gradient(180deg, rgba(181, 225, 218, 0.00) 31.15%, rgba(181, 225, 218, 0.73) 88.74%);}
#main .sec05 .slide8 .svgBox::before {width: 9.61131rem; height: 15.78125rem; top: 5rem; left: 0rem; background-image: url(/img/sec05_slide8_svg1.svg); transform: scale(2);}
#main .sec05 .slide8 .svgBox::after {width: 7.125rem; height: 15.8445rem; bottom: -2rem; right: 1rem; background-image: url(/img/sec05_slide8_svg2.svg); transform: scale(1.5);}
#main .sec05 .slide8:hover .svgBox::before {top: -1rem; left: -1rem; transform: scale(1);}
#main .sec05 .slide8:hover .svgBox::after {bottom: -1rem; right: 0rem; transform: scale(1);}
/* sec06 */
#main .sec06 {height: 56.625rem; background: url(/img/sec06_bg.jpg) no-repeat center/cover; display: flex; align-items: center;}
#main .sec06 .inner1600 {gap: 6.25rem; justify-content: space-between;}
#main .sec06 .main_tit p {opacity: 1;}
#main .sec06 ul {gap: 2.5rem;}
#main .sec06 ul li {width: 26.875rem; aspect-ratio: 0.811/1; position: relative; border: 1px solid rgba(188, 188, 188, 1);}
#main .sec06 ul li .txt {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 1.87rem 1.88rem; z-index: 2;}
#main .sec06 ul li .txt strong {font-family: var(--font-playDis); font-size: 1.875rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.05rem; text-transform: uppercase;}
#main .sec06 ul li .txt p {font-size: 1.375rem; font-weight: 600; line-height: 1.45; gap: 0.625rem;}
#main .sec06 ul li .txt p img {width: 1.375rem;}
#main .sec06 ul li::after {content: ""; width: 100%; height: 5.75rem; background: rgba(160, 140, 116, 0.80); position: absolute; left: 0; bottom: 0; transition: all .3s;}
#main .sec06 ul li:hover::after {height: 100%;}
/* sec07 */
#main .sec07 .flex {align-items: flex-start;}
#main .sec07 .left {width: 70rem;}
#main .sec07 .left .img {width: 100%; position: relative;}
#main .sec07 .left .img img {width: 100%;}
#main .sec07 .left .main_tit {position: absolute; top: 11.5rem; right: 4.38rem;}
#main .sec07 .left .main_tit h3 {font-size: 3.25rem;}
#main .sec07 .left .main_tit p {margin-top: 1.25rem; opacity: 1;}
#main .sec07 .left .main_tit a {margin-top: 1.6875rem; width: 9.375rem; aspect-ratio: 1/1; border-radius: 100%; background: rgba(159, 159, 159, 0.30); backdrop-filter: blur(5px); font-size: 1.25rem; font-weight: 400; display: inline-flex;}
#main .sec07 .left .bgTxt {margin-top: .75rem; font-size: 9.375rem; font-weight: 600; line-height: 1; text-transform: uppercase; opacity: .05; padding-left: var(--side-padding);}
#main .sec07 .right {position: relative; margin-top: 16.88rem; width: calc(100% - 70rem);}
#main .sec07 .right img {position: absolute; top: 0; right: 0; width: 63.1875rem; max-width: none; z-index: -1;}
/* sec08 */
#main .sec08 ul {margin-top: 5.625rem; display: grid; grid-template-columns: repeat(3,1fr); gap: 1.875rem;}
#main .sec08 ul li a {display: block; aspect-ratio: 1.775/1; position: relative; overflow: hidden;}
#main .sec08 ul li .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: 1.88rem 1.87rem; z-index: 1;}
#main .sec08 ul li .txt p {font-size: 1.125rem; font-weight: 500; line-height: 1.12; letter-spacing: -0.01563rem;}
#main .sec08 ul li .txt strong {display: block; margin-top: .5rem; font-size: 1.5rem; font-weight: 600; line-height: 1.29; letter-spacing: -0.025rem;}
/* sec09 */
#main .sec09 {background: #F5F5F5;}
#main .sec09 .main_tit span {font-size: 1.75rem; font-weight: 600; line-height: 1.29; letter-spacing: -0.0625rem;}
#main .sec09 .main_tit h3 {margin-top: 1.12rem; font-size: 2.8125rem;}
#main .sec09 .main_tit p {margin-top: 1.12rem;}
#main .sec09 .swiper_cont {padding-left: var(--side-padding); align-items: flex-start; gap: 1.6875rem;}
#main .sec09 .swiper .swiper-slide {overflow: hidden; position: relative;}
#main .sec09 .swiper .swiper-slide a {display: block; width: 100%; height: 100%; position: relative;}
#main .sec09 .swiper .swiper-slide::after {content: ""; width: 100%; height: 9rem; position: absolute; left: 0; bottom: 0; opacity: 0.8; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%); z-index: 1;}
#main .sec09 .swiper .swiper-slide .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: 1.87rem; z-index: 2;}
#main .sec09 .swiper .swiper-slide .txt strong {font-size: 1.625rem; font-weight: 600; line-height: 1; letter-spacing: -0.0625rem;}
#main .sec09 .swiper .swiper-slide .txt p {margin-top: 0.625rem; font-size: 1.5rem; font-weight: 600; line-height: 1; letter-spacing: -0.03125rem;}
#main .sec09 .swiper .swiper-slide .txt .flex {margin-top: .625rem; gap: 0.3125rem; display: inline-flex; padding: 0 .38rem; height: 1.625rem; border-radius: 0.3125rem; background: rgba(255, 255, 255, 0.25); font-size: 0.875rem; font-weight: 600;}
#main .sec09 .swiper .swiper-slide .txt .flex img {width: 1.0625rem;}
#main .sec09 .mySwiper {width: 100%;/*  width: calc(100% - 34.0625rem - 1.6875rem); */}
#main .sec09 .mySwiper .swiper-slide {width: 18.75rem; aspect-ratio: 0.681/1; margin-right: 1.6875rem; cursor: pointer; border-radius: 1.14681rem; /* transition: width 0.6s ease, aspect-ratio 0.6s ease; */}
#main .sec09 .pcSwiper .swiper-slide {transition: all .3s;}
#main .sec09 .pcSwiper .is-active {width: 34.0625rem; aspect-ratio: 1.048/1;}
#main .sec09 .mySwiper2 .swiper-slide {width: 100%; aspect-ratio: 1.048/1;}
#main .sec09 .mySwiper2 {width: 34.0625rem; border-radius: 1.14681rem; overflow: hidden;}
#main .sec09 .mySwiper2 .swiper-slide::after {height: 12.25rem;}
#main .sec09 .mySwiper2 .swiper-slide .txt {padding: 2.5rem;}
#main .sec09 .slider-track {min-height: 32.5rem;}
#main .sec09 .swiper_progress {margin-top: -1.56rem; padding-left: calc(var(--side-padding) + 34.0625rem); padding-right: 1.25rem;}
#main .sec09 .swiper_progress .progress-bar-wrap {width: 50rem; height: 0.125rem; background: rgba(0, 0, 0, 0.3); overflow: hidden;}
#main .sec09 .swiper_progress .progress-bar {background: #000; height: 100%; transition: width 300ms cubic-bezier(.4,0,.2,1);}
#main .sec09 .arrow.is-end {opacity: .35; cursor: auto; pointer-events: none;}
@media screen and (min-width:1025px){
    #main .sec09 .mobSwiper {display: none;}
}

/* swiper_progress */
#main .swiper_progress {gap: 3.4375rem;}
#main .swiper_progress .swiper-pagination {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; width: 50rem; height: 0.125rem; background: rgba(0, 0, 0, 0.3);}
#main .swiper_progress .swiper-pagination-progressbar-fill {background: #000;}
#main .swiper_progress .arrowBox {gap: 0.9375rem;}
#main .swiper_progress .arrow {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; display: flex; align-items: center; justify-content: center; width: 3.125rem; height: 3.125rem; border: 1px solid #000; border-radius: 100%; transition: all .3s; user-select: none;}
#main .swiper_progress .arrow::after {display: none;}
#main .swiper_progress .arrow img {width: 0.9375rem; transition: all .3s; -webkit-user-drag: none; pointer-events: none;}
#main .swiper_progress .arrow:hover {border-color: var(--bg-color); background: var(--bg-color);}
#main .swiper_progress .arrow:hover img {filter: brightness(0) invert(1);}
/* sec10 */
#main .sec10 .flex {align-items: flex-start;}
#main .sec10 .main_tit {padding-left: var(--side-padding); width: 43.81rem;}
#main .sec10 .main_tit a {display: inline-flex; align-items: center; gap: 1.25rem; font-size: 1.125rem; font-weight: 400;}
#main .sec10 .main_tit a span {display: flex; align-items: center; justify-content: center; width: 3.125rem; aspect-ratio: 1/1; border-radius: 100%; border: 1px solid #000; transition: all .3s;}
#main .sec10 .main_tit a span img {width: 1.04169rem; transition: all .3s;}
#main .sec10 .main_tit a:hover span {border-color: var(--bg-color); background: var(--bg-color);}
#main .sec10 .main_tit a:hover span img {filter: brightness(0) invert(1);}
#main .sec10 .top_swiper {width: calc(100% - 43.81rem);}
#main .sec10 .top_swiper .swiper-slide {width: 15.125rem; margin-right: 2.5rem; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);}
#main .sec10 .top_swiper .swiper-slide a {display: block; width: 100%; height: 100%;}
#main .sec10 .top_swiper .swiper-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
#main .sec10 .top_swiper .swiper_progress {margin-top: 3.13rem;}
#main .sec10 .top_swiper .swiper_progress .swiper-pagination {width: 49.125rem;}
#main .sec10 .flowSwiper {width: 100%;}
#main .sec10 .flowSwiper .swiper {width: 100%;}
#main .sec10 .flowSwiper .swiper-wrapper {transition-timing-function: linear !important;}
#main .sec10 .flowSwiper .swiper-slide {text-align: center; margin-right: 2.75rem; width: fit-content;}
#main .sec10 .flowSwiper .swiper-slide p {margin-top: 1.25rem; font-size: 1.125rem; font-weight: 400; line-height: 1.5;}
/* sec11 */
#main .sec11 {background: url(/img/sec11_bg.jpg) no-repeat center/cover;}
#main .sec11 .main_tit span {font-size: 1.75rem; font-weight: 600; line-height: 1.29; letter-spacing: -0.0625rem;}
#main .sec11 .main_tit h3 {margin-top: 1.875rem; font-size: 2.8125rem; line-height: 1.15;}
#main .sec11 ul {margin-top: 2.5rem; gap: 2.5rem; align-items: normal; max-width: 77.5rem; width: 100%; margin: 0 auto;}
#main .sec11 ul li {background: #fff; padding: 3.12rem 2.5rem; display: flex; align-items: flex-start; flex-direction: column; gap: 1.875rem;}
#main .sec11 ul li .tit span {font-size: 1.25rem; font-weight: 600; letter-spacing: -0.03125rem; line-height: 1.25;}
#main .sec11 ul li .tit strong {display: block; margin-top: .62rem; font-size: 1.75rem; font-weight: 600; line-height: 1.29;}
#main .sec11 ul li .tit p {margin-top: 1.25rem; opacity: 0.5; font-size: 1.25rem; font-weight: 400; line-height: 1.45; letter-spacing: -0.025rem;}
#main .sec11 ul li img {width: 100%;}
#main .sec11 ul li .w100 {width: 100%;}
#main .sec11 ul li a {display: flex; align-items: center; justify-content: center; width: 100%; height: 3.75rem; font-size: 1.25rem; font-weight: 600; background: #FFCD00;}
#main .sec11 ul li a.kakao span {color: #000;}
#main .sec11 ul li a + a {margin-top: 0.9375rem;}
#main .sec11 ul li a.fc-w {background: var(--bg-color);}
#main .sec11 ul li a .btn_fill {background: #616161; transition: width 0.75s, height 0.75s;}
#main .sec11 ul li a.kakao .btn_fill {background: #371A1C;}
#main .sec11 ul li a:hover .btn_fill {width: 70rem; height: 70rem;}
#main .sec11 ul li a:hover span {color: #fff;}

@media screen and (max-width:1825px){
    .inner1820 {max-width: calc(100% - 2.5rem);}
}
@media screen and (max-width:1640px){
    .inner1600 {max-width: calc(100% - 2.5rem);}
}
@media screen and (max-width:1440px){
    html {font-size: 80%;}
}
@media screen and (max-width:1280px){
    #cursor_div {display: none;}
    
    #main .swiper_progress {gap: 2rem;}
    #main .swiper_progress .swiper-pagination {width: 35rem;}

    #main .sec02 {padding-top: 0;}
    #main .sec02 .inner1820,
    #main .sec02 .right {gap: 1.25rem;}
    #main .sec04 ul li.tit .txt strong {font-size: 2.5rem;}
    #main .sec06 {height: auto;}
    #main .sec06 .inner1600 {flex-direction: column; align-items: flex-start;}
    #main .sec06 ul li {width: 50%;}
    #main .sec08 ul {gap: 1.25rem;}
    #main .sec08 ul li .txt {padding: 1.25rem;}
    #main .sec10 > .flex {gap: 1.25rem;}
    #main .sec10 .main_tit {width: 33rem;}
    #main .sec10 .top_swiper {width: calc(100% - 33rem - 1.25rem);}
    #main .sec11 ul {gap: 1.25rem;}
}
@media screen and (max-width:1225px){
    #main .sec04 ul li.cont p br {display: none;}
}
@media screen and (max-width:1024px){
    html {font-size: 100%;}

    .pc {display: none !important;}
    .mob {display: block !important;}

    .mt_10 {margin-top: .62rem;}
    .mt_15 {margin-top: .94rem;}
    .mt_16 {margin-top: 1rem;}
    .mt_20 {margin-top: 1.25rem;}
    .mt_30 {margin-top: 1.875rem;}
    .mt_40 {margin-top: 2.5rem;}
    .mt_60 {margin-top: 3.75rem;}
    .mt_64 {margin-top: 4rem;}
    .mt_70 {margin-top: 4.375rem;}
    .mt_80 {margin-top: 5rem !important;}
    .mt_100 {margin-top: 6.25rem;}
    .mt_110 {margin-top: 6.875rem;}

    .inner1820 {max-width: calc(100% - 2.5rem);}
    .inner1600 {max-width: calc(100% - 2.5rem);}

    /* header */
    #header {height: 4.375rem;}
    #header .gnb {display: none;}
    #header .logo {position: relative; top: auto; left: auto; transform: none;}
    #header .logo img {width: 7.06663rem;}
    #header .hd_until {gap: 0.75rem;}
    #header .hd_until img {width: 1.5rem;}

    /* all menu */
    .all_menu {display: none !important;}

    /* sideMenu */
    .head_bg {position: fixed; right: 0; top: 0; z-index: 10000; width: 100%; height: 100dvh;}
    .head_bg.on{display: block !important;}
    .head_bg .head_tp {align-items: flex-start; padding: 1.88rem 1.31rem 1.26rem 1.25rem;}
    .head_bg .head_bg_inner {position: relative; background: rgba(161, 140, 116, 95); width: 100%; height: 100%; display: inline-block; text-align: left;}
    .head_bg .head_bg_close img {width: 1.5rem; filter: invert(1);}
    .head_bg .head_bg_logo a{display: block;}
    .head_bg .head_bg_logo img {width:8.76688rem;}
    .head_bg .member {padding: 0 1.25rem 1rem; gap: 1rem;}
    .head_bg .member a {display: flex; align-items: center; gap: 0.25rem; color: #FFF; font-size: 0.875rem; font-weight: 500; line-height: 142.857%; letter-spacing: -0.05rem;}
    .head_bg .member a img {width: 1.25rem;}
    .head_bg .member span {display: block; width: 1px; height: 0.75rem; opacity: 0.4; background: #FFF;}
    .head_bg .menu {display: flex; height: calc(100% - 6.87rem); border-top: 1px solid rgba(255, 255, 255, 0.40);}
    .head_bg .menu .title {width: 13rem; border-right: 1px solid rgba(255, 255, 255, 0.40);}
    .head_bg .menu .title li {padding: 1rem 1.56rem 1rem .75rem; background: url(/img/head_bg_arrow.svg) no-repeat right .75rem center / 0.37881rem auto; font-size: 1rem; font-weight: 600; line-height: 1.43; border-bottom: 1px solid rgba(255, 255, 255, 0.40); color: #fff; letter-spacing: -0.05rem; font-family: var(--font-playDis);}
    .head_bg .menu .title li.on {background-color: #fff; background-image:  url(/img/head_bg_arrow_sel.svg); color: var(--bg-color);}
    .head_bg .menu .cont {width: calc(100% - 13rem); padding: 1.25rem 1rem; overflow-y: auto;}
	.head_bg .menu .cont ul{display: none; flex-direction: column; gap: 0.75rem;}
	.head_bg .menu .cont ul.on{display: flex;}
	.head_bg .menu .cont ul li > a {display: block; color: #FFF; font-size: 0.875rem; font-weight: 400; line-height: 142%; letter-spacing: -0.05rem;}
    .head_bg .menu .cont ul li > a:hover {text-decoration: underline;text-underline-offset: .2rem;}

    /* quick */
    #quick {right: .63rem; bottom: 1rem;}
    #quick a { width: 2.5rem;}
    #quick a + a {margin-top: 0.41669rem;}
    #quick a img {width: 1.25rem;}

    /* footer */
    #footer {padding-bottom: 2.87rem;}
    #footer .ft_top {height: auto; padding: 1.88rem 0;}
    #footer .ft_top .inner {gap: 1.69rem;}
    #footer .ft_use {gap: .25rem 1rem; flex-wrap: wrap;}
    #footer .ft_sns {gap: 0.44075rem;}
    #footer .ft_sns img {width: 2.125rem; min-width: 2.125rem;}
    #footer .ft_bot {padding: 1.87rem 0 0; gap: 1.25rem; flex-direction: column; align-items: flex-start;}
    #footer .ft_right {width: 100%;}
    #footer .logo img {width: 7.96875rem;}
    #footer .ft_info li {gap: 0.25rem 0.75rem; flex-wrap: wrap;}
    #footer .ft_tel {margin-top: 1.87rem; gap: .25rem 1.25rem; flex-wrap: wrap;}
    #footer .ft_tel p {gap: 0.5rem;}
    #footer .ft_tel p strong {font-size: 1.25rem;}
    #footer .ft_addr {margin-top: 2.5rem; flex-direction: column; align-items: flex-start; gap: 2.24rem;}
    #footer .ft_network {gap: 1rem; flex-direction: column; align-items: flex-start; width: 100%;}
    #footer .ft_network .tit {font-size: 1.25rem;}
    #footer .ft_network .cont {display: block; width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.60);}
    #footer .ft_network .cont > div {padding: 0 0 calc(1rem - 0.625rem); border-top: 1px solid rgba(255, 255, 255, 0.60);}
    #footer .ft_network .cont strong {padding: 1rem 0 0.625rem; font-size: 0.875rem; display: block; background: url(/img/ft_network_plus.svg) no-repeat center right/1rem;}
    #footer .ft_network .cont strong.on {background-image: url(/img/ft_network_minus.svg);}
    #footer .ft_network .cont p {margin-top: 0; padding-bottom: calc(1rem - 0.625rem); font-size: 0.875rem; opacity: 1; display: none;}
    #footer .ft_network .cont p span + span {margin-top: 0.3125rem;}
    #footer .addr_right {width: 100%;}
    #footer .addr_right > .flex {justify-content: space-between;}
    #footer .ft_site {width: 13.3125rem;}
    #footer .ft_site ul {bottom: calc(100% + 0.325rem);}
    #footer .ft_site ul li a {font-size: 0.875rem;}
    #footer .ft_today strong {font-size: 1.25rem;}
    #footer .ft_site {width: 13.3125rem; margin-top: 1.25rem;}
    #footer .copy {margin-top: 1.25rem; color: #fff;}
    #footer .copy span,
    #footer .copy {font-size: 0.875rem; text-align: left;}


    /* common  */
    #main .moveBtn {height: 3.125rem;}
    #main .moveBtn span {font-size: 1rem;}
    #main .moveBtn:hover .btn_fill {width: 30rem; height: 30rem;}
    #main .sec {padding: 3.75rem 0;}
    #main .main_tit {margin-bottom: 2.5rem;}
    #main .main_tit h3 {font-size: 1.75rem; letter-spacing: 0; line-height: 1.29;}
    #main .main_tit p {margin-top: 0.75rem; font-size: 0.875rem; letter-spacing: -0.0125rem;}

    /* visual */
    #main .visual {height: 37.5rem;}
    #main .visual .swiper-slide .vis_img img.pc {display: block !important;}
    #main .visual .swiper-slide .vis_img img.mob {display: none !important;}
    #main .visual .txts {text-align: center !important;}
    #main .visual .txts h2 {font-size: 1.375rem; letter-spacing: 0; line-height: 1.45;}
    #main .visual .txts .subTitle {margin-top: 1.25rem; font-size: 0.875rem;}
    #main .visual .txts .moveBtn {margin-top: 1.25rem;}
    #main .visual .controls {gap: 1.53125rem; bottom: 2.5rem;}
    #main .visual .pager {gap: 1.36719rem;}
    #main .visual .pager span {width: 0.27344rem; height: 0.27344rem;}
    #main .visual .pager span[class*=active] {width: 0.82031rem; height: 0.82031rem;}
    #main .visual .playBox {width: 2.1875rem;}
    #main .visual .btns button img {width: 0.76563rem;}
    /* sec01 */
    #main .sec01 .flex-jb {gap: 9.375rem; padding: 0; flex-direction: column; gap: 2.5rem;}
    #main .sec01 .item {padding: 0; gap: 0; width: 100%;}
    #main .sec01 .item span {display: flex; align-items: center; gap: 1.12rem; width: 100%;}
    #main .sec01 .item span em {font-size: 1rem; line-height: 1; display: block; min-width: fit-content;}
    #main .sec01 .item span img {min-width: fit-content; width: 100%; height: 1px;}
    #main .sec01 .item:nth-child(2) span img {transform: rotate(180deg);}
    #main .sec01 .item img {display: none;}
    #main .sec01 .item .cnt img {width: 1.37731rem; display: block;}
    #main .sec01 .item .cnt strong {font-size: 3rem; letter-spacing: -0.04375rem;}
    #main .sec01 .item:nth-of-type(odd) {text-align: right; align-items: flex-end;}
    #main .sec01 .item:nth-of-type(even) {text-align: left; align-items: flex-start;}
    #main .sec01 .item:nth-child(1) .cnt strong {min-width: auto;}
    #main .sec01 .item:nth-child(2) .cnt strong {min-width: 6.8rem;}
    #main .sec01 .item:nth-child(2) .cnt img {margin-left: 0;}
    #main .sec01 .item:nth-child(3) .cnt strong {min-width: auto;}
    #main .sec01 .item p {margin-top: 0.9375rem; font-size: 0.875rem;}
    /* sec02 */
    #main .sec02 {padding-top: 0;}
    #main .sec02 .inner1820 {gap: 1.25rem; flex-direction: column;}
    #main .sec02 .left {width: 100%;}
    #main .sec02 .right {width: 100%; grid-template-columns: repeat(2,1fr); gap: 1.25rem;}
    #main .sec02 .item a::after {height: 4.88919rem;}
    #main .sec02 .item .txt {padding: .94rem 1.25rem;}
    #main .sec02 .item .txt strong {font-size: 0.875rem; letter-spacing: 0;}
    #main .sec02 .item .txt p {margin-top: .31rem; font-size: 0.75rem; letter-spacing: -0.01413rem;}
    /* sec03 */
    #main .sec03 {height: 40.625rem; align-items: flex-end;}
    #main .sec03 .mt_60 {margin-top: 1.25rem;}
    #main .sec03 h2 {font-size: 1.75rem; letter-spacing: 0; line-height: 1.29;}
    #main .sec03 strong {font-size: 1.125rem;}
    #main .sec03 p {font-size: 0.875rem; letter-spacing: -0.0125rem;}
    /* sec04 */
    #main .sec04 ul {gap: 1.25rem; display: grid; grid-template-columns: repeat(2,1fr);}
    #main .sec04 ul li {flex: auto;}
    #main .sec04 ul li.tit {padding: 1.77rem 1.75rem; height: 100%;}
    #main .sec04 ul li.tit .txt {justify-content: space-between;}
    #main .sec04 ul li.tit .txt p {font-size: 1.125rem;}
    #main .sec04 ul li.tit .txt strong {font-size: 2.275rem; letter-spacing: -0.035rem; display: block; text-align: right; width: 100%;}
    #main .sec04 ul li.cont {padding: 1.25rem; gap: 0.875rem;}
    #main .sec04 ul li.cont .flex {align-items: flex-start; gap: 0.875rem;}
    #main .sec04 ul li.cont .img {width: 6.875rem;}
    #main .sec04 ul li.cont .tit {width: calc(100% - 6.875rem - 0.875rem);}
    #main .sec04 ul li.cont .tit span {font-size: 0.875rem; letter-spacing: -0.02188rem;}
    #main .sec04 ul li.cont .tit strong {margin-top: 0.4375rem; font-size: 1rem; letter-spacing: 0; line-height: 1.5;}
    #main .sec04 ul li.cont p {font-size: 0.875rem; min-height: auto;}
    /* sec05 */
    #main .sec05 {padding: 3.75rem 0;}
    #main .sec05 .t_desc {margin-top: .75rem;}
    #main .sec05 .swiper {margin-top: 2.5rem;}
    #main .sec05 .swiper-wrapper {padding: 0 1.25rem;}
    #main .sec05 .swiper-slide {width: 19rem; margin-right: 1.25rem;}
    #main .sec05 .swiper-slide .img::after {height: 6.65869rem;}
    #main .sec05 .swiper-slide .txt {padding: 1.12rem 1.32rem;}
    #main .sec05 .swiper-slide .txt p {font-size: 0.69725rem;}
    #main .sec05 .swiper-slide .txt strong {margin-top: 0.35rem; font-size: 0.90644rem;}
    #main .sec05 .swiper-slide .txt .flex {margin-top: 1.77rem; gap: .6rem;}
    #main .sec05 .swiper-slide .txt .flex span {font-size: 0.6275rem;}
    #main .sec05 .slide1 .svgBox::before {width: 17.125rem; height: 24.8125rem; top: -15rem; left: -9rem;}
    #main .sec05 .slide1 .svgBox::after {width: 16.9375rem; height: 22.5625rem; bottom: -12rem; right: -9rem;}
    #main .sec05 .slide1.swiper-slide-active .svgBox::before,
    #main .sec05 .slide1:hover .svgBox::before {top: -20rem; left: -9rem;}
    #main .sec05 .slide1.swiper-slide-active .svgBox::after,
    #main .sec05 .slide1:hover .svgBox::after {bottom: -15rem; right: -14rem;}
    #main .sec05 .slide2 .svgBox::before {width: 18.25rem; height: 18.25rem; top: -9.5rem; left: -6rem;}
    #main .sec05 .slide2 .svgBox::after {width: 7.125rem; height: 15.8445rem; bottom: -10.5rem; right: -1.2rem;}
    #main .sec05 .slide2.swiper-slide-active .svgBox::before,
    #main .sec05 .slide2:hover .svgBox::before {top: -9.5rem; left: -10rem; width: 15rem; height: 15rem;}
    #main .sec05 .slide2.swiper-slide-active .svgBox::after,
    #main .sec05 .slide2:hover .svgBox::after {bottom: -5.5rem; right: -3.2rem; width: 6.125rem; height: 14.5rem;}
    #main .sec05 .slide3 .svgBox::before {width: 10.25rem; height: 13.25rem; top: -3rem; left: -6rem;}
    #main .sec05 .slide3 .svgBox::after {width: 10rem; height: 18.5rem; bottom: 0.5rem; right: -0.2rem;}
    #main .sec05 .slide3.swiper-slide-active .svgBox::before,
    #main .sec05 .slide3:hover .svgBox::before {top: -5rem;left: -4rem;}
    #main .sec05 .slide3.swiper-slide-active .svgBox::after,
    #main .sec05 .slide3:hover .svgBox::after {bottom: -3.5rem;right: -2.2rem;}
    #main .sec05 .slide4 .svgBox::before {width: 6.61131rem;height: 12.78125rem;top: 3rem;}
    #main .sec05 .slide4 .svgBox::after {width: 4.125rem;height: 12.8445rem;bottom: -2rem;right: 1rem;}
    #main .sec05 .slide4.swiper-slide-active .svgBox::before,
    #main .sec05 .slide4:hover .svgBox::before {top: -1rem;left: -3rem;}
    #main .sec05 .slide4.swiper-slide-active .svgBox::after,
    #main .sec05 .slide4:hover .svgBox::after {bottom: -4rem;}
    #main .sec05 .slide1.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(238, 141, 31, 0.00) 0%, #EE8D1F 100%);}
    #main .sec05 .slide2.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(130, 226, 178, 0.00) 31.15%, #82E2B2 88.74%);}
    #main .sec05 .slide3.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(231, 156, 172, 0.00) 31.15%, #E79CAC 88.74%);}
    #main .sec05 .slide4.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(99, 90, 86, 0.00) 31.15%, #635A56 88.74%);}
    #main .sec05 .slide5.slide1.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(188, 136, 228, 0.00) 0%, #BC88E4 100%);}
    #main .sec05 .slide6.slide2.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(171, 174, 179, 0.00) 31.15%, #ABAEB3 88.74%);}
    #main .sec05 .slide7.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(231, 200, 156, 0.00) 31.15%, #E7C89C 88.74%);}
    #main .sec05 .slide8.swiper-slide-active .img::after {background: linear-gradient(180deg, rgba(181, 225, 218, 0.00) 31.15%, rgba(181, 225, 218, 0.73) 88.74%);}
    #main .sec05 .swiper-slide.swiper-slide-active .svgBox::after,
    #main .sec05 .swiper-slide:hover .svgBox::after,
    #main .sec05 .swiper-slide.swiper-slide-active .svgBox::before,
    #main .sec05 .swiper-slide:hover .svgBox::before {filter: none;}
    /* sec06 */
    #main .sec06 {height: auto; background-image: url(/img/sec06_bg_m.jpg) ;}
    #main .sec06 .inner1600 {gap: 2.5rem; flex-direction: column; align-items: flex-start;}
    #main .sec06 ul {gap: 1.75rem; width: 100%;}
    #main .sec06 ul li img.pc {display: block !important;}
    #main .sec06 ul li img.mob {display: none !important;}
    #main .sec06 ul li .txt {padding: .94rem 1.31rem;}
    #main .sec06 ul li .txt strong {font-size: 1.125rem; letter-spacing: -0.035rem;}
    #main .sec06 ul li .txt p {font-size: 0.875rem; gap: 0.625rem;}
    #main .sec06 ul li .txt p img {display: none; width: 1.375rem;}
    #main .sec06 ul li::after {height: 3.125rem;}
    /* sec07 */
    #main .sec07 .flex {position: relative; display: block; padding-bottom: .44rem;}
    #main .sec07 .left {width: calc(100% - 1.21rem);}
    #main .sec07 .left img {max-width: none;}
    #main .sec07 .left .main_tit {top: 10.38rem; right: 1.25rem;}
    #main .sec07 .left .main_tit h3 {font-size: 1.75rem;}
    #main .sec07 .left .main_tit p {margin-top: 0.875rem;}
    #main .sec07 .left .main_tit a {margin-top: 0.875rem; width: 5rem; font-size: 0.875rem;}
    #main .sec07 .left .bgTxt {margin-top: -1.25rem; font-size: 3.125rem; line-height: 2.06;}
    #main .sec07 .right {margin-top: 0; width: 100%;}
    #main .sec07 .right img {width: calc(100% - 7.5rem); top: auto; bottom: 0; max-width: none;}
    #main .sec07 .left img.pc,
    #main .sec07 .right img.pc {display: block !important;}
    #main .sec07 .left img.mob,
    #main .sec07 .right img.mob {display: none !important;}
    /* sec08 */
    #main .sec08 ul {margin-top: 0; grid-template-columns: repeat(3,1fr); gap: 0.9375rem;}
    #main .sec08 ul li a {aspect-ratio: 0.849/1;}
    #main .sec08 ul li .txt {padding: .72rem .75rem;}
    #main .sec08 ul li .txt p {font-size: 0.75rem; letter-spacing: -0.01413rem; line-height: 1.33;}
    #main .sec08 ul li .txt strong {margin-top: .28rem; font-size: 0.875rem; letter-spacing: 0; line-height: 1.43;}
    /* sec09 */
    #main .sec09 .main_tit span {font-size: 0.875rem; letter-spacing: -0.0625rem; line-height: 1.43;}
    #main .sec09 .main_tit h3 {margin-top: 1rem; font-size: 1.25rem; line-height: 1.45;}
    #main .sec09 .main_tit p {margin-top: 1rem;}
    #main .sec09 .swiper_cont {gap: 0.9375rem; flex-direction: column; padding: 0 1.25rem;}
    #main .sec09 .swiper .swiper-slide::after {height: 3.14681rem;}
    #main .sec09 .swiper .swiper-slide .txt {padding: .46rem 1rem;}
    #main .sec09 .swiper .swiper-slide .txt strong {font-size: 1rem; letter-spacing: 0; line-height: 1.43;}
    #main .sec09 .swiper .swiper-slide .txt p {margin-top: 0.3125rem; font-size: 0.875rem; letter-spacing: -0.01975rem; line-height: 1.12;}
    #main .sec09 .swiper .swiper-slide .txt .flex {margin-top: .3125rem; padding: 0 .44rem; height: 1.56rem; border-radius: 0.19725rem; font-size: 0.8125rem;}
    #main .sec09 .swiper .swiper-slide .txt .flex img {width: 0.9375rem;}
    #main .sec09 .mySwiper {width: 100%;}
    #main .sec09 .mySwiper .swiper-slide {width: 8.75rem !important; margin-right: 0.5625rem; border-radius: 0.625rem; aspect-ratio: 1.049/1;}
    #main .sec09 .mySwiper .swiper-slide strong {line-height: 1.4 !important; font-size: 0.875rem !important;}
    #main .sec09 .mySwiper .swiper-slide p,
    #main .sec09 .mySwiper .swiper-slide .flex {display: none !important;}
    #main .sec09 .mySwiper2 {width: 100%; border-radius: 0.625rem;}
    #main .sec09 .mySwiper2 .swiper-slide::after {height: 7.75rem;}
    #main .sec09 .mySwiper2 .swiper-slide .txt {padding: 1.22rem 1.23rem;}
    #main .sec09 .swiper_progress {margin-top: 0.9375rem; padding-left: 0;}
    #main .sec09 .pcSwiper {display: none;}
    /* swiper_progress */
    #main .swiper_progress {gap: 1.25rem;}
    #main .swiper_progress .swiper-pagination {width: 12.50938rem;}
    #main .swiper_progress .arrowBox {gap: 0.6375rem;}
    #main .swiper_progress .arrow {width: 2.125rem; height: 2.125rem;}
    #main .swiper_progress .arrow img {width: 0.6375rem;}
    /* sec10 */
    #main .sec10 > .flex {flex-direction: column; align-items: flex-start; gap: 2.5rem;}
    #main .sec10 .main_tit {width: 100%; margin-bottom: 0;}
    #main .sec10 .main_tit a {gap: 0.75rem; font-size: 0.875rem;}
    #main .sec10 .main_tit a span {width: 2rem;}
    #main .sec10 .main_tit a span img {width: 0.66669rem;}
    #main .sec10 .top_swiper {width: 100%; padding: 0 1.25rem;}
    #main .sec10 .top_swiper .swiper-slide {width: 12.5rem; margin-right: 1.25rem;}
    #main .sec10 .top_swiper .swiper_progress .swiper-pagination {width: 12.50938rem;}
    #main .sec10 .flowSwiper {margin-top: 2.5rem;}
    #main .sec10 .flowSwiper .swiper-slide {text-align: center; margin-right: 1.5625rem;}
    #main .sec10 .flowSwiper .swiper-slide span {display: flex; align-items: flex-start; justify-content: center; height: 4.5rem;}
    #main .sec10 .flowSwiper .swiper-slide img {max-width: 77%; max-height: 100%;}
    #main .sec10 .flowSwiper .swiper-slide p {margin-top: 0.855rem; font-size: 0.875rem; line-height: 1.5;}
    /* sec11 */
    #main .sec11 .main_tit span {font-size: 1rem; letter-spacing: -0.0625rem;}
    #main .sec11 .main_tit h3 {margin-top: 1rem; font-size: 1.5rem;}
    #main .sec11 ul {gap: 1.25rem; max-width: 100%;}
    #main .sec11 ul li {padding: 1.25rem; gap: 1.075rem;}
    #main .sec11 ul li .tit span {font-size: 0.875rem; letter-spacing: -0.02188rem;}
    #main .sec11 ul li .tit strong {margin-top: 0.35831rem; font-size: 1rem;}
    #main .sec11 ul li .tit p {margin-top: 0.71669rem; font-size: 0.875rem; letter-spacing: 0;}
    #main .sec11 ul li a { height: 3.125rem; font-size: 1rem;}
    #main .sec11 ul li a + a {margin-top: 0.5375rem;}
}
@media screen and (max-width:768px){
    /* visual */
    #main .visual .swiper-slide .vis_img img.pc {display: none !important;}
    #main .visual .swiper-slide .vis_img img.mob {display: block !important;}
    /* sec02 */
    #main .sec02 .right {grid-template-columns: repeat(1,1fr);}
    /* sec03 */
    #main .sec03 {background-image: url(/img/sec03_bg_m.jpg);}
    /* sec04 */
    #main .sec04 ul {grid-template-columns: repeat(1,1fr);}
    #main .sec04 ul li.tit {height: 12.5rem;}
    /* sec06 */
    #main .sec06 ul {flex-direction: column;}
    #main .sec06 ul li {width: 100%; aspect-ratio: 1.376/1;}
    #main .sec06 ul li img.pc {display: none !important;}
    #main .sec06 ul li img.mob {display: block !important;}
    /* sec07 */
    #main .sec07 .left img.pc,
    #main .sec07 .right img.pc {display: none !important;}
    #main .sec07 .left img.mob,
    #main .sec07 .right img.mob {display: block !important;}
    /* sec08 */
    #main .sec08 ul {grid-template-columns: repeat(2,1fr);}
    /* sec11 */
    #main .sec11 {background-image: url(/img/sec11_bg_m.jpg);}
    #main .sec11 ul {flex-direction: column;}
    #main .sec11 ul li {width: 100%;}
}