@charset "utf-8";
/* 당근고양이 'ㅅ' */

/* 초기화 */
@import url("default.css");

.red {color:#f00 !important;}
.material-symbols-outlined {  font-variation-settings:  'FILL' 0,  'wght' 400,  'GRAD' 0,  'opsz' 24}

/* header */
.header {position:fixed; top:0; left:0; width:100%; height:100px; z-index:100; transition:.2s linear;}
.header.fixed {box-shadow:rgba(0,0,0,.1) 0 0 10px;}
.header .logo {position:absolute; top:0; left:40px; line-height:100px; transition:none; z-index:1;}
.header h1 {display:none;}
.header .gnb {position:relative;}
.header .gnb .dm {content:""; position:absolute; top:100%; left:0; width:100%; height:635px; background:#fff; opacity:0; pointer-events:none; user-select:none; transition:.2s linear;}
.header .gnb > ul {display:flex; justify-content:center;}
.header .gnb > ul > li {position:relative;}
.header .gnb > ul > li > a {position:relative; display:block; font-size:22px; color:#fff; font-weight:700; line-height:100px; width:100%; padding:0 80px;}
.header .snb {position:absolute; top:100%; left:0; width:100%; text-align:center; opacity:0; pointer-events:none; user-select:none; transition:.2s linear;}
.header .snb > li > a {display:block; font-size:18px; color:#585858; font-weight:500; line-height:42px;}
.header .depth {padding-bottom:20px;}
.header .depth > a {display:block; font-size:17px; color:#979797; line-height:32px;}
.header .snb > li:last-child .depth {padding-bottom:0;}
.header .copy {position:absolute; top:100%; left:0; width:calc((100% - 930px)/2); height:635px; background:#0084cc; color:#fff; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; z-index:1; opacity:0; pointer-events:none; user-select:none; transition:.2s linear;}
.header .copy .tt {position:relative; font-size:45px; line-height:46px; padding-bottom:30px; margin-bottom:30px;}
.header .copy .tt:after {content:""; position:absolute; bottom:0; left:50%; width:44px; height:1px; background:#fff; opacity:.5px; transform:translateX(-50%);}
.header .copy p {font-size:18px; line-height:22px;}
.header .sns {position:absolute; top:0; right:240px; display:flex; gap:10px;}
.header .sns a {width:54px; height:100px; background:no-repeat 50% 50%; font-size:0;}
.header .sns .sns1 {background-image:url('/images/icon_sns01.png');}
.header .sns .sns2 {background-image:url('/images/icon_sns02.png');}
.header .links {position:absolute; top:0; right:0; display:flex;}
.header .links a {display:flex; flex-direction:column; justify-content:center; align-items:center; gap:16px; font-size:17px; color:#fff; font-weight:500; width:100px; height:100px;}
.header .links a:before {content:""; display:block; width:100%; height:25px; background:no-repeat 50% 50%;}
.header .links a.i1 {background:#0b588f;}
.header .links a.i1:before {background-image:url('/images/icon_head01.png');}
.header .links a.i2 {background:#0084cc;}
.header .links a.i2:before {background-image:url('/images/icon_head02.png');}

.header.fixed {background:#fff;}
.header.fixed .logo {background:url('/images/logo_c.png') no-repeat 50% 50% / contain;}
.header.fixed .logo img {opacity:0;}
.header.fixed .gnb > ul > li > a {color:#333;}

.header .gnb > ul > li.on > a {color:#0084cc;}
.header .snb > li.on > a {color:#0084cc;}
.header .depth > a.on {color:#0084cc;}

/* footer */
.footer {background:#181818; padding:90px 40px;}
.footer .txt {position:relative; padding-left:215px; font-size:16px;}
.footer .txt:before {content:""; position:absolute; top:0; left:0; width:140px; height:100%; background:url('/images/logo.png') no-repeat 50% 50% / contain; filter:grayscale(1);}
.footer .txt .flex {gap:26px;}
.footer .txt dl {display:flex; gap:6px; line-height:30px;}
.footer .txt dt {color:#fff;}
.footer .txt dd {color:#a7a7a7;}
.footer .copy {color:#a7a7a7; margin-top:20px;}
.footer .gotop {position:fixed; bottom:40px; right:40px; width:80px; height:80px; background:url('/images/icon_gotop.png') #0b588f no-repeat 50% 50%; border-radius:50%; font-size:0; opacity:0; pointer-events:none; user-select:none; z-index:1;}
.footer .gotop.fixed {opacity:1; pointer-events:auto; user-select:auto;}

/* main */
.mvisual_wrap {position:relative;}
.mv_txt {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; color:#fff; z-index:1; text-align:center; pointer-events:none; user-select:none;}
.mv_txt p {font-size:20px; line-height:28px; opacity:.72;}
.mv_txt p.montser {font-size:24px; line-height:1;}
.mv_txt .tt {font-size:78px; margin:30px 0 35px;}
.mvisual .slick-slide > div {font-size:0;}
.mvisual .slick-slide img {width:100%; height:100vh; object-fit:cover;}
.mvisual_wrap .mv_navi {position:absolute; bottom:60px; left:0; width:100%; display:flex; justify-content:center; align-items:center;}
.mvisual_wrap .mv_navi .arrow {width:48px; height:48px; border:#fff 1px solid; border-radius:50%; background:url('/images/arrow_slide.png') no-repeat 50% 50%;}
.mvisual_wrap .mv_navi .arrow.next {transform:rotate(180deg);}
.mvisual_wrap .mv_navi .slick-dots {width:90px;}
.mvisual_wrap .mv_navi .slick-dots li {font-size:20px; color:#fff; line-height:48px; height:48px; text-align:center; display:none;}
.mvisual_wrap .mv_navi .slick-dots li span {padding:0 10px;}
.mvisual_wrap .mv_navi .slick-dots li.slick-active {display:flex; justify-content:center;}
.mcon {background:#f6f6f6;}
.mcon .tit {line-height:1;}
.mcon .tit p {font-size:20px; color:#a4a4a4;}
.mcon .tit p.montser {font-size:26px;}
.mcon .tit .tt {font-size:73px; color:#222;  margin:40px 0 20px;}
.mcon .tit .tt span {color:#0084cc;}
.mc01 {padding:125px 40px 120px;}
.mc01 .tit {text-align:center; margin-bottom:90px;}
.mc01 ul {display:flex; gap:16px;}
.mc01 li {width:calc((100% - 48px)/4);}
.mc01 a {position:relative; display:flex; width:100%; height:440px;}
.mc01 a img {width:100%; height:100%; max-width:100%; max-height:100%; object-fit:cover;}
.mc01 .txt {position:absolute; bottom:0; left:0; padding:40px 50px; color:#fff; line-height:1;}
.mc01 b {display:block; font-size:30px;}
.mc01 p {font-size:20px; margin-top:15px; opacity:.53;}
.mc02 {display:flex;}
.mc02 .tit {width:35%; padding:0 40px; display:flex; flex-direction:column; justify-content:center;}
.mc02 .btns {display:flex; gap:10px; margin-top:40px;}
.mc02 .btns a {display:block; font-size:17px; color:#777; line-height:66px; height:68px; width:240px; max-width:calc(50% - 5px); padding:0 20px; background:#fff url('/images/icon_links.png') no-repeat right 36px center; border:#e1e1e1 1px solid;}
.mc02 .img {width:65%; height:calc(100vh - 100px); background:url('/images/img_mc02.jpg') no-repeat 50% 50% / cover;}

/* sub */
.svisual {background:no-repeat 50% 50% / cover;}
.svisual .inner {position:relative;}
.svisual.g01 {background-image:url('/images/svisual01.jpg');}
.svisual.g02 {background-image:url('/images/svisual02.jpg');}
.svisual.g03 {background-image:url('/images/svisual03.jpg');}
.svisual.g04 {background-image:url('/images/svisual04.jpg');}
.svisual .inner {display:flex; flex-direction:column; justify-content:center; height:480px; color:#fff; line-height:1; padding-top:115px;}
.svisual p {font-size:20px; margin-bottom:20px;}
.svisual strong {font-size:77px; font-family:'Montserrat';    font-weight: 300;}
.svisual .location {position:absolute; bottom:125px; right:20px; display:flex; font-size:16px; color:#fff; line-height:13px;}
.svisual .location .home {width:13px; height:13px; background:url('/images/icon_home.png') no-repeat 50% 50% / contain; font-size:0;}
.svisual .location em {width:30px; height:13px; background:url('/images/icon_arrow.png') no-repeat 50% 50% / contain;}
.aside {border-bottom:#e1e1e1 1px solid;}
.aside dd {display:flex; gap:90px;}
.aside .g,
.aside .s dt {display:none;}
.aside a {position:relative; font-size:20px; color:#777; font-weight:500; line-height:80px;}
.aside a:after {content:""; position:absolute; bottom:0; left:50%; width:0; height:3px; background:#0084cc; transition:.2s linear;}
.aside a.on {color:#0084cc; font-weight:700;}
.aside a.on:after {left:0; width:100%;}
.title {font-size:40px; color:#222; font-weight:700; line-height:1; text-align:center; margin:70px 0 80px;}
.container {padding-bottom:100px;}
.container * {}
.ctit {font-size:34px; font-weight:500; line-height:1; text-align:center; margin-bottom:45px;}
.btit {font-size:38px; line-height:50px;}
.stit {font-size:26px; font-weight:700; line-height:1; margin:120px 0 30px;}

/* 회사소개 */
.about01 ul {display:flex; gap:8px;}
.about01 li {width:calc((100% - 16px)/3);}
.about01 .txtarea {padding:45px 0 110px; display:flex;}
.about01 .txtarea > * {width:50%;}
.about01 .txtarea .tit .tt {font-size:40px; color:#0084cc; line-height:1.2;}
.about01 .txtarea .tit .tt strong {color:inherit;}
.about01 .txtarea .tit p {font-size:23px; line-height:34px; margin-top:15px;}
.about01 .txtarea .con p {font-size:18px; color:#777; line-height:29px;}
.about01 .txtarea .con .name {font-size:20px; font-weight:500; line-height:1; margin-top:20px;}
.about01 .txtarea .con .name b {color:#0084cc;}
.about02 .img {background:url('/images/bg_s0101_01.jpg') no-repeat 50% 50% / cover; height:356px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:16px; line-height:1;}
.about02 .img p {font-size:20px; color:#fff;}
.about02 .img span {font-size:27px; color:#fff;}
.history {position:relative; padding:80px 0;}
.history:before {content:""; position:absolute; top:0; left:50%; width:1px; height:100%; background:#e1e1e1;}
.history dl {display:flex; flex-direction:column; gap:15px; padding-left:50%; margin-bottom:85px;}
.history dl:last-child {margin-bottom:0;}
.history dl > * {padding-left:30px;}
.history dt {position:relative; font-size:25px; font-weight:700; line-height:30px;}
.history dt i {position:absolute; top:50%; left:-15px; width:30px; height:30px; border:#d3d8e9 1px solid; background:#fff; border-radius:50%; transform:translateY(-50%);}
.history dt i:before {content:""; position:absolute; top:50%; left:50%; width:14px; height:14px; background:#0084cc; border-radius:50%; transform:translate(-50%,-50%);}
.history dd p {font-size:17px; color:#777; line-height:23px; margin-bottom:10px;}
.history dd p:last-child {margin-bottom:0;}
.history dl:nth-child(2n) {padding:0 50% 0 0; text-align:right;}
.history dl:nth-child(2n) > * {padding:0 30px 0 0;}
.history dl:nth-child(2n) dt i {left:auto; right:-15px;}
.factory_photo {background:#f5f5f5; padding:65px 0 100px;}
.factory_photo .imgs {display:flex; gap:8px;}
.factory_photo .imgs img {width:calc((100% - 16px)/3);}

/* 오시는길 */
.tabs {display:flex; justify-content:center; align-items:center; gap:12px; margin-bottom:40px;}
.tabs li {max-width:290px; flex:1 1 calc((100% - 36px)/4);}
.tabs li > * {display:block; width:100%; height:62px; line-height:60px; font-size:18px; color:#b6b6b6; font-weight:500; text-align:center; background:#fff; border:#e1e1e1 1px solid;}
.tabs li.on > * {color:#fff; background:#0084cc; border-color:#0084cc;}
.root_daum_roughmap {max-width:100%;}
.map_txt {display:flex; margin:50px 0 100px;}
.map_txt li {width:calc(100%/3); border-left:#ebebeb 1px solid; text-align:center;}
.map_txt li:first-child {border-left:0;}
.map_txt i {display:block; width:58px; height:58px; background:#f5f5f5 no-repeat 50% 50% / contain; border-radius:50%; margin:0 auto 15px;}
.map_txt strong {display:block; font-size:20px; margin-bottom:30px;}
.map_txt p {font-size:16px; color:#777;}
.map_txt .i1 i {background-image:url('/images/icon_map01.png');}
.map_txt .i2 i {background-image:url('/images/icon_map02.png');}
.map_txt .i3 i {background-image:url('/images/icon_map03.png');}
.map_btns {display:flex; justify-content:center; align-items:center; gap:16px;}
.map_btns a {position:relative; display:block; font-size:16px; font-weight:500; line-height:54px; width:195px; max-width:calc(50% - 8px); padding:0 24px;}
.map_btns a:after {content:""; position:absolute; top:0; right:24px; width:19px; height:100%; mask:url('/images/arrow_sns.png') no-repeat 50% 50% / contain; -webkit-mask:url('/images/arrow_sns.png') no-repeat 50% 50% / contain;}
.map_btns .kakao {color:#371c1d; background:#fedd0d;}
.map_btns .kakao:after {background:#371c1d;}
.map_btns .naver {color:#fff; background:#10d265;}
.map_btns .naver:after {background:#fff;}

/* 제품 */
.product_head {display:flex;}
.product_head > * {width:50%;}
.product_head .txt {padding:60px 20px 0 0;}
.product_head .txt .montser {font-size:15px; color:#0084cc; line-height:1;}
.product_head .txt .tit {font-size:44px; line-height:1; margin:15px 0 60px;}
.product_head .txt p {font-size:18px; color:#777; line-height:29px;}
.product_head .head_slide {position:relative; width:calc(100% + ((100vw - 1350px)/2)); border-radius:10px 0 0 10px; overflow:hidden;}
.product_head .head_slide .slick-slide > div {height:566px;}
.product_head .head_slide .slick-slide > div img {width:100%; height:100%; object-fit:cover;}
.product_head .head_slide .slick-arrow {position:absolute; bottom:25px; width:64px; height:64px; background:#515151; border-radius:50%; font-size:0; z-index:1;}
.product_head .head_slide .slick-arrow:before {content:""; display:block; width:100%; height:100%; background:url('/images/arrow_slide2.png') no-repeat 50% 50%;}
.product_head .head_slide .slick-prev {left:30px;}
.product_head .head_slide .slick-next {left:110px;}
.product_head .head_slide .slick-next:before {transform:rotate(180deg);}
.gbox {background:#f6f6f6; padding:120px 0; margin:120px 0;}
.items_state ul {display:flex; flex-wrap:wrap; gap:0 164px;}
.items_state li {width:calc(50% - 82px); text-align:center;}
.items_state li .imgfit {border-radius:5px;}
.items_state li .tt {font-size:38px; line-height:1; margin:40px 0 24px;}
.items_state li p {font-size:16px; color:#909090; line-height:25px;}
.items_state li:nth-child(2n) {margin-top:120px;}
.product_info {font-size:17px; color:#777; line-height:32px;}
.product_info.mt {margin-top:140px;}
.product_info .btit {margin-bottom:80px;}
.product_info .btit ~ .btit {margin-top:180px;}
.product_info .type {display:flex;}
.product_info .type li {flex:1 1 calc(100%/5); padding:0 20px; text-align:center;}
.product_info .type .tt {font-size:24px; line-height:1; margin-top:55px;}
.product_info .type p {font-size:20px; line-height:1; margin-top:15px;}
.tbl table {border-top:#e1e1e1 1px solid;}
.tbl th,
.tbl td {border:#e1e1e1 1px solid; padding:20px;}
.tbl th:first-child,
.tbl td:first-child {border-left:0;}
.tbl th:last-child,
.tbl td:last-child {border-right:0;}
.tbl th {font-size:18px; font-weight:500; background:#f5f5f5;}
.tbl td {font-size:17px; text-align:left;}
.tbl col.th {width:210px;}
.product_info .tt {color:#222; margin-top:35px;}
.img_bs {margin: 0 auto; width:65%; }

/* 갤러리 목록 */
.gall_list {display:flex; flex-wrap:wrap; gap:44px;}
.gall_list a {position:relative; width:calc((100% - 88px)/3); height:332px;}
.gall_list img {width:100%; height:100%; object-fit:cover;}
.gall_list p {position:absolute; bottom:0; left:0; width:100%; height:100%; font-size:24px; color:#fff; font-weight:700; line-height:33px; text-align:center; display:flex; justify-content:center; align-items:center; background:rgba(0,0,0,.7); opacity:0; transition:.2s linear;}

/* 게시판 상세 */
.board_view {border-top:#ebebeb 1px solid;}
.board_view .tit {font-size:24px; font-weight:700; line-height:30px; padding:25px 0; text-align:center; border-bottom:#ebebeb 1px solid;}
.board_view .con {padding:30px 0; border-bottom:#ebebeb 1px solid;}

/* 게시판 목록 */
.board_list {border-top:#ddd 1px solid;}
.board_list th,
.board_list td {height:65px; text-align:center; border-bottom:#ddd 1px solid;}
.board_list th {font-size:18px;}
.board_list td {font-size:16px; color:#525252;}
.board_list td.tal a {display:inline-block; vertical-align:top; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.board_list .w1 {width:90px;}
.board_list .w2 {width:130px;}
.board_list .w3 {width:160px;}

.board_bottom .btns {display:flex; justify-content:space-between; gap:10px; margin-top:60px;}
.board_bottom .btns .btn {display:inline-block; width:150px; height:50px; line-height:50px; background:#0e5ba2; font-size:15px; color:#fff; text-align:center; border:0; vertical-align:top;}
.board_bottom .btns .btn_l {color:#0e5ba2; line-height:48px; border:#0e5ba2 1px solid; background:#fff;}
.board_bottom .paging {display:flex; justify-content:center; gap:10px; margin-top:60px;}
.board_bottom .paging a {width:40px; height:40px; line-height:38px; text-align:center; font-size:17px; border:#fff 1px solid;}
.board_bottom .paging a.on {color:#222; border-color:#222;}
.board_bottom .paging .arrow {font-size:0;}
.board_bottom .paging .prev {margin-right:10px;}
.board_bottom .paging .next {margin-left:10px;}
.board_bottom .search_wrap {text-align:center; font-size:0; margin-top:20px;}
.board_bottom .search_wrap .text,
.board_bottom .search_wrap .btn {display:inline-block; vertical-align:top; height:40px; font-size:15px;}
.board_bottom .search_wrap .text {line-height:38px;}
.board_bottom .search_wrap select.text {width:100px;}
.board_bottom .search_wrap input.text {width:300px; margin:0 10px;}
.board_bottom .search_wrap .btn {width:120px; line-height:40px; border:0; background:#0e5ba2; color:#fff; font-weight:700; text-align:center;}
.board_bottom .btns_view {display:flex; justify-content:space-between; align-items:center; margin-top:30px;}
.board_bottom .btns_view .check a {text-decoration:underline;}
.board_bottom .btns_view .btn_submit {font-size:17px; line-height:64px; height:66px; width:200px; padding:0 25px; border:#ddd 1px solid; background:#fff url('/images/arrow_submit.png') no-repeat right 25px center; text-align:left;}

.board_write dl {display:flex; border:#ebebeb 1px solid; margin-top:14px;}
.board_write dl:first-child {margin-top:0;}
.board_write dt {width:190px; font-size:18px; line-height:60px; padding-left:30px;font-weight: 500;}
.board_write dd {width:calc(100% - 190px); font-size:18px;}
.board_write .text {border:0;}
.board_write input.text {height:60px;}
.board_write textarea.text {height:140px;}
.board_write .text::placeholder {color:#777;}
.board_write dd.file {display:flex; padding:8px 0;}


.board_write { width:100%;}
.board_write th,
.board_write td {line-height:20px; padding:10px 0; }
.board_write th {width:190px; font-size:18px; ; padding-left:30px;}
.board_write td {width:calc(100% - 190px); font-size:18px;}
.board_write .text {border:#e1e1e1 1px solid;}
.board_write input.text {height:60px;}
.board_write textarea.text {height:140px;}
.board_write .text::placeholder {color:#777;}
.board_write td.file {display:flex; padding:8px 0;}

.filebutton {position:relative; width:106px; height:44px; overflow:hidden;}
.filebutton span {display:inline-block; width:100%; height:44px; line-height:44px; font-size:16px; color:#fff; text-align:center; background:#181818;}
.filebutton input {z-index:999; position:absolute; top:-2px; left:-700px; margin:0; padding:0; font-size:50px; line-height:0; opacity:0; filter:alpha(opacity = 0); -ms-filter:"alpha(opacity=0)"; cursor:pointer; _cursor:hand;}
.filebox {width:calc(100% - 106px); height:44px; line-height:44px; padding:0 10px; overflow:hidden; font-size:16px; white-space:nowrap;}
.radios {gap:36px; align-items:center;}
label.radio,
label.check {position:relative; font-size:18px; line-height:30px; padding-left:26px; display:block;}
label.radio input,
label.check input {display:none;}
label.radio i,
label.check i {position:absolute; left:0; transition:.2s linear;}
label.radio i {top:5px; width:20px; height:20px; border:#ddd 1px solid; border-radius:50%;}
label.check i {top:4px; width:22px; height:22px; border:#777 1px solid;}
label.radio i:before,
label.check i:before {content:""; position:absolute; top:50%; left:50%; width:0; height:0; background:#0b588f; transform:translate(-50%,-50%); transition:.2s linear;}
label.radio i:before {border-radius:50%;}
label.check i:before {border-radius:2px;}
label.radio input:checked + i {border-color:#777;}
label.radio input:checked + i:before {width:10px; height:10px;}
label.check input:checked + i {border-color:#0b588f;}
label.check input:checked + i:before {width:14px; height:14px;}
.yak_wrap {width:500px; max-width:100%; padding:30px;}
.yak_wrap .tit {font-size:22px; color:#222; font-weight:500; line-height:1; margin-bottom:25px;}
.yak_wrap .scroll {height:450px; max-height:calc(100vh - 177px); overflow:auto; border:#ddd 1px solid; padding:20px; font-size:14px; color:#777; line-height:20px;}
.fancybox-close {top:0; right:0; width:68px; height:68px; background:url('/images/icon_close.png') no-repeat 50% 50%;}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;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 img{max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative;}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject{background:#000;text-align:left}
.hd_pops_footer .hd_pops_close{background:#393939;position:absolute;top:0;right:0}

.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}