@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

.contain {width:100%; max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}

.only-desktop {display:block;}
.only-desktop-tablet {display:block;}
.only-tablet-mobile {display:none;}
.only-tablet {display:none;}
.only-mobile {display:none;}

:root {
    /* color */
    --color-primary: #ff7e0c;
}

.c1 {color:var(--color-primary);}

#wrapper {overflow:hidden;}

/* header */
#header {position:fixed; top:0; left:0; width:100%; transition:.2s; z-index:100;}
#header .contain {height:100px; z-index:2; display:flex; align-items:center; justify-content:center;}

.sitelogo {position:absolute; left:122px; bottom:13px;}
.sitelogo a {display:block; width:68px; height:70px; background:url("../images/common/logo_w.png") no-repeat 0 50% / contain; overflow:hidden; font-size:0; line-height:0; text-indent:-9999em;}

#gnb > ul {display:flex;}
#gnb > ul > li {position:relative; padding:0 68px;}
#gnb > ul > li > a {position:relative; display:flex; align-items:center; justify-content:center; height:100px; color:#fff; font-size:20px; font-weight:600; line-height:1.3em; letter-spacing:-.03em;}

/* for mobile */
.btn-m-menu {position:absolute; right:100px; width:30px; height:24px; text-indent:-9999em; line-height:0; font-size:0;}
.btn-m-menu span {position:absolute; left:8px; right:0; top:50%; height:2px; margin-top:-1px; background:#fff;}
.btn-m-menu span:before,
.btn-m-menu span:after {content:" "; position:absolute; left:-8px; right:0; height:2px; background:#fff;}
.btn-m-menu span:before {top:-11px;}
.btn-m-menu span:after {bottom:-11px;}

.mobile-navigation {position:fixed; top:0; right:0; width:230px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .home {height:80px; padding:0 20px; display:flex; align-items:center;}
.mobile-navigation .home a {display:block;}
.mobile-navigation .home img {height:54px;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #dfdfdf;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #dfdfdf;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:13px 40px 13px 20px; display:block; color:#333; font-size:17px; font-weight:600; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li.active>a {color:var(--color-primary);;}
.mobile-navigation .nav-menu .submenu {display:none; padding:10px 20px; background:var(--color-primary); color:#fff; font-size:16px; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu > ul >  li > a {display:block; padding:6px 0;}
.mobile-navigation .close {position:absolute; top:20px; right:10px; width:24px; height:24px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:11px; left:0; width:100%; height:2px; background:#242424; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}

#main.fp-viewing-intro #header,
#main.fp-viewing-branch #header,
#main.fp-viewing-product #header,
#main.fp-viewing-search #header,
#main.fp-viewing-found #header,
#main.fp-viewing-foot #header {background:#fff; box-shadow:0 7px 10px rgba(0,0,0,0.05)}
#main.fp-viewing-intro #header .sitelogo a,
#main.fp-viewing-branch #header .sitelogo a,
#main.fp-viewing-product #header .sitelogo a,
#main.fp-viewing-search #header .sitelogo a,
#main.fp-viewing-found #header .sitelogo a,
#main.fp-viewing-foot #header .sitelogo a {background-image:url("../images/common/logo.png")}
#main.fp-viewing-intro #header #gnb > ul > li > a,
#main.fp-viewing-branch #header #gnb > ul > li > a,
#main.fp-viewing-product #header #gnb > ul > li > a,
#main.fp-viewing-search #header #gnb > ul > li > a,
#main.fp-viewing-found #header #gnb > ul > li > a,
#main.fp-viewing-foot #header #gnb > ul > li > a {color:#242424;}
#main.fp-viewing-intro #header .btn-m-menu span,
#main.fp-viewing-intro #header .btn-m-menu span:before,
#main.fp-viewing-intro #header .btn-m-menu span:after,
#main.fp-viewing-branch #header .btn-m-menu span,
#main.fp-viewing-branch #header .btn-m-menu span:before,
#main.fp-viewing-branch #header .btn-m-menu span:after,
#main.fp-viewing-product #header .btn-m-menu span,
#main.fp-viewing-product #header .btn-m-menu span:before,
#main.fp-viewing-product #header .btn-m-menu span:after,
#main.fp-viewing-search #header .btn-m-menu span,
#main.fp-viewing-search #header .btn-m-menu span:before,
#main.fp-viewing-search #header .btn-m-menu span:after,
#main.fp-viewing-found #header .btn-m-menu span,
#main.fp-viewing-found #header .btn-m-menu span:before,
#main.fp-viewing-found #header .btn-m-menu span:after,
#main.fp-viewing-foot #header .btn-m-menu span,
#main.fp-viewing-foot #header .btn-m-menu span:before,
#main.fp-viewing-foot #header .btn-m-menu span:after {background:#242424;}

.header-fixed #header {background:#fff; box-shadow:0 7px 10px rgba(0,0,0,0.05)}
.header-fixed #header .sitelogo a {background-image:url("../images/common/logo.png")}
.header-fixed #header .btn-m-menu span,
.header-fixed #header .btn-m-menu span:before,
.header-fixed #header .btn-m-menu span:after {background:#242424;}

/* main */
.main-visual {position:relative; overflow:hidden;}
.main-visual .item {position:relative; width:100%; height:100vh; overflow:hidden;}
.main-visual .item .img {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden;}
.main-visual .item .img img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-visual .slick-arrow {width:70px; height:70px; position:absolute; top:50%; transform:translateY(-50%); border:0; font-size:0; line-height:0; background-color:transparent; background-size:contain; background-repeat:no-repeat; background-position:50% 50%; z-index:10; transition:.2s;}
.main-visual .slick-prev {left:100px; background-image:url("../images/main/mv_prev.png");}
.main-visual .slick-prev:hover {background-image:url("../images/main/mv_prev_on.png");}
.main-visual .slick-next {right:100px; background-image:url("../images/main/mv_next.png");}
.main-visual .slick-next:hover {background-image:url("../images/main/mv_next_on.png");}
.main-visual .caption {margin-top:30px; position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; text-align:center; color:#fff;}
.main-visual .caption h2 {margin-bottom:44px; font-size:100px; font-weight:700; letter-spacing:-.03em; line-height:1em;}
.main-visual .caption p {margin-bottom:73px; font-size:30px; font-weight:600; letter-spacing:-.03em; line-height:1em;}
.main-visual .controls {display:flex; align-items:center; justify-content:center;}
.main-visual .paging {font-size:18px; font-weight:700; letter-spacing:-.01em; line-height:1.3em; color:#fff;}
.main-visual .progress {margin:0 10px; position:relative; width:150px; height:2px; background:#fff;}
.main-visual .progress:after {content:""; position:absolute; top:0; left:0; width:0; height:100%; background:var(--color-primary); transition: 0.1s width linear;}
.main-visual .progress.animate:after {transition:width linear; width:100%; transition-delay:unset; transition-duration:4s;}
.main-visual .controls button {margin-right:5px; display:block; width:26px; height:26px; background-position:50% 50%; background-color:transparent; border:0; line-height:0; font-size:0; background-repeat:no-repeat; background-size:contain;}
.main-visual .controls button:last-child {margin-right:0;}
.main-visual .controls button.prev {background-image:url("../images/main/button_prev.png");}
.main-visual .controls button.stop {background-image:url("../images/main/button_stop.png");}
.main-visual .controls button.play {background-image:url("../images/main/button_play.png"); display:none;}
.main-visual .controls button.next {background-image:url("../images/main/button_next.png");}
.main-visual .scroll {position:absolute; bottom:50px; left:0; width:100%; text-align:center; animation:1.5s scrollUpDown linear infinite; z-index:50;}

@keyframes scrollUpDown{
	0%,100% {transform:translateY(0);}
	50% {transform:translateY(20px);}
}

.section-inner {padding:110px 0 20px;}
.section-inner.ty2 {padding-left:0; padding-right:0;}

.m-head {margin-bottom:45px; text-align:center;}
.m-tit {font-size:26px; font-weight:700; letter-spacing:-.03em; line-height:1.4em; color:#242424;}
.m-tit span {position:relative; display:inline-block;}
.m-tit span:after {right:-11px; top:-3px; content:""; width:6px; height:6px; border-radius:100%; background:var(--color-primary); position:absolute;}
.m-txt1 {margin:15px 0 17px; font-size:36px; font-weight:700; letter-spacing:-.03em; line-height:1.3em; color:#242424;}
.m-txt2 {line-height:1.5em; color:#454545;}

.m-tabs {margin-bottom:70px;}
.m-tabs ul {margin:0 -10px; display:flex; justify-content:center;}
.m-tabs ul li {width:auto; padding:0 10px;}
.m-tabs ul li a {padding:0 10px; line-height:50px; min-width:200px; color:#242424; border-radius:25px; font-weight:700; border:1px solid #ababab; display:flex; justify-content:center; align-items:center;}
.m-tabs ul li.active a {color:#fff; background:var(--color-primary); border-color:var(--color-primary);}

.main-intro .contain {position:relative;}
.main-intro .contain:before {position:absolute; left:-132px; top:-44px; content:""; width:274px; height:281px;  z-index:-1; background:url("../images/main/greeting_txt_bg.png") no-repeat 0 0 / contain;}

.intro-content {position:relative;}
.intro-content {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; z-index:-1;}
.intro-content.on {opacity:1; z-index:1; position:relative;}

.story {display:flex; align-items:center;}
.story .img {margin-right:80px; border-radius:80px 0 80px 0; overflow:hidden;}
.story .cnt h3 {margin-bottom:22px; font-size:24px; font-weight:700; letter-spacing:-.03em; line-height:1.4em; color:#242424;}
.story .c1 {border-bottom:2px solid var(--color-primary); line-height:1em; display:inline-block;}
.story .cnt p {letter-spacing:-.02em;}
.story .cnt p strong {color:#242424;}

.greeting-cnt {padding-bottom:45px; margin-bottom:50px; display:flex; justify-content:center; border-bottom:1px solid #ddd;}
.greeting-cnt .inner {max-width:743px; display:flex; align-items:center;}
.greeting-cnt .img {margin-right:50px;}
.greeting-cnt p {flex:1 1 auto; min-width:0; width:1%;}

.icon-list ul {display:flex; margin:-15px;}
.icon-list ul li {width:14.28%; padding:15px;}
.icon-list .box {border-radius:16px; padding-top:28px; min-height:180px; box-shadow:0 3px 6px rgba(0,0,0,0.15); text-align:center;}
.icon-list .box .tit {margin:10px 0 3px; color:#242424; font-weight:600;}
.icon-list .box .txt {font-size:14px; line-height:1.57em;}

.img-list ul {display:flex; margin:-26px;}
.img-list ul li {width:25%; padding:26px; text-align:center;}
.img-list .img img {border-radius:60px 0 60px 0;}
.img-list .tit {margin-top:25px; font-size:20px; font-weight:500; color:#242424;}
.img-list.col-2 ul li {width:50%;}
.img-list.col-3 ul li {width:33.333%;}
.img-list.radius43 .img img {border-radius:43px 0 43px 0;}

.root_daum_roughmap {width:100% !important;}

.location {display:flex; align-items:center;}
.location .map-area {margin-right:80px; width:800px;}
.directions .address-info {margin-bottom:35px;}
.directions .address-info .comp {line-height:1em; color:var(--color-primary); font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:23px; font-weight:600; line-height:1.33em; letter-spacing:-.03em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:19px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:31px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:var(--color-primary);}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

.main-guide {background:url("../images/main/guide_bg.jpg") no-repeat 50% 50% / cover;}
.inquiry-form {background:#fff; padding:60px;}
.inquiry-form .ico-required {font-style:normal; color:var(--color-primary);}
.ico-required.check {display:inline-block; vertical-align:middle;  margin:-0.3em 0 0 0;  width:16px; height:14px; background: url('../images/main/check.png') 0 50% no-repeat; background-size:contain;}
.inquiry-form .title {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:25px;}
.inquiry-form .title h4 {color:#242424; font-size:1.13em; line-height:1.33em; letter-spacing:-.03em;}
.inquiry-form .title .required {color:#ababab; font-size:14px; line-height:1.33em;}
.inquiry-form .form {font-size:14px; line-height:1.5em; letter-spacing:-.03em;}
.inquiry-form .form .row {display:flex; flex-wrap:wrap; margin:-10px -14px;}
.inquiry-form .form .col {width:25%; padding:10px 14px;}
.inquiry-form .form .col.ty2 {width:100%;}
.inquiry-form .form dt {font-size:15px; margin-bottom:5px; font-weight:500; color:#242424;}
.inquiry-form .form .input {display:block; width:100%; height:35px; padding:5px 8px; font-size:14px; line-height:1.5em;}\
.inquiry-form .form input::placeholder {color:#898989;}
.inquiry-form .form select.input {padding-right:30px; color:#505050; background-size:10px auto; background-position:right 10px center;}
.inquiry-form .form textarea.input {height:100px;}
.inquiry-form .group-flex {margin-top:37px; display:flex; align-items:center;}
.inquiry-form .group-flex .group {flex:1 1 auto; min-width:0; width:1%;}
.inquiry-form .submit-area {margin-left:134px;}
.inquiry-form .form-agree {margin:0 0 28px;}
.inquiry-form .form-agree .check {text-align:left;}
.inquiry-form .submit {text-align:right;}
.inquiry-form .checkbox {margin-top:0;}
.inquiry-form .btn-pack.dark {background:#000; border-color:#000;}

.main-product .contain {position:relative;}
.main-product .contain:before {position:absolute; right:-136px; top:106px; content:""; width:419px; height:126px; background:url("../images/main/product_txt_bg.png") no-repeat 100% 100% / contain;}


.main-search {background:#f7f7f7;}
.add-search {margin:-10px; display:flex; align-items:center;} 
.add-search .cate {width:230px; padding:10px;}
.add-search .cate.ty2 {flex:1 1 auto; min-width:0; width:1%;}
.add-search .cate.btn {width:auto;}
.add-search .input {width:100%;  background-color:#fff; color:#505050; border-radius:6px; height:60px;}
.add-search .input::placeholder {color:#505050;}
.add-search select.input {background-position:right 18px center;}
.add-search .btn-pack {min-width:190px; font-size:20px; font-weight:700; border-radius:6px; line-height:60px; color:#fff; background:var(--color-primary); border-color:var(--color-primary);}

.search-slider {position:relative; margin-top:40px;}
.search-slider .slick-list {margin:0 -15px;}
.search-slider .slick-slide {padding:0 15px;}
.search-slider .item {text-align:center;}
.search-slider .img {position:relative; padding-bottom:100%; overflow:hidden;}
.search-slider .img img {border-radius:20px; position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.search-slider .tit {margin:21px 0 11px; font-size:24px; font-weight:700; letter-spacing:-.02em; line-height:1.4em; color:#242424;}
.search-slider .txt {letter-spacing:-.02em; line-height:1.4em;}
.search-slider .slick-arrow {margin-top:-45px; width:64px; height:64px; position:absolute; top:50%; transform:translateY(-50%); border:0; font-size:0; line-height:0; background-color:transparent; background-size:contain; background-repeat:no-repeat; background-position:50% 50%; z-index:10; transition:.2s;}
.search-slider .slick-prev {left:-160px; background-image:url("../images/main/search_prev.png");}
.search-slider .slick-prev:hover {background-image:url("../images/main/search_prev_on.png");}
.search-slider .slick-next {right:-160px; background-image:url("../images/main/search_next.png");}
.search-slider .slick-next:hover {background-image:url("../images/main/search_next_on.png");}

.progress-slider {max-width:1920px; margin:0 auto;}
.progress-slider .swiper-wrap {max-width:1670px; margin-left:auto; position:relative;}
.progress-slider .swiper {padding:10px 140px 63px 10px; }
.progress-slider .box {padding:40px; display:flex; background:#fff; border-radius:20px; box-shadow:0 2px 10px rgba(0,0,0,0.15);}
.progress-slider .img {margin-right:39px;}
.progress-slider .img img {border-radius:15px;}
.progress-slider .cnt {padding:15px 0; flex:1 1 auto; min-width:0; width:1%;}
.progress-slider .num {font-weight:500; color:#898989;}
.progress-slider h3 {margin:6px 0 15px; font-size:28px; font-weight:700; letter-spacing:-.03em; line-height:1.3em; color:#333;}
.progress-slider .swiper-pagination-progressbar {margin-bottom: 3px; box-shadow:0 1px 5px rgba(0,0,0,0.1); left:10px; width:84%; top:auto; bottom:0; height:10px; background:#fff; border-radius:5px; overflow:hidden;}
.progress-slider .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:var(--color-primary); border-radius:5px;}
.progress-slider .arrow {margin-top:-47px; box-shadow:2px 0 10px rgba(0,0,0,0.1); border-radius:100%; content:""; position: absolute; width:64px; height:64px; background-size:contain; background-repeat:no-repeat; background-position:50% 50%; z-index:10; transition:.2s;}
.progress-slider .arrow:after {display:none;}
.progress-slider .swiper-button-prev {margin-left:-33px; background-image:url("../images/main/found_prev.png");}
.progress-slider .swiper-button-prev:hover {background-image:url("../images/main/found_prev_on.png");}
.progress-slider .swiper-button-next {margin-right:95px;background-image:url("../images/main/found_next.png");}
.progress-slider .swiper-button-next:hover {background-image:url("../images/main/found_next_on.png");}

.main-found {background:url("../images/main/found_bg.jpg") no-repeat 50% 50% / cover;}

/* sub */

/* footer */
/* #footer {background:#fff; border-top:1px solid #ddd; color:#686868; font-size:15px; line-height:1.5em; letter-spacing:-.03em;}
#footer .contain {max-width:1460px;}
#footer address {font-style:normal;}
#footer span {display:inline-block;}
#footer a:hover {text-decoration:underline;}

.foot-top {border-bottom:1px solid #ddd;}
.foot-top .contain {height:70px; display:flex; align-items:center; justify-content:space-between;}
.foot-top .links ul {display:flex; margin:0 -13px;}
.foot-top .links ul li {font-size:16px; font-weight:500; padding:0 13px; position:relative;}
.foot-top .links ul li:after {content:"ㆍ"; position: absolute; right:-7px;}
.foot-top .links ul li:last-child:after {display:none;}
.scroll-top {display:flex; align-items:center; font-size: 15px; font-weight:600; letter-spacing:0; line-height:1.2em; color:#454545;}
.scroll-top:after {margin-left:12px; content: ""; width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid #454545;}

.foot-btm .comp-name {font-size:17px; font-weight:600;}
.foot-btm {padding:27px 0; line-height:1.8em;}
.foot-btm address span {margin-right:34px;}
.foot-btm address {margin-bottom: 12px;}
.foot-btm .designed {color:#9c9c9c;} */

#footer2 {padding:64px 0;background:#fff;color:#2c2c2c; line-height:1.4em;letter-spacing:-.05em;}
#footer2 span {display:inline-block;}
#footer2 a:hover {text-decoration:underline;}
#footer2 .contain {max-width:1460px; display:flex; position:relative;}
#footer2 .f-logo {margin-right:60px;}
#footer2 address {font-style:normal;}
#footer2 address span {margin:0 20px 5px 0;}
#footer2 .copyright {letter-spacing:0; font-size:14px; color:#666;}
#footer2 .foot-links {position:absolute; right:30px; top:0;}
#footer2 .foot-links a{position:relative;display:inline-flex; align-items:center; padding-left:25px;}
#footer2 .foot-links a:before {content:''; position: absolute; left:0; top:3px; width:14px; height:17px; background:url('../images/common/icon-doc.png') no-repeat 50% 50% / contain;}