@charset "UTF-8";
/*****************************************************************

Copyright C 그누위즈 테마 All rights reserved.
gnuwiz@naver.com & master@gnuwiz.com
본 페이지는 유료콘텐츠 그누위즈 테마 CSS입니다. 불법복제시 법적인 제제를 받으실 수 있습니다.
라이센스를 삭제하지 마세요. 라이센스 삭제시 불법 사용으로 간주될 수 있습니다.

******************************************************************/

/*공통------------------------------------------------------------------------------------------------------------------ */
#wrapper{padding-top:0 !important;padding-bottom: 0;background: #fff;}
#container_wr{padding: 0;background: #fff;transition: all .3s}
.scroll-content > section{width: 100vw;position: relative;overflow: hidden;}
.gw-sec{padding:130px 0 140px;}
.gw-sec-con-wrap{position:relative;margin:0 auto;width: var(--gw-con-width);}
.gw-sec .gw-btn01 {max-width: 200px;}
.gw-sec-container{position:relative;margin:0 auto;width: var(--gw-con-width);}
.gw-sec-sub-title{margin-bottom:15px;display: block;font-size: var(--main-title04);font-family: "Outfit", sans-serif;font-weight: 700; line-height: 1.2em; color: var(--main-color);}
.gw-sec-title {margin-bottom:30px;font-size: var(--main-title02); font-weight: 700; letter-spacing: -0.05em; color: #000; line-height: 1.3;word-break: keep-all;}
.gw-sec-txt{font-size: var(--main-text01); font-weight: 400; letter-spacing: -0.05em; color: #555; line-height: 1.6;}
.gw-dot{margin-right:10px;width: 10px;height: 10px;border-radius: 100%;background: var(--main-color);}
.gw-category{padding: 0 15px;display: inline-block;border-radius: 15px;background: var(--main-color);height: 28px;line-height: 28px;color:#fff;font-size: 14px;font-family: 'NotoKr_M', sans-serif;}

/* gw-main-about-intro------------------------------------------------------------------------------------------------------------------ */
#gw-main-about-intro{padding:120px 0;background:#fff;}
#gw-main-about-intro .gw-about-intro-layout{display:flex;gap:64px;justify-content:space-between;align-items:flex-start;}
#gw-main-about-intro .gw-about-intro-copy{flex:1 1 auto;}
#gw-main-about-intro .gw-about-intro-text{display:flex;flex-direction:column;gap:24px;font-size:16px;line-height:1.8;color:#333;font-weight:400;word-break:keep-all;}
#gw-main-about-intro .gw-about-intro-lead{font-size:24px;font-weight:700;color:#111;line-height:1.6;}
#gw-main-about-intro .gw-about-intro-lead .gw-point{color:var(--main-color);}
#gw-main-about-intro .gw-about-intro-body{display:flex;flex-direction:column;gap:16px;}
#gw-main-about-intro .gw-about-intro-body strong{font-weight:600;color:#111;}
#gw-main-about-intro .gw-about-intro-image{overflow:hidden;position:relative;width:60%;flex:0 0 60%;aspect-ratio:3 / 2;background:#f3f3f3;border-radius:32px;}
#gw-main-about-intro .gw-about-intro-image img{display:block;width:100%;height:100%;object-fit:cover;}

@media screen and (max-width:1024px) {
    #gw-main-about-intro .gw-about-intro-layout{flex-direction:column;align-items:stretch;gap:50px;}
    #gw-main-about-intro .gw-about-intro-image{width:100%;flex-basis:auto;}
    #gw-main-about-intro .gw-about-intro-image{aspect-ratio:3 / 2;}
}

@media screen and (max-width:576px) {
    #gw-main-about-intro{padding:80px 0;}
    #gw-main-about-intro .gw-about-intro-text{gap:18px;font-size:16px;line-height:1.7;}
    #gw-main-about-intro .gw-about-intro-lead{font-size:22px;}
}

/* gw-theme03-main-product : 스킨 폴더의 style.css 참조 (skin/latest/gw-theme03-main-product/style.css) */

/*버튼*/
.gw-plus-btn{display: block;width: 50px;height: 50px;border-radius: 100%;border: 2px solid #ddd;}
.gw-plus-btn > i{transform-origin:center;transition: all 0.5s;}
.gw-plus-btn:hover > i{transform: translate(-50%,-50%) rotate(360deg);}
.gw-more-btn {position: absolute; bottom: -60px; left: 50%; margin-left: -47.5px; opacity:0; text-align:center; border-radius:50%; -webkit-transition:all 0.4s ease-in-out; z-index:10; width: 95px; height: 95px; background: var(--main-color); transition:all 0.4s ease-in-out;}
.gw-more-btn:before {position: absolute; content: ''; top: -21px; left: -21px; width:137px; height: 137px; background: url(../img/gw-more-btn-txt.png)no-repeat center/100%; animation: rotateItem 10s linear infinite;}
.gw-more-btn i {font-size:var(--main-title03); line-height: 95px; color: #fff; transform: rotate(45deg); transition:all 0.4s ease-in-out;}
.gw-main-btn02{display:flex;place-content:center;border:2px solid #ddd;width: 100%;height:55px;line-height:55px;cursor:pointer;border-radius: 5px;font-family: "Outfit", sans-serif;transition: all .3s;}
.gw-main-btn04{transition: all .3s;}
.gw-main-btn04:hover{letter-spacing: 5px;}

/* cursor */
#flag {position: fixed;left: 0;top: 0;z-index: 99899999999;pointer-events: none;}
#flag > div {width: 15px;height: 15px;background: var(--main-color);border-radius: 50px;transition: all .3s ease;}
#flag.on{mix-blend-mode: difference !important;}
#flag.on > div{width:40px;height: 40px;background: #fff;}


/* gw-theme08-main-service------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-service .gw-service-list {display: flex; width: 100%; height:100vh;}
#gw-theme08-main-service .gw-service-list .gw-list-item {flex: 1; position: relative; transition:all 0.4s ease-in-out;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-item-inner {display: block; width: 100%; height: 100%;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-img-box { margin: 0;position: relative; height: 100vh;overflow: hidden; background:#000;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-img-box img {position: absolute;left: 50%; transform: translateX(-50%); height: 100%; min-width:100%; object-fit:cover; opacity:0.3; transition:all 0.4s ease-in-out;}
#gw-theme08-main-service .gw-service-list .gw-list-item:first-child .gw-img-box img{left:0; transform:translateX(0);}
#gw-theme08-main-service .gw-service-list .gw-list-item:last-child .gw-img-box img{left:auto; right:0; transform:translateX(0);}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-tit-box{margin: 0 auto;position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:calc(100% - 30px); text-align:center; z-index:9; transition:all 0.4s ease-in-out;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-tit-box .gw-tit{overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;font-size:var(--main-title03); line-height:1.35; letter-spacing:-0.005em; color:#fff; font-weight:400;font-family: "Outfit", sans-serif;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-tit-box .gw-txt{font-size:var(--main-text01); line-height:1.77; letter-spacing:-0.05em; color:rgba(255,255,255,0.3); font-weight:500;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-tit-box .gw-main-btn01{display: none;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-tit-box .gw-main-btn01 .gw-txt {color: #fff;line-height: initial;}
#gw-theme08-main-service .gw-thumb-box{position: absolute; top:0; left:0; width:100%; height:100%; padding:10rem 5rem; box-sizing:border-box; z-index:9; transition:all 0.4s ease-in-out; }
#gw-theme08-main-service .gw-thumb-box .gw-thumb-tit-box{margin-bottom:1.5rem;}
#gw-theme08-main-service .gw-thumb-box .gw-thumb-tit-box .gw-thumb-tit{overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;font-size:var(--main-title02); line-height:1.2; letter-spacing:-0.005em; color:#fff; font-weight:400; margin-bottom:1rem;}
#gw-theme08-main-service .gw-thumb-box .gw-thumb-tit-box .gw-thumb-txt{overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;line-height:1.5; letter-spacing:-0.05em; color:#fff; font-weight:500;}
#gw-theme08-main-service .gw-thumb-box .gw-check-list{margin-bottom:4rem;}
#gw-theme08-main-service .gw-thumb-box .gw-check-list p{padding-left:1.5rem;position: relative; box-sizing:border-box;  line-height:2; letter-spacing:-0.05em; color:#fff; font-weight:500; white-space:nowrap;}
#gw-theme08-main-service .gw-thumb-box .gw-check-list p:before{content:"\e929";font-family:"xeicon"; position: absolute; left:0; top:0;color:#fff; }
#gw-theme08-main-service .gw-service-list .gw-list-item.active {flex: 3;}
#gw-theme08-main-service .gw-service-list .gw-list-item.active .gw-img-box img{opacity: 1;}
#gw-theme08-main-service .gw-service-list .gw-list-item.active .gw-img-box + .gw-tit-box{opacity: 0; transition-delay:0s;}
#gw-theme08-main-service .gw-service-list .gw-list-item .gw-img-box + .gw-tit-box + .gw-thumb-box .gw-txt-effect{transform:translateY(100px); opacity:0; transition: transform 1.2s ease-in-out, opacity 0.4s ease-in-out;}
#gw-theme08-main-service .gw-service-list .gw-list-item.active .gw-img-box + .gw-tit-box + .gw-thumb-box .gw-txt-effect{transform:translateY(0); opacity:1; transition: all 1.2s ease-in-out;}

/* gw-theme08-main-business------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-business .gw-sec-container {width: var(--gw-wide-width);}
#gw-theme08-main-business .gw-business-list{display: flex; justify-content:space-between;}
/* justify-content:space-between 이면 카드가 옆 이미지 높이에 맞춰 늘어난 만큼
   남는 공간을 자식 사이에 골고루 뿌린다. 그래서 margin 을 줄여도 간격이 좁아지지 않았다.
   화살표는 position:absolute 라 흐름 밖에 있으므로 flex-start 로 바꿔도 위치가 그대로다. */
#gw-theme08-main-business .gw-business-item{position: relative; width:calc(33.33% - 1rem); display: flex; flex-direction: column; justify-content: flex-start; background:var(--main-color); border-radius:var(--gw-card-radius); padding:5rem; box-sizing:border-box;}
/* Production 과 주요 설비는 한 덩어리로 읽혀야 해서 기본 15px 보다 좁힌다 */
#gw-theme08-main-business .gw-business-item .gw-sec-sub-title{margin-bottom:6px;color:#fff;}
#gw-theme08-main-business .gw-business-item .gw-business-title{margin-bottom:32px;font-size:46px;font-weight:700;line-height:1.4;letter-spacing:-.02em;color:#fff;word-break:keep-all;}
#gw-theme08-main-business .gw-business-item .gw-business-box{position: relative;}
#gw-theme08-main-business .gw-business-item .gw-inner-con{padding-bottom:11rem;}
#gw-theme08-main-business .gw-business-item .gw-tit{overflow: hidden;margin-bottom:0.8rem;font-size: var(--main-title03);font-weight:800;color:#fff;transform: translateY(50px);opacity: 0; transition: all 0.6s ease;}
#gw-theme08-main-business .gw-business-item .gw-tit.on{transform: translateY(0);opacity: 1;}
#gw-theme08-main-business .gw-business-item .gw-txt{overflow: hidden;font-size:var(--main-title04); line-height:1.4; letter-spacing:-0.035em; color:rgba(255,255,255,0.85);transform: translateY(50px);opacity: 0; transition: all 0.6s ease;}
#gw-theme08-main-business .gw-business-item .gw-txt.on{transform: translateY(0);opacity: 1;}
#gw-theme08-main-business .gw-img-box{position: relative; width:calc(66.66% - 1rem); border-radius:var(--gw-card-radius); overflow:hidden;}
#gw-theme08-main-business .gw-img-box .gw-img-inner{position: relative; width:100%;}
#gw-theme08-main-business .gw-img-box .gw-img > span > img{width:100%;}
#gw-theme08-main-business .gw-img-box .gw-txt{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:var(--main-title04); line-height:1.5; letter-spacing:-0.6em;text-align:center; opacity:0; color:#fff; font-weight:700; width:100%;transition:all 0.4s ease-in-out; }
#gw-theme08-main-business .gw-business-arrow-box{position: absolute; bottom:5rem; left:5rem; display: flex; margin:0 -0.5rem; z-index:100;}
/* hover 시 ::before 가 scale(100) 으로 퍼지던 효과를 걷어내고 배경색만 부드럽게 바꾼다 */
#gw-theme08-main-business .gw-business-arrow-box .slick-arrow{position: relative; overflow: hidden;display: flex; align-items:center; justify-content:center; width:5rem; height:5rem; border:2px solid rgba(255,255,255,0.3); font-size:var(--main-title04); color:#fff; border-radius:50%; margin:0 0.5rem; background:transparent; transition: background-color 0.3s ease;}
#gw-theme08-main-business .gw-img-box .gw-img.slick-active .gw-txt{opacity:1; letter-spacing:0.6em;}
@media (hover: hover){
    #gw-theme08-main-business .gw-business-arrow-box .slick-arrow:hover{background-color: rgba(255,255,255,0.15);}
}

/* gw-theme08-main-about------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-about .gw-content{padding: 5rem 0 6rem; display: flex;background: url("../img/gw-theme08-main-about-bg.jpg") no-repeat center center / cover; border-radius: 500px; text-align: center;}
#gw-theme08-main-about dl{flex:1;padding: 0 7px; position: relative;}
#gw-theme08-main-about dl::after{ content: ""; width: 1px; height: 60px; background: rgba(0, 0, 0, 0.1); position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#gw-theme08-main-about dl:last-child::after{ display: none; }
#gw-theme08-main-about dl dt{ font-size: var(--main-title04); font-weight: 500; color: var(--main-color); margin-bottom: 20px;font-family: "Outfit", sans-serif;}
#gw-theme08-main-about dl dd{ font-size: var(--main-text01); font-weight: 400; color: #222; letter-spacing: -0.03em; }
#gw-theme08-main-about dl dd p{ line-height: 1.6; margin-top: 10px; }
#gw-theme08-main-about .gw-counter-box {text-indent: 1.5rem;}
#gw-theme08-main-about .gw-counter-box .counter{font-size: var(--main-title01);font-weight: 800;font-family: "Outfit", sans-serif;}
#gw-theme08-main-about .gw-counter-box .counter-txt{font-size: var(--main-title04);font-weight: 800;}

/* gw-theme08-main-recruit------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-recruit .gw-recruit-container{margin:0 auto;position: relative; max-width:100%; width:calc(100% - (2 * var(--gw-padding))); max-height:800px; height:80vh; border-radius:50px; border-bottom-right-radius:0; overflow:hidden;}
#gw-theme08-main-recruit .gw-recruit-container .gw-bg{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:url('../img/gw-theme08-main-recruit-bg.jpg') no-repeat bottom; background-size:cover;width: 100%;height: 100%;}
#gw-theme08-main-recruit .gw-recruit-container .gw-sec-container{position: relative; height:100%;}
#gw-theme08-main-recruit .gw-recruit-container .gw-tit-box{display: flex; flex-direction:column; justify-content:center; height:100%;}
#gw-theme08-main-recruit .gw-recruit-btn-list{position: absolute; bottom:-25px; right:-25px; display: flex;}
#gw-theme08-main-recruit .gw-recruit-btn-list:before{content:"";position: absolute;bottom:25px; left:0; transform:translateX(-100%);width:46px; height:50px;background:url('../img/gw-theme08-main-recruit-radius.png') no-repeat center; background-size:cover;}
#gw-theme08-main-recruit .gw-recruit-btn-list:after{content:"";position: absolute;top:0; right:25px; transform:translateY(-100%);width:46px; height:50px; background:url('../img/gw-theme08-main-recruit-radius.png') no-repeat center; background-size:cover;}
#gw-theme08-main-recruit .gw-recruit-btn-list .gw-recruit-btn-item{position: relative; display: flex; align-items:center; justify-content:space-between; width:470px; height:156px; background:transparent; border-radius:78px; padding:0 60px; box-sizing:border-box; font-size:var(--main-title04); line-height:1.2; letter-spacing:-0.05em; color:#fff; font-weight:700; border:25px solid #fff;}
#gw-theme08-main-recruit .gw-recruit-btn-list .gw-recruit-btn-item:before{content:""; position: absolute; top:-25px; left:-25px; width:calc(100% + 50px); height:calc(100% + 50px); border:25px solid #fff; box-sizing:border-box;}
#gw-theme08-main-recruit .gw-recruit-btn-list .gw-recruit-btn-item:nth-of-type(1){margin-right:-15px;}
#gw-theme08-main-recruit .gw-recruit-btn-list .gw-recruit-btn-item:nth-of-type(1):before{border-radius:78px 0 0 0;}

/* gw-theme08-main-partners------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-partners .gw-more-btn {place-content: center;}
/* gw-about-intro-lead 와 동일한 크기 */
#gw-theme08-main-partners .gw-sec-title {margin-bottom:64px;font-size:24px;line-height:1.6;}
#gw-theme08-main-partners .gw-partner-container {overflow: hidden;position: relative;width: 100%;}
/* 양옆을 배경색으로 페이드 처리해 로고가 갑자기 잘려 보이지 않게 한다 */
#gw-theme08-main-partners .gw-partner-container:before,
#gw-theme08-main-partners .gw-partner-container:after {content:"";position:absolute;top:0;width:120px;height:100%;z-index:1;pointer-events:none;}
#gw-theme08-main-partners .gw-partner-container:before {left:0;background:linear-gradient(to right, #f8f8f8, rgba(248,248,248,0));}
#gw-theme08-main-partners .gw-partner-container:after {right:0;background:linear-gradient(to left, #f8f8f8, rgba(248,248,248,0));}
/* hover 로 흐름이 멈추지 않도록 한다. 로고 띠는 계속 돈다 */
#gw-theme08-main-partners .gw-partner-track {display: flex;width: max-content;animation: gw-partner-roll 40s linear infinite;}
/* 아이템 폭 + margin-right 가 트랙의 반복 단위. gap 을 쓰면 절반 지점이 어긋난다 */
#gw-theme08-main-partners .gw-partner-item {flex:0 0 250px;margin-right:20px;overflow:hidden;width:250px;height: 100px;}
#gw-theme08-main-partners .gw-partner-item > img{width: 100%;height: 100%;padding:20px;object-fit: contain;box-sizing:border-box;}
@keyframes gw-partner-roll {
    from {transform: translateX(0);}
    to {transform: translateX(-50%);}
}
@media (prefers-reduced-motion: reduce) {
    #gw-theme08-main-partners .gw-partner-track {animation: none;}
}
#gw-theme08-main-partners .gw-partner-banner > li {width: 100%;}
#gw-theme08-main-partners .gw-partner-banner > li > a{position:relative;display:block;width:100%;height: 200px;}
/* 주요설비 카드와 같은 모서리를 쓴다. 폭이 좁아지면 함께 작아진다 */
#gw-theme08-main-partners .gw-partner-banner .gw-bg {overflow:hidden;position:relative;width: 100%;height: 100%;border-radius:var(--gw-card-radius);}
#gw-theme08-main-partners .gw-partner-banner .gw-bg > img {width: 100%;height: 100%;object-fit: cover;}
/* hover 는 이미지 위에 어둠만 얹는다. 텍스트는 .gw-text-container 로 별도 레이어라 영향받지 않는다 */
#gw-theme08-main-partners .gw-partner-banner .gw-bg:after {content:"";position:absolute;inset:0;background:#000;opacity:0;transition:opacity .3s ease;pointer-events:none;}
#gw-theme08-main-partners .gw-partner-banner > li > a:hover .gw-bg:after {opacity:.12;}
/* 스크롤 중에는 커서가 멈춰 있어도 배너가 그 밑을 지나가며 :hover 가 토글된다.
   그대로 두면 스크롤할 때마다 어둠이 깜빡인다. 스크롤이 멎을 때까지 끈다.
   transition 도 함께 없애야 한다. 아니면 사라지는 0.3초가 오히려 더 눈에 띈다. */
html.is-scrolling #gw-theme08-main-partners .gw-partner-banner > li > a:hover .gw-bg:after {opacity:0;transition:none;}
/* 배너 이미지가 밝은 회색이라 텍스트는 어두운 색을 쓴다 */
#gw-theme08-main-partners .gw-text-container {position: absolute;top: 50%;left: 50px;transform:translateY(-50%);color:#000;}
#gw-theme08-main-partners .gw-title {font-size: var(--main-title03);color: #000;}
#gw-theme08-main-partners .gw-partner-banner .gw-text {color: rgba(0,0,0,0.7);font-size: var(--main-text01);}

/* gw-theme08-main-video------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-video{position: relative;}
#gw-theme08-main-video .gw-bg-text{position: absolute;top: 50%;transform: translateY(-50%);}
.gw-flow-text {display: flex; flex: 0 0 auto; white-space: nowrap;overflow: hidden; transition:all 0.4s ease-in-out; font-size: 220px; font-weight:600; letter-spacing: -0.025em; color: rgba(255,255,255,0.1);}
.gw-flow-text .gw-flow-item {animation: videotextmove 30s linear infinite; margin-right: 30px;}
@keyframes videotextmove {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-100%, 0, 0);
    }
}

#gw-theme08-main-video .gw-sec-con-1440 {padding:0;margin:0 auto;width: 1200px;}
#gw-theme08-main-video .video-container{margin:0 auto;position: relative;height: 70vh;border-radius:30px;cursor: pointer;overflow: hidden;}
#gw-theme08-main-video .video{overflow:hidden;width: 100%;height: 100%;box-shadow: 55px 55px 150px -75px rgba(0,0,0,0.5);border-radius: 30px;}
#gw-theme08-main-video .gw-video-btn {position: absolute;right: 80px;bottom: -80px;width: 160px;height: 160px;border-radius: 100%;color:#fff;background: var(--main-color);}
#gw-theme08-main-video .gw-video-btn > a{position:relative;z-index:100;color:#fff;font-family: "Outfit", sans-serif;font-weight: 700;letter-spacing: 1px;transition:all 0.5s ease;}
#gw-theme08-main-video .gw-video-btn > a:hover{letter-spacing: 3px;}
#gw-theme08-main-video .gw-bgline-container{position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%);width:220px;height:220px;}
#gw-theme08-main-video .gw-bgline-container > div {border:1px solid rgba(255,255,255,0.5);border-radius:100%;position: absolute;top: 50%;left: 50%;opacity: 0.6;animation: gw-scale 2.4s linear infinite;}
#gw-theme08-main-video .gw-line01{width: 140px;height: 140px;margin-top:-70px;margin-left:-70px;}
#gw-theme08-main-video .gw-line02{width: 180px;height: 180px;margin-top:-90px;margin-left:-90px;}
#gw-theme08-main-video .gw-line03{width: 220px;height: 220px;margin-top:-110px;margin-left:-110px;}
#gw-theme08-main-video .gw-text-container{display: flex;flex-direction: column;align-items: center;place-content: center;height:100%;}
@keyframes gw-scale {
    from {
        opacity: 0;
    }

    to {
        transform: scale(1.2);
        opacity: 0.4;
    }
}

/* gw-theme08-main-location------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-location{display:flex;height: 100vh;}
#gw-theme08-main-location .gw-sec-sub-title{color:#fff;}
#gw-theme08-main-location .gw-sec-title{color:#fff;}
#gw-theme08-main-location > div{height: 100%;}
/* grid 트랙 폭 = 가장 넓은 자식(주소 li). 더보기 버튼이 이 폭을 그대로 채운다 */
#gw-theme08-main-location .gw-text-container {display:grid;justify-content:center;justify-items:center;box-sizing:border-box;width: 100%;max-width:560px;padding:0 20px;}
#gw-theme08-main-location .gw-sec-container > div{height:100%;}
/* 50vw 는 세로 스크롤바 폭을 포함해 가로 넘침을 만든다. 부모 기준 50% 로 나눈다 */
#gw-theme08-main-location .gw-left{width: 50%;height:100%;}
#gw-theme08-main-location .gw-left .gw-map{overflow: hidden;width: 100%;height: 100%;}
#gw-theme08-main-location .gw-left .gw-map > img {width: 100%;height: 100%;object-fit: cover;}
/* 지도 상단의 '지도 열기' 버튼이 잘리도록 iframe을 위로 올림 (하단 저작권 표기는 유지) */
/* Google 임베드는 좌상단에 장소 카드(주소 + 열기/길찾기 버튼)를 그린다.
   크로스 오리진이라 CSS 로 지울 수 없어 iframe 을 위로 밀어 잘라낸다.
   카드는 폭 305px 로 고정이라 주소가 항상 두 줄로 감기고 높이는 약 85px 이다.
   기존 56px 로는 아래 29px 이 삐져나와 주소 끄트머리가 보였다. 여유를 둬 96px 로 자른다.
   좁은 화면에서는 구글이 카드를 아예 그리지 않으므로 이 값이 과해도 문제되지 않는다. */
#gw-theme08-main-location .gw-left .gw-map > iframe {display:block;width: 100%;height: calc(100% + 96px);margin-top:-96px;border:0;}
#gw-theme08-main-location .gw-right{overflow: hidden;position: relative;display: flex;flex-direction: column;align-items: center;place-content: center;text-align: center;color:#fff;background: var(--main-color);width: 50%;transition: all 0.5s;}
#gw-theme08-main-location .gw-right .gw-location-list > li{display:flex;align-items:flex-start;justify-content:flex-start;gap:6px;font-size:16px;line-height:1.5;text-align:left;word-break:keep-all;}
#gw-theme08-main-location .gw-right .gw-location-list > li > i{flex:0 0 auto;line-height:inherit;}
#gw-theme08-main-location .gw-right .gw-location-list > li:not(:first-child){margin-top: 10px;}
#gw-theme08-main-location .gw-main-btn01{width:100%;}
#gw-theme08-main-location .gw-main-btn01,
#gw-theme08-main-location .gw-main-btn01:before{border-radius:16px;}
#gw-theme08-main-location .gw-main-btn02 {max-width: 295px;color: #fff;}
#gw-theme08-main-location .gw-main-btn04 {font-size: 11px;}
#gw-theme08-main-location .gw-plus-btn {width: 30px;height: 30px;}
@media (hover: hover) and (min-width:576px){
    /* gw.css의 40rem 원은 오른쪽 끝에서 352px까지만 덮는다. 버튼 폭이 유동적이므로 폭에 비례하는 크기로 대체 */
    #gw-theme08-main-location .gw-main-btn01:hover .gw-ico{width:200%;height:800%;right:-50%;}
}
@media (hover: hover) and (min-width:1281px){
    #gw-theme08-main-location .gw-main-btn02:hover .gw-plus-btn > i {transform: translate(-50%,-50%) rotate(360deg);}
    #gw-theme08-main-location .gw-main-btn02:hover .gw-main-btn04 {letter-spacing: 5px;}
}

/* gw-theme08-main-inquiry------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-inquiry > form {margin:0 auto;display: flex;align-items: center;place-content: center;width: 1200px;height: 100%;}
#gw-theme08-main-inquiry .gw-title-container {display: flex;flex-direction: column;align-items: center;}
#gw-theme08-main-inquiry .gw-input-container > ul {width:calc(50% - 30px);}
#gw-theme08-main-inquiry .gw-input-container > ul > li{margin-top:15px;}
#gw-theme08-main-inquiry .gw-input-container .gw-input-item{padding:0 15px 0 80px;position:relative;background: #f8f8f8;height:55px;border-radius: 30px;}
#gw-theme08-main-inquiry .gw-input-container .gw-input-title{position:absolute; top:0px; left:0px; width:100px; line-height:55px;text-align: center;font-family: "Noto Sans KR", sans-serif; font-weight: 800;}
#gw-theme08-main-inquiry .gw-input-container .gw-input{width:100%;background: #f8f8f8;border: none;height:55px;}
#gw-theme08-main-inquiry .gw-input-container .gw-file-input-container{background: #f8f8f8;border-radius: 30px;}
#gw-theme08-main-inquiry .gw-input-container .file-name{padding: 0;padding-left: 30px;border: none;background: #f8f8f8;color:#666;width: 100%;border-radius: 30px;line-height: 55px;}
#gw-theme08-main-inquiry .gw-check-list{align-items: center;place-content: center;cursor: pointer;}
#gw-theme08-main-inquiry .gw-file-input-container{cursor: pointer;}
#gw-theme08-main-inquiry .gw-file-input-button {top: 50%;right: 20px;transform: translateY(-50%);height: 30px;line-height: 30px;border-radius: 30px;}
#gw-theme08-main-inquiry .gw-textarea-item > textarea {padding:30px;border: none;background: #f8f8f8;border-radius: 30px;height: 260px;margin-top: 15px;color:#666;}
#gw-theme08-main-inquiry input[type="checkbox"].on + .check-label:before {content: "\e928";font-family: "xeicon";border-color: var(--main-color);background: var(--main-color);font-weight: 600;line-height: 16.5px;color: #fff;}
#gw-theme08-main-inquiry .gw-search {display: inline-block;width: 30px;height: 30px;background: #000;color: #fff;border-radius: 100%;cursor: pointer;box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.15);}
#gw-theme08-main-inquiry .gw-search > i {font-size: 14px;}
#gw-theme08-main-inquiry .gw-btn-container {display: flex;place-content: center;align-items: center;}

/* gw-theme08-main-quick------------------------------------------------------------------------------------------------------------------ */
#gw-theme08-main-quick .gw-sec-container{width: var(--gw-wide-width);}
#gw-theme08-main-quick .gw-quick-con{position: relative; width:100%; border-radius:4rem; background:no-repeat center right; background-size:cover; background-image:url("../img/gw-theme08-main-quick-bg.jpg"); z-index:1;}
#gw-theme08-main-quick .gw-quick-con:after{position: absolute; content:''; width:100%; height:2px; top:calc(50% - 1px); left:50%; transform:translateX(-50%); background: linear-gradient(to right,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0.2) 50%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%);}
#gw-theme08-main-quick .gw-quick-item{display: flex;align-items:center;padding:4rem;}
#gw-theme08-main-quick .gw-quick-item .gw-left-box{width:20rem;}
#gw-theme08-main-quick .gw-quick-item .gw-left-box .gw-tit{margin-bottom:1rem;font-size:var(--main-title03); line-height:1.4; letter-spacing:-0.02em; color:#fff; font-weight:700;}
#gw-theme08-main-quick .gw-quick-item .gw-right-box{width:calc(100% - 20rem);}
#gw-theme08-main-quick .gw-quick-item .gw-right-box .gw-txt{font-size:var(--main-title04); line-height:1.375; letter-spacing:-0.05em; color:#fff;word-break:keep-all;}






/* gw-main-quick(카탈로그·채용) ------------------------------------------------------------------------------------------------------- */
#gw-main-quick{background:#fff;}
#gw-main-quick .gw-quick-title{margin-bottom:60px;text-align:center;font-size:46px;font-weight:700;line-height:1.4;letter-spacing:-.02em;color:#000;word-break:keep-all;}
#gw-main-quick .gw-quick-list{display:flex;align-items:flex-start;}
#gw-main-quick .gw-quick-card{position:relative;display:block;width:52%;aspect-ratio:16 / 10;overflow:hidden;border-radius:32px;}
#gw-main-quick .gw-quick-card:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.45);transition:background .3s;}
#gw-main-quick .gw-quick-card:hover:before{background:rgba(0,0,0,.6);}
#gw-main-quick .gw-quick-catalogue{background:#8d8d8d url(../img/smkorics-quick-notice.jpg) no-repeat center/cover;}
#gw-main-quick .gw-quick-recruit{margin-left:-4%;margin-top:70px;z-index:1;background:#4f4f4f url(../img/smkorics-quick-recruit.jpg) no-repeat center/cover;}
#gw-main-quick .gw-quick-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;text-align:center;}
#gw-main-quick .gw-quick-sub{font-family:"Outfit",sans-serif;font-weight:600;font-size:15px;color:#fff;}
#gw-main-quick .gw-quick-tit{font-size:var(--main-title03);font-weight:700;color:#fff;letter-spacing:-0.05em;}
#gw-main-quick .gw-quick-more{margin-top:8px;display:inline-block;padding:14px 40px;border:1px solid rgba(255,255,255,.8);border-radius:12px;font-size:15px;color:#fff;transition:all .3s;}
#gw-main-quick .gw-quick-card:hover .gw-quick-more{border-color:#000;background:#000;color:#fff;}

@media screen and (max-width:1024px){
    #gw-main-quick .gw-quick-list{flex-direction:column;align-items:stretch;gap:20px;}
    #gw-main-quick .gw-quick-card{width:100%;}
    #gw-main-quick .gw-quick-recruit{margin-left:0;margin-top:0;}
}

@media screen and (max-width:576px){
    #gw-main-quick .gw-quick-title{margin-bottom:40px;}
    #gw-main-quick .gw-quick-card{aspect-ratio:3 / 2;}
    #gw-main-quick .gw-quick-more{padding:12px 30px;}
}

/* gw-main-patent(특허) --------------------------------------------------------------------------------------------------------------- */
#gw-main-patent{--gw-patent-card-max:380px;background:#fff;}
#gw-main-patent .gw-patent-head{margin-bottom:50px;text-align:center;}
#gw-main-patent .gw-patent-heading{font-size:46px;font-weight:700;line-height:1.4;letter-spacing:-.02em;color:#000;word-break:keep-all;}
#gw-main-patent .gw-patent-list{display:flex;justify-content:center;gap:32px;}
#gw-main-patent .gw-patent-list > li{display:flex;flex:1;min-width:0;max-width:var(--gw-patent-card-max);}
#gw-main-patent .gw-patent-card{display:block;width:100%;overflow:hidden;border:1px solid #e5e5e5;border-radius:var(--gw-r-card);background:#f3f4f6;transition:border-color .3s, box-shadow .3s;}
#gw-main-patent .gw-patent-card:hover{border-color:#c9ccd2;box-shadow:0 18px 40px rgba(14,22,38,.08);}
#gw-main-patent .gw-patent-doc{display:block;padding:16px;}
#gw-main-patent .gw-patent-doc img{display:block;width:100%;aspect-ratio:482 / 660;object-fit:contain;background:#fff;border:1px solid #e0e2e6;}
#gw-main-patent .gw-patent-more-box{margin-top:50px;text-align:center;}
#gw-main-patent .gw-patent-more{display:inline-block;padding:14px 40px;border:1px solid #ddd;border-radius:12px;font-size:15px;color:#111;transition:all .3s;}
#gw-main-patent .gw-patent-more:hover{border-color:#000;background:#000;color:#fff;}

/* 1280 초과에서만 2단. 그 아래는 좌측 컬럼(300px)과 문서 2장이 함께 들어가지 않는다.
   카드 폭은 컨테이너에 여유가 생기는 폭에서만 단계적으로 키운다 */
@media screen and (min-width:1281px){
    #gw-main-patent .gw-sec-container{display:grid;grid-template-columns:minmax(300px,1fr) auto;column-gap:60px;align-items:start;grid-template-rows:auto 1fr;}
    #gw-main-patent .gw-patent-head{grid-column:1;grid-row:1;margin-bottom:0;text-align:left;}
    #gw-main-patent .gw-patent-list{grid-column:2;grid-row:1 / span 2;}
    #gw-main-patent .gw-patent-more-box{grid-column:1;grid-row:2;align-self:start;margin-top:36px;text-align:left;}
}

@media screen and (min-width:1441px){
    #gw-main-patent{--gw-patent-card-max:440px;}
}

@media screen and (min-width:1781px){
    #gw-main-patent{--gw-patent-card-max:480px;}
}

@media screen and (max-width:1024px){
    #gw-main-patent .gw-patent-list{flex-wrap:wrap;}
    #gw-main-patent .gw-patent-list > li{flex:1 1 calc(50% - 16px);}
}

@media screen and (max-width:576px){
    #gw-main-patent .gw-patent-head{margin-bottom:35px;}
    #gw-main-patent .gw-patent-list{flex-direction:column;align-items:center;gap:20px;}
    #gw-main-patent .gw-patent-list > li{flex:1 1 auto;width:100%;}
    #gw-main-patent .gw-patent-more-box{margin-top:35px;}
}