@charset "UTF-8";

* {margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-print-color-adjust: exact !important; print-color-adjust: exact; word-break: keep-all; word-wrap: break-word; overflow-wrap: break-word; -webkit-overflow-scrolling: touch;}
:root {
  --sat: env(safe-area-inset-top);
  --sar: env(safe-area-inset-right);
  --sab: env(safe-area-inset-bottom);
  --sal: env(safe-area-inset-left);
}
html {width: 100%; height: 100%; font-size: .052vw; line-height:130%; font-style: normal;}
body {position: relative; height: auto; font-family: "NotoSans_Regular", "맑은 고딕", "Malgun Gothic", sans-serif; font-weight: 400; font-size: max(16rem, 14px); color: #06161E; line-height: 150%; height: 100%; letter-spacing: -.15em; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; -webkit-print-color-adjust: exact !important;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, table, tr, th, td {margin: 0; padding: 0; font-weight: normal;}
ul, ol, li {list-style: none;}
img, fieldset {border: none; vertical-align: top;}
img::selection {background: transparent;}
legend, caption {visibility: hidden; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
textarea, button {vertical-align: middle;}
input, select {font-family: "NotoSans_Regular", "맑은 고딕", "Malgun Gothic", sans-serif; vertical-align: top;}
input {padding: 0; height: 39rem;}
input[type="text"]::-ms-clear {display: none;}
input:focus, input:active {outline: none;}
.attach_area .file_div input[readonly] {pointer-events: none;}
option {padding: 3px 10px;}
option:focus, option:active {outline: none;}
input[type="radio"], input[type="checkbox"] {border: 0; padding: 0; height: auto; -webkit-box-shadow: none; box-shadow: none;}
input[type="password"] {height: 40px; border: 1px solid #e5e5e5; color: #06161E; background: transparent; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="password"]::-webkit-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="password"]:-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="password"]::-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="password"]::placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="password"]:disabled {color: #999; background-color: #f3f3f3;}
input[type="password"].readonly {color: #999; background-color: #f3f3f3;}
input[type="password"][readonly=readonly] {color: #999; background-color: #f3f3f3;}
input[type="text"] {color: #06161E; font-size: max(16rem, 14px); background: transparent; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="text"]::-webkit-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="text"]:-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="text"]::-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="text"]::placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="text"]:disabled {color: #D9DDE0; background-color: transparent;}
input[type="text"]:-moz-read-only {color: #999; background-color: transparent;}
input[type="text"]:read-only {color: #C6CCD1; background-color: transparent;}
input[type="text"].readonly {color: #C6CCD1; background-color: transparent;}
input[type="text"]:disabled + .cal_btn {opacity: .5;}
input[type="text"]:disabled::-webkit-input-placeholder {color: #C6CCD1;}
input[type="text"]:disabled:-ms-input-placeholder {color: #C6CCD1; font-size: max(16rem, 14px);}
input[type="text"]:disabled::-ms-input-placeholder {color: #C6CCD1; font-size: max(16rem, 14px);}
input[type="text"]:disabled::placeholder {color: #C6CCD1; font-size: max(16rem, 14px);}
input[type="text"]:disabled {color: #C6CCD1; background-color: #fff;}
input[type="tel"] {background: #fff; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none;}
input[type="tel"]::-webkit-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="tel"]:-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="tel"]::-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="tel"]::placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="tel"]:disabled {color: #999; background-color: #f3f3f3;}
input[type="tel"]:-moz-read-only {color: #999; background-color: #f3f3f3;}
input[type="tel"]:read-only {color: #999; background-color: #f3f3f3;}
input[type="tel"].readonly {color: #999; background-color: #f3f3f3;}
input[type="tel"]:disabled + .cal_btn {opacity: .5;}
input[type="number"] {font-size: max(16rem, 14px); background-color: transparent;}
input[type="number"]::-webkit-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="number"]:-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="number"]::-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="number"]::placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
input[type="number"]:disabled {color: #999;}
input[type="number"]:-moz-read-only {color: #999;}
input[type="number"]:read-only {color: #999;}
input[type="number"].readonly {color: #999;}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
select {font-size: max(18rem, 16px); color: #888; appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; vertical-align: top; background: transparent; border: none;}
select::-ms-expand {display: none;}
select:disabled {color: #9CA1A6; opacity: 1;}
textarea {padding: 0; font-family: "NotoSans_Regular", "맑은 고딕", "Malgun Gothic", sans-serif; color: #06161E; font-size: max(16rem, 14px); -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; border-radius: 0; vertical-align: top; background: #fff; border: 1px solid #e5e5e5; resize: none;}
textarea:focus, textarea:active {outline: none;}
textarea::-webkit-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
textarea:-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
textarea::-ms-input-placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
textarea::placeholder {color: #9CA1A6; font-size: max(16rem, 14px);}
textarea:disabled {color: #D9DDE0; background-color: #f3f3f3;}
textarea:-moz-read-only {color: #D9DDE0; background-color: #f3f3f3;}
textarea:read-only {color: #D9DDE0; background-color: #f3f3f3;}
a {text-decoration: none; color: #06161E;}
a:hover, a:focus, a:active {text-decoration: none;}
table {width: 100%; border-collapse: collapse;}
button {background: none; border: none; padding: 0; margin: 0; font-family: "NotoSans_Regular", "맑은 고딕", "Malgun Gothic", sans-serif; font-size: max(18rem, 16px); cursor: pointer; overflow: visible; white-space: nowrap;}
button::-moz-focus-inner {padding: 0; border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}
.swiper-button-next:after, .swiper-button-prev:after {display: none;}

/* --------------------------------------------- Common style 공통 스타일 - START --------------------------------------------- */
body.stop-scroll {overflow: hidden; height: 100%; min-height: 100%; touch-action: none;}
#wrap {overflow:hidden; position: relative; width:100%;}
.inner{position:relative; margin:0 auto; width:1755rem;}
.only-pc {display: block !important;}
.only-tabl {display: block;}
.only-mobile {display: none;}
.dimd {display: none; content: ""; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); z-index: 50;}

.tit-wrap{position:relative; top:-80rem; text-align: center; opacity:0; transition:top 1s ease, opacity 1s ease;}
section.active .tit-wrap{top:0; opacity:1;}
.tit-wrap .title{font-size:40rem; line-height:120%; color:#fd3848; font-family: "NotoSans_Bold"}
.tit-wrap .eng-title{margin-top:20rem; font-size:max(20rem, 16px); line-height:120%; color:#c8c8c8; font-family: "GmarketSans_Medium"; letter-spacing: 0;}
.tit-wrap .sub-txt{display:flex; align-items: center; justify-content: center; margin-top:40rem; font-size:30rem; line-height:120%; color:#353535; font-family: "NotoSans_Medium"}
.tit-wrap .sub-txt span img{width:117rem;}

@media all and (max-width: 1023px) {
  html {font-size: .130vw;}

  .inner{width:calc(100% - 74rem);}
  .only-pc {display: none !important;}
  .only-tabl {display: block;}
  .only-mobile {display: block;}

  .tit-wrap .title{font-size:30rem;}
  .tit-wrap .eng-title{margin-top:8rem; font-size:15rem;}
  .tit-wrap .sub-txt{display:block; margin-top:30rem; font-size:28rem; line-height:140%;}
  .tit-wrap .sub-txt span img{position:relative; top:7rem; width:90rem;}
}

@media all and (max-width: 599px) {
  html {font-size: .196vw;}
}
/* --------------------------------------------- Common style 공통 스타일 - END --------------------------------------------- */


/* --------------------------------------------- Header - START --------------------------------------------- */
#header{position:fixed; top:0; left:0; width:100%; height:81rem; z-index:10; background:transparent; transition:background 0.4s ease;}
#header .inner{display:flex; align-items: center; justify-content: space-between; height:100%;}
#header .logo img{width:117rem;}
#header nav{display:flex; align-items: center; column-gap: 55rem;}
#header nav .one-d > a{font-family: "NotoSans_Medium"; color:#fff; letter-spacing: 0; transition:color 0.4s ease;}
#header nav .one-d:hover > a{color:#e60013}
#header.scroll-down{background:#fff;}
#header.scroll-down nav .one-d > a{color:#666;}
#header.scroll-down nav .one-d:hover > a{color:#e60013;}
#header .depth-div .top-area{display:none;}
#header .all-menu{display:none;}
#header .copy{display:none;}

@media all and (max-width: 1023px) {
  #header{height:99rem;}
  #header .inner{height:100%;}
  #header .logo img{width:108rem;}
  #header .depth-div{position:fixed; top:0; right:-100%; padding:0 57rem; width:100%; height:100vh; background:#fff; transition:right 0.6s ease; z-index:1;}
  #header .depth-div.on{right:0;}
  #header .depth-div nav{flex-wrap:wrap; column-gap:unset; flex-direction:column; justify-content: center; position:absolute; top:50%; left:57rem; transform:translateY(-50%);}
  #header nav .one-d{margin-top:33rem; width:100%;}
  #header nav .one-d:first-child{margin-top:0;}
  #header nav .one-d > a{font-size:32rem; font-family: "NotoSans_Regular"; letter-spacing: -0.05em; color:#313131;}
  #header .all-menu{display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:42rem; height:30rem; background:url("../images/icon-all-menu.png") no-repeat center center/cover}
  #header .depth-div .top-area{display:flex; justify-content: space-between; align-items: center; padding-top:65rem;}
  #header .depth-div .top-area img{width:112rem;}
  #header .depth-div .top-area .close-btn{width:31rem; height:31rem; background:url("../images/icon-all-menu-close.png") no-repeat center center/cover}
  #header .copy{display:block; position:absolute; bottom:90rem; right:57rem; text-align: right; color:#a6a6a6; font-size:13rem; letter-spacing: -0.05em; font-family: "NotoSans_Light";}
  #header.scroll-down nav .one-d > a{color:#313131;}
  #header.scroll-down .all-menu{background:url("../images/icon-all-menu-black.png") no-repeat center center/cover}
}
/* --------------------------------------------- Header - END --------------------------------------------- */


/* --------------------------------------------- 회사소개 - START --------------------------------------------- */
.visual-area{position:relative; width:100%; height:max(1000rem, 800px);}
.visual-area .swiper-container{width:100%; height:100%;}
.visual-area .swiper-slide{position:relative; width:100%; height:100%;}
.visual-area .swiper-slide .img{position:absolute; top:0; left:0; width:100%; height:100%;}
.visual-area .swiper-slide .img img{width:100%; height:100%; object-fit: cover;}
.visual-area .swiper-slide .txt-wrap{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); text-align: center; color:#fff;}
.visual-area .swiper-slide .txt-wrap .tit{position:relative; top:80rem; font-size:max(16rem, 14px); letter-spacing: 0; font-family: "GmarketSans_Medium"; opacity:0; transition:top 1s ease, opacity 1s ease;}
.visual-area .swiper-slide .txt-wrap .txt{position:relative; top:80rem; margin-top:40rem; font-size:60rem; line-height:120%; opacity:0; transition:top 1s ease, opacity 1s ease;}
.visual-area .swiper-pagination{bottom:165rem;}
.visual-area .swiper-pagination-bullet{position:relative; width:13px; height:13px; background:#fff; opacity:1;}
.visual-area .swiper-pagination-bullet-active:after{display:block; content:""; position:absolute; top:-6px; left:-6px; width:23px; height:23px; border:1px solid #fff; border-radius: 50%;}
.visual-area .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 12rem;}
.visual-area .swiper-slide.on .txt-wrap .tit{top:0; opacity:1;}
.visual-area .swiper-slide.on .txt-wrap .txt{top:0; opacity:1; transition-delay:0.15s}
.visual-area .scroll-bar{position:absolute; bottom:53rem; left:50%; transform:translateX(-50%); width:37rem; height:58rem; border:2px solid #fff; z-index:1; border-radius:14px;}
.visual-area .scroll-bar:after{display:block; content:""; position:absolute; top:7rem; left:50%; transform:translateX(-50%); width:10rem; height:10rem; border:2px solid #fff; border-radius:50%;}
.visual-area .scroll-bar .arrow:nth-child(1){position:absolute; bottom:-18rem; left:50%; transform:translateX(-50%); width:11rem; height:7rem; animation:opacityAni 2s infinite}
.visual-area .scroll-bar .arrow:nth-child(2){position:absolute; bottom:-29rem; left:50%; transform:translateX(-50%); width:11rem; height:7rem; animation:opacityAni 2s infinite; animation-delay:0.5s}

@-webkit-keyframes opacityAni {
  0% {
    opacity:1;
  }
  50% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@media all and (max-width: 1023px) {
  .visual-area .swiper-slide .txt-wrap{width:80%;}
  .visual-area .swiper-slide .txt-wrap .tit{font-size:15rem; letter-spacing: 0;}
  .visual-area .swiper-slide .txt-wrap .txt{margin-top:60rem; font-size:40rem;}
  .visual-area .swiper-pagination{bottom:44rem;}
  .visual-area .scroll-bar{bottom:25%; width:18px; height:29px;z-index:1; border-radius:9px;}
  .visual-area .scroll-bar:after{top:4px; width:5px; height:5px;}
  .visual-area .scroll-bar .arrow:nth-child(1){left:50%;}
  .visual-area .scroll-bar .arrow:nth-child(2){bottom:-25rem; left:50%;}
}
/* --------------------------------------------- 회사소개 - END --------------------------------------------- */


/* --------------------------------------------- 회사소개 - START --------------------------------------------- */
.company-intro{padding:77rem 0 98rem;}
.company-intro .company-intro-img{overflow:hidden; position:relative; top:-80rem; margin-top:70rem; width:1755rem; height:374rem; opacity:0; transition:top 1s ease, opacity 1s ease;}
.company-intro .company-intro-img img{width:100%; height:100%; object-fit: cover; transform:scale(1); transition:transform 0.7s ease;}
/* .company-intro .company-intro-img:hover img{transform:scale(1.05);} */
.company-intro .txt{position:relative; top:-80rem; margin-top:50rem; text-align: center; font-family: "NotoSans_Medium"; color:#2d2d2d; font-size:max(20rem, 16px); line-height:150%; letter-spacing: -0.05em; opacity:0; transition:top 1s ease, opacity 1s ease;}
.company-intro.active .company-intro-img{top:0; opacity:1; transition-delay:0.15s}
.company-intro.active .txt{top:0; opacity:1; transition-delay:0.3s}

@media all and (max-width: 1023px) {
  .company-intro{padding:45rem 0 40rem;}
  .company-intro .company-intro-img{margin-top:40rem; left:50%; transform:translateX(-50%); width:100vw; height:380rem;}
  .company-intro .txt{margin-top:45rem; font-size:23rem;}
}
/* --------------------------------------------- 회사소개 - END --------------------------------------------- */


/* --------------------------------------------- 사업소개 - START --------------------------------------------- */
.business-intro{padding:77rem 0 112rem; background:url("../images/bg-business-intro.jpg") no-repeat center center/cover}
.business-intro .inner{width:1670rem;}
.business-intro .business-list{display:flex; column-gap: 23rem; position:relative; top:-80rem; margin-top:80rem; opacity:0; transition:top 1s ease, opacity 1s ease;}
.business-intro .business-list .list{width:calc((100% - 69rem) / 4);}
.business-intro .business-list .list .img img{width:100%; height:100%; object-fit: cover;}
.business-intro .business-list .list .tit{margin-top:35rem; color:#f04553; font-size:25rem; line-height:150%; font-family: "NotoSans_Bold"}
.business-intro .business-list .list .txt{margin-top:28rem; color:#575653; font-size:max(18rem, 14px); letter-spacing: -0.05em;}
.business-intro.active .business-list{top:0; opacity:1; transition-delay:0.15s}

@media all and (max-width: 1023px) {
  .business-intro{padding:25rem 0 65rem;}
  .business-intro .inner{width:calc(100% - 74rem);}
  .business-intro .business-list{flex-wrap:wrap; flex-direction: column; column-gap: unset; row-gap: 60rem; margin-top:20rem;}
  .business-intro .business-list .list{width:100%;}
  .business-intro .business-list .list .img{height:291rem;}
  .business-intro .business-list .list .tit{margin-top:30rem;}
  .business-intro .business-list .list .txt{font-size:22rem; line-height:150%;}
}
/* --------------------------------------------- 사업소개 - END --------------------------------------------- */


/* --------------------------------------------- 솔루션 - START --------------------------------------------- */
.solution{position:relative; height:1240rem;}
.solution .tit-wrap{position:absolute; top:0; width:100%; z-index:2;}
.solution.active .tit-wrap{top:80rem;}
.solution .swiper-container{height:100%;}
.solution .swiper-container .swiper-slide{height:100%;}
.solution .swiper-container .swiper-slide .bg{position:absolute; top:0; left:0; width:100%; height:100%;}
.solution .swiper-container .swiper-slide .bg img{width:100%; height:100%; object-fit: cover;}
.solution .swiper-container .swiper-slide .content{position:relative; padding-top:195rem; margin:0 auto; width:1755rem; z-index:1;}
.solution .swiper-container .swiper-slide .content .slide-txt{position:relative; top:80rem; margin-bottom:55rem; color:#4b4b4b; text-align: center; font-size:30rem; line-height:120%; opacity:0; transition:top 1s ease, opacity 1s ease;}
.solution .swiper-container .swiper-slide .content .flex-box{display:flex; align-items: center;}
.solution .swiper-container .swiper-slide .content .img{position:relative; top:80rem; width:calc(100% - 595rem); opacity:0; transition:top 1s ease, opacity 1s ease;}
.solution .swiper-container .swiper-slide .content .img img{width:100%;}
.solution .swiper-container .swiper-slide .content .txt-wrap{position:relative; top:80rem; margin-left:35rem; padding:85rem 100rem; width:560rem; height:560rem; background:#fff; border-radius:100rem; opacity:0; transition:top 1s ease, opacity 1s ease;}
.solution .swiper-container .swiper-slide .content .txt-wrap .title{text-align: center; font-size:40rem; color:#fd3848; font-family: "NotoSans_Bold"; line-height:150%;}
.solution .swiper-container .swiper-slide .content .txt-wrap .txt-div{margin-top:60rem;}
.solution .swiper-container .swiper-slide .content .txt-wrap .txt-div .txt{margin-top:25rem; padding-left:65rem; color:#5f5f5f; font-size:30rem; line-height:150%; font-family: "NotoSans_Medium"; background:url("../images/icon-check.png") no-repeat left top/47rem auto}
.solution .swiper-container .swiper-slide .content .txt-wrap .txt-div .txt:first-child{margin-top:0;}
.solution .swiper-container .swiper-pagination{bottom:68rem;}
.solution .swiper-container .swiper-pagination-bullet{width:40rem; height:3px; border-radius: 0; background:#fff; opacity:1;}
.solution .swiper-container .swiper-pagination-bullet-active{background:#fd3848}
.solution .swiper-container .swiper-slide.on .content .slide-txt{top:0; opacity:1; transition-delay:0.15s}
.solution .swiper-container .swiper-slide.on .content .img{top:0; opacity:1; transition-delay:0.3s}
.solution .swiper-container .swiper-slide.on .content .txt-wrap{top:0; opacity:1; transition-delay:0.45s}

@media all and (max-width: 1023px) {
  .solution{height:auto;}
  .solution.active .tit-wrap{top:40rem;}
  .solution .swiper-container .swiper-slide .content{padding:115rem 0 90rem; width:100%;}
  .solution .swiper-container .swiper-slide .content .slide-txt{margin-bottom:40rem; font-size:25rem;}
  .solution .swiper-container .swiper-slide .content .flex-box{flex-wrap:wrap;}
  .solution .swiper-container .swiper-slide .content .img{Width:100%;}
  .solution .swiper-container .swiper-slide .content .txt-wrap{margin:30rem auto 0; padding:45rem 60rem; width:375rem; height:375rem; border-radius:50rem;}
  .solution .swiper-container .swiper-slide .content .txt-wrap .title{Font-size:27rem;}
  .solution .swiper-container .swiper-slide .content .txt-wrap .txt-div{margin-top:40rem;}
  .solution .swiper-container .swiper-slide .content .txt-wrap .txt-div .txt{padding-left:40rem; margin-top:20rem; font-size:20rem; background-size:30rem auto;}
  .solution .swiper-container .swiper-pagination{bottom:45rem;}
}
/* --------------------------------------------- 솔루션 - END --------------------------------------------- */


/* --------------------------------------------- 연혁 - START --------------------------------------------- */
.history{padding-top:90rem; background:url("../images/bg-history.jpg") no-repeat center center/cover}
.history .inner{width:1715rem;}
.history .tit-wrap .title{color:#fff;}
.history .tit-wrap .eng-title{color:#eee;}
.history .swiper-container{overflow:visible; margin-top:110rem; padding-bottom:195rem;}
.history .swiper-container:after{display:block; content:""; position:absolute; top:40rem; left:50%; transform:translateX(-50%); width:100vw; height:2px; background:#fff;}
.history .year{padding-left:22rem; font-size:27rem; color:#fff; font-family: "GmarketSans_Medium"; letter-spacing: 0; line-height:150%; border-left:2px solid #fff;}
.history .swiper-slide{width:20%;}
.history .swiper-slide.on .year{font-family: "GmarketSans_Bold";}
.history .history-txt{padding:0 20rem; color:#fff;}
.history .history-txt .txt{position:relative; margin-top:30rem; padding-left:14rem; font-size:21rem; line-height:140%; letter-spacing: -0.05em;;}
.history .history-txt .txt:before{display:block; content:""; position:absolute; top:14rem; left:0; width:4px; height:4px; background:#fff; border-radius: 50%;}
.history .swiper-button-next{top:auto; margin-top:0; right:auto; left:calc(50% + 60rem); bottom: 55rem; transform:translateX(-50%);width:63rem; height:14rem; background:url("../images/icon-history-next-arrow.png") no-repeat center center/cover}
.history .swiper-button-prev{top:auto; margin-top:0; left:calc(50% - 60rem); bottom: 55rem; transform:translateX(-50%); width:63rem; height:14rem; background:url("../images/icon-history-prev-arrow.png") no-repeat center center/cover}

@media all and (max-width: 1023px) {
  .history{padding-top:55rem;}
  .history .inner{width:calc(100% - 74rem);}
  .history .swiper-container{margin-top:100rem; padding-bottom:200rem;}
  .history .swiper-container:after{top:45rem;}
  .history .swiper-slide{padding-right:20rem; width:100%;}
  .history .year{padding-left:13rem; font-size:30rem;}
  .history .history-txt{padding:0 13rem;}
  .history .history-txt .txt{font-size:24rem;}
  .history .swiper-button-prev, .history .swiper-button-next{bottom:77rem;}
}
/* --------------------------------------------- 연혁 - END --------------------------------------------- */


/* --------------------------------------------- 특허 및 인증서 - START --------------------------------------------- */
.certificate{position:relative; padding:85rem 0 180rem; background:url("../images/bg-cetificate.jpg") no-repeat center center/cover}
.certificate:before{display:block; content:""; position:absolute; top:0; left:0; width:780rem; height:100%; background:linear-gradient(to right, rgba(0,0,0,0.05), transparent)}
.certificate:after{display:block; content:""; position:absolute; top:0; right:0; width:780rem; height:100%; background:linear-gradient(to left, rgba(0,0,0,0.05), transparent)}
.certificate .inner{width:1670rem;}
.certificate .swiper-container{overflow:visible; margin-top:125rem; width:1387rem;}
.certificate .swiper-slide{margin:0 13rem; width:calc((100% - 130rem) / 4); opacity:1; transition:opacity 0.3s ease;}
.certificate .swiper-slide img{width:100%; transform:scale(1); transition:transform 0.5s ease;}
.certificate .swiper-slide:hover img{transform:scale(1.1);}
.certificate .swiper-slide.opacity{opacity:0.4;}
.certificate .swiper-button-next{right:-175rem; width:27rem; height:53rem; background:url("../images/icon-certificate-next-arrow.png") no-repeat center center/27rem auto;}
.certificate .swiper-button-prev{left:-175rem; width:27rem; height:53rem; background:url("../images/icon-certificate-prev-arrow.png") no-repeat center center/27rem auto;}

@media all and (max-width: 1023px) {
  .certificate{padding:50rem 0 180rem;}
  .certificate:before{width:150rem;}
  .certificate:after{width:150rem;}
  .certificate .inner{width:calc(100% - 74rem)}
  .certificate .swiper-container{margin-top:60rem; width:100%;}
  .certificate .swiper-slide{width:60%;}
  .certificate .swiper-button-prev{left:0;}
  .certificate .swiper-button-next{right:0;}
}
/* --------------------------------------------- 특허 및 인증서 - END --------------------------------------------- */


/* --------------------------------------------- 협력업체 - START --------------------------------------------- */
.cooperative-company{padding:75rem 0 65rem; background:#f7f5f3}
.cooperative-company .inner{width:1670rem;}
.cooperative-company .company-logo-list{display:flex; flex-wrap:wrap; margin-top:37rem;}
.cooperative-company .company-logo-list .list{display:flex; align-items: center; justify-content: center; position:relative; top:80rem; margin:33rem 21rem 0 0; width:190rem; height:132rem; background:#fff; border-radius:15rem; opacity:0; transition:top 1s ease, opacity 1s ease;}
.cooperative-company .company-logo-list .list:nth-child(8n){margin:33rem 0 0;}
.cooperative-company .company-logo-list .list img{max-width:70%;}
.cooperative-company .view-more{position:relative; top:80rem; margin-top:80rem; text-align:center; opacity:0; transition:top 1s ease, opacity 1s ease;}
.cooperative-company .view-more > a{display:inline-block; padding:10rem 20rem; font-size:max(14rem, 12px); border:1px solid #a3a3a3;}
.cooperative-company .view-more > a span{padding-left:47rem; color:#afafaf; letter-spacing: 0; font-family: "GmarketSans_Medium"; background:url("../images/icon-view-more.png") no-repeat left center/max(16rem, 14px) auto;}
.cooperative-company.active .company-logo-list .list{top:0; opacity:1;}
.cooperative-company.active .company-logo-list .list:nth-child(1){transition-delay:0.15s;}
.cooperative-company.active .company-logo-list .list:nth-child(2){transition-delay:0.25s;}
.cooperative-company.active .company-logo-list .list:nth-child(3){transition-delay:0.35s;}
.cooperative-company.active .company-logo-list .list:nth-child(4){transition-delay:0.45s;}
.cooperative-company.active .company-logo-list .list:nth-child(5){transition-delay:0.55s;}
.cooperative-company.active .company-logo-list .list:nth-child(6){transition-delay:0.65s;}
.cooperative-company.active .company-logo-list .list:nth-child(7){transition-delay:0.75s;}
.cooperative-company.active .company-logo-list .list:nth-child(8){transition-delay:0.85s;}
.cooperative-company.active .company-logo-list .list:nth-child(9){transition-delay:0.95s;}
.cooperative-company.active .company-logo-list .list:nth-child(10){transition-delay:1.05s;}
.cooperative-company.active .company-logo-list .list:nth-child(11){transition-delay:1.15s;}
.cooperative-company.active .company-logo-list .list:nth-child(12){transition-delay:1.25s;}
.cooperative-company.active .company-logo-list .list:nth-child(13){transition-delay:1.35s;}
.cooperative-company.active .company-logo-list .list:nth-child(14){transition-delay:1.45s;}
.cooperative-company.active .company-logo-list .list:nth-child(15){transition-delay:1.55s;}
.cooperative-company.active .company-logo-list .list:nth-child(16){transition-delay:1.65s;}
.cooperative-company.active .view-more{top:0; opacity:1; transition-delay:1.75s}

@media all and (max-width: 1023px) {
  .cooperative-company{padding:50rem 0 75rem;}
  .cooperative-company .inner{width:calc(100% - 74rem);}
  .cooperative-company .company-logo-list{margin-top:27rem;}
  .cooperative-company .company-logo-list .list{margin:13rem 10rem 0 0; width:calc((100% - 30rem) / 4)}
  .cooperative-company .company-logo-list .list:nth-child(4n){margin:13rem 0 0 0;}
  .cooperative-company .view-more{margin-top:64rem;}
}

@media all and (max-width: 599px) {
  .cooperative-company .company-logo-list .list{height:62rem; border-radius:10rem;}
}
/* --------------------------------------------- 협력업체 - END --------------------------------------------- */


/* --------------------------------------------- Footer - START --------------------------------------------- */

footer{padding:65rem 0 30rem; background:#232323}
footer .inner{display:flex; align-items: flex-start; padding:0 0 0 120rem; width:1670rem; color:#a3a3a3;}
footer .inner .logo{margin-right:165rem}
footer .inner .logo img{width:187rem;}
footer .inner .info-div{display:flex; flex-wrap:wrap; column-gap: 55rem; row-gap: 5rem;}
footer .inner .info-div .info-list{display: flex;}
footer .inner .info-div .info-list .tit{min-width:150rem; font-size:max(14rem, 12px); letter-spacing: -0.1em;}
/* footer .inner .info-div .info-list:nth-child(3n-1) .tit{min-width:70rem;}
footer .inner .info-div .info-list:nth-child(3n-2) .tit{min-width:107rem;} */
footer .inner .info-div .info-list .txt{font-size:max(14rem, 12px); letter-spacing: -0.1em;}
footer .inner .copy-div{display:flex; margin-top:80rem;}
footer .inner .copy-div .copy-txt{font-size:max(14rem, 12px); letter-spacing: -0.1em;}
footer .inner .copy-div .util-txt{margin-left:40rem; font-size:max(13rem, 12px); letter-spacing: -0.1em;}
footer .inner .info-div .info-list .footer-select {
  font-size: max(18rem, 16px);
  color: #888;
  -moz-appearance: none;
  -o-appearance: none;
  vertical-align: top;
  background: transparent;
  min-width: 150rem;
  font-size: max(14rem, 12px);
  -webkit-appearance: auto;border-top: 1px solid;
  height:35px;
}
footer .inner .info-div .info-list .footer-select option {
  padding: 3px 10px;
  min-width: 150rem;
  font-size: max(14rem, 12px);
  letter-spacing: -0.1em;
  background: #232323;
  opacity: 0.5;
}
option:hover  {
  
  background-color: #6666;
}



/* 패밀리 사이트 */
.shortcut_relationship {
  overflow: hidden;
  position: absolute;
  min-width: 175rem;
  text-align: center;
  transition: all ease-in-out;
  vertical-align: middle;
  border-top: 1px solid #888;
}
.shortcut_relationship.open{
  border: 1px solid #888;

}
.shortcut_relationship_btn{
  width: 100%;
  height: 35px;
  color: #fff;
  vertical-align: middle;
}
.shortcut_relationship_btn.open{
  border-bottom: 1px solid #888;
}
.shortcut_relationship_btn > span {
  position: relative;
  padding-right: 75px;
  font-size: max(14rem, 12px);
  color: #888;
}
.shortcut_relationship_btn > span::after {
  display: block;
  content: '';
  position: absolute;
  top: 55%;
  right: 0;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background: url(../images/arrow_white.svg) no-repeat;
  background-size: 100%;
}

.shortcut_relationship_btn > span.open::after { /* js */
  transform: rotate(180deg) translateY(50%);
}
.shortcut_relationship_list {
  display: none;
  font-size: max(14rem, 12px);
  background: #232323;
}
.shortcut_relationship_list> li {
  height: 38px;
}
.shortcut_relationship_list > li > a {
  display: inline-block;
  width: 100%;
  height: 100%;
  line-height: 38px;
  color: #888;
  text-align: left;
  padding-left: 10px;
  letter-spacing: 0.1px;
}
.shortcut_relationship_list > li > a:hover {
  background-color: #373737;
} 

@media all and (max-width: 1500px) {
  footer .inner{padding:0 120rem;}
  footer .inner .info-div{column-gap: 60rem;}

   /* 패밀리 사이트 */
   .shortcut_relationship {
    position: relative;
    width: 165px;
  }
  .shortcut_relationship_btn {
    height: 34px;
  }
  .shortcut_relationship_btn > span {
    font-size: 12px;
  }
  .shortcut_relationship_list > li {
    height: 34px;
    font-size: 12px;
  }
  .fnb .fnb_list .fnb_list-depth1 > .fnb_list-depth2 {
    font-size: 10px;
  }
  .footer_logo {
    margin-bottom: 15px;
  }
  .footer_address {
    margin-bottom: 14px;
    line-height: 16px;
  }
  .footer_address .separator {
    margin: 0 5px;
  }
}

@media all and (max-width: 1280px) {
  footer .inner{padding:0;}
}

@media all and (max-width: 1023px) {
  footer{padding:35rem 0 32rem;}
  footer .inner{padding:0; width:calc(100% - 74rem)}
  footer .inner .logo{margin-right:30rem;}
  footer .inner .logo img{width:110rem;}
  footer .inner .info-div{flex-wrap:wrap; flex-direction: column; row-gap: 25rem;}
  footer .inner .info-div .info-box{width:100%;}
  footer .inner .info-div .info-list .tit{min-width:110rem;}
  footer .inner .copy-div{margin-top:40rem;}
}

/* --------------------------------------------- Footer - END --------------------------------------------- */