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

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

#wrapper { position:relative; overflow:hidden; } 

#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 { position:relative; width:100%; max-width:1230px; padding-left:15px; padding-right:15px; margin:0 auto; } 
.contain:after { content:" "; display:block; clear:both; } 
.contain.w1900 { max-width:1930px } 


/* header */
#header { position:absolute; top:0; left:0; width:100%; z-index:90; transition: all 0.5s ease-in-out; } 
#header .contain { position:relative; height:110px; max-width:1850px !important; } 
#header .sitelogo { position:absolute; top:50%; left:15px; -ms-transform:translateY(-50%); transform:translateY(-50%); z-index:10 } 
.util { position:absolute; top:50%; right:15px; -ms-transform:translateY(-50%); transform:translateY(-50%); z-index:2 } 
.util ul { display:flex; margin-left:-22px; } 
.util ul li { padding-left:22px; } 

.m-util { margin-top:20px; } 
.m-util ul { display:flex; justify-content:center; margin-left:-15px; } 
.m-util ul li { padding-left:15px; } 

.m-quick { padding:15px } 
.m-quick ul { display:flex; justify-content:center; margin:-5px; } 
.m-quick ul li { padding:5px; } 

#gnb> ul { display:flex; justify-content:center; } 
#gnb> ul> li {position:relative; padding:0 25px; } 
#gnb> ul> li a { display:inline-block; position:relative; color:#fff; font-size:20px; line-height:110px; font-weight:500; letter-spacing:-.40px; } 
#gnb> ul> li a:after { content:" "; position:absolute; bottom:40px; left:50%; width:0; height:2px; opacity:0; z-index:0; background:#fff; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } 
#gnb>ul>li.active a:after { opacity:1; width:100%; left:0; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } 
#gnb>ul>li> a .en { display:block; } 
#gnb>ul>li> a .ko { display:none; } 
#gnb>ul> li.active> a .en { display:none; } 
#gnb>ul> li.active> a .ko { display:block; } 

#gnb .submenu { display:none; position: absolute; top: 80px; left: 0; width: 190px; margin-left: 25px; background: #fff; border: 1px solid #ddd; border-top: 0; text-align: center; border-radius: 12px; } 
#gnb .submenu>ul { padding:10px 0; } 
#gnb .submenu>ul>li { padding:0 20px; } 
#gnb .submenu>ul>li>a { display: block; padding: 10px 0; color: #2c2c2c; font-size: 16px; line-height: 1em; text-align: left; } 
#gnb .submenu>ul>li>a:hover { color:#d0262b;}
#gnb .submenu>ul>li.active>a { color:#d0262b; } 

/* for mobile */
.btn-m-menu { display:none; position:absolute; top:35px; right:15px; width:20px; right:0; width:30px; height:24px; text-align:center; text-indent:-9999em; z-index:92; transition: all 0.5s ease-in-out; } 
.btn-m-menu span { position:absolute; left:0; top:13px; height:2px; width:22px; background:#fff; } 
.btn-m-menu span:before,
.btn-m-menu span:after { content:" "; position:absolute; right:0; width:30px; height:2px; background:#fff; transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s; } 
.btn-m-menu span:before { top:-10px; transition-property:top, transform; } 
.btn-m-menu span:after { bottom:-10px; transition-property:bottom, transform; } 

.mobile-navigation { position:fixed; top:0; right:0; padding:20px 0; width:300px; height:100%; overflow:auto; transition:.3s ease-in-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#212121; z-index:202; } 
.mobile-navigation .home { margin-bottom:20px; padding-left:15px; font-size:20px; color:#fff; line-height:1.4em; font-weight:500; } 
.mobile-navigation .nav-menu>ul>li { border-bottom:1px solid #333; } 
.mobile-navigation .nav-menu>ul>li>a { position:relative; padding:12px 15px; display:block; color:#fff; font-size:18px; font-weight:500; line-height:1.3em; } 
.mobile-navigation .nav-menu>ul>li>a .en { display:block } 
.mobile-navigation .nav-menu>ul>li>a .ko { display:none } 
.mobile-navigation .nav-menu>ul>li.active>a { color:#ce1c21 } 
.mobile-navigation .nav-menu>ul>li.active>a .en { display:none } 
.mobile-navigation .nav-menu>ul>li.active>a .ko { display:block } 
.mobile-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:20; } 

.mobile-navigation .submenu {padding-left:15px; color: #fff;}
.mobile-navigation .submenu ul {padding-bottom:15px;}
.mobile-navigation .submenu ul li a:hover {color:#ce1c21}

html.menu-opened { overflow:hidden; } 
html.menu-opened .mobile-navigation { -ms-transform:translateX(0); transform:translateX(0); } 
html.menu-opened .mobile-overlay { display:block; } 
html.menu-opened .btn-m-menu { top:18px; right:15px; width:22px; height:22px; z-index:203 } 
html.menu-opened .btn-m-menu span { background:none; width:100%; height:2px; } 
html.menu-opened .btn-m-menu span:before,
html.menu-opened .btn-m-menu span:after { transition-delay:0s, 0.3s; background:#fff; width:22px; height:2px; } 
html.menu-opened .btn-m-menu span:before { top:0; transform:rotate(45deg); } 
html.menu-opened .btn-m-menu span:after { bottom:0; transform:rotate(-45deg); } 

/* main-pop */
.cate_pop { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.7); z-index:1000; overflow:hidden; } 
.cate_pop .pop_slide { margin:0 auto; max-width:600px; width:80%; position:relative; top:50%; transform:translate(0, -50%); } 
.cate_pop .cateSlider-for .thumb { position:relative; padding-bottom:100%; overflow:hidden; } 
.cate_pop .cateSlider-for .thumb img { 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; } 
.cate_pop .cateSlider-nav { margin:10px -3px; } 
.cate_pop .cateSlider-nav .title { padding: 0 3px; } 
.cate_pop .cateSlider-nav .title p { height: 80px; max-height: 80px; font-weight: 300; align-items: center; justify-content: center; color: #666; background-color: #fff; display:flex; line-height:1.25em; text-align: center; } 
.cate_pop .cateSlider-nav .slick-current .title p { background-color: #da251c; color: #fff; } 
.cate_pop .close-wrap { padding: 8px 18px; display:flex; font-weight: 300; color: #fff; border:1px solid #fff; justify-content: space-between; } 
.cate_pop .close-wrap .col-l .checkbox label:before { width: 13px; height: 13px; } 


/* main */
.main-visual .item { position:relative; height:100vh; z-index:1; overflow:hidden; } 
.main-visual .item .visual-img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; opacity: 1 !important; animation-duration: 3s; transition: all 1s ease; } 
.main-visual .content { position:absolute; top:50%; -ms-transform:translateY(-50%); transform:translateY(-50%); left:0; padding:0 100px; width:100%; color:#fff; z-index:50; transition:all 1s; -webkit-transition-timing-function:ease; transition-timing-function:ease; } 
.main-visual .content .contain { max-width:1430px !important } 
.main-visual .content .title { font-size:57px; line-height:1.4em; font-weight:700; } 
.main-visual .content .txt { font-size:34px; line-height:1.5em; font-weight:300; } 
.main-visual .content.v1 { text-align:center; } 
.main-visual .content.v1 .txt { margin-bottom:40px; } 
.main-visual .content.v1 .title { margin-bottom:50px; } 
.main-visual .content.v2 .title { margin-bottom:10px; } 
.main-visual .content.v3 .title { margin-bottom:20px; } 
.main-visual .content.v3 .txt { margin-bottom:25px; } 
.main-visual .content.v3 .txt:last-child { margin-bottom:0; } 
.main-visual .content img { display:inline-block; vertical-align:middle; position:relative; margin-top:-.2em; } 
.main-visual .count-wrap { } 
.main-visual .count-wrap ul { display:flex; align-items:center; } 
.main-visual .count-wrap ul li { width:25%; position:relative; padding:20px 0; text-align:center; } 
.main-visual .count-wrap ul li:after { content:""; position:absolute; top:0; left:0; width:.1em; height:100%; background:#fff; opacity:.5; } 
.main-visual .count-wrap ul li:first-child:after { display:none } 
.main-visual .count-wrap ul li .tt { font-size:20px; line-height:1.4em; font-weight:600; margin-bottom:20px; } 
.main-visual .count-wrap ul li .number { font-size:18px; line-height:1.4em; margin-bottom:10px; } 
.main-visual .count-wrap ul li .number .num { font-size:60px; font-weight:600; } 
.main-visual .count-wrap ul li p { font-size:16px; line-height:1.4em; } 
.main-visual .slick-arrow { position:absolute; top:50%; font-size:0; width:36px; height:72px; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; background-size:contain; margin-top:-36px; opacity:.50; border:0; z-index:70; } 
.main-visual .slick-arrow:hover { opacity:1; } 
.main-visual .slick-prev { left:50px; background-image:url('../images/main/bt_prev.png'); } 
.main-visual .slick-next { right:50px; background-image:url('../images/main/bt_next.png'); } 
.main-visual .slick-dots { position:absolute; bottom:50px; left:0; width:100%; display:flex; justify-content:center; z-index:50 } 
.main-visual .slick-dots li { margin:0 8px; } 
.main-visual .slick-dots li button { position:relative; font-size:0; line-height:0; width:16px; height:16px; background:transparent; border:4px solid #fff; border-radius:100%; opacity:.52; } 
.main-visual .slick-dots li.slick-active button { opacity:1; background:#ce1c21; width:20px; height:20px; border-color:#ce1c21 } 

.animated { transition: all .5s ease; } 

.main-visual [data-animation-in] { opacity: 0; animation-duration: 1.5s; transition:opacity 0.5s ease 0.3s; transition:1s; } 
@keyframes zoomInImage { 
 from { transform: scale3d(1.1, 1.1, 1.1); transition:1s; } 
 to { transform: scale3d(1, 1, 1); transition:1s; } 
 }
.zoomInImage { animation-name: zoomInImage; } 

@keyframes zoomOutImage { 
 from { transform: scale3d(1, 1, 1); transition:1s; } 
 to { transform: scale3d(1.1, 1.1, 1.1); transition:1s; } 
 }
.zoomOutImage { animation-name: zoomOutImage; transition:1s; } 


#main .contain { max-width:1930px; } 
/* #main .contain2 { max-width:1400px; margin: 0 auto; } */
.main-title { text-align:center; margin-bottom:40px; } 
.main-title h2 { font-size:60px; line-height:1.4em; color:#2c2c2c; font-weight:500; margin-bottom:10px; font-family: 'Frank Ruhl Libre', serif; text-transform: uppercase; } 
.main-title p { font-size:18px; line-height:1.5em; color:#a8a8a8; } 

.main-brand { padding:90px 0; } 
.main-brand .slick-list { margin-left:-10px; } 
.main-brand .slick-slide { padding-left:10px; } 
.main-brand a { display:block; position:relative; } 
.main-brand .thumb { position:relative; height:0; padding-bottom:100%; overflow:hidden } 
.main-brand .thumb 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; transition:0.3s; } 
.main-brand .thumb:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:0; } 
.main-brand a:hover .thumb img { transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04); } 
.main-brand a:hover .thumb:after { opacity:.42; } 
.main-brand .content { position:absolute; bottom:0; left:0; width:100%; padding:20px 15px; color:#fff; text-align:center; background-color:rgba(0,0,0,.42); text-align:center; z-index:1; transition:0.3s; } 
.main-brand .content .tit-row { display:flex; justify-content:center; align-items:center; } 
.main-brand .content .tit-row .icon { width:46px; } 
.main-brand .content .tit-row .tit { padding-left:10px; font-size:30px; line-height:1.4em; font-weight:500; font-family: 'Frank Ruhl Libre', serif; } 
.main-brand .content p { font-size:18px; line-height:1.4em; } 
.main-brand .content .more { display:none; width:72px; height:72px; border-radius:100%; text-align:center; font-size:26px; line-height:72px; color:#ce1c21; background:#fff; margin:20px auto 0; } 
.main-brand a:hover .content { bottom:auto; top:50%; background:none; transform:translateY(-50%); -ms-transform:translateY(-50%); } 
.main-brand a:hover .content .more { display:block } 
.main-brand .slick-dots { padding-top:20px; display:flex; justify-content:center; } 
.main-brand .slick-dots li { margin:0 3px; } 
.main-brand .slick-dots li button { position:relative; font-size:0; line-height:0; width:12px; height:12px; background:#ddd; border:0; border-radius:100%; opacity:.52; } 
.main-brand .slick-dots li.slick-active button { opacity:1; background:#ce1c21; width:16px; height:16px; border-color:#ce1c21 } 

.main-more { text-align:center; margin-top:50px; } 
.main-more a { display:inline-block; position:relative; padding:0 34px; min-width:220px; border:1px solid #a8a8a8; font-size:20px; line-height:64px; color:#2c2c2c; font-weight:500; } 
.main-more a span { display:inline-block; vertical-align:middle; position:relative; top:-.04em; width:18px; height:18px; margin-left:10px; transition:0.3s; } 
.main-more a span:before,
.main-more a span:after { content:""; position:absolute; background:#ce1c21 } 
.main-more a span:before { top:0; left:50%; width:2px; height:100%; margin-left:-1px; } 
.main-more a span:after { top:50%; left:0; width:100%; height:2px; margin-top:-1px; } 
.main-more a:hover { background:#ce1c21; border-color:#ce1c21 !important; color:#fff } 
.main-more a:hover span:before,
.main-more a:hover span:after { background:#fff; } 

.main-product { padding:90px 0; background:#121212 } 
.main-product .main-title h2 { color:#fff } 
.main-product .main-title p { color:#666 } 
.main-product .slick-list { margin-left:-10px; } 
.main-product .slick-slide { padding-left:10px; } 
.main-product .item { text-align:center; } 
.main-product .thumb { position:relative; height:0; padding-bottom:141.4%; margin-bottom:20px; overflow:hidden } 
.main-product .thumb 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; transition:0.3s; } 
.main-product .thumb:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:12px solid #ce1c21; opacity:0; transition:0.3s; } 
.main-product a:hover .thumb img { transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04); } 
.main-product a:hover .thumb:after { opacity:1; } 
.main-product .tit-row { display:flex; justify-content:center; align-items:center; } 
.main-product .tit-row .icon { width:46px; } 
.main-product .tit-row .tit { padding-left:10px; font-size:22px; line-height:1.4em; font-weight:500; color:#fff; font-family: 'Frank Ruhl Libre', serif; transition:0.3s; } 
.main-product a:hover .tit { color:#ce1c21 } 
.main-product .main-more a { color:#fff; border-color:#666 } 
.main-product .main-more a:hover { border-color:#ce1c21 } 
.main-product .slick-dots { padding-top:20px; display:flex; justify-content:center; } 
.main-product .slick-dots li { margin:0 3px; } 
.main-product .slick-dots li button { position:relative; font-size:0; line-height:0; width:12px; height:12px; background:#ddd; border:0; border-radius:100%; opacity:.52; } 
.main-product .slick-dots li.slick-active button { opacity:1; background:#ce1c21; width:16px; height:16px; border-color:#ce1c21 } 

.main-project { padding:90px 0 40px; } 
.main-project > ul { display:flex; flex-wrap:wrap; margin-left:-10px; margin-bottom:-10px; } 
.main-project > ul > li { width:33.33333%; padding-left:10px; margin-bottom:10px; } 
.main-project .thumb { position:relative; height:0; padding-bottom:57.7%; overflow:hidden } 
.main-project .thumb 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; transition:0.3s; } 
.main-project .thumb:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:12px solid #ce1c21; opacity:0; transition:0.3s; } 
.main-project a:hover .thumb img { transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04); } 
.main-project a:hover .thumb:after { opacity:1; } 



.main-pedestal { background:url('../images/main/pedestal.jpg') 50% 50% no-repeat; text-align:center; background-size:cover; color:#fff; height:870px; margin-bottom:40px; display:table; width:100%; } 
.main-pedestal .cell { width:100%; height:100%; display:table-cell; vertical-align:middle; } 
.main-pedestal .title { font-size:72px; line-height:1.4em; font-weight:500; margin-bottom:30px; font-family: 'Frank Ruhl Libre', serif; } 
.main-pedestal .cnt { font-size:28px; line-height:1.6em; font-weight:300; } 
.main-pedestal .main-more a { color:#fff; border-color:#fff } 
.main-pedestal .main-more a span:before,
.main-pedestal .main-more a span:after { background:#fff; } 
.main-pedestal .main-more a:hover { border-color:#ce1c21 } 

.main-customer { margin-bottom:130px; } 
.main-customer .img { height:380px; background:url('../images/main/customer.jpg') 50% 50% no-repeat; text-align:center; background-size:cover; } 
.main-customer .title { padding:110px 0; font-size:60px; color:#fff; line-height:1.4em; font-weight:500; margin-bottom:30px; font-family: 'Frank Ruhl Libre', serif; } 
.main-customer .wrap { padding:0 15px; } 
.main-customer .box { max-width:1400px; margin:0 auto; background:#fff; box-shadow:10px 40px 30px rgba(0,0,0,.15); padding:80px 0; margin-top:-115px; position:relative; } 
.main-customer .box:after { content:""; position:absolute; top:0; left:0; width:100%; height:115px; border:12px solid #ce1c21; border-bottom:0; } 
.main-customer .box ul { display:flex; } 
.main-customer .box ul li { width:33.333333%; text-align:center; padding:30px 0; position:relative; } 
.main-customer .box ul li:after { content:""; position:absolute; top:0; left:0; width:1px; height:100%; background:#dfdfdf; } 
.main-customer .box ul li:first-child:after { display:none; } 
.main-customer .box ul li .tit { color:#2c2c2c; font-size:30px; line-height:1.4em; font-weight:300; margin-bottom:25px; } 
.main-customer .box ul li .icon { margin-bottom:25px; } 
.main-customer .box ul li p { font-size:22px; line-height:1.4em; } 
.main-customer .box ul li p.tel { font-size:24px; } 
.main-customer .box ul li p.bt { font-size:20px; } 
.main-customer .box ul li p.bt .arrow { font-size:22px; color:#ce1c21; margin-left:5px; } 

.main-sns { padding: 60px 0 100px; } 
.main-sns .sns01 { margin-bottom: 50px; } 
.pic-list { position: relative; padding: 0 100px; max-width: 1400px; margin: 0 auto; } 
.pic-list a { display: block; } 
.pic-list .swiper a .thumb { position:relative; padding-bottom:100%; overflow:hidden; } 
.pic-list .swiper a .thumb img { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; object-fit:cover; } 
.pic-list .swiper a:hover .thumb::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 12px solid #ce2c30; z-index: 10; } 
.pic-list .slide-btn { position:absolute; top:50%; transform:translateY(-50%); border:0; width:19px; height:34px; background:url("../images/main/slide_arrow.png") no-repeat 50% 50%/contain; } 
.pic-list .slide-btn.prev { left:50px; transform:rotate(180deg) translateY(50%) } 
.pic-list .slide-btn.next { right:50px; } 
.pic-list .slide-btn.swiper-button-disabled { opacity:.2; } 
.pic-list .slide-btn:hover.prev { background-image: url(../images/main/slide_arrow_on.png); } 
.pic-list .slide-btn:hover.next { background-image: url(../images/main/slide_arrow_on.png); } 

.youtubeSwiper .video-container { position:relative; padding-bottom:48.99%; height:0; overflow:hidden; background:#000; } 
.youtubeSwiper .video-container video { position: absolute; top:0; left:0; width:100%; height:100%; } 


/* sub page */
#sub #container { padding-top:60px; } 
.sub-visual { position:relative; width:100%; height:441px; overflow:hidden; } 
.sub-visual .content { position:absolute; top:60%; left:0; transform:translateY(-60%); -ms-transform:translateY(-60%); color:#fff; text-align:center; width:100%; z-index:10; } 
.sub-visual .content h2 { font-size:66px; line-height:1.5em; font-weight:500; font-family: 'Frank Ruhl Libre', serif; } 
.sub-visual .background { position:absolute; top:0; left:0; width:100%; height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; transform:scale(1.09); -ms-transform:scale(1.09); /* IE 9 */
 -moz-transform:scale(1.09); /* Firefox */
 -webkit-transform:scale(1.09); /* Safari and Chrome */
 -o-transform:scale(1.09); /* Opera */
transition: all 2s ease-out 0s; transition-delay: 0.1s; z-index:0; } 
.sub-visual.load .background { transform:scale(1); -ms-transform:scale(1); /* IE 9 */
 -moz-transform:scale(1); /* Firefox */
 -webkit-transform:scale(1); /* Safari and Chrome */
 -o-transform:scale(1); /* Opera */ } 


.sub-title { margin:80px 0 60px; text-align:center; } 
.sub-title h2 { color:#2c2c2c; font-size:44px; line-height:1.6em; letter-spacing:-.40px; } 


.lnb { max-width:1200px; margin:0 auto 60px; } 
.lnb ul { display:flex; } 
.lnb ul li { position:relative; font-size:20px; text-align:center; line-height:68px; letter-spacing:-.04em; } 
.lnb ul li:after { content:""; position:absolute; top:50%; left:0; width:1px; height:16px; background:#fff; margin-top:-8px; opacity:.40; } 
.lnb ul li:first-child:after { display:none } 
.lnb ul li:first-child a { border-left:1px solid #a8a8a8; } 
.lnb ul li a { display:block; color:#2c2c2c; border:1px solid #a8a8a8; border-left:0; } 
.lnb ul li.active a { background:#da251c; border-color:#da251c; color:#fff; font-weight:600; } 

.real-cont { padding-bottom:100px; } 
.real-cont.none { padding-bottom:0; } 



/* footer */
#footer { position:relative; background:#121212; padding:36px 0; color:#878787; font-size:14px; line-height:1.4em; } 
#footer address { font-style:normal; } 
#footer .bar { padding:0 10px; } 
#footer .br { padding:0 10px; } 
#footer .contain { position:relative; max-width:1850px !important; } 

.foot-row { display:flex; flex-wrap:wrap; align-items:center; } 
.foot-logo { width:310px } 
.foot-info { width:calc(100% - 310px); padding-left:50px; } 
.foot-info .tit { font-size:18px; line-height:1.4em; color:#fff; font-weight:500; margin-bottom:14px; } 
.foot-info .copy { margin-top:15px; } 
.foot-menu { position:absolute; top:50%; right:15px; transform:translateY(-50%); -ms-transform:translateY(-50%); } 
.foot-menu ul { display:flex; margin-left:-26px; } 
.foot-menu ul li { margin-left:26px; } 
.foot-menu ul li a { display:block; position:relative; padding-left:22px; color:#fff; } 
.foot-menu ul li a:before { content:""; position:absolute; top:2px; left:0; width:17px; height:17px; background:url('../images/common/icon_link.png') 50% 50% no-repeat; } 

.scroll-top { position:absolute; bottom:200px; right:50px; display:table; width:74px; height:74px; text-align:center; background:#121212; z-index:50 } 
.scroll-top .cell { display:table-cell; vertical-align:middle; width:100%; height:100%; } 
.scroll-top .arrow { display:block; width:0; height:0; margin:0 auto; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:6px solid #fff; } 
.scroll-top p { font-size:12px; line-height:1.4em; font-weight:500; color:#fff; margin-top:5px; } 

.quick { position:fixed; top:200px; right:0; text-align:center; width:100px; z-index:50 } 
.quick .box { border:1px solid #a8a8a8; background:#fff; } 
.quick .box a { display:block; padding:20px 15px; } 
.quick .box .icon { margin-bottom:10px; } 
.quick .box .tit { font-size:12px; line-height:1.3em; color:#878787; } 
.quick .top { } 
.quick .top a { display:block; background:#121212 url('../images/common/quick_top.png') 50% 50% no-repeat; height:36px; } 

.quick .sns-list { } 
.quick .sns-list a { display: block; margin-bottom: 15px; }