@charset "utf-8";

/* ------- COMMON ------- */
html.sr .load-hidden { visibility: hidden; }
[data-scroll-y="false"] { overflow-y: hidden; }
.wrap.main .scroll-top { display: none; }
.main { overflow: hidden; }
.blind { position: absolute; width: 1px; height: 1px; clip: rect(0 0 0 0); overflow: hidden; }
.inner { position: relative; margin-left: auto; margin-right: auto; max-width: 1500px; width: 90%; }
.inner--large { max-width: 1720px; }
.image-wrap { position: relative; }
.image-wrap::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.image-wrap img { max-width: 100%; }
.font-secondary { font-family: 'Figtree'; }
.color-primary { color: #ED8C28; }
.color-secondary { color: #2abc3f; }
.color-dark3 { color: #333; }
.color-blue { color: #2a64d0; }
.color-red { color: #ff0101; }
.color-sky { color: #00a4e3; }
.sp, .mo { display: none; }
.text-center { text-align: center; }
.fw-light { font-weight: 200; }
.fw-bold { font-weight: bold; }
.fw-normal { font-weight: 400; }
.fw-medium { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.w-auto { width: auto; }
.d-none { display: none !important; }
.pt0 { padding-top: 0 !important; }
.pb0 { padding-bottom: 0 !important; }
/* 공통 */
.sec-title{font-size:42px; font-weight:600; padding:90px 0;}
.sec-title em{color:#3437CC;}
.menu-inner {border-bottom: 1px solid #e5e5e5;}
.menu-inner .menu-tab {max-width: 1500px; width:90%; margin: 0 auto; position: relative ;display:flex; gap:70px;}
.menu-inner .menu-tab > li {font-size:  18px; letter-spacing: -0.45px; color: #999999; }
.menu-inner .menu-tab > li a{padding:30px 0;display:block; position: relative;}
.menu-inner .menu-tab > li.active a{color:#FF8000;}
.menu-inner .menu-tab > li.active a::after{content:''; width:100%; height:2px; background-color: #FF8000; position:absolute; bottom:0; left:0;}


.floating-container { z-index: 10; position: fixed; bottom: 60px; right: 60px; }
.scroll-top { pointer-events: none; }
.scroll-top a { display: block; margin: auto; width: 70px; height: 70px; background: #f2b21b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' viewBox='0 -960 960 960' width='48' fill='%23000'%3E%3Cpath d='M450-80v-686L242-558l-42-42 280-280 280 280-42 42-208-208v686h-60Z'/%3E%3C/svg%3E") no-repeat center / auto 43%; opacity: 0; visibility: hidden; transition: ease .6s; }
.scroll-top a:hover{animation: scrollTop ease 1s infinite;}
.floating { display: block; transition: all cubic-bezier(0.18, 0.89, 0.32, 1.28) .35s; }
.floating-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 25px; width: 110px; height: 110px; background: linear-gradient(48deg, #2e3092, #ff7900); border-radius: 50%; box-shadow: 0px 4px 10px 0px rgba(108, 108, 108, 0.15), 0px 6px 16px 0px rgba(108, 108, 108, 0.25); transition: all cubic-bezier(0.18, 0.89, 0.32, 1.28) .35s; animation: .45s floating cubic-bezier(0.18, 0.89, 0.32, 1.28) 0.5s forwards; opacity: 0; }
.floating .icon { display: block; margin: 0 auto 10px; width: 50px; height: 34px; background: url('/new/images/logo-symbol-light.svg') no-repeat center / auto 100%; }
.floating .text { text-align: center; font-size: 15px; color: #fff; font-weight: 700; }
[data-floating="false"] { position: absolute; }
[data-scroll-top="true"] .scroll-top a { opacity: 1; visibility: visible; transition: ease .3s; }
[data-scroll-top="true"] .scroll-top { pointer-events: auto; }
@keyframes floating {
	from { opacity: 0; transform: scale(0); }
	to { opacity: 1; transform: none; }
}

/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto; width:100%; max-width:970px;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops_con {}
.hd_pops_con p{word-break: break-all;}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right; overflow:hidden;}
.hd_pops_footer button {margin-right:5px;padding:2px 10px;border:0;background:#000; font-size:12px;color:#fff; float:left;}
.hd_pops_footer button:last-child{float:right;}
img{max-width:100%;}
@media screen and (max-width:970px){
	#hd_pop div.hd_pops{left:0 !important; width:50%;}
	#hd_pop div.hd_pops:nth-child(2n){left:50% !important;}
	.hd_pops_con{width:100% !important; height:auto !important;}
	.hd_pops_con img{width:100%;}
}
@media screen and (max-width:500px){
	#hd_pop div.hd_pops{ width:96%; top:10px !important; left:2% !important;}
	#hd_pop div.hd_pops:nth-child(2n){left:2% !important;}
}
	
/* Form */
.check { display: inline-flex; align-items: center; position: relative; user-select: none; }
.check label { padding-left: 10px; font-size: 16px; color: #3d3d40; cursor: pointer; }
.check i { display: inline-block; vertical-align: middle; position: relative; width: 26px; height: 26px; pointer-events: none; }
.check i::before,
.check i::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 3px; box-sizing: border-box; }
.check i::after { background-repeat: no-repeat; border: 1px solid #111; background-color: #111; background-image: url('/new/images/icon-checked.svg'); background-size: auto 16px; background-position: center; opacity: 0; }
.check i::before { border: 1px solid #dddddd; }
.check input { z-index: 2; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; width: 26px; height: 26px; color: #fff; opacity: 0; cursor: pointer; }
.check input:checked ~ i::after { opacity: 1; }
.check a { background: linear-gradient(to bottom, #666, #666); background-size: 1px 1px; background-position: left bottom 3px; background-repeat: repeat-x; }
.check a span { vertical-align: baseline; }
.check-light label { color: #fff; cursor: pointer; }
.check-light i::after { background-color: #fff; background-image: url('/new/images/check-dark.png'); }
.check-light i::before { border-color: #fff; }
.radio { display: inline-flex; align-items: center; position: relative; user-select: none; }
.radio label { padding-left: 10px; font-size: 16px; color: #3d3d40; cursor: pointer; }
.radio i { display: inline-block; vertical-align: middle; position: relative; width: 18px; height: 18px; pointer-events: none; }
.radio i::before,
.radio i::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; box-sizing: border-box; }
.radio i::after { padding: 4px; background-image: radial-gradient(circle at 50%, #2e3092 40%, #fff 46%); border: 1px solid #2e3092; opacity: 0; }
.radio i::before { border: 1px solid #dddddd; }
.radio input { z-index: 2; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; width: 26px; height: 26px; color: #fff; opacity: 0; cursor: pointer; }
.radio input:checked ~ i::after { opacity: 1; }
.radio input:checked ~ label { color: #111; }
.input-block-group { display: flex; }
.input-block-group .radio-block { flex: 0 1 180px; display: inline-block; position: relative; margin-right: -1px; text-align: center; }
.input-block-group .radio-block:first-child i { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.input-block-group .radio-block:last-child i { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.input-block-group .radio-block i { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #e5e5e5; pointer-events: none; transition: all ease .15s; }
.input-block-group .radio-block input { position: absolute; opacity: 0; }
.input-block-group .radio-block input:checked ~ i { z-index: 2; border-color: #2e3092; }
.input-block-group .radio-block input:checked ~ label { color: #2e3092; }
.input-block-group .radio-block label { display: block; padding: 10px; font-size: 18px; color: #999999; font-weight: 500; cursor: pointer; transition: all ease .15s; }

.mobile-scroll-container img { max-width: 100%; }
@media screen and (pointer: fine) {
	.floating:hover { transform: scale(1.1); }
	.floating:hover .floating-wrap { box-shadow: -3px 3px 14px 0px rgba(234, 0, 44, 0.5), 3px -3px 14px 0px rgb(255, 121, 0, 0.5); }

	.check a:hover { color: #000; }
}
@media screen and (max-width:1280px){
	.footer-primary .row:first-child .right { margin-top: 0; }
	.sitemap { display: none; }
}
@media screen and (max-width:1024px){
    .inner { padding: 0; width: 90%; }
    .image-wrap.border:not(.full) { padding: 60px; }
    .pc { display: none; }
    .sp { display: block; }

	.floating-container { right: 5%; }
	.floating-wrap { margin-bottom: 15px; width: 75px; height: 75px; }
	.floating .icon { margin-bottom: 5px; width: 35px; height: 20px; }
	.floating .text { font-size: 12px; }

    .mobile-scroll-container { overflow: visible; position: relative; padding-bottom: 12px; }
    .mobile-scroll-container .swiper-slide { width: auto; }
    .mobile-scroll-container .image-wrap img { max-width: none; width: 1000px; }

	.scroll-top a { width: 55px; height: 55px; }

	.check i { width: 22px; height: 22px; }
    .check label { font-size: 15px; }
	.input-block-group .radio-block label { font-size: 16px; }
}
@media screen and (max-width:768px){
    .image-wrap.border:not(.full) { padding: 24px; }

    .mo { display: block; }

	.floating-container { bottom: 25px; }
    .scroll-top { bottom: 15px; }
    .scroll-top a { width: 45px; height: 45px; }

	.check i { width: 20px; height: 20px; }
    .check label { padding-left: 6px; font-size: 14px; }
	.input-block-group .radio-block label { font-size: 14px; }

    .sec-title{font-size:20px; padding:60px 0;}

    .menu-inner .menu-tab{gap:20px; overflow-x: auto;}
    .menu-inner .menu-tab > li{font-size:16px; white-space: pre;}
}

/* Icons */
.icon-date::before { content: ''; display: inline-block; vertical-align: middle; width: 15px; height: 15px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 358.4 358.4' enable-background='new 0 0 358.4 358.4' xml:space='preserve' fill='%23555555'%3E%3Cpath d='M179.2,0C80.4,0,0,80.4,0,179.2s80.4,179.2,179.2,179.2S358.4,278,358.4,179.2S278,0,179.2,0z M179.2,33.6 c80.6,0,145.6,65,145.6,145.6c0,80.6-65,145.6-145.6,145.6s-145.6-65-145.6-145.6C33.6,98.6,98.6,33.6,179.2,33.6z M179.2,71.6 c-9.3,0-16.8,7.5-16.8,16.8v90.8c0,9.3,7.5,16.8,16.8,16.8h79.6c9.3,0,16.8-7.5,16.8-16.8c0-9.3-7.5-16.8-16.8-16.8H196v-74 C196,79.1,188.5,71.6,179.2,71.6L179.2,71.6z'/%3E%3C/svg%3E"); }
@media screen and (max-width: 1024px) {

}
@media screen and (max-width: 768px) {
	.icon-date::before { width: 13px; height: 13px; }
}


/* ------- Button ------- */
.button { display: inline-block; padding: 10px; border: 1px solid transparent; transition: all ease .15s; }
.button-primary { font-weight: 700; color: #fff; background: #2e3092; }
.button-arrow { overflow: hidden; display: inline-block; position: relative; padding: 14px 30px 14px 20px; min-width: 220px; color: #fff; border: 1px solid #fff; transition: all ease .35s; }
.button-arrow::after { content: ''; position: absolute; top: 0; right: 30px; bottom: 0; margin: auto; display: block; width: 7px; height: 13px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 7.7 12.9' enable-background='new 0 0 7.7 12.9' xml:space='preserve' stroke='%23ffffff'%3E%3Cg%3E%3Cpath stroke-width='1.8' stroke-miterlimit='10' d='M5.7,6.4'/%3E%3Cline stroke-width='1.8' stroke-linecap='square' stroke-linejoin='bevel' stroke-miterlimit='10' x1='1.3' y1='1.3' x2='6.4' y2='6.4'/%3E%3Cline stroke-width='1.8' stroke-linecap='square' stroke-linejoin='bevel' stroke-miterlimit='10' x1='1.3' y1='11.6' x2='6.4' y2='6.4'/%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; }
.button-border-light { border: 1px solid rgba(255, 255, 255, 0.3); }
.button-border-gray { border: 1px solid #dddddd; }
.button-round { border-radius: 50px; }
.button-gradient { color: #fff; background-image: linear-gradient(48deg, #2e3092, #ff7900, #ff7900, #2e3092); background-size: 400% 100%; background-position: 0%; border-color: transparent; transition: background ease .3s; }
.button-dark { color: #fff; background: #292929; }
@media screen and (pointer: fine) {
    .button-primary:hover { background: #2f31b5; }
    .button-arrow:hover { color: #111; background: #fff; border-color: #fff; }
    .button-arrow:hover::after { background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 7.7 12.9' enable-background='new 0 0 7.7 12.9' xml:space='preserve' stroke='%23111'%3E%3Cg%3E%3Cpath stroke-width='1.8' stroke-miterlimit='10' d='M5.7,6.4'/%3E%3Cline stroke-width='1.8' stroke-linecap='square' stroke-linejoin='bevel' stroke-miterlimit='10' x1='1.3' y1='1.3' x2='6.4' y2='6.4'/%3E%3Cline stroke-width='1.8' stroke-linecap='square' stroke-linejoin='bevel' stroke-miterlimit='10' x1='1.3' y1='11.6' x2='6.4' y2='6.4'/%3E%3C/g%3E%3C/svg%3E"); }
	.button-border-light:hover { color: #111; background: #fff; border-color: #fff; }
	.button-border-gray:hover { color: #fff; background: #111; border-color: #111; }
	.button-gradient:hover { background-position: 20%; }
	.button-dark:hover { background: #373737; }
}
@media screen and (max-width: 1024px) {
	.button-arrow { padding: 12px 40px 12px 30px; }
}
@media screen and (max-width: 768px) {
}


.swiper-container-horizontal>.swiper-scrollbar { height: 5px; }
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal { left: 0; width: 100%; }
.swiper-container .swiper-scrollbar { left: 0; width: 100%; background: #eee; }
.swiper-scrollbar-drag { background: #2e3092; }


/* ------- Header ------- */
.header { z-index: 11; position: fixed; top: 0; left: 0; width: 100%; }
.header-primary { z-index: 2; position: relative; color: #fff; transition-property: background, box-shadow; transition-timing-function: ease; transition-duration: .35s; }
.header-primary-wrap { margin: auto; position: relative; max-width: 1500px; width: 90%; }
.header-primary .logo {
    z-index: 2;
    position: absolute;
    top: 30px;
    left: 0;
    transition: all ease .35s;
    background: url(/img/logo.png?4) no-repeat left center / contain;
    width: 400px;
    height: 69px;
    margin-left: 30px;
    padding-left: 52px;
}
/* .header-primary .language { z-index: 2; position: absolute; top: 46px; right: 0; }
.header-primary .language .current { position: relative; padding: 2px 20px 0 24px; font-size: 16px; color: inherit; font-weight: 700; background: url('/images/language-arrow.png') no-repeat top 7px right; border: none; }
.header-primary .language .current::before { content: ''; position: absolute; top: 2px; left: 0; width: 18px; height: 18px; background: url('/images/language.png') no-repeat center / auto 100%; }
.header-primary .language ul { position: absolute; left: -6px; top: 100%; margin-top: 5px; width: 80px; background: #fff; box-shadow: 0 3px 10px rgba(0, 0, 0, .1); visibility: hidden; opacity: 0; }
.header-primary .language a { display: block; padding: 10px 0; text-align: center; font-size: 14px; color: #212227; transition: all ease .15s; }
.header-primary .language .current[aria-pressed="true"] + ul { visibility: visible; opacity: 1; } */
.header-primary .language a { position: absolute; top: 32px; right: 0; padding: 5px 20px 5px 12px; text-align: center; font-size: 16px; font-weight: 500; border: 1px solid #fff; border-radius: 50px; transition: all ease .35s; }
.header-primary .language a::before { content: ''; display: inline-block; vertical-align: -6px; margin-right: 13px; width: 24px; height: 24px; background: url('/new/images/icon-globe-light.svg') no-repeat center / auto 100%; transition: all ease .35s; }
.header-primary .hamburger { display: none; position: absolute; top: 30px; right: 0; padding: 0 8px; width: 50px; height: 50px; }
.header-primary .hamburger button { display: block; width: 100%; height: 100%; }
.header-primary .hamburger .circle { display: block; position: relative; width: 100%; height: 100%; border: 1px solid transparent; border-radius: 50%; }
.header-primary .hamburger .circle::before,
.header-primary .hamburger .circle::after { content: ''; position: absolute; left: 0; width: 100%; height: 2px; background: #111; }
.header-primary .hamburger .circle::before { top: 21px; }
.header-primary .hamburger .circle::after { top: 27px; }
.header-primary .gnb .depth1 { display: flex; justify-content: space-evenly;}
.header-primary .gnb .depth1 > li > a { display: block; position: relative; margin: 0 30px; padding: 38px 28px; text-align: center; font-size: 18px; color: inherit; font-weight: 500; }
.header-primary .gnb .depth2 { padding: 15px 0; }
.header-primary .gnb .depth2 > li > a { display: block; padding: 8px 4px; text-align: center; font-size: 16px; }
.header-primary .gnb .depth3 { display: none; }
.header-primary .gnb .close { display: none; position: fixed; top: 10px; right: 5%; margin: auto; width: 40px; height: 40px; }
.header-primary .gnb .close button { display: block; width: 100%; height: 100%; }
.header-primary .gnb .close .circle { display: block; position: relative; width: 100%; height: 100%; }
.header-primary .gnb .close .circle::before,
.header-primary .gnb .close .circle::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 26px; height: 2px; background: #212227; }
.header-primary .gnb .close .circle::before { transform: rotate(45deg); }
.header-primary .gnb .close .circle::after { transform: rotate(-45deg); }
.header-full { z-index: 3; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0; }
.header-full .col { overflow: hidden; flex: 1 1 50%; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.header-full .col:first-child { overflow: hidden; display: flex; flex-direction: column; justify-content: center; position: relative; padding: 0 40px; max-width: 615px; text-align: center; }
.header-full .col:first-child .background { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('/new/images/header-full-background.jpg') no-repeat center / cover; transform: scale(1.3); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
.header-full .title { overflow: hidden; font-size: 34px; color: #fff; }
.header-full .title img { vertical-align: middle; width: auto; height: 64px; }
.header-full .title .split { display: block; }
.header-full .text { overflow: hidden; margin-top: 20px; line-height: 1.2; font-size: 42px; color: #fff; }
.header-full .text .split { display: block; }
.header-full .nav { overflow-y: auto; display: flex; padding: 10% 0 15% 160px; height: 100%; background: url('/new/images/logo-background.png') no-repeat right -20px bottom -20px / auto 213px; }
.header-full .nav .depth1 { margin: auto 0; }
.header-full .nav .depth1 > li { display: flex; align-items: center; margin-bottom: 70px; }
.header-full .nav .depth1 > li:last-child { margin-bottom: 0; }
.header-full .nav .depth1 > li > a { flex-shrink: 0; display: inline-block; position: relative; margin-right: 100px; min-width: 255px; font-family: 'Figtree'; font-size: 50px; font-weight: 700; color: #212227; transition: color ease .15s; }
/* .header-full .nav .depth1 > li > a span { display: block; transform: translateY(100%); } */
.header-full .nav .depth1 > li > a span { display: inline-block; position: relative; }
.header-full .nav .depth1 > li > a span::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: #2e3092; transform: scaleX(0); transform-origin: right; transition: transform ease .35s; }
.header-full .nav .depth2 { display: flex; margin-top: 10px; }
.header-full .nav .depth2 > li { flex-shrink: 0; position: relative; }
.header-full .nav .depth2 > li > a { display: inline-block; position: relative; padding: 0px 28px; font-size: 20px; font-weight: 600; color: #111; }
/* .header-full .nav .depth2 > li a::after { content: ''; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; width: 1px; height: 45%; background: #b2b2b2; } */
.header-full .nav .depth2 > li:last-child a::after { content: none; }
.header-full .nav .depth2 > li:first-child > a { padding-left: 0; }
.header-full .nav .depth3 { position: absolute; top: 100%; left: 0; }
.header-full .nav .depth3 > li > a { display: inline-block; position: relative; margin-top: 10px; padding-left: 43px; font-size: 16px; color: #999; white-space: nowrap; }
.header-full .nav .depth3 > li > a::before { content: ''; position: absolute; top: 14px; left: 28px; width: 8px; height: 1px; background: #999; }
.header-full .nav .depth1 > li > a[aria-expanded="true"] { color: #2e3092; }
.header-full .nav .depth1 > li > a[aria-expanded="true"] span::after { transform: scaleX(1); transform-origin: left; }
.header-full .nav .depth1 > li > a[aria-expanded="true"] + .depth2 { display: flex; }
.header-full .close { position: absolute; top: 58px; right: 92px; margin: auto; width: 50px; height: 50px; }
.header-full .close a { display: block; width: 100%; height: 100%; }
.header-full .close .circle { display: block; position: relative; width: 100%; height: 100%; }
.header-full .close .circle::before,
.header-full .close .circle::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 33px; height: 2px; background: #212227; }
.header-full .close .circle::before { transform: rotate(45deg); }
.header-full .close .circle::after { transform: rotate(-45deg); }
[data-header-fullmenu] .header-primary .hamburger { display: block; }
[data-header-gnb="opened"] .header-primary,
[data-header-theme="light"] .header-primary,
[data-header-sticky="true"] .header-primary { background: #fff; -webkit-backdrop-filter: saturate(190%) blur(20px); backdrop-filter: saturate(190%) blur(20px); box-shadow: 0px 0px 20px 0px rgba(10, 10, 10, .1); }
[data-header-sticky="true"] .header-primary { box-shadow: 0px 0px 20px 0px rgba(10, 10, 10, .1); }

/* [data-hamburger="opened"] .header-primary .language .current::before,
[data-header-theme="black"] .header-primary .language .current::before,
[data-header-theme="light"] .header-primary .language .current::before,
[data-header-sticky="true"] .header-primary .language .current::before { background-image: url('/new/images/language-dark.png'); } */
[data-header-gnb="opened"] .header-primary,
[data-header-theme="transparent"] .header-primary { color: #111; }
[data-header-menu="true"] .header-primary,
[data-header-theme="black"] .header-primary,
[data-header-theme="light"] .header-primary,
[data-header-sticky="true"] .header-primary { color: #111; }
[data-header-gnb="opened"] .header-primary .logo,
[data-hamburger="opened"] .header-primary .logo,
[data-header-menu="true"] .header-primary .logo,
[data-header-theme="light"] .header-primary .logo,
[data-header-theme="black"] .header-primary .logo,
[data-header-theme="transparent"] .header-primary .logo,
[data-header-sticky="true"] .header-primary .logo { background-image: url('/img/logo_b.png?4'); }
/* [data-header-sticky="true"] .header-primary .language .current,
[data-header-theme="black"] .header-primary .language .current,
[data-header-theme="light"] .header-primary .language .current { background-image: url('/new/images/language-arrow-dark.png'); } */
[data-header-gnb="opened"] .header-primary .language a,
[data-header-theme="transparent"] .header-primary .language a,
[data-header-theme="light"] .header-primary .language a { border-color: #e5e5e5; }
[data-header-gnb="opened"] .header-primary .language a::before,
[data-header-theme="transparent"] .header-primary .language a::before,
[data-header-theme="light"] .header-primary .language a::before { background-image: url('/new/images/icon-globe.svg'); }
[data-header-theme="white"] .header-primary .hamburger .circle::before,
[data-header-theme="white"] .header-primary .hamburger .circle::after { background: #fff; }
@media screen and (pointer: fine) {
    /* .header-primary .language a:hover { color: #fff; background: #2e3092; } */
    .header-primary .gnb .depth1 > li:hover > a span::after { transform: scaleX(1); }
    .header-primary .gnb .depth1 > li:hover > a { color: #2e3092; }
    .header-primary .gnb .depth2 > li > a:hover { color: #2e3092; text-decoration: underline; text-underline-offset: 3px; }
	.header-full .nav .depth1 > li > a:hover { color: #2e3092; }
	.header-full .nav .depth1 > li > a:hover span::after { transform: scaleX(1); transform-origin: left; }
    .header-full .nav .depth2 > li > a:hover,
	.header-full .nav .depth3 > li > a:hover { text-decoration: underline; text-underline-offset: 6px; }
	.header-full .nav .depth3 > li > a:hover { color: #111; }
}
@media screen and (min-width: 1281px) {
	.header > .background { z-index: 1; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); opacity: 0; visibility: hidden; transition: all ease .65s; pointer-events: none; }
	.header-primary::before { content: ''; position: absolute; top: 110px; left: 0; width: 100%; height: 1px; background: #f0f0f0; opacity: 0; transition: opacity ease .35s; }
    .header-primary .gnb { overflow: hidden; position: relative; display: flex; justify-content: center; margin-right: -40px; height: 110px; width: 100%; }
	.header-primary .gnb .depth1 > li > a { transition: color ease .15s; }
    .header-primary .gnb .depth1 > li > a::before { content: ''; z-index: 2; position: absolute; top: -2px; left: 0; right: 0; margin: auto; width: 7px; height: 7px; background: #2e3092; border-radius: 50%; opacity: 0; }
    .header-primary .gnb .depth1 > li > a::after { content: ''; z-index: 3; position: absolute; bottom: -1px; left: 0; width: 100%; height: 3px; background: #2e3092; transform: scaleX(0); transform-origin: left; transition: transform ease .3s; }
    .header-primary .gnb .depth1 > li.on > a { color: #2e3092; }
    .header-primary .gnb .depth1 > li.on > a::before { opacity: 1; }
	[data-header-gnb="opened"] > .background { opacity: 1; visibility: visible; }
	[data-header-gnb="opened"] .header-primary::before { opacity: 1; }
    /* [data-header-gnb="opened"] .header-primary .gnb .background { opacity: 1; } */
}
@media screen and (max-width: 1280px) {
    .header { height: 60px; }
	.header::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); opacity: 0; transition: opacity ease .65s; pointer-events: none; }
    .header-primary { height: 100%; transition: background ease .3s; }
    .header-primary .logo {
        top: 10px;
        left: 0;
        width: 200px;
        height: 36px;
        margin-left: 0px;
        padding-left: 27px;
        font-size: 19px;
    }	
    .header-primary .hamburger { display: block; top: 10px; right: 0; padding: 0 6px; width: 40px; height: 40px; }
    .header-primary .hamburger .circle::before,
    .header-primary .hamburger .circle::after { height: 2px; }
    .header-primary .hamburger .circle::before { top: 13px; }
    .header-primary .hamburger .circle::after { top: 21px; }
    .header-primary .language .current { padding: 2px 16px 0 22px; line-height: 1; font-size: 13px; background-position: top 4px right; }
    .header-primary .language .current::before { top: 0; width: 16px; height: 16px; }
    .header-primary .language a { top: 14px; right: 52px; padding: 5px 20px 5px 15px; font-size: 13px; }
	.header-primary .language a::before { margin-right: 6px; width: 18px; height: 18px; }
    .header-primary .gnb { z-index: 1; overflow-y: auto; position: fixed; top: 0; right: -100%; padding: 100px 5%; width: 100%; height: 100vh !important; background: #fff; transition: all ease .6s; }
    .header-primary .gnb .depth1 { flex-direction: column; }
    .header-primary .gnb .depth1 > li:last-child { border-bottom: none; }
    .header-primary .gnb .depth1 > li > a { overflow: hidden; margin: 0; padding: 14px 0; text-align: left; font-weight: 600; padding: 10px 0 !important; }
    .header-primary .gnb .depth1 > li > a::after { content: ''; z-index: 2; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; width: 26px; height: 26px; background-repeat: no-repeat; background-size: auto 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' viewBox='0 96 960 960' width='48' fill='212227'%3E%3Cpath d='m375 816-43-43 198-198-198-198 43-43 241 241-241 241Z'/%3E%3C/svg%3E"); transition: transform ease .15s; }
    .header-primary .gnb .depth2 { overflow: hidden; padding: 0; max-height: 0; opacity: 0; visibility: hidden; }
    .header-primary .gnb .depth2 > li:last-child { padding-bottom: 10px; }
    .header-primary .gnb .depth2 > li > a { padding: 10px 16px; text-align: left; font-size: 15px; }
	.header-primary .gnb .depth1 > li > a[aria-expanded="true"] { color: #2e3092; }
	.header-primary .gnb .depth1 > li > a[aria-expanded="true"]::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' viewBox='0 96 960 960' width='48' fill='%232e3092'%3E%3Cpath d='m375 816-43-43 198-198-198-198 43-43 241 241-241 241Z'/%3E%3C/svg%3E"); transform: rotate(90deg); }
    [data-header-sticky="true"] .header-primary { background: rgba(255, 255, 255, 0.8); }

	[data-hamburger="opened"]::before { opacity: 1; }
    [data-hamburger="opened"] .header-primary .gnb { color: #212227; right: 0; }
    [data-hamburger="opened"] .header-primary .gnb .close { display: block; }
    /* [data-hamburger="opened"] .header-primary .logo { background-image: url('/new/images/logo-dark.svg'); } */
    [data-hamburger="opened"] .header-primary .language .current { color: #212227; background-image: url('/new/images/language-arrow-dark.png'); }
}
@media screen and (max-width: 768px) {
}


/* ------- Footer ------- */
.footer { padding: 76px 0 74px; color: #aaaaaa; font-size: 16px; letter-spacing: -0.05em; background: #111111; }
.footer-primary { margin: auto; max-width: 1500px; width: 90%; }
.footer-primary .row { display: flex; justify-content: space-between; }
.footer-primary .row:first-child {
    /* margin-bottom: 46px; */
    /* padding-bottom: 50px; */
    /* border-bottom: 1px solid #333; */
}
.footer-primary .right { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; }
.footer-primary .links ul { display: flex; flex-wrap: wrap; margin: 0 -20px; }
.footer-primary .links li { position: relative; padding: 0 20px; }
/* .footer-primary .links li:not(:last-child)::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; width: 1px; height: 13px; background: #fff; transform: translateY(-2px); } */
.footer-primary .links a { color: #fff; font-weight: 600; }
.footer-primary .info ul { display: flex; flex-wrap: wrap; margin: 0 -8px; max-width: 700px; }
.footer-primary .info li { position: relative; padding: 2px 8px; }
.footer-primary .info li:not(:last-child)::after { content: ''; position: absolute; top: 0; right: -2px; bottom: 0; margin: auto; width: 1px; height: 12px; background: #aaaaaa; }
.footer-primary .logo { width: 178px; height: 40px; background: url('/new/images/logo.png') no-repeat center / auto 100%; }
.footer-primary .copyright { margin-top: 4px; font-size: 15px; letter-spacing: -0.01em; }
.footer-primary .social ul { display: flex; margin: 0 -6px 15px; }
.footer-primary .social li { padding: 0 6px; }
.footer-primary .family-site { position: relative; width: 330px; }
.footer-primary .family-site .toggle { display: block; position: relative; padding: 18px 40px 18px 34px; line-height: 1; font-size: 14px; color: inherit; border: 1px solid #3c3c3c; transition: all ease .3s; }
.footer-primary .family-site .toggle::after { content: ''; position: absolute; top: 0; right: 24px; bottom: 0; margin: auto; width: 22px; height: 22px; background: url('/new/images/family-site-arrow.svg') no-repeat center / auto 100%; }
.footer-primary .family-site .listbox { display: none; z-index: 11; position: absolute; bottom: 100%; left: 0; margin-bottom: -1px; padding: 20px 0; width: 100%; background: #252726; border: 1px solid #555; }
.footer-primary .family-site .listbox li a { display: block; padding: 6px 34px; color: inherit; font-size: 16px; }
.footer-primary .family-site[aria-expanded="true"] .listbox { display: block; }
.footer-primary .family-site[aria-expanded="true"] .toggle { color: #fff; border-color: #555555; }
.footer-primary .family-site[aria-expanded="true"] .toggle::after { background-image: url('/new/images/family-site-arrow-light.svg'); }
.footer-primary .sitemap > ul { display: flex; }
.footer-primary .sitemap > ul > li { margin-right: 76px; }
.footer-primary .sitemap .title { margin-bottom: 16px; font-size: 18px; color: #fff; font-weight: 700; }
.footer-primary .sitemap a { display: block; margin-top: 3px; }
.footer-primary .button-dark { padding: 12px 44px; border-radius: 4px; }
@media screen and (pointer: fine) {
    .footer-primary .links a:hover { opacity: .7; }
    .footer-primary .social a:hover { opacity: .7; }
    .footer-primary .family-site .listbox li a:hover { color: #fff; }
    .footer-primary .family-site .toggle:hover { color: #fff; border-color: #555555; }
    .footer-primary .family-site .toggle:hover::after { background-image: url('/new/images/family-site-arrow-light.svg'); }
	.footer-primary .sitemap a:hover { color: #fff; }
}
@media screen and (min-width: 1025px) {
}
@media screen and (max-width: 1200px) {
	.footer { font-size: 14px; }
    .footer-primary .row { flex-direction: column; }
	.footer-primary .row:first-child { margin-bottom: 20px; padding-bottom: 15px; }
    .footer-primary .left { flex-direction: column; align-items: flex-start; width: 100%; }
    .footer-primary .right { align-items: flex-start; margin-top: 20px; width: 100%; }
    .footer-primary .logo { width: 135px; height: 30px; }
    .footer-primary .copyright { margin-left: 0; font-size: 13px; }
	.footer-primary .links ul { margin: 0 -10px; }
    .footer-primary .links li { padding: 3px 10px; }
	.footer-primary .info li:not(:last-child)::after { content: none; }
	.footer-primary .social ul { margin-bottom: 26px; }
	.footer-primary .social li img { width: 36px; }
    .footer-primary .family-site { width: 100%; max-width: 300px; }
	.footer-primary .family-site .listbox { padding: 10px 0; }
	.footer-primary .family-site .listbox li a { padding: 6px 24px; font-size: 14px; }
    .footer-primary .family-site .toggle { padding: 16px 48px 16px 24px; width: 100%; background-position: right 10px center; border: 1px solid rgba(255, 255, 255, 0.5); }
	.footer-primary .copyright { margin-top: 0; }
}
@media screen and (max-width: 1024px) {
	.footer { padding: 35px 0 60px; }
	.footer-primary .button-dark { padding: 10px 30px; }
}
@media screen and (max-width: 768px) {
	.footer { padding-bottom: 40px; }
	.footer-primary .info li { width: 100%; }
	.footer-primary .info li:nth-child(3)::after,
	.footer-primary .info li:nth-child(4)::after { content: none; }
	.footer-primary .family-site { max-width: none; }
}


/* Main */
@keyframes scrollDown {
	0% { opacity: 0; transform: translateY(0); }
	50% { opacity: 1; }
	100% { opacity: 0; transform: translateY(16px); }
}
@keyframes scrollTop {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(10px); }
}
.section-indicator .scroll {
    z-index: 2;
    position: fixed;
    bottom: 48px;
    right: 0px;
    margin: auto;
    height: 100px;
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    transition: all ease .35s;
}
.section-indicator .scroll span { display: block; white-space: nowrap; transform: rotate(90deg); }
.section-indicator .scroll i { display: block; position: relative; margin: 30px auto 0; width: 11px; height: 30px; transition: all ease .35s; }
.section-indicator .scroll i::before,
.section-indicator .scroll i::after { content: ''; position: absolute; left: 0; width: 100%; height: 7px; background: url('/new/images/icon-scroll-arrow-light.svg') no-repeat center / auto 20px; animation: scrollDown ease 1.6s infinite; opacity: 0; }
.section-indicator .scroll i::after { animation-delay: 0.8s; }
.section-indicator .top { z-index: 2; position: fixed; bottom: 50px; right: 30px; margin: auto; font-size: 14px; color: #333; font-weight: 700; transition: all cubic-bezier(0.4, 0.12, 0.21, 1) .9s; }

.section-indicator .top i { display: block; margin: auto; width: 30px; height: 30px; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%23333'%3E%3Cpath d='M440-240v-368L296-464l-56-56 240-240 240 240-56 56-144-144v368h-80Z'/%3E%3C/svg%3E"); background-size: auto 50px; background-position: center; transition: all ease .35s; }
.section-indicator .top span { display: block; margin: 20px 0 16px; }
.section-indicator [data-indicator="hidden"] { opacity: 0; visibility: hidden; }
.section-indicator [data-indicator-theme="light"] { color: #999; }
.section-indicator .top[data-indicator-theme="light"] i { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24' fill='%23999'%3E%3Cpath d='M440-240v-368L296-464l-56-56 240-240 240 240-56 56-144-144v368h-80Z'/%3E%3C/svg%3E"); }

.section-main { height: 100vh; }
.section-main .section-title .title { font-size: 50px; font-weight: 600; line-height: 1.4; }
.section-main .section-title .text { font-size: 20px; font-weight: 500; margin-top: 20px; }
.section-main .section-title .button { font-size: 14px; margin-top: 50px; padding: 14px 44px; }
.section-main .split { overflow: hidden; display: block; }
.section-main .split span { display: block; }

.section-main--visual .media .mo { display: none; }
.section-main--visual .swiper { height: 100%; }
.section-main--visual .background { height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; }
.section-main--visual .text-wrap { position: absolute; top: 40%; left: 0; right: 0; margin: auto; width: 90%; max-width: 1500px; color: #fff; }
.section-main--visual .text-wrap .title { font-size: 64px; font-weight: 800; line-height: 1.2; }
.section-main--visual .text-wrap .text { font-size: 24px; font-weight: 600; margin-top: 30px; }
.section-main--visual .swiper-pagination { position: static; margin: 0 -10px; width: auto; }
.section-main--visual .swiper-pagination .swiper-pagination-bullet { margin: 0 10px; width: 10px; height: 10px; background: transparent; border: 1px solid #fff; opacity: 1; transition: all ease .35s; }
.section-main--visual .swiper-pagination .swiper-pagination-bullet-active { background: #fff; }
.section-main--visual .control { display: flex; align-items: center; position: absolute; bottom: 10%; left: 0; right: 0; margin: auto; width: 90%; max-width: 1500px; }
.section-main--visual .control .toggle { display: block; z-index: 2; position: relative; margin-right: 20px; width: 40px; height: 40px; border-radius: 50%; }
.section-main--visual .control .toggle::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 16px; height: 16px; background: url('/new/images/icon-pause-light.svg') no-repeat center / auto 100%; pointer-events: none; }
.section-main--visual .control .toggle[data-state="pause"]::before { background-image: url('/new/images/icon-play-light.svg'); }
.section-main--visual .control .toggle svg { display: block; width: 100%; height: auto; pointer-events: none; }
.section-main--visual .control .toggle .path { display: block; transform: rotateZ(-90deg); transform-origin: center; stroke-dasharray: 220; }

.section-main--intro { display: flex; align-items: center; color: #fff; background: #19255f url('/new/images/How-to-Use-Futures-Open-Interest-in-Forex-Trading1.jpg') no-repeat center / cover; }
.section-main--intro > p {position: absolute; right: 150px; bottom: 140px; color: gray;}
.section-main--intro .intro-block { display: flex; flex-wrap: wrap; }
.section-main--intro .intro-head { width: 50%; }
.section-main--intro .intro-body { width: 50%; margin-left: auto; margin-right: -60px; }
.section-main--intro .lists { display: flex; flex-wrap: wrap; margin: -90px -56px; }
.section-main--intro .lists li { padding: 90px 56px; width: 50%; }
.section-main--intro .lists .title { font-size: 18px; font-weight: 700; margin-bottom: 20px; }
.section-main--intro .lists .text { font-size: 40px; font-weight: 700; display: flex; align-items: baseline; gap: 5px;}
.section-main--intro .lists .text b { font-size: 80px; line-height: 0.8; }
.section-main--intro .lists .icon { display: inline-block; vertical-align: middle; margin-right: 10px; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; background-size: auto 100%; }
.section-main--intro .lists .icon1 { background-image: url('/new/images/section-intro-icon1.svg'); }
.section-main--intro .lists .icon2 { background-image: url('/new/images/section-intro-icon2.svg'); }
.section-main--intro .lists .icon3 { background-image: url('/new/images/section-intro-icon3.svg'); }
.section-main--intro .lists .icon4 { background-image: url('/new/images/section-intro-icon4.svg'); }

.section-main--global {
    display: flex;
    align-items: center;
    color: #fff;
    background: #09161f url(/new/images/empty-black-studio-background-abstract-gradient-black-background-black-wall-room-with-spotlights-space-for-selling-products-on-the-website-illustration-vector.jpg) no-repeat center / cover;
    background-size: 100%;
}
.section-main--global .section-title { margin-bottom: 50px; }

.section-main--visual .media { height: 100%; background:#000;}
.section-main--visual .media video { width: 100%; height: 100%; object-fit: cover; opacity:.9}
		
.section-main--technology { display: flex; align-items: center; position: relative; color: #111; background: #f7f7f7; padding-top: 30px; }
.section-main--technology .swiper { width: 100%; height: 100%; }
.section-main--technology .swiper-slide { display: flex; align-items: center; }
.section-main--technology .inner { display: flex; padding: 0 110px 0 290px; }
.section-main--technology .text-wrap {
    padding-top: 60px;
    width: 41.5%;
}
.section-main--technology .image-wrap, .section-main--technology .media-wrap {
    flex: 1 1 auto;
    overflow: hidden;
    position: relative;
    margin: auto 0 auto 104px;
    border-radius: 20px;
    box-shadow: 4px 4px 40px 0px rgba(0, 0, 0, .36);
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform-origin: 200% center;
    animation: snapOut ease .65s both;
}
.section-main--technology .media-wrap::before { content: ''; display: block; padding-top: 56.25%; width: 100%; height: 0; }
.section-main--technology .media-wrap video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.section-main--technology .swiper-pagination { top: 50%; left: 0; right: 0; bottom: auto; display: flex; flex-direction: column; align-items: flex-start; margin: -28px auto 0; width: 90%; max-width: 1500px; pointer-events: none; }
.section-main--technology .swiper-pagination .swiper-pagination-bullet { margin: 0 0 30px; width: auto; height: auto; color: #aaaaaa; font-weight: 500; background: none; border-radius: 0; opacity: 1; transition: color ease .35s; pointer-events: auto; }
.section-main--technology .swiper-pagination .swiper-pagination-bullet span { display: block; position: relative; padding-bottom: 4px; }
.section-main--technology .swiper-pagination .swiper-pagination-bullet span::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: #2e3092; transform: scaleX(0); transform-origin: left; transition: transform ease .35s; }
.section-main--technology .swiper-pagination .swiper-pagination-bullet-active { color: #2e3092; font-weight: 800; }
.section-main--technology .swiper-pagination .swiper-pagination-bullet-active span::after { transform: none; }
.section-main--technology .swiper-slide-active .image-wrap,
.section-main--technology .swiper-slide-active .media-wrap { animation: snapIn ease .65s both; }
/*.section-main--technology .swiper-slide:last-child .text-wrap { padding-top: 0; }*/
.section-main--technology [data-timeline] { opacity: .35; transition: opacity ease .35s; }
.section-main--technology [data-timeline="on"] { opacity: 1; }

.section-main--board { display: flex; align-items: center; }
.section-main--board .inner { display: flex; flex-wrap: wrap; padding-top:6%;}
.section-main--board .section-title { width: 35%; color: #111; }
.section-main--board .main-board-container { flex: 1 1; display: flex; margin: -35px; }
.section-main--board .main-board { padding: 35px; width: 50%; }
.section-main--board .main-board-head { display: flex; align-items: center; justify-content: space-between; color: #111; font-weight: 700; }
.section-main--board .main-board-head .title { font-size: 30px; }
.section-main--board .main-board-head .more { font-size: 16px; }
.section-main--board .link { display: block; position: relative; padding: 40px 0 30px; }
.section-main--board .link::before { content: ''; z-index: -1; position: absolute; top: 0; left: -34px; width: calc(100% + 68px); height: 100%; background: #2e3092; border-radius: 10px; opacity: 0; transition: opacity ease .35s; }
.section-main--board .link:not(:last-child) { border-bottom: 1px solid #dddddd; }
.section-main--board .link .title { font-size: 22px; color: #111; font-weight: 600; transition: color ease .35s; }
.section-main--board .link .text { overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.4; margin: 4px 0 6px; font-size: 16px; color: #888888; transition: color ease .35s; }
.section-main--board .link .date { text-align: right; font-size: 15px; color: #aaaaaa; font-weight: 300; transition: color ease .35s; }
@keyframes snapIn {
	from { opacity: 0; transform: rotate(25deg); }
	to { opacity: 1; transform: rotate(0); }
}
@keyframes snapOut {
	from { opacity: 1; transform: rotate(0); }
	to { opacity: 0; transform: rotate(-25deg); }
}
@media screen and (pointer: fine) {
	.section-indicator .top:hover::after { animation: scrollTop ease 1s infinite; }

	.section-main--board .lists .link:hover::before { opacity: 1; }
	.section-main--board .link:hover { border-bottom-color: transparent; }
	.section-main--board .link:hover .title,
	.section-main--board .link:hover .text,
	.section-main--board .link:hover .date { color: #fff; }
}
@media screen and (min-width: 1025px) {

}
@media screen and (max-width: 1400px) {
	.section-main--intro .lists .text b { font-size: 35px; }
}
@media screen and (max-width: 1024px) {
	.section-main .section-title .title { font-size: 30px; }
	.section-main .section-title .text { font-size: 18px; }
	.section-main .section-title .button { font-size: 13px; margin-top: 34px; }

	.section-indicator .top { font-size: 13px; bottom: 20px; }
	.section-indicator .top i { width: 24px; height: 24px; background-size: auto 36px; }
	.section-indicator .top span { margin: 10px 0 16px; }
	.section-indicator .top::after { width: 30px; height: 60px; }

	.section-main--visual .text-wrap .title { font-size: 40px; }
	.section-main--visual .text-wrap .text { font-size: 20px; }

	.section-main--intro .intro-head { width: 100%; }
	.section-main--intro .intro-body { width: 100%; margin: 80px 0 0; }
	.section-main--intro .lists { margin: -10px -16px; }
	.section-main--intro .lists li { padding: 10px 16px; width: 25%; }
	.section-main--intro .lists .icon { width: 24px; height: 24px; }
	.section-main--intro .lists .title { font-size: 16px; }
	.section-main--intro .lists .text { font-size: 24px; }
	/* .section-main--intro .lists .text b { font-size: 48px; } */

	.section-main--technology .inner { padding: 100px 0; }
	.section-main--technology .text-wrap { width: 50%; }
	.section-main--technology .image-wrap,
	.section-main--technology .media-wrap { flex: 1 1; margin-top: 100px; }
	.section-main--technology .media-wrap { margin: 0; }
	.section-main--technology .swiper-pagination { flex-direction: row; top: 40%; margin: -155px auto 0; display: inline; }
	.section-main--technology .swiper-pagination .swiper-pagination-bullet { margin-bottom: 0px !important; margin-right: 24px;text-align: left; }

	.section-main--board .section-title { width: 100%; }
	.section-main--board .main-board-container { margin: 30px -16px -16px; width: 100%; flex-wrap:wrap; }
	.section-main--board .main-board { padding: 16px; width:100%; }
	.section-main--board .main-board-head .title { font-size: 24px; }
	.section-main--board .main-board-head .more { font-size: 14px; }
	.section-main--board .link { padding: 16px 0; }
    .section-main--board .link:nth-child(3) { display:none; }
	.section-main--board .link .title { font-size: 18px; }
	.section-main--board .link .text { font-size: 15px; -webkit-line-clamp: 1; }
	.section-main--board .link .date { font-size: 13px; }
	.section-main--board .split { display: inline-block; }
}
@media screen and (max-width: 1024px) and (orientation: landscape) {
	.section-main--visual .media .mo { display: block; }

	.section-main--intro .intro-block { margin-top: 15px; }
	.section-main--intro .intro-head { display: flex; align-items: flex-end; justify-content: space-between; }
	.section-main--intro .intro-body { margin-top: 50px; }
	.section-main--board .main-board-container { flex-wrap: nowrap; }
	.section-main--global .section-title { margin-top: 0; }

	.section-main--technology .inner { align-items: center; }
	.section-main--technology .image-wrap { max-width: 200px; }
	.section-main--technology .media-wrap { margin-top: 100px; }
	.section-main--technology .text-wrap { margin-top: 0; padding-top: 75px; }
	.section-main--technology .text-wrap.lists { margin-top: 100px; }
	.section-main--technology .swiper-pagination { top: 80px; margin: 0 auto; }
}
@media screen and (max-width: 768px) {
	.section-main .section-title .title { font-size: 24px; }
	.section-main .section-title .text { font-size: 16px; }
	.section-main .section-title .button { margin-top: 20px; padding: 10px 30px; }

	.section-main--visual .text-wrap .title { font-size: 26px; }
	.section-main--visual .text-wrap .text { font-size: 16px; }
	.section-main--visual .media .pc { display: none; }
	.section-main--visual .media .mo { display: block; }

	.section-main--technology .inner { flex-direction: column-reverse; }
	.section-main--intro .intro-body { margin-top: 46px; }
	.section-main--intro .lists li { width: 50%; }
	.section-main--intro .lists .title { font-size: 14px; margin-bottom: 14px; }
	.section-main--intro .lists .text { font-size: 18px; }
	.section-main--intro .lists .text b { font-size: 26px; }
	.section-main--intro .lists .icon { margin-right: 4px; width: 18px; height: 18px; }
	.section-main--intro > p {right: 70px; bottom: 50px;}

	.section-main--global { background-position: bottom right 23%; background-size: 180% auto; }

	.section-main--technology .inner { margin-top: 160px; padding: 0; }
	.section-main--technology .text-wrap { padding-top: 30px; width: 100%; }
	.section-main--technology .image-wrap,
	.section-main--technology .media-wrap { margin: 0; }
	.section-main--technology .image-wrap { width: 70%; max-width: 300px; }
	.section-main--technology .media-wrap { max-width: 500px; }
	.section-main--technology .swiper-slide:last-child .text-wrap { padding-top: 30px; }
	.section-main--technology .swiper-pagination .swiper-pagination-bullet { margin-bottom: 50px; }
	.section-main--board .main-board-container { margin-top: 50px; }
	.section-main--board .main-board-head .title { font-size: 20px; }
	.section-main--board .main-board-head .more { font-size: 13px; }
	.section-main--board .link { padding: 10px 0; }
	.section-main--board .link .title { font-size: 16px; }
	.section-main--board .link .text { font-size: 14px; -webkit-line-clamp: 1; }
	.section-main--board .link .date { font-size: 12px; }
}















/* Sub */
@keyframes subvisualFadeIn {
	to { opacity: 1; }
}
@keyframes subVisual {
    to { transform: scale(1); }
}
.sub .main { padding-bottom: 160px; }

.sub-heading { display: flex; align-items: center; margin: 250px auto 80px; max-width: 1440px; width: 90%; }
.sub-heading .line { flex: 1 1; display: block; margin: 0 50px; height: 1px; background: #e5e5e5; }
.sub-heading .title {  line-height: 1; font-size: 52px; color: #111; }
.sub-heading .breadcrumb ul { display: flex; }
.sub-heading .breadcrumb li { color: #888888; font-weight: 500; }
.sub-heading .breadcrumb li:not(:last-child)::after { content: '/'; margin: 0 10px; }
.sub-heading .breadcrumb a { font-family: 'Figtree'; color: inherit; font-size: 15px; text-decoration: underline; text-underline-offset: 0.125em; }
.sub-heading .breadcrumb span { color: #111; font-weight: 700; }

/* .sub-visual { overflow: hidden; display: flex; align-items: center; position: relative; height: 80vh; min-height: 740px; text-align: center; } */
.sub-visual { overflow: hidden; display: flex; align-items: center; position: relative; height: calc(100vh - 102px); min-height: 500px; text-align: center; }
.sub-visual h1{text-align: left; font-size:80px; color:#fff; line-height: 1.2;}
.sub-visual p{text-align: left; color:#fff;}
.sub-visual .background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 1; /*animation: subvisualFadeIn ease .85s forwards;*/ }
.sub-visual .background::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover !important; transform: scale(1.15); animation: 2s subVisual cubic-bezier(0.39, 0.58, 0.57, 1) forwards; }
.sub-visual--web .background::before { background-image: url('/new/images/sub/visual-web.jpg'); }
.sub-visual--database .background::before { background-image: url('/new/images/sub/visual-database.jpg'); }
.sub-visual--dbsafer .background::before { background-image: url('/new/images/sub/visual-dbsafer.jpg'); }
.sub-visual--network .background::before { background-image: url('/new/images/sub/visual-network.jpg'); }
.sub-visual--cloud .background::before { background-image: url('/new/images/sub/visual-cloud.jpg'); }
.sub-visual--support .background::before { background-image: url('/new/images/sub/visual-support.jpg'); }
.sub-visual.sub-visual--about .background::before{background:url(/new/images/sub/compnay-bg.jpg);}
.sub-visual.sub-visual--ceo .background::before{background:url(/new/images/sub/ceo-bg.jpg);}
.sub-visual.sub-visual--history .background::before{background:url(/new/images/sub/history-bg.jpg);}
.sub-visual.sub-visual--ci .background::before{background:url(/new/images/sub/ci-bg.jpg);}
.sub-visual.sub-visual--management .background::before{background:url(/new/images/sub/management-bg.jpg);}
.sub-visual.sub-visual--workplace .background::before{background:url(/new/images/sub/workplace-bg.jpg);}
.sub-visual.sub-visual--partner .background::before{background:url(/new/images/sub/partner-bg.jpg);}
.sub-visual.sub-visual--process .background::before{background:url(/new/images/sub/ci-bg.jpg);}
.sub-visual.sub-visual--equipment .background::before{background:url(/new/images/sub/equipment-bg.jpg);}
.sub-visual.sub-visual--laboratory .background::before{background:url(/new/images/sub/laboratory-bg.jpg);}
.sub-visual.sub-visual--performance .background::before{background:url(/new/images/sub/performance-bg.jpg);}
.sub-visual.sub-visual--innovation .background::before{background:url(/new/images/sub/innovation-bg.jpg);}
.sub-visual.sub-visual--design .background::before{background:url(/new/images/sub/design-bg.jpg);}
.sub-visual.sub-visual--personnel .background::before{background:url(/new/images/sub/personnel-bg.jpg);}
.sub-visual.sub-visual--job .background::before{background:url(/new/images/sub/job-bg.jpg);}
.sub-visual.sub-visual--schedule .background::before{background:url(/new/images/sub/schedule-bg.jpg);}
.sub-visual.sub-visual--information .background::before{background:url(/new/images/sub/information-bg.jpg);}
.sub-visual.sub-visual--presentation .background::before{background:url(/new/images/sub/presentation-bg.jpg);}
.sub-visual.sub-visual--announcement .background::before{background:url(/new/images/sub/announcement-bg.jpg);}
.sub-visual.sub-visual--talented .background::before{background:url(/new/images/sub/talented-bg.jpg);}
.sub-visual.sub-visual--recruitment .background::before{background:url(/new/images/sub/recruitment-bg.jpg);}
.sub-visual.sub-visual--inquiry .background::before{background:url(/new/images/sub/inquiry-bg.jpg);}
.sub-visual.sub-visual--employment .background::before{background:url(/new/images/sub/employment-bg.jpg);}
.sub-visual.sub-visual--composition .background::before{background:url(/new/images/sub/composition-bg.jpg);}
.sub-visual.sub-visual--notification .background::before{background:url(/new/images/sub/notification-bg.jpg);}

.sub-visual .inner { z-index: 2; }
.sub-visual .title { position: relative; font-size: 80px; color: #fff; font-weight: 700; text-align: left; }
.sub-visual-tab { border-bottom: 1px solid #e5e5e5; padding:50px 0 100px;}
.sub-visual-tab ul { display: flex; margin: auto; max-width: 1500px; width: 90%; }
.sub-visual-tab li { margin-right: 10px; width: auto; }
.sub-visual-tab a { display: flex; align-items: center; justify-content: center; position: relative; padding: 10px 30px; font-size: 18px; color: #999; font-weight: 500; border:1px solid #E5E5E5; border-radius:26px; }
.sub-visual-tab a::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 3px; opacity: 0; background: #000; transform: scaleX(0); transform-origin: center; transition: all ease .35s; }
.sub-visual-tab li.on a { color: #fff; background-color: #3437CC; }


.sub-visual .inner:before { display: block; content: ""; width: 1px; height: calc(1000% - 0px); background: #fff; position: absolute; left: 0; top: calc(100% + 50px); z-index: 10; transform: scaleY(0); animation: lineActiveAnimation 2.3s cubic-bezier(0.445,0.05,0.55,0.95) infinite;}
.sub-visual .inner:after { display: block; content: ""; width: 1px; height: calc(1000% - 0px); background: rgba(255,255,255,0.4); position: absolute; left: 0; top: calc(100% + 50px); }
@keyframes lineActiveAnimation {
	0%{
		-webkit-transform:scaleY(1);
		transform:scaleY(1);
		-webkit-transform-origin:center top;
		transform-origin:center bottom;
	}
	49%{
		-webkit-transform:scaleY(0);
		transform:scaleY(0);
		-webkit-transform-origin:center top;
		transform-origin:center bottom;
	}
	50%{
		-webkit-transform:scaleY(0);
		transform:scaleY(0);
		-webkit-transform-origin:center bottom;
		transform-origin:center top;
	}
	99%{
		-webkit-transform:scaleY(1);
		transform:scaleY(1);
		-webkit-transform-origin:center bottom;
		transform-origin:center top;
	}
	100%{
		-webkit-transform:scaleY(1);
		transform:scaleY(1);
		-webkit-transform-origin:center bottom;
		transform-origin:center top;
	}
}

.top-bloque { padding: 190px 0; text-align: center; color: #fff; background-repeat: no-repeat; background-position: center; background-size: cover; background-attachment: fixed; }
.top-bloque--end { margin-bottom: -160px; }
.top-bloque--history { background-image: url('/new/images/sub/top-bloque-history.jpg'); }
.top-bloque--lab { background-image: url('/new/images/sub/top-bloque-lab.jpg'); }
.top-bloque .title { line-height: 1.5; font-size: 40px; font-weight: 700; }
.top-bloque .category { display: block; margin-bottom: 24px; font-family: 'Figtree'; font-weight: 700; opacity: .6; }

.section { padding: 130px 0; padding:130px 0 0;}
.section:last-child { padding-bottom: 0; }
.section .section-title { margin-bottom: 40px; }
.section .section-title:not(:first-child) { margin-top: 130px; }
.section .section-title h3 { font-size: 40px; color: #111; font-weight: 700; }
.section .section-title p { margin-top: 20px; font-size: 18px; color: #444444; font-weight: 500; }
.section .section-title p.large { font-size: 24px; }
.section--start { padding-top: 160px; }
.section--end { padding-bottom: 190px; }

@media screen and (pointer: fine) {
	.sub-heading .breadcrumb a:hover { color: #111; }

	.sub-visual-tab a:hover { color: #111; }
}
@media screen and (max-width: 1024px) {
	.section { padding: 110px 0; padding:110px 0 0;}
	.section--start { padding-top: 100px; }
	.section--end { padding-bottom: 120px; }
	.section .section-title { margin-bottom: 25px; }
	.section .section-title h3 { font-size: 30px; }
	.section .section-title p { font-size: 17px; margin-top: 14px; }
	.section .section-title p.large { font-size: 20px; }

	.sub .main { padding-bottom: 120px; }

	.sub-heading { margin: 200px auto 60px; }
	.sub-heading .title { font-size: 36px; }
	.sub-heading .breadcrumb li:not(:last-child)::after { margin: 0 14px; }

	.sub-visual { height: 50vw; min-height: 240px; }
	.sub-visual .title { font-size: 48px; }
	.sub-visual-tab ul { margin: 0; max-width: none; }
	.sub-visual-tab li { flex: 1 0 auto; margin-right: 15px; }
	.sub-visual-tab li:last-child { margin-right: 0; }
	.sub-visual-tab a { height: 60px; font-size: 16px; }
}
@media screen and (max-width: 768px) {
	.section { padding: 80px 0; padding:80px 0 0;}
	.section .section-title { margin-bottom: 16px; }
	.section .section-title h3 { font-size: 24px; }
	.section .section-title p { font-size: 15px; margin-top: 14px; }
	.section .section-title p.large { font-size: 17px; }

	.sub .main { padding-bottom: 80px; }

	.sub-heading { flex-direction: column; align-items: flex-start; margin: 140px auto 50px; }
	.sub-heading .title { font-size: 30px; }
	.sub-heading .breadcrumb { margin-top: 15px; }

	.sub-visual .title { font-size: 30px; }
    .sub-visual-tab{padding:30px 0 60px;}
    .sub-visual-tab li{margin-right:10px;}
    .sub-visual-tab a {font-size:14px; height:40px; padding:10px 20px;}
}


/* ------- Modal ------- */
.modal-container { display: none; z-index: 11; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); }
.modal-container .modal-wrapper { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 5px; width: auto; height: 100%; min-height: calc(100% - 10px); max-height: calc(100% - 10px); }
.modal-container .modal { overflow: hidden; display: flex; flex-direction: column; justify-content: center; position: relative; padding: 0 60px; max-width: 800px; width: 100%; height: auto; }
.modal-container .head-title { margin-bottom: 15px; padding-bottom: 10px; text-align: center; font-size: 1.6rem; font-weight: 600; color: #111; border-bottom: 1px solid var(--border-c); }
.modal-container .modal-body { overflow-x: hidden; overflow-y: auto; padding: 24px 5%; max-height: 600px; background: #fff; }
.modal-container .modal-body p:not(.head-title) { margin: 14px 0; }
.modal-container .modal .close { display: block; position: absolute; top: -20px; right: 0; width: 60px; height: 60px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: auto 55%; }
.modal-container .modal img { max-width: 100%; }
.modal-container--auto .modal { max-width: 100%; width: auto; }
.modal-container--flat .modal-body { padding: 0; }
.modal-container .modal-agree h2{font-size:20px}
.modal-container .modal-agree p{font-size:16px;}
.modal-container .modal-agree ul { list-style: inherit; margin: revert; padding: revert; }
.modal-container .modal-agree ul li { font-size:16px; list-style: inherit; }
@media screen and (pointer: fine) {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 768px) {
    .modal-container .modal{padding:0 20px; overflow:unset; max-height:500px;}
    .modal-container .modal .close{top:-48px;}

    .modal-container .modal-agree h2{font-size:16px;}
    .modal-container .modal-agree p{font-size:14px;}
    .modal-container .modal-agree ul li{font-size:14px;}
}
/* ------- Inquiry ------- */
.inquiry-container .inquiry-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 30px; }
.inquiry-container .inquiry-head .title { font-size: 40px; font-weight: 700; color: #111; }
.inquiry-container .inquiry-head .note { margin-bottom: 10px; font-size: 16px; font-weight: 500; }
.inquiry-container .inquiry-body .terms-container { margin-top: 70px; }
.inquiry-container .inquiry-foot { margin-top: 70px; text-align: center; }
.inquiry-container .inquiry-foot .button { padding-top: 24px; padding-bottom: 24px; max-width: 220px; width: 100%; }
.inquiry-container table { border-top: 1px solid #1c1c1c; }
.inquiry-container table tr { border-bottom: 1px solid #dcdcdc; }
.inquiry-container table th { padding: 42px 0 30px; vertical-align: top; width: 115px; text-align: left; font-weight: 500; color: #111; }
.inquiry-container table td { padding: 30px 0; }
.inquiry-container input,
.inquiry-container textarea { background-color: #f5f5f5; }
.inquiry-container .radio label { font-size: inherit; color: inherit; }
@media screen and (pointer: fine) {

}
@media screen and (min-width: 1025px) {
	.inquiry-container table td { height: 118px; }
	.inquiry-container input,
	.inquiry-container select,
	.inquiry-container textarea { padding-top: 16px; padding-bottom: 16px; }
}
@media screen and (max-width: 1024px) {
	.inquiry-container table,
	.inquiry-container table tbody,
	.inquiry-container table tr,
	.inquiry-container table th,
	.inquiry-container table td { display: block; }
	.inquiry-container table th { padding: 20px 0 6px; width: 100%; }
	.inquiry-container table td { padding: 6px 0 20px; }
	.inquiry-container .input { width: 100%; }
	.inquiry-container .inquiry-head { margin-bottom: 20px; }
	.inquiry-container .inquiry-head .title { font-size: 30px; }
	.inquiry-container .inquiry-head .note { margin-bottom: 6px; font-size: 14px; }
	.inquiry-container .inquiry-body .terms-container { margin-top: 40px; }
	.inquiry-container .inquiry-foot { margin-top: 50px; }
	.inquiry-container .inquiry-foot .button { padding-top: 20px; padding-bottom: 20px; }
}
@media screen and (max-width: 768px) {
	.inquiry-container .inquiry-head { margin-bottom: 14px; }
	.inquiry-container .inquiry-head .title { font-size: 24px; }
	.inquiry-container .inquiry-head .note { font-size: 13px; }
	.inquiry-container .inquiry-body .terms-container { margin-top: 30px; }
	.inquiry-container .inquiry-foot .button { padding-top: 16px; padding-bottom: 16px; }
}


/* ------- Terms ------- */
.terms-basic { }
.terms-basic--scroll { overflow-x: hidden; overflow-y: auto; padding: 34px; max-height: 300px; border: 1px solid #ddd; }
.terms-basic ol,
.terms-basic ul { margin: revert; padding: revert; list-style: revert; }
.terms-basic h1 { margin: 26px 0; font-size: 26px; color: #222; }
.terms-basic p { font-size: inherit; }
.circle-num { list-style: none !important; counter-reset: numList; }
.circle-num > li { position: relative; }
.circle-num > li::before { content: counter(numList); counter-increment: numList; position: absolute; top: 6px; left: -24px; width: 18px; height: 18px; line-height: 16px; text-align: center; font-size: 13px; border: 1px solid #666; border-radius: 50%; }
@media screen and (max-width: 1024px) {
	.terms-basic--scroll { padding: 36px; font-size: 14px; }
	.terms-basic h1 { margin: 20px 0; font-size: 22px; }
	.circle-num > li::before { top: 3px; left: -22px; width: 16px; height: 16px; line-height: 14px; font-size: 10px; }
}
@media screen and (max-width: 768px) {
	.terms-basic--scroll { padding: 24px; font-size: 13px; }
	.terms-basic h1 { margin: 16px 0; font-size: 18px; }
	.circle-num > li::before { top: 1px; left: -19px; }
}

.terms-container .terms-head { margin-bottom: 14px; }
.terms-container .terms-head .title { font-size: 24px; font-weight: 700; color: #111; }
.terms-container .terms-foot { margin-top: 14px; text-align: right; }
@media screen and (max-width: 1024px) {
	.terms-container .terms-head .title { font-size: 20px; }
}
@media screen and (max-width: 768px) {
	.terms-container .terms-head .title { font-size: 18px; }
}
