@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 
 
#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

.only-desktop {display:block;}
.only-desktop-tablet {display:block;}
.only-tablet-mobile {display:none;}
.only-tablet {display:none;}
.only-mobile {display:none;}

.contain {max-width:1260px; margin:0 auto; padding-right:var(--space-container); padding-left:var(--space-container);}

#wrapper {position:relative;}
#container {overflow: hidden;}

/* header */
#header {position:fixed; top:0; left:0; z-index:101; width:100%; height:var(--header-height); padding:0 60px; background: #fff; transition:.2s;}
#header .contain {display:flex; align-items:center; justify-content:space-between; width:100%; max-width: 1720px; height:100%; padding:0; z-index:2;}
.header-pc {height: 100%;}

.header-fixed #header {box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.16);}

.sitelogo a {display:block; aspect-ratio:221/54; height:clamp(30px, calc(54 / var(--inner) * 100vw), 54px); background:url('/images/common/logo.svg') no-repeat center / contain;}

#gnb {flex:1 0 auto; min-width:0; text-align:center; padding:0 var(--space-30); margin-right: var(--space-50);}
#gnb>ul {display:flex; justify-content:flex-end; gap: var(--space-140);} 
#gnb>ul>li {position:relative;} 
#gnb>ul>li>a {position:relative; display:flex; align-items:center; flex-direction:column; justify-content:center; height:var(--header-height); font-family: 'Paperlogy', sans-serif; color:#242424; font-size:var(--font-size-20); font-weight:700; letter-spacing:-.03em; line-height:1.3em;}
#gnb>ul>li.none {position: absolute; overflow: hidden; width: 0; height: 0; margin: 0; padding: 0; font-size: 0; line-height: 0;}
#gnb>ul>li.active > a {color:var(--color-primary);}
#gnb .submenu {position:absolute; left:-40px; right:-40px; height:0; overflow:hidden; text-align:center; display: none;}
#gnb .submenu>ul {padding:30px 0;}
#gnb .submenu>ul>li>a {display:block; padding:10px 0; color:#454545; font-size:16px; line-height:1.25em;}
#gnb .submenu>ul>li>a:hover {text-decoration:underline; font-weight:600; color:var(--color-primary);}
.submenu-bg {display:none; position:absolute; width:100%; left:0; background:#fff; border-top:1px solid #ddd; border-bottom:1px solid #eee;}

.submenu-wrap {position: absolute; top: 100%; left: 0; width: 100%; z-index: 20; background: #fff; border-radius: 0 0 var(--radius-32) var(--radius-32); box-shadow: 0 10px 8px -6px rgba(0, 0, 0, 0.12); overflow: hidden; border-top: 1px solid #ddd; padding: 0 var(--space-100); display: none;}
.submenu-list {max-width: 1720px; margin: 0 auto; width: 100%;}
.submenu-list>ul {display: flex; justify-content: center;}
.submenu-list>ul>li {padding: var(--space-40); width: 25%; background: #fff; position: relative;}
.submenu-list>ul>li:after {position:absolute; content:''; top:0; bottom:0; background-color:#ddd; width:1px; right:0;}
.submenu-list>ul>li:last-child:after {display:none;}
.submenu-list>ul>li .tit {padding-bottom: var(--space-20); margin-bottom: var(--space-25); border-bottom:1px solid #242424;}
.submenu-list>ul>li .tit a {font-size:var(--font-size-20); font-weight:600; line-height:1.1; color:#242424;}
.submenu-list>ul>li:hover .tit a {color:var(--color-quaternary); font-weight: 700;}
.submenu-list .sub li {font-size:var(--font-size-16); margin: var(--space-15) 0; letter-spacing:-.03em; line-height:1.3em; text-align:right;}
.submenu-list .sub li:last-child {margin-bottom:0;}
.submenu-list .sub li a {position:relative; transition: color .3s;}
.submenu-list .sub li:hover {color:var(--color-tertiary); font-weight:600;}
.submenu-list .sub li:hover a:after {width:15px; height:5px; left:-30px; top:50%; transform:translateY(-50%); background-image:url('../images/common/hd-dot.svg'); background-size:contain; background-repeat:no-repeat; position:absolute; content:'';}

#header .top-right {display:flex; align-items:center; margin-left: auto;}
#header .members {display: flex; align-items: center; justify-content: center;}
#header .members a {width: clamp(70px, calc(90 / var(--inner) * 100vw), 90px); height: clamp(30px, calc(38 / var(--inner) * 100vw), 38px); background:#fff; color:#868686; font-size:var(--font-size-15); font-weight:600; line-height:1.2; display:flex; align-items:center; justify-content:center; border-radius: 38px; border: 1px solid transparent;}
#header .members .btn-login {color: #fff; background: var(--color-tertiary); border-color: var(--color-tertiary);}
#header .language {margin-left: var(--space-26); color: #686868; position: relative; padding: var(--space-8) 0;}
#header .language span {display: flex; align-items: center; justify-content: center; gap: 2px; background: transparent; border: 0; padding: 0 2px 0 4px; line-height: 1.2; cursor: pointer;}
#header .language span::before {content: ''; width: 18px; height: 18px; background: url('/images/common/language-global.svg') no-repeat center / contain;}
#header .language span::after {content: ''; width: 16px; height: 16px; background: url('/images/common/language-arrow.svg') no-repeat center / contain;}
#header .language ul {display: none; position: absolute; top: 100%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100%; text-align: center; background: var(--color-primary); padding: var(--space-8); border-radius: 0 0 var(--radius-8) var(--radius-8); z-index: 30;}
#header .language ul a {color: #bcdeb5; font-size: var(--font-size-14); font-weight: 500; line-height: 1.75; display: block;}
#header .language ul .active a {color: #fff;}
#header .search {margin: 0 var(--space-20);}
#header .search a {display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;}
#header .search a img {width: 100%; height: 100%; object-fit: contain;}

#header .members .btn-join:hover {color: var(--color-primary);}
#header .members .btn-login:hover {background: #fff; color: var(--color-tertiary);}

.header-fixed #header {background:#fff; box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.16);}
.header-fixed .sitelogo a {background-image:url('/images/common/logo.svg');}
.header-fixed #gnb>ul>li>a {color:#2c2c2c;}
.header-fixed .btn-m-menu span {background:#2c2c2c;}

.all-menu {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; z-index: 103; transition: all .3s; transform: translateX(100%);}
.all-menu.active {transform: translateX(0);}
.all-menu .nav-wrap {display: flex; align-items: center; width: 100%; height: 100%; padding: var(--space-100) var(--space-200);}
.all-menu .nav {width: 100%; text-align: center;}
.all-menu .nav > ul {display: flex; justify-content: space-evenly;}
.all-menu .nav > ul > li > a {display: block; padding: var(--space-20) 0; font-size: var(--font-size-50); font-weight: 700; line-height: 1.3em; color: #2c2c2c; font-family: 'Paperlogy', sans-serif;}
.all-menu .nav .submenu > ul > li > a {display: inline-block; padding: var(--space-10) 0; font-size: var(--font-size-26); font-weight: 500; line-height: 1.3em; color: #2c2c2c; font-family: 'Paperlogy', sans-serif; position: relative;}
.all-menu .nav .submenu > ul > li > a:hover {color: var(--color-tertiary);}
.all-menu .close {position: absolute; top: var(--space-80); right: var(--space-80); width: 44px; height: 44px; overflow: hidden; color: #505050; transition: all .3s; padding: 10px;}
.all-menu .close:hover {color: #000;}

/* for mobile */ 
.btn-m-menu {position:relative; width:32px; height:32px;}
.btn-m-menu div {display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:6px; width:100%; height:100%; padding: 4px;}
.btn-m-menu span {display:block; width:100%; height:3px; background:#2c2c2c;}

.mobile-navigation {position:fixed; top:0; right:0; width:300px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {display:flex; align-items:center; height:var(--header-height); padding:0 20px; border-bottom:1px solid #ddd;;}
.mobile-navigation .home img {height:clamp(34px, calc(50 / var(--inner) * 100vw), 50px);}
.mobile-navigation .members {display:flex; align-items:center; height:var(--header-height); border-bottom:1px solid #ddd;}
.mobile-navigation .members a {width: 90px; height: 34px; background:#fff; color:#868686; font-size:var(--font-size-15); font-weight:600; line-height:1.2; display:flex; align-items:center; justify-content:center; border-radius: 38px; border: 1px solid transparent;}
.mobile-navigation .members .btn-login {color: #fff; background: var(--color-tertiary); border-color: var(--color-tertiary);}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li.member {position: absolute; overflow: hidden; width: 0; height: 0; margin: 0; padding: 0; font-size: 0; line-height: 0;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:12px 48px 12px 20px; display:block; color:#242424; font-size:18px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:11px; height:11px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:var(--color-primary);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; background:#f8f8f8; color:#454545; font-size:15px; font-weight:400; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:12px 20px;}
.mobile-navigation .nav-menu .submenu ul li a:hover {color:var(--color-primary);}
.mobile-navigation .close {position:absolute; top:15px; right:15px; width:26px; height:26px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:3px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}

/* main */
#main section {padding: var(--space-60) 0;}
#main section .contain {max-width: 1460px;}
#main .main-visual-wrap {padding: 0; margin-top: var(--header-height);}
#main .main-visual-wrap .contain {max-width: 1780px; display: flex; align-items: center; justify-content: center; gap: var(--space-30);}
.main-visual-wrap .left {width: 72.675%; height: clamp(300px, calc(610 / var(--inner) * 100vw), 610px); max-height: 610px; aspect-ratio: 1250/610;}
.main-visual {position:relative; overflow:hidden; height: 100%;}
.main-visual .slick-slider {height:100%;}
.main-visual .slick-list {height:100%;}
.main-visual .slick-track {height:100%;}
.main-visual .slick-slide {position:relative; height:100%; overflow:hidden;}
.main-visual .item {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; border-radius: var(--radius-32);}
.main-visual .item .video-js,
.main-visual .item video {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.main-visual .item iframe {position:absolute; top:50%; left:50%; width:100vw; height: clamp(300px, calc(610 / var(--inner) * 100vw), 610px); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); max-width: 1250px;}
.main-visual .item img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition: 5s linear;}
.main-visual .caption {position:absolute; top:50%; left: var(--space-80); width: calc(100% - var(--space-80) * 2); display:flex; align-items: flex-start; flex-direction:column; gap: var(--space-30); -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.main-visual .caption .tit {font-family: 'GmarketSans', sans-serif; color: #242424; font-size: var(--font-size-50); font-weight: 700; line-height: 1.36; letter-spacing:-.03em;}
.main-visual .caption .tit span {display: block;}
.main-visual .caption .tit1 {color: var(--color-primary);}
.main-visual .caption .txt {color: #454545; font-size: var(--font-size-16); line-height: 1.75; letter-spacing:-.03em;}
.main-visual .caption .btn-more {display: inline-flex; align-items: center; justify-content: center; padding: var(--space-15) var(--space-18); background: #fff; color: var(--color-quaternary); font-size: var(--font-size-15); font-weight: 600; line-height: 1.2; border-radius: 30px; margin-top: var(--space-30);}
.main-visual .caption .btn-more .icon {display: flex; align-items: center; justify-content: center; width: 12px; height: 12px; margin-left: var(--space-10); color: inherit; padding-bottom: 1px;}
.main-visual .caption .btn-more:hover {background: var(--color-quaternary); color: #fff;}
.main-visual .ani {transition:1.2s; transform:translate(100px, -50%); opacity:0;}
.main-visual .first-slide .ani {opacity:1; transform:translate(0, -50%); animation:first-slide-cap 1.2s ease forwards; -webkit-animation:first-slide-cap 1.2s ease forwards; animation-delay:0.15s;}
.main-visual .slick-active .ani {opacity:1; transform:translate(0, -50%);}

.main-visual .controls {position: absolute; bottom: 0; right: 0; z-index: 10; background: url('/images/main/visual-controls-bg.svg') no-repeat right bottom / contain; padding: 40px 0 0 40px;}
.main-visual .controls .pager {display: flex; align-items: center; justify-content: center; background: var(--color-quaternary); font-family: 'Paperlogy', sans-serif; color: #71946a; font-size: var(--font-size-15); font-weight: 700; line-height: 1.2; width: 150px; height: 60px; border-radius: 60px;}
.main-visual .controls .btn {display: flex; align-items: center; justify-content: center; width: 15px; height: 15px; background: transparent; border: 0;}
.main-visual .controls .nums {display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 20px;}
.main-visual .controls .nums .dot {width: 3px; height: 3px; background: #71946a; border-radius: 50%;}
.main-visual .controls .nums .current {color: #fff;}

/* @media (min-aspect-ratio: 16/9) {
.main-visual .item iframe {height:56.25vw;}
}
@media (max-aspect-ratio: 16/9) {
.main-visual .item iframe {width:177.78vh;}
} */
@keyframes first-slide-cap {
	0% {opacity:0; transform:translate(100px, -50%); -webkit-transform:translate(100px, -50%);}
	100% {opacity:1; transform:translate(0, -50%); -webkit-transform:translate(0, -50%);}
}
	
.main-visual-wrap .right {width: calc(30% - var(--space-30));}
.main-visual-wrap .banner {display: flex; flex-direction: column; gap: var(--space-30); height: 100%;}
.main-visual-wrap .banner .item a {display: block; width: 100%; overflow: hidden; border-radius: var(--radius-16);}
.main-visual-wrap .banner .item .img {width: 100%; height: 0; padding-bottom: 95.455%; position: relative; overflow: hidden;}
.main-visual-wrap .banner .item .img img {position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: cover;}
.main-visual-wrap .banner .txt-wrap {display: flex; align-items: center; justify-content: space-between; padding: var(--space-20) var(--space-40); background: var(--color-secondary);}
.main-visual-wrap .banner .tit {font-family: 'Paperlogy', sans-serif; color: #fff; font-size: var(--font-size-24); font-weight: 700; line-height: 1.66;}
[lang="en"] .main-visual-wrap .banner .tit {font-size: var(--font-size-20); line-height: 1.3;}
.main-visual-wrap .banner .item.directions .txt-wrap {background: var(--color-tertiary);}

#main section {overflow: hidden;}
#main section .head {margin-bottom: var(--space-40); display: flex; align-items: center; justify-content: center;}
#main section .head h2 {font-family: 'Paperlogy', sans-serif; color: inherit; font-size: var(--font-size-40); font-weight: 700; line-height: 1.5; flex: 1;}
[lang="en"] #main section .head h2 {line-height: 1.1;}
#main section .head .btn-more {display: flex; align-items: center; justify-content: center; color: #868686; width: var(--space-48); height: var(--space-48); border: 1px solid #dbdbdb; border-radius: var(--radius-8); transition: all .3s;}
#main section .head .btn-more svg {transition: all .3s;}
#main section .head .btn-more:hover {background: var(--color-tertiary); border-color: var(--color-tertiary); color: #fff;}

.main-scholarship .head {color: #242424; text-align: center;}
.main-scholarship .items {display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr;}
.main-scholarship .item {position: relative; width: 100%; height: 100%;}
.main-scholarship .item a {padding: var(--space-40) var(--space-30) var(--space-30) var(--space-40); display: flex; width: 100%; height: 100%;}
.main-scholarship .item a::before {content: ''; width: calc(100% - 40px); height: calc(100% - 40px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 var(--space-20) 0 rgba(0, 0, 0, 0.16); border-radius: var(--radius-24); transition: all .2s; background: #fff; z-index: 1; opacity: 0;}
.main-scholarship .item::before {content: ''; width: 89.3%; height: 1px; background: #ddd; position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 0;}
.main-scholarship .item:nth-child(3n+1)::before {width: 94.65%; left: 0; transform: translateX(0);}
.main-scholarship .item:nth-child(3n)::before {width: 94.65%; left: initial; transform: translateX(0); right: 0;}
.main-scholarship .item::after {content: ''; width: 1px; height: 83.33%; background: #ddd; position: absolute; top: 50%; right: 0; transform: translateY(-50%); z-index: 0;}
.main-scholarship .item:nth-child(3n)::after {content: none;}
.main-scholarship .item:nth-last-child(-n+3) a::after {content: ''; width: 89.3%; height: 1px; background: #ddd; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 0;}
.main-scholarship .item:nth-child(3n+1) a::after {width: 94.65%; left: 0; transform: translateX(0);}
.main-scholarship .item:nth-child(3n) a::after {width: 94.65%; left: initial; transform: translateX(0); right: 0;}
.main-scholarship .item .txt-wrap {position: relative; z-index: 2;}
.main-scholarship .item .tags {display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-8); margin-bottom: var(--space-20);}
.main-scholarship .item .tags .type {display: inline-flex; align-items: center; justify-content: center; border: 1px solid #bcdeb5; border-radius: var(--radius-8); padding: var(--space-6) var(--space-10); color: var(--color-primary); font-size: var(--font-size-15); font-weight: 600; line-height: 1.2; transition: all .3s;}
.main-scholarship .item .tags .day {display:inline-flex;align-items:center;justify-content:center;padding: var(--space-6) var(--space-10);border-radius:var(--radius-8);background:var(--color-primary);color:#fff;font-size:var(--font-size-15);font-weight:700; line-height: 1.2; border: 1px solid var(--color-primary);}
.main-scholarship .item .tit {font-family: 'Paperlogy', sans-serif; color: #242424; font-size: var(--font-size-24); font-weight: 700; line-height: 1.33; margin-bottom: var(--space-20); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.main-scholarship .item .info-list li {display: flex; align-items: flex-start; line-height: 1.87;}
.main-scholarship .item .info-list .lbl {color: #454545; font-weight: 500; margin-right: 10px;}
.main-scholarship .item .info-list .val {color: #686868;}
[lang="en"] .main-scholarship .item .info-list li {margin-bottom: 10px; line-height: 1.3;}
[lang="en"] .main-scholarship .item .info-list li:last-child {margin-bottom: 0;}
[lang="en"] .main-scholarship .item .info-list .lbl {width: 80px; flex: 0 0 auto;}
[lang="en"] .main-scholarship .item .info-list .val {flex: 0 1 auto;}
.main-scholarship .item .status-wrap {margin: auto 0 0 auto; padding: 5px; position: absolute; z-index: 2; right: var(--space-20); bottom: var(--space-20);}
.main-scholarship .item .status {width: clamp(60px, calc(76 / var(--inner) * 100vw), 76px); height: clamp(60px, calc(76 / var(--inner) * 100vw), 76px); border-radius: 100%; display: flex; align-items: center; justify-content: center; color: #a9a9a9; font-family: 'Paperlogy', sans-serif; font-weight: 700; line-height: 1.25; text-align: center; background: #ebebeb; padding: var(--space-20); word-break: normal; position: relative;}
.main-scholarship .item .status::after {content: ''; width: calc(100% + 14px); height: calc(100% + 14px); border: 3px solid transparent; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 0; border-radius: 50%;}
.main-scholarship .item .status.soon {background: var(--color-secondary); color: #fff;}
.main-scholarship .item .status.soon::after {border: 2px dashed var(--color-secondary);}
.main-scholarship .item .status.ing {word-break: keep-all; background: var(--color-tertiary); color: #fff;}
.main-scholarship .item .status.ing::after {border-color: #ffd6b3;}
.main-scholarship .item:hover a::before {width: calc(100% + 40px); height: calc(100% + 40px); opacity: 1;}
.main-scholarship .item:hover .tags .type {background: var(--color-primary); color: #fff; border-color: var(--color-primary);}

.main-biznotice {position: relative;}
.main-biznotice::before {content: ''; position: absolute; z-index: 0; top: 0; bottom: 0; left: max(0px, calc(50vw - 1720px / 2)); right: 0; border-radius: 160px 0 0 0; background: #1cac00 url('/images/main/biznotice-bg.svg') no-repeat right max(-100px, calc(50vw - (1720px / 1.65))) top / auto 123%; pointer-events: none;}
.main-biznotice .contain {position: relative; z-index: 1; display: flex; align-items: flex-start; gap: var(--space-50);}
#main .main-biznotice .head h2 {color: #fff;}
.main-biznotice .head h2 span {position: relative;}
.main-biznotice .head h2 span::after {content: ''; width: 60px; height: 18px; position: absolute; top: 50%; right: -80px; transform: translateY(-50%); background: url('/images/main/biznotice-tit.svg') no-repeat center / contain;}
#main .main-biznotice .head .btn-more {color: #fff;}
#main .main-biznotice .head .btn-more:hover {background: var(--color-tertiary); border-color: var(--color-tertiary);}
.biznotice-wrap .items {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-30);}
.biznotice-wrap .item a {width: 100%; height: 100%; display: flex; flex-direction: column; background: #fff; border-radius: var(--radius-16); padding: var(--space-30); box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10); position: relative;}
.biznotice-wrap .item a::after {content: ''; position: absolute; inset: 0; width: 100%; height: 100%; border: 2px solid var(--color-tertiary); border-radius: var(--radius-16); opacity: 0; transition: all .2s;}
.biznotice-wrap .item .date {display: flex; align-items: center; margin-bottom: var(--space-20);}
.biznotice-wrap .item .date .icon {width: 14spx; height: 14spx; margin-right: 5px; display: flex; align-items: center; justify-content: center;}
.biznotice-wrap .item .date .icon img {width: 100%; height: 100%; object-fit: contain;}
.biznotice-wrap .item .date .val {color: #868686; font-size: 12px; font-weight: 500; line-height: 1;}
.biznotice-wrap .item .tit {color: #242424; font-size: var(--font-size-18); font-weight: 600; line-height: 1.7em; margin-bottom: var(--space-20); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: calc(1.7em * 2); box-sizing: content-box;}
.biznotice-wrap .item .txt {color: #686868; font-size: var(--font-size-14); line-height: 1.7em; padding-top: var(--space-20); border-top: 1px solid #ddd; height: calc(1.7em * 2); box-sizing: content-box; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.biznotice-wrap .item:hover a::after {opacity: 1;}

.biznotice-popup {width: clamp(200px, calc(307 / var(--inner) * 100vw), 307px);  flex-shrink:0; margin-top:5px;}
.biznotice-popup .items {border-radius: var(--space-40) var(--radius-16)  var(--radius-16)  var(--radius-16); overflow: hidden; width: 100%; height: clamp(203px, calc(311 / var(--inner) * 100vw), 311px);}
.biznotice-popup .controls {transform: translateY(-50%);}
.biznotice-popup .item .img {width: 100%; height: 100%;}
.biznotice-popup .item .img img {width: 100%; height: 100%; object-fit: cover;}
.biznotice-popup .controls .pager {display: flex; align-items: center; justify-content: center; background: #fff; border-radius: var(--radius-16) 60px 60px 100px; width: 162px; height: 44px; padding: 0 var(--space-25);}
.biznotice-popup .controls .btn {background: transparent; border: 0; width: 15px; height: 15px; display: flex; align-items: center; justify-content: center;}
.biznotice-popup .controls .btn img {width: 100%; height: 100%; object-fit: contain;}
.biznotice-popup .controls .nums {font-family: 'Paperlogy', sans-serif; color: #a0b79b; font-size: var(--font-size-15); font-weight: 700; line-height: 1; display: flex; align-items: center; justify-content: center; margin: 0 10px; gap: 6px;}
.biznotice-popup .controls .nums .dot {width: 3px; height: 3px; border-radius: 50%; background: #a0b79b;}
.biznotice-popup .controls .current {color: var(--color-quaternary);}
.biznotice-popup .controls .toggle {margin-left: auto;}

.main-links .contain {display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-30);}
.main-links .links {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-30);}
.main-links .item a {display: block; width: 100%; height: 100%; padding: var(--space-30) var(--space-60); text-align: center; border-radius: var(--radius-16); border: 1px solid #ddd; background: #fff; position: relative;}
.main-links .item a::after {content: ''; position: absolute; inset: -1px; border-radius: var(--radius-16); border: 4px solid var(--color-tertiary); opacity: 0; transition: all .3s;}
.main-links .item .img {width: clamp(70px, calc(96 / var(--inner) * 100vw), 96px); height: clamp(70px, calc(96 / var(--inner) * 100vw), 96px); margin-bottom: var(--space-12);}
.main-links .item .img img {width: 100%; height: 100%; object-fit: contain;}
.main-links .item .tit {font-family: 'Paperlogy', sans-serif; color: #242424; font-size: var(--font-size-20); font-weight: 700; line-height: 1.4;}
.main-links .item:hover a::after {opacity: 1;}
.main-links .asklist {flex: 1 0 auto;}
.main-links .asklist a {position: relative; border-radius: var(--radius-16); background: #156e02; padding: var(--space-35); display: block; height: 100%;}
.main-links .asklist .img {position: absolute; right: 0; bottom: 0; width: clamp(120px, calc(288 / var(--inner) * 100vw), 288px); height: clamp(99px, calc(237 / var(--inner) * 100vw), 237px);}
.main-links .asklist .img img {width: 100%; height: 100%; object-fit: contain;}
.main-links .asklist .txt-wrap {width: 70%; color: #fff;}
.main-links .asklist .tit {font-family: 'Paperlogy', sans-serif; color: #fff; font-size: var(--font-size-36); font-weight: 700; line-height: 1.2; margin-bottom: var(--space-30);}
[lang="en"] .main-links .asklist .tit {font-size: var(--font-size-30);}
.main-links .asklist .tit span {color: #21c400;}
.main-links .asklist .desc {line-height: 1.62; margin-top: auto;}
.main-links .asklist .desc .highlight {font-weight: 700; position: relative; z-index: 1; white-space: nowrap;}
.main-links .asklist .desc .highlight::after {content: ''; position: absolute; left: -3px; bottom: -2px; right: -3px; height: 55%; background: #448b35; z-index: -1;}

.main-notice {background: #fafcf9;}
.main-notice .head h2 span {position: relative;}
.main-notice .head h2 span::after {content: ''; width: 60px; height: 18px; position: absolute; top: 50%; right: -80px; transform: translateY(-50%); background: url('/images/main/notice-tit.svg') no-repeat center / contain;}
.main-notice .items {display: grid; grid-template-columns: repeat(1, 1fr); gap: var(--space-30);}
.main-notice .item {width: 100%;}
.main-notice .item a {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: var(--space-25) var(--space-50); border: 1px solid #bcdeb5; border-radius: var(--radius-16); background: #fff; position: relative;}
.main-notice .item a::after {content: ''; position: absolute; inset: -1px; border: 2px solid var(--color-tertiary); border-radius: var(--radius-16); transition: all .3s; pointer-events: none; opacity: 0;}
.main-notice .item .new {color: var(--color-primary); font-size: var(--font-size-20); font-weight: 800; line-height: 1.3; margin-right: var(--space-45); transition: all .3s;}
.main-notice .item .tit {color: #242424; font-size: var(--font-size-22); font-weight: 600; line-height: 38px; flex: 1; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.main-notice .item .file {width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #f8f8f8; margin-left: var(--space-45); color: #868686; transition: all .3s;}
.main-notice .item .file svg {width: 24px; height: 24px;}
.main-notice .item .date {color: #868686; font-weight: 500; line-height: 1.6; margin-left: var(--space-45);}
.main-notice .item:hover a::after {opacity: 1;}
.main-notice .item:hover .new {color: var(--color-secondary);}
.main-notice .item:hover .file {background: var(--color-tertiary); color: #fff;}

#main .main-gallery .head {text-align: center; margin-bottom: var(--space-70);}
.main-gallery .head h2 span {color: var(--color-primary);}
.main-gallery .slick-list {margin: 0 calc(var(--space-30) * -1);}
.main-gallery .slick-slide {margin: 0 var(--space-30);}
.main-gallery .item a {width: 100%; height: 100%; display: block; border-radius: var(--radius-32); overflow: hidden; position: relative;}
/* .main-gallery .item a::after {content: ''; width: 100%; height: 100%; position: absolute; inset: 0; border: 4px solid var(--color-tertiary); border-radius: var(--radius-32); opacity: 0; transition: all .3s;} */
.main-gallery .item:hover a::after {opacity: 1;}
.main-gallery .item .img {width: 100%; height: 0; padding-bottom: 60.89%; position: relative;}
.main-gallery .item img {width: 100%; height: 100%; object-fit: cover; transition: all .3s; position: absolute;}
.main-gallery .item:hover img {transform: scale(1.05);}
.main-gallery .slick-dots {text-align: center; display: flex; align-items: center; justify-content: center; gap: var(--space-10); margin-top: var(--space-30); height: 12px;}
.main-gallery .slick-dots li {height: 100%; line-height: 0; font-size: 0;}
.main-gallery .slick-dots button {border: 0; font-size: inherit; background: #e1e1e1; border-radius: 12px; width: 12px; height: 100%; transition: all .3s;}
.main-gallery .slick-dots .slick-active button {width: 24px; background: var(--color-primary);}

.main-gallery .cont {position: relative;}
.main-gallery .decoration {position: absolute; left: 0; top: 0; width: 100%; height: calc(100% - var(--space-30) - 12px); user-select: none; pointer-events: none;}
.main-gallery .decoration .area {position: absolute; width: calc((100% - 4 * var(--space-30)) / 3); height: 100%;}
.main-gallery .decoration .area img {position: absolute; z-index: 1;}
.main-gallery .decoration .area .img1 {width: clamp(68px, calc(98 / var(--inner) * 100vw), 98px); height: clamp(22px, calc(32 / var(--inner) * 100vw), 32px); top: 0; left: clamp(22px, calc(42 / var(--inner) * 100vw), 42px); transform: translateY(-100%);}
.main-gallery .decoration .area .img2 {width: clamp(39px, calc(56 / var(--inner) * 100vw), 56px); height: clamp(39px, calc(55 / var(--inner) * 100vw), 55px); top: 0; right: 0; transform: translate(35%, -35%);}
.main-gallery .decoration .area2 {right: 0;}
.main-gallery .decoration .area .img3 {width: clamp(44px, calc(78 / var(--inner) * 100vw), 78px); height: clamp(38px, calc(66 / var(--inner) * 100vw), 66px); bottom: 0; left: 0; transform: translate(-22%, 50%);}
.main-gallery .decoration .area .img4 {width: clamp(46px, calc(71 / var(--inner) * 100vw), 71px); height: clamp(41px, calc(65 / var(--inner) * 100vw), 65px); top: 0; right: clamp(24px, calc(48 / var(--inner) * 100vw), 48px); transform: translateY(-100%);}

/* sub */
.sub-visual {position:relative; display:flex; flex-direction:column; background:#eee; height:clamp(300px, calc(550 / var(--inner) * 100vw), 550px); overflow:hidden;}
.sub-visual .bg {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:1s; transform:scale(1.1); opacity:0;}
.sub-visual .title {position:relative; flex:1 1 auto; min-height:0; height:1%; display:flex; align-items:center; text-align:center;}
.sub-visual .title .contain {width:100%;}
.sub-visual .title h2 {font-size:clamp(28px, calc(56 / var(--inner) * 100vw), 56px); line-height:1.3em; color:#fff;}
.sub-visual .title p {margin-top:var(--space-24); font-size:clamp(14px, calc(18 / var(--inner) * 100vw), 18px); line-height:1.5em; color:#fff;}
.sub-visual.loaded .bg {transform:scale(1); opacity:1;}

.path-wrap {position:relative; margin-top: var(--header-height); padding: 0 var(--space-container); border-bottom:1px solid #ddd; border-top:1px solid #ddd; z-index: 100;}
.path-wrap .wrap {max-width:1200px; margin:0 auto; display: flex; align-items: center; height: 80px;}
.path-wrap .inner {display:flex; height: 100%;}
.path-wrap .home {width: 42px; height: 100%; position: relative; padding-right: 22px;}
.path-wrap .home::after {content: ''; width: 9px; height: 9px; background: url('/images/common/path-arrow.svg') no-repeat center / contain; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.path-wrap .home a {display:block; width: 20px; height: 100%; background:url("/images/common/path-home.svg") 50% 50% no-repeat; background-size:20px; text-indent:-999em; overflow:hidden;}
.path-wrap .part {position:relative; z-index:50;}
.path-wrap .part::after {content: ''; width: 9px; height: 9px; background: url('/images/common/path-arrow.svg') no-repeat center / contain; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.path-wrap .part > a {display:flex; align-items:center; position:relative; height: 100%; color:#686868; font-weight:500; line-height:1.3em; padding:0 30px 0 15px;}
.path-wrap .part > a::after {content:""; position:absolute; top:50%; right:22px; transform: translateY(-50%); width:8px; height:8px; background:url("/images/common/path-down.svg") 50% 50% no-repeat;}
.path-wrap .part > a.active {color: #242424; font-weight: 600;}
.path-wrap .part > a.active::after {background:url("/images/common/path-down-active.svg") 50% 50% no-repeat}
.path-wrap .part span {margin-right: 8px;}
.path-wrap .part:last-child::after {content: none;}
.path-wrap .part ul {display:none; position:absolute; left:-1px; background:var(--color-primary); border-radius: 0 0 var(--radius-8) var(--radius-8); z-index:50; min-width: 100px; padding: 13px 0;}
.path-wrap .part ul li {color:#686868; line-height:1.85;}
.path-wrap .part ul li a {display:block; padding:0 15px; color: rgba(255, 255, 255, 0.5); font-weight: 500; text-align: center; white-space: nowrap;}
[lang="en"] .path-wrap .part ul li a {white-space: inherit;}
.path-wrap .part ul li a:hover,
.path-wrap .part ul li.active a {color:#fff;}
.path-wrap .ask-btn {margin-left: auto; width: 180px; height: 48px; border-radius: var(--radius-8); display: flex; align-items: center; justify-content: center; font-family: 'Paperlogy', sans-serif; color: #fff; font-weight: 700; background: var(--color-secondary);}
.path-wrap .ask-btn .arrow {margin-left: var(--space-10); width: 20px; height: 20px;}
.path-wrap .ask-btn .arrow img {width: 100%; height: 100%; object-fit: contain;}

.lnb-wrap {position: relative; margin-top: var(--space-100); background: #f8f8f8; border-radius: 60px;}
.lnb {margin: 0 auto; max-width: 1200px;}
.lnb ul {display: flex;}
.lnb ul li {flex: 1; text-align: center;}
.lnb ul li a {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 60px; border-radius: 60px; color: #bebebe; font-weight: 600; line-height: 1.3; padding: 0 15px; white-space: nowrap;}
.lnb ul li.active a {color: #fff; background: var(--color-primary);}

#contArea {max-width:1260px; padding:0 var(--space-container); margin:0 auto;}
#contArea.wide {max-width:100%; padding-left:0; padding-right:0;}

.sub-title {padding:var(--space-80) 0; text-align:center;}
.sub-title h2 {font-size:var(--font-size-40); line-height:1.5em; color:#2c2c2c; font-family: 'Paperlogy', sans-serif;}

.real-cont {min-height:300px; padding-bottom:var(--space-150);}

/* footer */
#footer {position:relative; padding:var(--space-40) 0; background:#fff; color:#808084; font-size:var(--font-size-15); line-height:1.2; letter-spacing:-.03em; border-top: 1px solid #ddd;}
#footer .contain {position:relative; max-width: 1460px;}

.foot-links {border-bottom: 1px solid #ddd; display: flex; align-items: center; padding-bottom: var(--space-30); margin-bottom: var(--space-30);}
.foot-logo {width: clamp(130px, calc(164 / var(--inner) * 100vw), 164px); margin-right: var(--space-60);}
.foot-logo img {width: 100%; height: 100%; object-fit: contain;}
.foot-links .links-wrap {display: flex; align-items: center; gap: 10px var(--space-40);}
.foot-links .links {display: flex; align-items: center; gap: var(--space-40);}
.foot-links .links li {position: relative;}
.foot-links .links li::after {content: ''; position: absolute; top: 50%; right: calc(var(--space-20) * -1); transform: translateX(100%); width: 3px; height: 3px; border-radius: 50%; background: #ddd;}
.foot-links .links li:last-child:after {content: none;}
.foot-links .links li.email::after {content: '';}
.foot-links .links a {color: #808084; font-size: var(--font-size-16); font-weight: 500;}
.foot-links .links .privacy a {color: var(--color-primary);}
.foot-bottom {display: flex; gap: var(--space-50);}
.foot-info-wrap {flex: 1;}
.foot-info {margin-bottom: var(--space-20); display: flex; flex-direction: column; gap: var(--space-12);}
.foot-info .unit-wrap {display: flex; align-items: center; gap: var(--space-40);}
.foot-info .unit {display: flex; align-items: center; gap: var(--space-10);}
[lang="en"] .foot-info .unit {align-items: flex-start;}
.foot-info .unit .lbl {font-weight: 600;}
.foot-copy {font-size: 13px; font-weight: 300;}
.foot-copy .designed {color: rgba(128, 128, 132, 0.40); font-size: 8px; letter-spacing: -0.03em;}

.foot-site {width: clamp(180px, calc(248 / var(--inner) * 100vw), 248px); position: relative; z-index: 1;}
.foot-site.active {z-index: 50;}
.foot-site .site-btn {width: 100%; padding: var(--space-16) var(--space-24); border: 0; border-radius: var(--radius-8); background: #f8f8f8; color: #686868; font-weight: 500; line-height: 1.5; display: flex; align-items: center; justify-content: space-between;}
.foot-site .site-btn .arrow {width: 14px; height: 14px; background: url('/images/common/arrow-off.svg') no-repeat center / contain;}
.foot-site .site-list {position: absolute; left: 0; top: -10px; width: 100%; padding: var(--space-10); border-radius: var(--radius-8); overflow: hidden; background: #fff; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-90%); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.10); border: 1px solid var(--color-tertiary);}
.foot-site .site-list a {display: block; padding: var(--space-10) var(--space-14); color: #2c2c2c; border-radius: var(--radius-8);}
.foot-site .site-list li:hover a {background: #f8f8f8; color: var(--color-tertiary);}
.foot-site.active .site-btn {background: var(--color-tertiary); color: #fff;}
.foot-site.active .site-btn svg {transform: rotate(180deg);}
.foot-site.active .site-btn .arrow {transform: rotate(180deg); background: url('/images/common/arrow-on.svg') no-repeat center / contain;}
.foot-site.active .site-list {opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(-100%);}

.floating {position: fixed; right: var(--space-50); bottom: 14vh; z-index: 1;}

.scroll-top {width:clamp(40px, calc(60 / var(--inner) * 100vw), 60px); height:clamp(40px, calc(60 / var(--inner) * 100vw), 60px); display: flex; align-items: center; justify-content: center; box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.08); background: #fff; border-radius: 50%; z-index: 50; transition: none; margin: 0 auto;}

.quick {width: clamp(90px, calc(160 / var(--inner) * 100vw), 160px); height: clamp(90px, calc(160 / var(--inner) * 100vw), 160px); margin-bottom: var(--space-100);}
.quick a {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; background: url('/images/common/quick-img.svg') no-repeat center / contain; font-family: 'Paperlogy', sans-serif; color: #fff; font-size: var(--font-size-22); font-weight: 700; line-height: 1.27; box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.14); position: relative; border-radius: 50%;}
.quick a::before {content: ''; width: calc(100% + 40px); height: calc(100% + 40px); position: absolute; left: 50%; top: 50%; background: url('/images/common/quick-txt.svg') no-repeat center / contain; animation: quick-ring-spin 18s linear infinite; pointer-events: none; user-select: none;}
[lang="en"] .quick a {font-size: var(--font-size-18);}

@keyframes quick-ring-spin {from {transform: translate(-50%, -50%) rotate(0deg);} to {transform: translate(-50%, -50%) rotate(360deg);}}
@media (prefers-reduced-motion: reduce) {
.quick a::before {animation: none; transform: translate(-50%, -50%);}
}

#sub .floating {bottom: initial; top: 260px;}