@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard-subset.min.css');

* {margin:0;padding:0;font:inherit;}
*, *::before, *::after {box-sizing:border-box;}
html {text-size-adjust: 100%;}
body {font-size:18px;letter-spacing:-0.1px;line-height: 1;}
html, body {font-family: "Pretendard", sans-serif;font-weight:400;color:#333D4B;}
img, video, svg, picture {display:block;height:auto;max-width:100%;}
a {text-decoration:none;cursor:pointer;color:#333D4B;}
button {border:none;cursor:pointer;background-color:transparent;}
sup {line-height:1;vertical-align:0px;}
ul, ol, li {list-style:none;}
input,textarea,button,select,a {-webkit-tap-highlight-color: transparent;}

input {-webkit-appearance: none;-moz-appearance: none;appearance: none;outline:0px;border:0;}
input::-ms-clear {display: none;}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
input[type='number'] {-moz-appearance: textfield;}

select {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
select::-ms-expand {display: none;}

.blind {
  position: absolute;
  width: 1px;
  height: 1px;
  clip: rect(0 0 0 0);
  overflow: hidden;
}

.mo-only {display:none;}

.inner {width:1240px;margin:0 auto;}

.header {position:fixed;top:0;left:0;right:0;width:100%;height:86px;background:#fff;z-index:10;}
.header .header__inner {display:flex;align-items:center;max-width:1480px;margin:0 auto;height:100%;padding:0 20px;}
.header .header__logo {margin-right:72px;;}
.header .header__nav {flex-grow:1;}
.header .header__nav a {font-size:16px;font-weight:500;margin-right:42px;}
.header .header__nav a:last-child {margin-right:0;}
.header .header__menu {width:32px;height:32px;font-size:0;text-indent:-9999px;overflow:hidden;background:url(../images/header_menu.svg) no-repeat center/contain;}

.footer {border-top:1px solid #F0F0F0;background:#fff;padding:40px 0 22px;}
.footer .footer__inner {max-width:1480px;margin:0 auto;padding: 0 20px;}
.footer .footer__top {display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;}
.footer .footer__logo {font-size:0;text-indent:-9999px;overflow:hidden;width:92px;height:42px;background:url(../images/logo_footer.png) no-repeat center/contain;}
.footer .footer__links {display:flex;align-items:center;gap:12px;}
.footer .footer__links a {color:#7F8894;font-size:14px;}
.footer .footer__info {margin-bottom:30px;color:#7F8894;line-height:1.6;font-size:14px;}
.footer .footer__copyright {color:#7F8894;font-size:14px;}

.navigation {position:fixed;top:86px;left:0;right:0;bottom:0;z-index:-1;opacity:0;display:none;background-color:rgba(0, 0, 0, .8);display:flex;align-items:center;}
.navigation.show {z-index:100;opacity:1;display:flex;}
.navigation li {padding: 20px 0;border-bottom:1px solid rgba(255, 255, 255, .25);}
.navigation a {color:#fff;font-size:26px;font-weight:500;}

#container {margin-top:86px;}
.main-container .visual {background-color:#ddd;position:relative;}
.main-container .visual .swiper {height:calc(100vh - 86px);overflow:hidden;--swiper-navigation-size:32px;}
.main-container .visual .swiper .swiper-slide {display:flex;align-items:center;justify-content:center;}
.main-container .visual .swiper .swiper-button-prev {left:48px;color:#fff;}
.main-container .visual .swiper .swiper-button-next {right:48px;color:#fff;}
.main-container .visual .swiper .swiper-pagination {bottom:60px;left:50%;width:auto;transform:translateX(-50%);background:rgba(0, 0, 0, .6);padding:13px;border-radius:100px;display:inline-flex;}
.main-container .visual .swiper .swiper-pagination .swiper-pagination-bullet {width:6px;height:6px;border-radius:100px;background-color:#fff;opacity:1;transition:width .5s ease;}
.main-container .visual .swiper .swiper-pagination .swiper-pagination-bullet-active {width:40px;background-color:#367CFF;}
.main-container .visual .visual__bg {position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;}
.main-container .visual .visual__content {line-height:1.3;word-break:keep-all;padding:0 120px;position:relative;z-index:1;}
.main-container .visual .visual__content h1 {color:#fff;font-size:48px;font-weight:700;text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.25);}
.main-container .visual .visual__content h1 strong {color:#367CFF;}
.main-container .visual .visual__content p {color:#fff;font-size:22px;margin-top:20px;text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.25);}
.main-container .visual .visual__content a {display:inline-block;font-size:18px;color:#fff;background:#367CFF;border-radius:100px;padding:12px 26px;margin-top:40px;}

.main-container .service {padding:120px 0;background-color:#F9FAFB;}
.main-container .service h2 {font-size:48px;font-weight:bold;text-align:center;margin-bottom:80px;}
.main-container .service .service__grid {width:1240px;display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 1fr);gap:40px;margin:0 auto;max-width:90%;}
.main-container .service .service__item {display:flex;padding:50px;border-radius:25px;overflow:hidden;background-color:#aaa;flex-direction:column;justify-content:space-between;align-items:start;color:#fff;}
.main-container .service .service__item:nth-child(1) {grid-area: 1 / 1 / 2 / 2;height:358px;background:#000 url(../images/main/service_con1.png) no-repeat center/cover;}
.main-container .service .service__item:nth-child(2) { grid-area: 2 / 1 / 3 / 2;height:358px;background:#000 url(../images/main/service_con2.png) no-repeat center/cover;}
.main-container .service .service__item:nth-child(3) { grid-area: 1 / 2 / 3 / 3;background:#000 url(../images/main/service_con3.png) no-repeat center/cover;}
.main-container .service .service__item .service__question {display:inline-block;padding:10px 16px;border-radius: 50px;border: 1px solid rgba(240, 240, 240, 0.20);background: rgba(255, 255, 255, 0.20);backdrop-filter: blur(5.949999809265137px);font-size:18px;font-weight:400;word-break:keep-all;}
.main-container .service .service__item .service__heading {font-size:48px;font-weight:700;display:block;}
.main-container .service .service__item .service__text {font-size:20px;font-weight:400;margin-top:20px;line-height:1.5;word-break:keep-all;font-weight:300;}

.main-container .foryou {padding:120px 0 0;}
.main-container .foryou h2 {font-size:48px;font-weight:bold;text-align:center;margin-bottom:80px;}
.main-container .foryou .foryou__list {display:flex;flex-direction:column;}
.main-container .foryou .foryou__item {display:flex;}
.main-container .foryou .foryou__item:nth-child(even) {flex-direction:row-reverse;}
.main-container .foryou .foryou__item .foryou__image {width:50%;background-color:#efefef;}
.main-container .foryou .foryou__item .foryou__image img {width:100%;height:100%;object-fit:cover;}
.main-container .foryou .foryou__item .foryou__content {width:50%;display:flex;align-items:center;justify-content:center;}
.main-container .foryou .foryou__item .foryou__content__inner {width:60%;}
.main-container .foryou .foryou__item .foryou__heading {font-size:48px;font-weight:700;margin-bottom:28px;display:block;}
.main-container .foryou .foryou__item .foryou__text {font-size:22px;line-height:1.55;margin-bottom:40px;}
.main-container .foryou .foryou__item .foryou__link {display:inline-block;background-color:#367CFF;color:#fff;height:56px;line-height:56px;padding:0 25px;border-radius:8px;}


.sub__visual {width:100%;text-align:center;height:480px;background:url(../images/about/sub_visual_bg.png) no-repeat center/cover;position: relative;display:flex;align-items:center;}
.sub__visual:before {position:absolute;left:0;top:0;width:100%;height:100%;background: rgba(0, 0, 0, 0.60);display:block;content:'';} 
.sub__visual .inner {position:relative;color:#fff;line-height:1.5;}
.sub__visual .inner .sub__visual-title {font-size:36px;font-weight:700;}
.sub__visual .inner .sub__visual-title strong {color:#367CFF;}
.sub__visual .inner .sub__visual-text {margin-top:16px;color:#d3d3d3;word-break:keep-all;}


/* about */
.about-container .story {position:relative;padding:120px 0;}
.about-container .story .gradient {position:absolute;top:-100%;left:-30%;z-index:-1;}
.about-container .story .story__inner {display:flex;align-items:center;gap:40px;}
.about-container .story .story__content {flex:1;}
.about-container .story .story__content h2 {font-size:30px;font-weight:700;margin-bottom:24px;}
.about-container .story .story__content h2 span {color:#367CFF;}
.about-container .story .story__content p {line-height:1.6;color:#575757;}

.about-container .about {padding:0 0 120px;}
.about-container .about .about__content {margin-bottom:40px;}
.about-container .about .about__content h2 {font-size:30px;font-weight:700;margin-bottom:24px;}
.about-container .about .about__content h2 span {color:#367CFF;}
.about-container .about .about__content p {color:#575757;line-height:1.5;}
.about-container .about .about__card {position:relative;;border-radius:25px;overflow:hidden;border: 1px solid #ddd;}
.about-container .about .about__card-img {width:39%;height:100%;object-fit:cover;}
.about-container .about .about__card-con {flex:1;background-color: #11171D}
.about-container .about .about__card .swiper .swiper-slide {display:flex;}
.about-container .about .about__card .swiper .about__card-con {display:flex;flex-direction:column;justify-content:center;padding:0 50px;color:#fff;line-height:1.4;}
.about-container .about .about__card .swiper .about__card-con strong {font-size:40px;font-weight:600;margin-bottom:12px;}
.about-container .about .about__card .swiper .about__card-con strong span {color:#367CFF;}
.about-container .about .about__card .swiper .about__card-con p:nth-of-type(1) {font-size:18px;color:#e2e2e2;margin-bottom:20px;font-weight: 300;}
.about-container .about .about__card .swiper .about__card-con p:nth-of-type(2) {font-size:14px;color:#fff;font-weight: 300;}
.about-container .about .about__card .swiper-pagination {width:auto;left:unset;right:14px;bottom:14px;}
.about-container .about .about__card .swiper-pagination .swiper-pagination-bullet {background-color:#ddd;opacity:1;}
.about-container .about .about__card .swiper-pagination .swiper-pagination-bullet-active {background-color: #367CFF;}

.about-container .vision {margin-bottom:120px;padding:60px 0;background:url(../images/about/vision.jpg) no-repeat center/cover;position:relative;}
.about-container .vision:before {content:'';position:absolute;left:0;top:0;right:0;bottom:0;background: rgba(12, 42, 81, 0.40);}
.about-container .vision .inner {position:relative;}
.about-container .vision .vision__heading {display:block;text-align:center;font-size:30px;color:#fff;font-weight:600;margin-bottom:20px;}
.about-container .vision .vision__text {text-align:center;color:#fff;font-size:18px;line-height:1.5;}

.about-container .greeting {margin-bottom:120px;}
.about-container .greeting .inner {display:flex;gap:52px;}
.about-container .greeting .greeting__img {width:583px;height:367px;border-radius:15px;overflow:hidden;}
.about-container .greeting .greeting__img img {width:100%;height:100%;object-fit: cover;}
.about-container .greeting .greeting__heading {font-size:30px;font-weight:600;margin-bottom:30px;display:block;border-bottom:1px solid #696969;padding-bottom:20px;}
.about-container .greeting .greeting__text {color:#575757;line-height:1.55;}
.about-container .greeting .greeting__name {margin-top:14px;color:#367CFF;font-weight:500;}

.about-container .history {padding:120px 0 70px;background-color:#F9FAFB;}
.about-container .history__heading {display:block;text-align:center;font-size:30px;font-weight:600;line-height:1.45;margin-bottom:60px;}
.about-container .history__heading strong {color:#367CFF;}
.about-container .history__heading2 {display:block;text-align:center;font-size:30px;font-weight:600;line-height:1.45;margin:80px 0 60px;}
.about-container .history__area {}
.about-container .history__item {display:flex;align-items:start;gap:36px;height:130px;justify-content:center;}
.about-container .history__item:last-child {margin-bottom:0;}
.about-container .history__item .year {width:210px;text-align:right;font-size:36px;font-weight:700;}
.about-container .history__item .dot {display:block;width:26px;height:26px;border-radius:50%;background-color:#fff;border:10px solid #367CFF;margin-top:5px;position:relative;}
.about-container .history__item .dot:after {content:'';display:block;width:1px;height:64px;background-color:#CDCDCF;position: absolute;left:50%;top:calc(100% + 28px);transform:translateX(-50%);}
.about-container .history__item:last-child .dot:after {content:none;}
.about-container .history__item .detail {display:flex;align-items:center;line-height:36px;}
.about-container .history__item .num {font-size:26px;font-weight:700;color:#CDCDCF;margin-right:10px;width:38px;text-align:center;}
.about-container .history__item .text {width:355px;text-align:left;display:block;}
.about-container .history__area-highlight .history__item .year, .highlight {color:#367CFF;}

/* service */
.service-container .sub__visual {background-image:url(../images/service/sub_visual_bg.png);height:340px;}
.service-container .service {padding:100px 0 200px;}
.service-container .service__list {display:grid;grid-template-columns:repeat(3, 1fr);gap:40px;}
.service-container .service__thumb {margin-bottom:20px;}
.service-container .service__name {font-size:20px;font-weight:700;margin-bottom:12px;line-height: 1.4;}
.service-container .service__desc {font-size:16px;color:#575757;margin-bottom:20px;font-weight:300;line-height:1.4;word-break:keep-all;}
.service-container .service__link {display:inline-block;color:#fff;padding:14px 24px;border-radius:4px;background-color:#367CFF;font-size:16px;font-weight:500;}

/* service1 */
.service1-container .sub__visual {background-image:url(../images/service1/sub_visual_bg.png);height:340px;}
.service1-container,
.service2-container,
.service3-container {
  .info__area {padding:120px 0;}
  .info__box {display:flex;align-items:center;margin-bottom:200px;justify-content:space-between;gap:40px;}
  .info__thumb {width: 726px;height: 452px;border-radius:25px;overflow:hidden;}
  .info__thumb img {width:100%;height:100%;object-fit:cover;}
  .info__box:last-child {margin-bottom:0;}
  .info__box:nth-child(even) {flex-direction:row-reverse;}
  .info__title {font-size:34px;font-weight:700;margin-bottom:40px;}
  .info__title:before {content:'Q.';margin-right:6px;color:#367CFF;}
  .info__con {width:440px;}
  .info__con li {border-radius: 15px;background: #F9FAFB;padding:20px 18px;display:flex;gap:10px;font-size:18px;line-height:1.4;align-items:start;margin-bottom:20px;word-break:keep-all;}
  .info__con li:last-child {margin-bottom:0;}
}

/* service2 */
.service2-container .sub__visual {background-image:url(../images/service2/sub_visual_bg.png);height:340px;}

/* service3 */
.service3-container .sub__visual {background-image:url(../images/service3/sub_visual_bg.png);height:340px;}

@media screen and (max-width: 1480px) {
  .inner {width:100%;padding:0 14px;}

  .header .header__inner {padding:0 24px;}
  .footer .footer__inner {padding:0 24px;}
}

@media screen and (max-width: 1024px) {
  body {font-size:14px;}

  .mo-only {display:block;}
  
  .header {height:64px;}
  .header .header__inner {padding:0 20px;justify-content:space-between;}
  .header .header__nav {flex-grow:0;}
  .header .header__nav a {margin-right:8px;font-size:14px;}
  .header .header__logo {margin-right:0;}
  .header .header__logo img {height:30px;}
  .header .header__menu {background-size: 26px auto;}

  .navigation {top:64px;}
  .navigation ul {padding:0 20px;}
  .navigation a {font-size:18px;}
  
  #container {margin-top:64px;}

  .main-container .visual .swiper {height:68vh;--swiper-navigation-size:18px;}
  .main-container .visual .swiper .swiper-slide {align-items:start;}
  .main-container .visual .swiper .swiper-button-prev {left:20px;top:unset;margin-top:0;bottom:29px;}
  .main-container .visual .swiper .swiper-button-next {right:20px;top:unset;margin-top:0;bottom:29px;}
  .main-container .visual .swiper .swiper-pagination {bottom:24px;padding:10px;}
  .main-container .visual .visual__content {padding:0 20px;text-align:center;padding-top:45%;}
  .main-container .visual .visual__content h1 {font-size:24px;word-break:keep-all;}
  .main-container .visual .visual__content h1 strong {font-size:36px;}
  .main-container .visual .visual__content p {font-size:15px;line-height:1.5;}
  .main-container .visual .visual__content a {font-size:15px;}
  
  .main-container .service {padding:70px 14px;}
  .main-container .service h2 {margin-bottom:40px;font-size:24px;}
  .main-container .service .service__grid {display:flex;flex-direction:column;gap:12px;width:100%;max-width:unset;}
  .main-container .service .service__item {padding:20px;height:280px !important;}
  .main-container .service .service__item .service__question {font-size:13px;padding:6px 12px;line-height:1.4;border-radius:16px;}
  .main-container .service .service__item .service__heading {font-size:24px;}
  .main-container .service .service__item .service__text {font-size:14px;margin-top:10px;}

  .main-container .foryou {padding:70px 0 0;}
  .main-container .foryou h2 {margin-bottom:40px;font-size:24px;}
  .main-container .foryou .foryou__item {flex-direction:column-reverse;}
  .main-container .foryou .foryou__item:nth-child(even) {flex-direction:column-reverse;}
  .main-container .foryou .foryou__item .foryou__image {width:100%;height:0;padding-bottom:60%;position:relative;}
  .main-container .foryou .foryou__item .foryou__image img {position:absolute;left:0;top:0;}
  .main-container .foryou .foryou__item .foryou__content {width:100%;}
  .main-container .foryou .foryou__item .foryou__content__inner {width:100%;padding:20px 14px 40px 14px;}
  .main-container .foryou .foryou__item .foryou__heading {font-size:24px;margin-bottom:12px;}
  .main-container .foryou .foryou__item .foryou__text {font-size:14px;margin-bottom:24px;}
  .main-container .foryou .foryou__item .foryou__link {height:40px;line-height:40px;padding:0 20px;border-radius:6px;}

  .sub__visual {height:360px;}
  .sub__visual .inner {padding:0 36px;}
  .sub__visual .inner .sub__visual-title {font-size:24px;}

  .about-container .story {padding:70px 0;}
  .about-container .story .story__content h2 {font-size: 24px;margin-bottom:16px;}
  .about-container .story .story__content p br {display:none;}
  .about-container .story .story__inner {flex-direction:column;gap:28px;}

  .about-container .about {padding-bottom:70px;}
  .about-container .about .about__content {margin-bottom:28px;}
  .about-container .about .about__content h2 {font-size: 24px;margin-bottom:16px;}
  .about-container .about .about__content p br {display:none;}
  .about-container .about .about__card {flex-direction:column;border-radius:16px;}
  .about-container .about .about__card-img {width:100%;}
  .about-container .about .about__card-img img {width:100%;height:100%;object-fit:cover;}
  .about-container .about .about__card .swiper {width:100%;}
  .about-container .about .about__card .swiper .swiper-slide {flex-direction:column-reverse;height:unset;}
  .about-container .about .about__card .swiper .about__card-con {padding:20px 20px 36px;word-break: keep-all;}
  .about-container .about .about__card .swiper .about__card-con strong {font-size:18px;}
  .about-container .about .about__card .swiper .about__card-con p:nth-of-type(1) {}
  .about-container .about .about__card .swiper .about__card-con p:nth-of-type(2) {font-size:12px;}
  .about-container .about .about__card .swiper .about__card-img {height:200px;}
  .about-container .vision {margin-bottom:70px;}
  .about-container .vision .vision__heading {font-size:20px;}
  .about-container .vision .vision__text {font-size:13px;word-break:keep-all;}
  .about-container .greeting {margin-bottom:70px;}
  .about-container .greeting .inner {flex-direction:column-reverse;gap:30px;}
  .about-container .greeting .greeting__img {width:100%;height:200px;}
  .about-container .greeting .greeting__heading {font-size:24px;margin-bottom:20px;padding-bottom:14px;}
  .about-container .history {padding:70px 0 0;}
  .about-container .history__heading {font-size:20px;}
  .about-container .history__heading2 {font-size:20px;}
  .about-container .history__item {gap:16px;}
  .about-container .history__item .year {font-size:20px;width:50px;}
  .about-container .history__item .dot {margin-top:0;width:20px;height:20px;border-width:7px;}
  .about-container .history__item .detail {line-height:20px;align-items:start;}
  .about-container .history__item .num {font-size: 18px;width:28px;margin-right:8px;}
  .about-container .history__item .text {width:162px;}
  .about-container .history__item .details .detail {margin-bottom:6px;}

  .service-container .service {padding:70px 0;}
  .service-container .service__list {grid-template-columns:repeat(1, 1fr);gap:50px;}
  .service-container .service__name {font-size:18px;margin-bottom:6px;}
  .service-container .service__desc {font-size:14px;}
  .service-container .service__link {font-size:14px;padding:12px 18px;}

  .service1-container,
  .service2-container,
  .service3-container {
    .info__area {padding:70px 0;}
    .info__box {flex-direction:column !important;align-items:stretch;gap:28px;margin-bottom:80px;}
    .info__thumb {width:100%;height:200px;border-radius:14px;}
    .info__con {width:100%;}
    .info__title {font-size:20px;margin-bottom:20px;}
    .info__con li {font-size:15px;padding:10px 15px;border-radius:8px;margin-bottom:10px;}
    .info__con li img {height:19px;}
  }
}