﻿@charset 'utf-8';
@import url(normalize.css);

/* 웹폰트 */
@font-face {
    font-family: 'NanumSquareR';
    font-style: normal;
    font-weight: 100;
    src: local('NanumSquareR'), 
    url(font/NanumSquareR.otf) format('opentype'),
	url(font/NanumSquareR.eot),
    url(font/NanumSquareR.eot?#iefix) format('embedded-opentype'),
    url(font/NanumSquareR.woff) format('woff')
}
@font-face {
    font-family: 'NanumSquareL';
    font-style: normal;
    font-weight: 100;
    src: local('NanumSquareL'), 
    url(font/NanumSquareL.otf) format('opentype'),
	url(font/NanumSquareL.eot),
    url(font/NanumSquareL.eot?#iefix) format('embedded-opentype'),
    url(font/NanumSquareL.woff) format('woff')   
}
@font-face {
    font-family: 'NanumSquareB';
    font-style: normal;
    font-weight: 100;
    src:
    url(font/NanumSquareB.otf) format('opentype'),
	url(font/NanumSquareB.eot),
    url(font/NanumSquareB.eot?#iefix) format('embedded-opentype'),
    url(font/NanumSquareB.woff) format('woff');
}
@font-face {
    font-family: 'NanumSquareEB';
    font-style: normal;
    font-weight: 700;
    src: local('NanumSquareEB'),
    url(font/NanumSquareEB.otf) format('opentype'),
	url(font/NanumSquareEB.eot),
    url(font/NanumSquareEB.eot?#iefix) format('embedded-opentype'),
    url(font/NanumSquareEB.woff) format('woff');
}
@font-face {
    font-family: 'NotoSansKR-Black';
    font-style: normal;
    font-weight: 900;
    src: local('NotoSansKR-Black'),
    url(font/NotoSansKR-Black.otf) format('opentype'),
	url(font/NotoSansKR-Black.eot),
    url(font/NotoSansKR-Black.eot?#iefix) format('embedded-opentype'),
    url(font/NotoSansKR-Black.woff) format('woff');
}

/* reset */
html, body, h1, h2, h3, h4, h5, h6, li, dl, dt, dd{margin: 0 ;}
html{overflow-x:hidden}
button, div, span, table, tr, td, ul, ol, li, dl, dt, dd{box-sizing:border-box}
fieldset{margin:0;padding:0;border:0;}
legend, .hidden{position:absolute;background:red;left:-9999em;}
img, video {max-width: 100% ;height: auto ;}
ul, ol {list-style-type: none;}
a:link, a:visited, a:hover, a:focus{text-decoration: none ;}
a:link, a:visited, a:hover, a:focus{color: inherit;}

/* ClearFix */
.header:after, .gnb:after, .footer-box div:after, .main-news-box:after, .main-vod-box:after, .main-product-box:after, .footer-box:after, .main-quickmenu-box:after, .footer-box .box-r:after, .footer-box .box-l:after, .about-cont:after, .vision-cont:after, .history-tab:after, .historylist > li:after, .location-cont:after, .sub-news-box:after, .catalog-cont:after, .ci-dym:after, .asterm-cont:after, .product-list-box:after, .product-view-header:after{content:"";display:block;clear:both;}


/*///////////////////////////////////////// pc /////////////////////////////////////////*/


/* ---본문스타일 공통--- */
html {font-size: 10px;}
body{font-size:1.6rem;font-family: 'NanumSquareR';line-height:1;color:#333;background-color:#fff;}
h1, h2, h3, h4{font-family: 'NanumSquareB';color:#000;word-break:keep-all}
h1{font-size: 4.2rem}
h2{font-size: 3.4rem}
h3{font-size: 2.6rem}
h4{font-size: 1.8rem}
p{line-height : 1.8 ;word-break:keep-all}
input, textarea{background:#f4f4f4;border:none;border-radius:4px;color:#333;box-sizing:border-box}
input{height:52px;padding:0 24px;line-height:2;vertical-align:middle;}
textarea{width:100%;padding:24px;line-height:1.5;}
::placeholder {font-family: 'NanumSquareR';color:#aaa;opacity: 1; /* Firefox */}
:-ms-input-placeholder {font-family: 'NanumSquareR';color: #aaa !important;}
::-ms-input-placeholder {font-family: 'NanumSquareR';color: #aaa;}
.txt-aln-c{text-align:center}
.txt-aln-l{text-align:left}
.txt-aln-r{text-align:right}
textarea:focus, button:focus, input:focus  {outline: none;}

/* 버튼 */
a.btn-red{display:inline-block;width:200px;height:52px;border-radius:26px;background-color:#f00000;border:2px solid #f00000;font-family: 'NanumSquareB';font-size: 1.6rem;line-height:3.2;color:#fff;text-align:center;transition: 0.2s;box-sizing:border-box}
a.btn-red:hover {background-color:#fff;color:#f00000;border:2px solid #f00000;transition: 0.2s;box-shadow: 0 2px 30px rgba(0, 0, 0, 0.19);box-sizing:border-box;}

a.btn-black{display:inline-block;width:200px;height:52px;border-radius:26px;background-color:#000;border:2px solid #000;font-family: 'NanumSquareB';font-size: 1.6rem;line-height:3.2;color:#fff;text-align:center;transition: 0.2s;box-sizing:border-box}
a.btn-black:hover {background-color:#fff;color:#000;border:2px solid #000;transition: 0.2s;box-shadow: 0 2px 30px rgba(0, 0, 0, 0.19);box-sizing:border-box}

.btn-top{display: none;position: fixed;bottom: 36px;right: 36px;z-index: 99;width:52px;height:52px;background-color:#f1f1f1;border-radius:50%;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);cursor:pointer}
.btn-top >span{display: inline-block;position:absolute;top:22px;left:18px;width: 8px;height: 8px;border-top: 2px solid #f00000;border-right: 2px solid #f00000;transform-origin: 100% 0;transform: rotate(-45deg); }
.btn-top:hover {background:#fff;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.19);transition: 0.2s;}
.btn-top:hover span{border-color: #f00000;}

a.btn-down{display:inline-block;width:160px;height:52px;padding-left:20px;background:url('/images/front/icon_down@3x.png')  24% 50% no-repeat;background-size:20px 20px;background-color:#f00000;border-radius:26px;border:2px solid #f00000;font-family: 'NanumSquareB';font-size: 1.6rem;line-height:3.2;color:#fff;text-align:center;transition: 0.2s;box-sizing:border-box;}
a.btn-down:hover {background-color:#000;border-radius:26px;border:2px solid #000;box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);box-sizing:border-box}

/* 체크박스 */
.checkbox-wrap {position: relative;font-size:1.5rem;}
.checkbox-wrap input[type="checkbox"] {display:none;}
.checkbox-wrap input[type="checkbox"] + label span {display:inline-block; width: 24px; height: 26px;margin-right:12px;vertical-align: middle;cursor: pointer;background: url(/images/front/checkbox_off@3x.png) 0 0 no-repeat;background-size:24px 24px;}
.checkbox-wrap input[type="checkbox"]:checked + label span {display: inline-block;background: url(/images/front/checkbox_on@3x.png) 0 0 no-repeat;background-size:24px 24px;}

/* pager */
.pagination{width:100%;padding:20px 0;text-align:center}
.pagination a {position: relative;display:inline-block;width:32px;height:32px;margin:0 6px;border-radius:50%;line-height:2.5;font-size:1.4rem;font-family: 'NanumSquareEB';text-align:center;vertical-align:middle;transition:0.3s}
.pagination a > span{display: inline-block;position:absolute;width:7px;height:7px;border-top: 2px solid #000;border-right: 2px solid #000;}
.pagination a > span.next{top:10px;left:8px;transform-origin: 100% 50%;transform: rotate(-135deg); }
.pagination a > span.prev{top:12px;left:9px;transform-origin: 50% 100%;transform: rotate(45deg); }
.pagination a.active {background-color: #f00000;color:#fff;}
.pagination a:hover:not(.active) {background-color: #ddd;}

/* select box */
.search-wrap{position:relative;width:320px;height:52px;margin:0 auto;margin-top:60px;border-bottom:2px solid #000}
.custom-select {float:left;position: relative;width:110px;margin-top:5px;font-size:1.4rem;line-height:1.8}
.custom-select select {display:none}
.select-selected:after {content: "";display: inline-block;position:absolute;top:13px;right:7px;width:6px;height:6px;border-top: 2px solid #000;border-right: 2px solid #000;transform: rotate(135deg); }
.select-selected.select-arrow-active:after {top:17px;right:7px;transform: rotate(-45deg); }
.select-items div,.select-selected {color: #000;padding: 8px 12px;cursor: pointer;user-select: none;}
.select-items {padding-left:0;position: absolute;background-color:#f5f5f5;top: 100%;left: 0;right: 0;z-index: 99;}
.select-hide {display: none;}
.select-items div:hover, .same-as-selected {background-color: rgba(0, 0, 0, 0.1);}
.search-wrap input{float:left;height:50px;padding-left:8px;background-color:#fff;font-size:1.4rem}
.search-wrap span{position:absolute;top:16px;right:0}
.search-wrap span img{width:18px;height:18px}

/* ---wrap--- */
.wrapper, .gnb-wrap, .footer-wrap,.main-bn-wrap, .main-quickmenu-wrap, .main-product-wrap, .main-vod-wrap, .main-news-wrap, .main-ask-wrap,.sub-title-wrap,.sub-container-wrap, .product-view-detail-wrap {position:relative;width:100%;}
.gnb-box, .footer-box, .main-quickmenu-box, .main-product-box, .main-vod-box, .main-news-box, .main-ask-box, .sub-container-box, .product-view-detail-box{position:relative;width:100%;max-width:1280px;margin:0 auto;padding:0 36px;}


/* ---gnb---*/
.gnb-wrap{height:84px}
.gnb-box h1{position: absolute;left: 36px;top: 10px}
.gnb-box h1 img{width:162px;height:auto}

.mobile-menu-open{display: none;position: absolute;right: 8px;top: 11px;width: 40px;height: 40px;border:none;background-color:#fff}
.mobile-menu-close{display: none;position: absolute;right: 8px;top: 11px;width: 40px;height: 40px;border:none;background-color:#fff}

.main-nav-wrap{float:right;position:relative;z-index:200}
.main-nav {position:relative;background: #ff0;margin-top:26px;}
.main-nav > ul {position:relative;}
.main-nav > ul > li { margin-left:30px;float:left;position:relative;font-size: 1.7rem;color:#333;font-family: 'NanumSquareB';line-height:2.4}
.main-nav > ul > li > a {display:block;width:90px;height:38px;text-align:center}
.main-nav > ul > li > a:hover, .main-nav > ul > li > a.active {font-family: 'NanumSquareEB'}
.main-nav ul ul {position:relative;left:0;top:0;width: 120px;margin: 0 4px 4px 4px;padding:12px 0;background-color: #fff;border: 1px solid #e1e1e1;border-radius: 4px;font-size:1.4rem;color:#666;text-align:center;box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2); transition: max-height 0.2s ease-out;z-index:9000}
.main-nav .nav-pop{position:absolute;left:-18px;max-height: 0;overflow: hidden; transition: max-height 0.2s ease-out;z-index:900}
.main-nav ul ul a{height: 36px;line-height:2.8;text-align: center;font-family: 'NanumSquareR'}
.main-nav ul ul a:hover{border-bottom:2px solid #f00000;color:#000;font-family: 'NanumSquareB'}
#header-wrap{display:none}


/* ---footer--- */
.footer-wrap{padding-bottom:40px;background-color:#1a1a1a;color:#6b6b6b;font-size:1.4rem}
.footer-box .box-l{float:left;height:96px;padding-top:34px;font-family: 'NanumSquareB';}
.footer-box .box-r{float:right;height:96px;padding-top:46px;font-family: 'NanumSquareB';}
.footer-box h1{display:inline-block;margin-right:40px;vertical-align:middle}
.footer-box a{padding-left:28px;background: url('/images/front/footer_bar.png') 10px 1px no-repeat;cursor:pointer}
.footer-box a:hover{color:#bbb}
.footer-box span{margin-right:12px}
.footer-box .box-l a:nth-last-child(2){margin-left:10px;background:none}
.footer-box .box-r a:first-child{background:none}
.footer-box hr{height:1px;margin-bottom:30px;background-color:#2f2f2f;border:none}
.footer-box .place{line-height:3}
.footer-box .copyright{color:#555;font-size:1.2rem;line-height:3}


/* ---메인페이지--- */
#main-visual{position: relative;width: 100%;margin-bottom:80px;background:url('/images/front/main_visual_bg.jpg') center 0 no-repeat;background-color:#2c343f;}
#main-visual .visual-item-wrap{position: relative;width:100%;max-width:1208px;height:580px;margin:0 auto;line-height:580px;text-align:center}
#main-visual .visual-item-wrap img{vertical-align:middle}
#main-visual .visual-item-wrap .bn-mobile{display:none}
#main-visual .bx-prev, #main-visual .bx-next{display: block;width: 36px;height: 52px;text-indent: -9999px;position: absolute;top: 50%;margin-top: -26px;}
#main-visual .bx-prev{left: 10px;background: url('/images/front/btn_visual_next.png') no-repeat}
#main-visual .bx-next{right: 10px;background: url('/images/front/btn_visual_prev.png') no-repeat;}
#main-visual .bx-pager {text-align: center;position: absolute;width: 100%;bottom: -40px;left:0;}
#main-visual .bx-pager-item{display: inline;}
#main-visual .bx-pager-link{display: inline-block;width:25px;height:18px;background:url('/images/front/blt.png') center 0 no-repeat;text-indent: -9999px;}
#main-visual .bx-pager-link.active{background:url('/images/front/blt_on.png') center 0 no-repeat}

.main-quickmenu-box{animation:ani-quickmenu 1s;  animation-delay:0s; animation-duration:0.7s; animation-iteration-count:1;}
.main-quickmenu-box div{float:left;width:25%;padding:30px 0 40px 0; text-align:center}
.main-quickmenu-box img{width:32px;height:32px}
.main-quickmenu-box .title{display:block;font-size: 2rem;line-height:2.5;font-family: 'NotoSansKR-Black';}
.main-quickmenu-box p{margin:0 20%;font-size: 1.4rem;}
.main-quickmenu-box a:hover{color:#f00000}
.main-quickmenu-wrap hr{height:2px;background-color:#f00000;border:none}
@keyframes ani-quickmenu{
    0%{opacity:0;top:30px;transform:ease-in;}
    100%{opacity:1;top:0;}
}

.main-product-wrap{padding-top:80px;padding-bottom:80px}
.main-product-box{position:relative;padding:60px 36px;font-size:1.8rem;}
.main-product-box .product-l{position:relative;float:left;width:50%}
.main-product-box .product-r{position:relative;float:right;width:50%;padding-left:60px;box-sizing:border-box}
.main-product-box img{border-radius:50%;box-shadow: 0 25px 45px rgba(0, 0, 0, 0.1)}
.main-product-box h2{margin-top:50px;margin-bottom:40px;font-size:4.2rem;letter-spacing:-1px}
.main-product-box ul{padding-bottom:60px;margin-top:40px;padding-left: 0;}
.main-product-box li{padding-left:24px;background:url('/images/front/check_red@3x.png') no-repeat 0 50%;background-size:16px 16px;font-size:1.5rem;line-height:2;color:#999 }

.main-vod-wrap{background:url('/images/front/main_vod_bg.jpg') 50% 0;}
.main-vod-box{margin:0 auto;padding:150px 36px;}
.main-vod-box .vod-box{float:left;position:relative;width:50%;}
.main-vod-box .vod-box .wrap{position:relative; padding-top:56.22%; width:100%;}
.main-vod-box .vod-box .wrap iframe{ position:absolute; top:0; left:0; width:100%; height:100%}
.main-vod-box .txt-box{float:left;margin-left:10%}
.main-vod-box p{margin-bottom:20px;color:#666}
.main-vod-box p > span{color:#f00000}
.main-vod-box .vod-btn{display:inline-block;margin-top:40px;color:#000;font-size:1.4rem;font-family: 'NanumSquareEB'}
.main-vod-box .vod-btn a:before{content: "";display:inline-block;margin-right:10px;width:40px;height:40px;background:url(/images/front/btn_more@3x.png) no-repeat;background-size:40px 40px;transform: rotate(-180deg);transition: 0.2s;vertical-align:middle}
.main-vod-box .vod-btn:hover a:before{transform: rotate(180deg);transition: 0.2s;}

.main-news-wrap{background:url('/images/front/bg_line.png') repeat;}
.main-news-box{padding:150px 36px;}
.main-news-box .news-txt{float:left;width:25% }
.main-news-box .news-txt > p{margin-top:20px;font-size:1.4rem;color:#999}
.main-news-box .news-txt .news-btn{display:inline-block;position:relative;width:40px;height:40px;margin-top:40px;margin-right:4px;background-color:#000;border-radius:50%}
.main-news-box .news-txt .news-btn >span{display: inline-block;position:absolute;top:14px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform-origin: 20% 80%; }
.main-news-box .news-txt .news-btn .prev{left:14px;transform: rotate(45deg); }
.main-news-box .news-txt .news-btn .next{left:23px;transform: rotate(-135deg); }
.main-news-box .news-txt .news-btn:hover {background:#fff;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.19);transition: 0.2s;}
.main-news-box .news-txt .news-btn:hover .next,.main-news-box .news-txt .news-btn:hover .prev{border-color: #f00000;}
/* off btn - 시작 */
.main-news-box .news-txt .news-btn-off{display:inline-block;position:relative;width:40px;height:40px;margin-top:40px;margin-right:4px;background-color:#b8b8b8;border-radius:50%}
.main-news-box .news-txt .news-btn-off >span{display: inline-block;position:absolute;top:14px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform-origin: 20% 80%; }
.main-news-box .news-txt .news-btn-off .prev{left:14px;transform: rotate(45deg); }
.main-news-box .news-txt .news-btn-off .next{left:23px;transform: rotate(-135deg); }
/* off btn - 끝 */
.main-news-box .news-card{position:relative;float:left;width:calc(25% - 20px);max-width:282px;height:460px;margin-left:20px;background:#fff;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);transition: 0.2s;}
.main-news-box .news-card:hover{box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);}
.main-news-box .news-card .img-box{position:relative;width:100%;height:188px;background:url('/images/front/news_no_img.png') 50% 0 no-repeat;background-size: auto 100%;background-color:#dcdcdc;border-radius:4px 4px 0 0 ;overflow:hidden }
.main-news-box .news-card .img-box img{width:100%;height:188px;min-height:188px;border-radius:4px 4px 0 0  }
.main-news-box .news-card p{height:155px;margin:24px;color:#666;font-size:1.5rem;line-height:1.8;text-align:left;overflow:hidden}
.main-news-box .news-card .btn-more{position:absolute;left:24px;bottom:21px;font-size:11px;font-family: 'NanumSquareEB';color:#000;}
.main-news-box .news-card .btn-more img{width:20px;height:20px;margin-right:10px;vertical-align:middle}
.main-news-box .news-card .time{position:absolute;right:24px;bottom:25px;font-size:11px;font-family: 'NanumSquareEB';color:#000;letter-spacing:2px}

.main-ask-box{padding:150px 31px;text-align:center;}
.main-ask-box p{margin:20px 0 40px 0;font-size:1.4rem;color:#999}
.main-ask-box input{width:calc(33.33% - 10px);margin:5px}
.main-ask-box textarea{width:calc(100% - 10px);height:200px;margin:5px}
.main-ask-box .term-box{position:relative;width:calc(100% - 10px);margin:5px 5px 50px 5px;border:1px solid #ebebeb;border-radius:4px;line-height:2.6;padding:8px 24px;text-align:left}
.main-ask-box .view-term{position:absolute;top:12px;right:24px;font-size:1.5rem;cursor: pointer;line-height:2.6}
.main-ask-box .view-term img{width:12px;height:12px;margin-left:4px;vertical-align:middle}
.main-ask-box .content {padding: 0;margin:0;max-height: 0;overflow: hidden;transition: max-height 0.2s ease-out;border:none;text-align:left}
.main-ask-box .content iframe{width:100%;height:140px;overflow:auto;margin:6px 0;padding:0}



/* -- 서브페이지 --  */
/* 공통 */
.sub-title-wrap{color:#fff;text-align:center}
.sub-title-wrap h2{padding-top:74px;color:#fff;font-size:3.6rem;font-family: 'NanumSquareR'}
.sub-title-wrap .location{padding-top:24px;font-size:1.3rem;color:rgba(255,255,255,0.5)}
.sub-title-wrap .location > span{display: inline-block;height: 7px;width:7px;margin:10px;border-top: 1px solid rgba(255,255,255,0.6);border-right: 1px solid  rgba(255,255,255,0.6);transform-origin: 50% 0;transform: rotate(45deg);vertical-align:middle}
.sub-about-bg{height:220px;background:url('/images/front/sub_about_bg.jpg') top center no-repeat;background-color:#2e4259}
.sub-product-bg{height:440px;background:url('/images/front/sub_product_bg.jpg') top center no-repeat;background-color:#3e3c63}
.sub-pr-bg{height:220px;background:url('/images/front/sub_pr_bg.jpg') top center no-repeat;background-color:#3d374f}
.sub-cs-bg{height:220px;background:url('/images/front/sub_cs_bg.jpg') top center no-repeat;background-color:#343d5a}
.sub-container-box{min-height:400px;padding:40px 36px 140px 36px;}

.sub-title-s{margin-bottom:68px;text-align:center;}
.sub-title-s > h3{padding-bottom:10px;line-height:1.4}
.sub-title-s > p{font-size:1.4rem;padding-bottom:10px;color:#999;line-height:1.4}
.sub-title-s > h3 > span{color:#f00000}
.title-s-tag{margin-bottom:40px;}

/* 회사소개 - ceo인사말 */
.about-cont > img{float:left;margin-right:80px}
.about-cont > h3{float:left;width:calc(100% - 303px);margin-bottom:60px;font-size:2rem;line-height:1.5}
.about-cont > p{float:left;width:calc(80% - 303px);}
.about-cont span{margin-top:60px;font-family: 'NanumSquareB'}
.about-cont span > img{width:80px;height:43px;}

/* 회사소개 - 경영이념 */
.vision-card{float:left;width:calc(33.33333% - 24px);margin:0 12px;border:1px solid #ebebeb;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);text-align:center}
.vision-card img{margin-top:56px}
.vision-card h4{margin-top:12px}
.vision-card ul{margin:32px 32px 56px 32px;padding-left: 0;}
.vision-card li{padding:4px 0 4px 24px;background:url('/images/front/check_red@3x.png') no-repeat 0 8px;background-size:16px 16px;text-align:left;line-height:1.5;color:#666}

/* 회사소개 - 회사개요 */
.overview-table{width:100%;border-top:2px solid #000;border-bottom:2px solid #000;line-height:1.5;word-break:keep-all}
.overview-table th{padding:30px;background:#f8f8f8;vertical-align:top}
.overview-table td{padding:30px;color:#666}
.overview-table tr{border-bottom:1px solid #eee}

/* 회사소개 - 조직도 */
.org-pc{display:block}
.org-mobile{display:none}

/* 회사소개 - 연혁 */
.history-tab{width:100%;padding-left:0}
.history-tab li{float:left;width:20%;height:64px;background:#f0f0f0;border:1px solid #e0e0e0;font-size:1.5rem;color:#999;text-align:center;}
.history-tab li a{display:inline-block;padding-top:24px;width:100%;height:37px;background:#f0f0f0;cursor:pointer}
.history-tab li a:hover, .history-tab li a.active{background:#fff;color:#333;font-family: 'NanumSquareB';border-top:2px solid #f00000}
.historylist{display:none;padding-left: 0;}
.historylist li{padding:60px;border-bottom:1px solid #eee}
.historylist li:last-child{border:none}
.historylist h4{float:left;display:inline-block;width:96px;height:96px;background:url('/images/front/bg_line_red.png') repeat;border-radius:50%;background-color:#ff4e4e;color:#fff;text-align:center;line-height:5.8}
.historylist h4.text-s{font-size:1.4rem;line-height:7.5}
.historylist table{float:left;margin-left:7%;width:calc(93% - 120px);font-size:1.5rem;line-height:2.2}
.historylist table td{color:#999;vertical-align:top}
.historylist table th{width:36px;padding-right:12px;color:#666;font-family: 'NanumSquareB';vertical-align:top}
.historylist table th.th-s{width:80px}

/* 회사소개 - 인증현황 */
.certi-cont .row:after {content: "";display: table;clear: both;}
.certi-cont .row .column{float:left;width:25%;text-align:center;padding:0 12px 60px 12px}
.certi-cont .row .column a{cursor: pointer}
.certi-cont .row .column img{border:1px solid #ebebeb;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);}
.certi-cont .row .column img:hover{box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);}
.certi-cont .row .column span{display:block;width:100%;padding-top:30px;}
.certiSlides {display: none;}
.certi-modal {display: none;position: fixed;z-index: 1000;padding-top: 100px;left: 0;top: 0;width: 100%; height: 100%;overflow: auto;background-color:rgba(0, 0, 0, 0.4);}
.certi-modal-content {position: relative; background-color: #fefefe;margin: auto;padding: 0;width: 500px; }
.certi-modal-close {color: white;position: absolute;top: -40px;right: 0;font-size: 35px;font-weight: bold;}
.certi-modal-close:hover,.certi-modal-close:focus {color: #f00000;text-decoration: none;cursor: pointer;}

/* 회사소개 - 찾아오시는 길 */
.location-map-box{width:100%;height:500px}
.location-info{width:100%;padding-top:40px;padding-left: 0;}
.location-info li{float:left;width:25%;padding:12px 12px 32px 12px;border-right:1px solid #eaeaea;text-align:center;}
.location-info li:last-child{border:none}
.location-info dt{font-family: 'NanumSquareB';font-size:1.8rem;line-height:2.2}


/* 제품소개 리스트 */
.wrap-product{background-color:#f5f5f5}
.product-header{position:relative;width:100%;max-width:1280px;margin:0 auto;padding:66px 0;}
.product-header div:last-child{border:none}
.product-header > div{position:relative;float:left;width:50%;padding:0 66px;text-align:left;border-right:1px solid #5d5b7b}
.product-header > div > span{display:block;width:52px;height:2px;margin:28px 0;background-color:#fff;}
.product-header h3{font-size:3.2rem;color:#fff}
.product-header h3 > span{display:block;padding-bottom:18px;font-size:1.6rem;color:#9392bb;font-family: 'NotoSansKR-Black';}
.product-header p{color:#cecede;font-size:1.5rem;}
.product-header img{position:absolute;top:0;right:60px;width:34%;height:auto}
.product-header a{position:absolute;bottom:0;right:12%;display:inline-block;width:172px;height:48px;padding-right:16px;border-radius:26px;background-color:#fff;border:2px solid #fff;font-family: 'NanumSquareB';font-size: 1.4rem;line-height:3.2;color:#000;text-align:center;transition: 0.2s;box-sizing:border-box}
.product-header a span{position:relative;display: inline-block;position:absolute;top:22px;right:26px;width: 8px;height: 8px;border-top: 2px solid #f00000;border-right: 2px solid #f00000;transform-origin: 100% 0;transform: rotate(45deg);}
.product-header a:hover {background-color:#f00000;color:#fff;border:2px solid #f00000;transition: 0.2s;box-shadow: 0 2px 30px rgba(0, 0, 0, 0.19);box-sizing:border-box}
.product-header a:hover span{border-color:#fff}

.product-tab-box{width:100%;height:68px;background-color:#fff;border-bottom:1px solid #dedede;}
.product-tab-box ul{position:relative;width:100%;max-width:1280px;margin:0 auto;padding-left: 0;}
.product-tab-box ul li{float:left;padding-left: 0;text-align:center;line-height:4.4;font-family: 'NanumSquareB';}
.productlinks{display:inline-block;height:66px;padding:0 52px;cursor:pointer;border-bottom:none}
.productlinks.active{border-bottom:2px solid #f00000}

.product-list-box{display:none;padding-left: 0;}
.product-list-box li{position:relative;float:left;width:calc(33.33% - 32px);height:436px;margin:0 16px 36px 16px;padding:32px 16px;border:1px solid #ebebeb;background:#fff;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.03);text-align:center;transition: 0.2s;}
.product-list-box li a{display:inline-block;width:100%;height:100%;cursor:pointer;}
.product-list-box li:hover{box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);}
.product-list-box .product-list-img{display:block;width:100%;height:250px;margin-bottom:20px;line-height:250px;text-align:center}
.product-list-box .product-list-img img{width:100%;max-width:280px;height:auto;vertical-align:middle}
.product-list-box .product-list-dir{display:inline-block;height:28px;margin-bottom:20px;padding:0 12px;border:2px solid #f00000;border-radius:24px;font-size:1.3rem;color:#f00000;font-family: 'NanumSquareB';line-height:1.9}

/* 제품소개 - 상세보기 */
.product-view-header{padding:30px 36px 60px 36px;}
.product-view-header .location{display:inline-block;width:80%;padding:4px 0 32px 8px;font-size:1.4rem;color:#999}
.product-view-header .img-box{float:left;width:45%;}
.product-view-header .img-box > span{position:relative;float:left;display:inline-block;padding:0 16px;border:1px solid #ebebeb;background:#fff;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.03);text-align:center;margin-left:8px;overflow:hidden}
.product-view-header .img-box > span img{vertical-align:middle;width:calc(100% - 32px);height:auto}
.product-view-header .img-box .img-l{width:calc(100% - 8px);height:430px;margin-bottom:8px;line-height:430px}
.product-view-header .img-box .img-thum{width:calc(33.33% - 8px);height:135px;line-height:135px;cursor:pointer}

.product-view-header .spac-box{float:left;width:420px;margin-left:10%}
.product-view-header .spac-box h3{font-size:4rem;margin-bottom:72px}
.product-view-header .spac-box span{display:inline-block;height:28px;margin-bottom:20px;padding:0 12px;border:2px solid #f00000;border-radius:24px;font-size:1.3rem;color:#f00000;font-family: 'NanumSquareB';line-height:1.9}
.product-view-header .spac-box table{width:400px;margin:0 auto;margin-bottom:72px}
.product-view-header .spac-box table th{width:120px;padding-left:30px;background:url('/images/front/check_red@3x.png') no-repeat 0 8px;background-size:16px 16px;vertical-align:top;line-height:2.2;text-align:left;}
.product-view-header .spac-box table td{vertical-align:top;line-height:2.2;color:#666}
.product-view-header .spac-box div{}

.product-view-tab-box{width:100%;height:68px;background-color:#fff;border-bottom:1px solid #ebebeb;border-top:1px solid #ebebeb}
.product-view-tab-box ul{position:relative;padding-left: 0;width:100%;max-width:1280px;margin:0 auto;}
.product-view-tab-box ul li{float:left;width:50%;text-align:center;line-height:4.4;font-family: 'NanumSquareB';}
.viewlinks{display:inline-block;width:100%;height:65px;cursor:pointer;border-bottom:none}
.viewlinks.active{border-bottom:2px solid #f00000}

.product-view-detail-wrap{background:#f5f5f5}
.product-view-detail-box{display:none;min-height:400px;padding:40px 36px 140px 36px;}
.product-view-detail-box p{font-family: 'NanumSquareB';}
.product-view-detail-box li{list-style-type :square;}
.product-view-detail-box h1{margin: 0.67em 0;}


/* 홍보센터 - 회사소식 */
.sub-news-box{position:relative;width:100%;}
.sub-news-box .news-card{position:relative;float:left;width:calc(33.33% - 32px);height:460px;margin:0 16px 48px 16px;border:1px solid #ebebeb;background:#fff;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);transition: 0.2s;}
.sub-news-box .news-card:hover{box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);}
.sub-news-box .news-card .img-box{position:relative;width:100%;height:200px;background:url('/images/front/news_no_img.png') 50% 0 no-repeat;background-size: auto 100%;background-color:#dcdcdc;border-radius:4px 4px 0 0 ;overflow:hidden }
.sub-news-box .news-card .img-box img{width:100%;height:auto;min-height:200px;border-radius:4px 4px 0 0  }
.sub-news-box .news-card p{height:155px;margin:24px;color:#666;font-size:1.5rem;line-height:1.8;text-align:left;overflow:hidden;word-break:break-all}
.sub-news-box .news-card .btn-more{position:absolute;left:24px;bottom:21px;font-size:11px;font-family: 'NanumSquareEB';color:#000;}
.sub-news-box .news-card .btn-more img{width:20px;height:20px;margin-right:10px;vertical-align:middle}
.sub-news-box .news-card .time{position:absolute;right:24px;bottom:25px;font-size:11px;font-family: 'NanumSquareEB';color:#000;letter-spacing:2px}

.news-view-cont{position:relative;width:100%;max-width:940px;margin:0 auto}
.news-view-cont > span{position:absolute;top:-24px;left:0;display:block;width:100%;max-width:940px;height:2px;background-color:#000}
.news-view-cont .text-box{width:100%;padding-bottom:52px;word-break:break-all}
.news-view-cont .img-box{width:100%;padding-bottom:52px;text-align:center}
.news-view-cont .img-box > img{border-radius:4px}
.news-view-cont .info-box > span{margin-left:20px;font-size:1.3rem;font-family: 'NanumSquareB';color:#000;}
.news-view-cont .info-box > span img{margin-right:4px;padding-bottom:2px;width:14px;height:14px;vertical-align:middle}
.news-view-cont .info-box{text-align:right;padding-bottom:24px}
.news-view-btn{padding-top:36px;text-align:center}

/* 홍보센터 - 카탈로그 */
.catalog-cont{padding-left:0}
.catalog-cont > li{float:left;width:33.33%;text-align:center}
.catalog-cont > li figure{margin:0 24px 24px 24px;}
.catalog-cont > li > figure > img{margin-bottom:24px;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);}

/* 홍보센터 - vod */
.vod-cont{position:relative;width:80%;margin:0 auto}
.vod-cont .wrap{position:relative; padding-top:56.22%; width:100%;}
.vod-cont .wrap iframe{ position:absolute; top:0; left:0; width:100%; height:100%; }

/* 홍보센터 - ci */
.ci-dym{width:100%;margin-bottom:80px;}
.symbol{padding:60px;background:#f5f5f5;border:1px solid #ebebeb;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);}
.ci-dym > img{float:left;margin-right:60px;}
.ci-dym h3{line-height:1.8;}
.ci-dym span{font-size:1.4rem;color:#999;}
.ci-dym p{margin-top:32px;word-break:break-all}
.ci-dym h4{margin:0 24px 24px 0;border-bottom:1px solid #ddd;line-height:2.6}
.ci-dym ul{margin-top:36px;padding-left:0}
.ci-dym li{float:left;width:50%}


/* 고객지원 - 자주하는 질문 */
.faq-tag{margin-bottom:32px;text-align:center}
.taglinks {display:inline-block;height:40px;margin:0 2px;padding:0 28px;background:url('/images/front/bg_line_pink.png') repeat;border-radius:20px;font-family: 'NanumSquareEB';font-size:1.4rem;line-height:3;cursor:pointer}
.taglinks:hover, .taglinks.active{background:url('/images/front/bg_line_red.png');color:#fff}
.faq-accordion-wrap{width:100%;margin-bottom:16px;border:1px solid #ebebeb;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05)}
.faq-accordion {position:relative;display:inline-block;cursor: pointer;padding: 27px 0 23px 0;width: 100%;font-size:1.8rem;transition: 0.4s;}
.faq-accordion:after {position:absolute;top:30px;right:28px;content: '\002B';color: #000;font-weight: bold;}
.faq-accordion-wrap .active:after { content: "\2212";}
.faq-panel {position:relative;padding: 0 28px;max-height: 0;overflow: hidden; transition: max-height 0.2s ease-out;}
.faq-panel p{padding:0 30px 28px 30px;color:#666;margin:0;}
.faq-q{position:absolute;top:29px;left:28px;font-size:2rem}
.faq-a{position:absolute;top:5px;left:28px;font-size:2rem}
.faq-title{display:inline-block;width:90%;padding-left:60px;line-height:1.5}
.faq-accordion, .faq-q, .faq-a{font-family: 'NanumSquareB';}

/* 고객지원 - qna & a/s 신청 */
.ask-cont input{width:calc(33.33% - 10px);margin:5px}
.ask-cont .input-address{width:calc(100% - 10px)}
.ask-cont textarea{width:calc(100% - 10px);height:280px;margin:5px}
.ask-cont iframe{width:calc(100% - 54px);height:180px;overflow:auto;margin:6px 0;padding:20px;border:1px solid #ebebeb;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05)}
.ask-cont-btn{padding-top:36px;text-align:center}
.ask-cont-btn .checkbox-wrap{display:block;margin-bottom:36px}

/* 고객지원 - 제품메뉴얼 */
.manual-cont{position:relative;border-top:2px solid #000;padding-left:0}
.manual-cont li{padding:30px 0;border-bottom:1px solid #e0e0e0}
.manual-cont h4{padding:0 28px 16px 28px}
.manual-cont p{padding:0 28px 12px 28px;font-size:1.3rem;color:#999}
.manual-cont .down-box{position:relative;display:block;width:100%;height:44px;margin-top:10px;padding:0 28px;background:url('/images/front/icon_file.png') no-repeat 28px 13px;background-size:16px 16px;background-color:#f9f9f9;border:1px solid #ebebeb;border-radius:4px;font-size:1.4rem;line-height:3.2}
.manual-cont .down-box span{display:inline-block;width:calc(100% - 150px);padding-left:24px;color:#999;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;word-break:break-all}
.manual-cont .down-box a{position:absolute;top:0;right:0;display:inline-block;width:140px;height:42px;padding-left:16px;background:url('/images/front/icon_down@3x.png')  24% 50% no-repeat;background-size:20px 20px;background-color:#808080;border-radius:0 4px 4px 0;color:#fff;text-align:center}
.manual-cont .down-box a:hover{background-color:#000;}


/* 고객지원 - a/s 규정 */
.asterm-cont{display:table;height:500px;}
.asterm-card{display:table-cell;height:100%;float:left;width:calc(50% - 24px);margin:0 12px;border:1px solid #ebebeb;border-radius:4px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);text-align:center}
.asterm-card img{margin-top:56px}
.asterm-card h4{margin-top:12px}
.asterm-card ul{margin:32px 32px 56px 32px;padding-left:0}
.asterm-card li{padding:4px 0 4px 24px;background:url('/images/front/check_red@3x.png') no-repeat 0 8px;background-size:16px 16px;text-align:left;line-height:1.8;color:#666;word-break:keep-all}


/* 제품가이드 */
.guide-cont-model{padding:0 28px 12px 28px;font-size:1.3rem;color:#999}
.bg-gray{background-color:#f5f5f5; padding: 40px 36px 140px 36px¬}
.guide-cont-model{padding:0 16px 4px 16px;font-size:1.2rem}


/* 개인정보보호정책 */
.private-policy-wrap{padding:36px;}
.private-policy-wrap > p{margin-top:24px;font-size:1.5rem;}
.private-policy-wrap ul{list-style-type : square;margin:8px 0 16px 40px;padding-left:0}
.private-policy-wrap ul > li{font-size:1.3rem;}
.private-policy-wrap li{line-height:1.6;font-size:1.4rem;color:#666}
.private-policy-wrap li h4{margin:28px 0  8px 0}
.private-policy-wrap ol{padding-left:0}
.private-policy-wrap ol p{margin-left:22px;margin-bottom:8px;}
.private-policy-wrap hr{height:2px;margin:24px 0;background-color:#f00000;border:none}
.private-policy-wrap h5{margin:8px 0 12px 22px;color:#000;font-size:1.5rem;font-family: 'NanumSquareB'}

.private-policy-s-wrap{padding:4px}
.private-policy-s-wrap h3{font-size:1.6rem;}
.private-policy-s-wrap ul{padding-left:0}
.private-policy-s-wrap li{line-height:1.5;font-size:1.3rem;color:#666}
.private-policy-s-wrap li h4{font-size:1.4rem;margin:12px 0  8px 0}
.private-policy-s-wrap ol{padding-left:0}
.private-policy-s-wrap ol p{margin-left:16px;margin-bottom:4px;}
.private-policy-s-wrap li .text-s{margin-left:16px;margin-bottom:12px;}
.private-policy-s-wrap strong{margin:8px 0 12px 0;color:#000;font-size:1.3rem;font-family: 'NanumSquareB'}
.private-policy-s-wrap table{width:calc(100% - 32px);margin:0 16px;border:1px solid #ddd;text-align:center}
.private-policy-s-wrap table th,.private-policy-s-wrap table td{padding:4px;border-left:1px solid #ddd}
.private-policy-s-wrap table th{height:28px;background-color:#eee}
.private-policy-s-wrap table td{border-top:1px solid #ddd}

/* 모달팝업 */
.modal {display: none;position: fixed;z-index: 1000;padding-top: 100px;left: 0;top: 0; width: 100%;height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
.modal-content {background-color: #fff;margin: auto;padding: 16px;border: 1px solid #888;width: 80%;max-width:940px;height:85%;}
.modal-content iframe{width:100%;height:calc(100% - 36px)}
.modal-close {color: #000;float: right;font-size: 28px;font-weight: bold;}
.modal-close:hover,.modal-close:focus {color: #f00000;text-decoration: none;cursor: pointer;}



/*///////////////////////////////////////// tablet /////////////////////////////////////////*/

@media (min-width:768px) and (max-width:1023px) {
    
/* footer */

.footer-box .box-r{width:100%;height:26px;padding-top:0;}
.footer-box .box-r a:first-child{padding-left:0;}
.footer-box hr{margin-top:30px;}


/* 메인화면 */
#main-visual .visual-item-wrap{height:400px;line-height:400px}
#main-visual .visual-item-wrap img{max-height:400px}

 .main-vod-box{padding:120px 36px;}
 .main-vod-box .vod-box{float:left;position:relative;width:40%;}
 .main-vod-box .txt-box{float:left;margin-left:6%}
 
 .main-product-wrap{padding-top:70px;padding-bottom:70px}
 .main-product-box{padding:50px 36px;}
 .main-product-box .product-l{float:left;width:50%;padding-right:15px;}
 .main-product-box .product-r{float:right;width:50%;padding-left:15px;box-sizing:border-box}
 .main-product-box h2{margin-top:30px;margin-bottom:20px;font-size:3rem;}
 .main-product-box ul{padding-bottom:30px;margin-top:20px;}
 
 .main-news-box{padding:120px 36px;}
 .main-news-box .news-txt{width:33.33% }
 .main-news-box .news-card{width:calc(33.33% - 30px);height:400px;margin-left:20px}
 .main-news-box .news-card .img-box{width:100%;height:168px;overflow:hidden}
 .main-news-box .news-card .img-box img{width:100%;height:auto;min-height:168px;}
 .main-news-box .news-card p{height:155px;margin:20px;}
 .main-news-box .news-card .btn-more{position:absolute;left:20px;bottom:15px;}
 .main-news-box .news-card .time{position:absolute;right:20px;bottom:20px}
 .main-news-box > a:last-child{display:none}

 .main-ask-box{padding:120px 31px;text-align:center;}
 
 /* -- 서브페이지 --  */
 /* 공통 */
 .sub-container-box{padding:60px 36px;}
 .sub-title-s{margin-bottom:50px;}
 
 /* 회사소개 - 경영이념 */
 .vision-card ul{margin:24px 32px 56px 24px}
 
 /* 홍보센터 - 회사소식 */
 .sub-news-box .news-card{width:calc(33.33% - 20px);height:400px;margin:0 10px 36px 10px;}
 .sub-news-box .news-card .img-box{width:100%;height:168px;}
 .sub-news-box .news-card .img-box img{width:100%;height:auto;min-height:168px;}
 .sub-news-box .news-card p{height:155px;margin:20px;}
 .sub-news-box .news-card .btn-more{position:absolute;left:20px;bottom:15px}
 .sub-news-box .news-card .time{position:absolute;right:20px;bottom:20px;}
 
 /* 홍보센터 - ci */
 .ci-dym{margin-bottom:50px}
 .symbol{padding:40px;}
 
 /* 제품소개 리스트 */
 .product-header{padding:42px 0;}
 .product-header > div{padding:0 36px;height:350px}
 .product-header h3{font-size:2.8rem;}
 .product-header h3 > span{font-size:1.4rem}
 .product-header p{font-size:1.4rem;}
 .product-header img{right:36px;width:30%;height:auto}
 .product-header a{right:36px;}
 
 .product-tab-box{height:60px;}
 .product-tab-box ul li{width:33.33%;line-height:3.8;}
 .productlinks{height:58px;}
 
 .product-list-box li{width:calc(50% - 16px);height:436px;margin:0 8px 16px 8px;}

 
 /* 제품소개 - 상세보기 */
 .product-view-header{padding:30px 36px 50px 36px;}
 .product-view-header .img-box{width:40%;}
 .product-view-header .img-box > span img{width:calc(100% - 16px);}
 .product-view-header .img-box .img-l{height:300px;line-height:300px}
 .product-view-header .img-box .img-thum{height:80px;line-height:80px;}
 
 .product-view-header .spac-box{width:340px;margin-left:8%}
 .product-view-header .spac-box h3{font-size:3.6rem;margin-bottom:40px}
 .product-view-header .spac-box table{width:340px;margin-bottom:40px}
 .product-view-header .spac-box table th{width:85px;line-height:2}
 .product-view-header .spac-box table td{line-height:2;}
 .product-view-header .spac-box a{width:160px;}
 
 .product-view-tab-box{height:60px;}
 .product-view-tab-box ul li{line-height:3.8;}
 .viewlinks{display:inline-block;width:100%;height:57px;}
 
 .product-view-detail-box{display:none;min-height:400px;padding:60px 36px 80px 36px;}
 
 
 
 
}
/*///////////////////////////////////////// mobile /////////////////////////////////////////*/

@media (max-width:767px) {

body{font-size:1.4rem;}
h1{font-size: 3.3rem}
h2{font-size: 2.1rem}
h3{font-size: 1.7rem}
h4{font-size: 1.5rem}
p{line-height : 1.6 }
input{height:48px;padding:0 16px;}
textarea{width:100%;padding:16px;}
a.btn-red{width:152px;height:48px;border-radius:24px;font-size: 1.3rem;line-height:3.4;}
a.btn-black{width:152px;height:48px;border-radius:24px;font-size: 1.3rem;line-height:3.4;}
a.btn-down{display:inline-block;width:140px;height:48px;background:url('/images/front/icon_down@3x.png')  26% 50% no-repeat;background-size:18px 18px;background-color:#f00000;border-radius:24px;font-size: 1.3rem;line-height:3.6;}

.checkbox-wrap {margin:0;font-size:1.3rem}
.checkbox-wrap input[type="checkbox"] {display:none;}
.checkbox-wrap input[type="checkbox"] + label span { width: 20px; height: 20px;margin-right:8px;background-size:20px 20px;}
.checkbox-wrap input[type="checkbox"]:checked + label span {background-size:20px 20px;}

.btn-top{bottom: 16px;right: 16px;}

/* pager */
.pagination{padding:16px 0;}
.pagination a {width:28px;height:28px;margin:0 4px;line-height:2.4;font-size:1.3rem;}
.pagination a > span.next{top:8px;left:8px;}
.pagination a > span.prev{top:10px;left:9px;}

/* select box */
.search-wrap{width:300px;height:40px;margin:0 auto;margin-top:24px;}
.custom-select {width:100px;margin-top:3px;font-size:1.3rem;line-height:1.4}
.search-wrap input{float:left;width:calc(100% - 126px);height:38px;padding-left:10px;font-size:1.3rem}
.search-wrap span{position:absolute;top:10px;right:0}

/* 레이아웃 */
.wrapper{min-width:345px}
.gnb-box, .footer-box, .main-quickmenu-box, .main-product-box, .main-vod-box, .main-news-box, .main-ask-box, .sub-container-box{padding:0}

.gnb-wrap{height:60px;}
.gnb-box h1{position: absolute;left: 20px;top: 10px;}
.gnb-box h1 img{width:108px;height:auto}

.main-nav-wrap{display:none}
.mobile-menu-close, .mobile-menu-open{display: block;}

#header-wrap{position:relative;float:right;display: block;}
.header-inner{height: auto;}
#header-wrap h1{background-color: #b40a13;padding: 0;}
#header-wrap picture{display: inline-block;width: 30.125%;min-width:145px;padding: 10px 0;}
.mobile-menu-wrap{display:none;position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 100;}
.mobile-menu-scroll{width: 100%;overflow-y: auto;background-color:#fff;}
#gnb{position: static;width: 100%;margin-top:0;background-color:#fff;z-index: 100}
#gnb h1{position: absolute;left: 20px;top: 10px;}
#gnb h1 img{width:108px;height:auto}
#gnb h1 a{background-color:#fff}
#gnb ul{position:absolute;left:0;width: 100%;padding:60px 16px 24px 24px;background-color:#fff;border-bottom:1px solid #ddd;box-shadow: 0 8px 8px rgba(0, 0, 0, 0.05);margin-top:0}
#gnb > ul > li{float: none;margin:0;width:auto;font-family: 'NanumSquareB';}
#gnb > ul > li > a{position: relative;display:block;height:50px;width:100%;line-height:3.5;font-size:1.7rem;font-family: 'NanumSquareB';}
#gnb > ul > li > a:hover{font-family: 'NanumSquareEB'}
#gnb > ul > li > a:after{content: "";display: inline-block;width: 6px;height: 6px;border-top: 2px solid #f00000;border-right: 2px solid #f00000;transform-origin: 50% 35%; transform: rotate(135deg); top: 16px;margin-left:10px;transition: 0.2s;}
#gnb > ul > li.no-sub > a:after{content: none;}
#gnb > ul > li > a.on:after{transform: rotate(-45deg);transition: 0.2s;}
#gnb ul ul{position: static;width: auto;margin:0;padding:0;border-radius:0;border: none;background: none;text-align:left;display: none;box-shadow:none}
#gnb ul ul a{height: 36px;line-height:2.8;font-size:1.2rem;text-align: center;font-family: 'NanumSquareR'}
#gnb ul ul a:hover{border-bottom:2px solid #f00000;color:#000;font-family: 'NanumSquareB'}


/* footer */
.footer-box .box-l{float:none;width:100%;height:auto;padding:12px 24px}
.footer-box .box-r{float:none;width:100%;height:auto;padding:0 24px}
.footer-box h1{display:block;margin-bottom:30px;padding-top:24px}
.footer-box a{padding-left:12px;background: url(/images/front/footer_bar.png) 3px 1px no-repeat}
.footer-box .box-l a:nth-last-child(2){margin-left:12px;padding-left:0}
.footer-box .box-r a:first-child{padding-left:0;}
.footer-box hr{margin-top:40px;}
.footer-box .place{line-height:3;padding:0 24px 0 24px;font-size:1.2rem;}
.footer-box .copyright{padding:34px 24px;color:#555;font-size:1rem;line-height:1.5}
.footer-box span{display:block;height:24px;margin:0}


/* 메인화면 */
#main-visual{margin-bottom:50px;}
#main-visual .visual-item-wrap{height:180px;line-height:180px}
#main-visual .visual-item-wrap img{max-height:180px}
#main-visual .visual-item-wrap .bn-pc{display:none}
#main-visual .visual-item-wrap .bn-mobile{display:block}

 #main-visual .visual-title{font-size: 1.8rem;margin: 0 0 20px 0;}
 #main-visual .visual-title + p{margin-bottom: 35px;font-family: 'NanumSquareL';}
 #main-visual .bx-prev, #main-visual .bx-next{display: none;}
 #main-visual .bx-pager {bottom: -30px;}

 .main-quickmenu-box div{padding:0 0 16px 0;}
 .main-quickmenu-box img{width:24px;height:24px}
 .main-quickmenu-box .title{font-size: 1.2rem;line-height:1.8}
 .main-quickmenu-box p{display:none}
 
 .main-product-wrap{padding-top:24px;padding-bottom:24px}
 .main-product-box{padding:10px 24px;font-size:1.3rem;}
 .main-product-box .product-l{float:left;width:100%;}
 .main-product-box .product-r{float:left;width:100%;padding:0}
 .main-product-box h2{margin-top:12px;margin-bottom:16px;font-size:2.4rem;}
 .main-product-box ul{padding-bottom:24px;margin-top:16px;}
 .main-product-box li{padding-left:24px;background-size:12px 12px;font-size:1.2rem;line-height:2;color:#666 }
 .main-product-box .btn-red{margin-bottom:24px}
 .main-product-box img{width:80%;height:80%;margin-left:10%;margin-top:16px;margin-bottom:16px}
 #mykitchen, #mykitchen2{display:block;animation:none }
 
 .main-vod-box{padding:60px 24px;text-align:center}
 .main-vod-box .vod-box{float:none;width:100%;}
 .main-vod-box .txt-box{float:none;margin-left:0;margin-top:24px}
 .main-vod-box p{margin-bottom:16px;}
 .main-vod-box .vod-btn{margin-top:24px;font-size:1.3rem;}
 
 .main-news-box{padding:60px 24px 48px 24px;text-align:center}
 .main-news-box .news-txt{float:none;width:100% }
 .main-news-box .news-txt > p{margin:8px 0 16px 0;font-size:1.2rem;color:#a1a1a1}
.main-news-box .news-txt .news-btn{display:none}
 .main-news-box .news-card{float:none;width:100%;max-width:800px;height:260px;margin:0 auto;margin-bottom:16px;}
 .main-news-box .news-card .img-box{width:100%;height:120px;overflow:hidden}
 .main-news-box .news-card .img-box img{min-height:120px;}
 .main-news-box .news-card p{height:70px;margin:16px;color:#666;font-size:1.3rem;line-height:1.7;overflow:hidden}
 .main-news-box .news-card .btn-more{position:absolute;left:16px;bottom:16px;font-size:11px;}
 .main-news-box .news-card .btn-more img{width:20px;height:20px;margin-right:10px;}
 .main-news-box .news-card .time{position:absolute;right:16px;bottom:20px;font-size:11px}
 .main-news-box > a:last-child{display:none}
 
 .main-ask-box{padding:60px 24px;}
 .main-ask-box p{margin:8px 0 16px 0;font-size:1.2rem;color:#a1a1a1}
 .main-ask-box input{width:100%;margin:4px 0}
 .main-ask-box textarea{width:100% ;height:200px;margin:4px 0}
 .main-ask-box .term-box{position:relative;width:100% ;margin:4px 0 28px 0;line-height:2.4;padding:8px 0;text-align:center}
 .main-ask-box .view-term{position:relative;top:0;left:0;display:block;padding:0;margin:0;font-size:1.2rem;sline-height:2;}
 .main-ask-box .view-term img{width:12px;height:12px;margin-left:0;vertical-align:middle}
 .main-ask-box .content iframe{width:calc(100% - 24px);height:120px;overflow:auto;margin:12px;padding:0;font-size:1.2rem}

 
 /* -- 서브페이지 --  */
 /* 공통 */
 .sub-title-wrap h2{padding-top:32px;font-size:1.8rem;}
 .sub-title-wrap .location{padding-top:10px;font-size:1.0rem;}
 .sub-title-wrap .location > span{display: inline-block;height: 6px;width:6px;margin:4px}
 
 .sub-about-bg{height:100px;background:url(/images/front/sub_about_bg.jpg) 55% 0 no-repeat;background-size:auto 100px}
 .sub-product-bg{height:220px;background:url(/images/front/sub_product_bg.jpg) 55% 0 no-repeat;background-size:auto 220px}
 .sub-pr-bg{height:100px;background:url(/images/front/sub_pr_bg.jpg) 55% 0 no-repeat;background-size:auto 100px}
 .sub-cs-bg{height:100px;background:url(/images/front/sub_cs_bg.jpg) 55% 0 no-repeat;background-size:auto 100px}
 
 .sub-container-box{min-height:200px;padding:36px 16px;}
 
 .sub-title-s{margin-bottom:24px;}
 .sub-title-s > h3{padding-bottom:8px;line-height:1.3}
 .sub-title-s > p{font-size:1.1rem;padding-bottom:8px;}
 
 /* 회사소개 - ceo인사말 */
 .about-cont > img{display:none}
 .about-cont > h3{width:100%;margin-bottom:24px;font-size:1.6rem;line-height:1.4}
 .about-cont > p{width:100%;}
 .about-cont span{margin-top:24px;}
 
 /* 회사소개 - 경영이념 */
 .vision-card{width:100%;margin:0 0 16px 0}
 .vision-card img{margin-top:36px}
 .vision-card h4{margin-top:12px}
 .vision-card ul{margin:24px 24px 36px 24px}
 .vision-card li{padding:4px 0 4px 24px;background-size:12px 12px;}
 
 /* 회사소개 - 회사개요 */
 .overview-table th{padding:16px;}
 .overview-table td{padding:16px;}
 
 /* 회사소개 - 연혁 */
 .history-tab li{height:48px;font-size:1.2rem;line-height:1.2}
 .history-tab li a{padding-top:10px;height:36px;}
 .historylist li{padding:24px 0;}
 .historylist h4{float:none;width:60px;height:60px;margin:16px 0;line-height:4.4}
 .historylist h4.text-s{font-size:0.9rem;line-height:6.5}
 .historylist table{float:none;margin-left:0;width:100%;font-size:1.3rem;line-height:1.4}
 .historylist table td{padding:6px 0}
 .historylist table th{width:16px;padding:6px 12px 6px 4px;}
 .historylist table th.th-s{width:64px}
 
 /* 회사소개 - 조직도 */
 .org-pc{display:none}
 .org-mobile{display:block}
 
  /* 회사소개 - 인증현황 */
 .certi-cont .row .column{float:left;width:50%;text-align:center;padding:0 6px 36px 6px}
 .certi-cont .row .column span{display:block;width:100%;padding-top:12px;font-size:1.2rem;}
 .certi-modal-content {width: 300px;}
 .certi-modal-close {font-size: 35px;}
 
 /* 회사소개 - 찾아오시는 길 */
 .location-map-box{width:100%;height:240px}
 .location-info{padding-top:24px}
 .location-info li{float:left;width:100%;padding:0 0 24px 0;border:none;text-align:left;}
 .location-info li img{float:left;width:24px;height:auto;margin-right:8px;vertical-align:middle}
 .location-info dt{width:70px;font-family: 'NanumSquareB';font-size:1.6rem;}
 .location-info dt, .location-info dd{float:left;font-size:1.4rem;line-height:1.8}
 
 /* 제품소개 리스트 */
 .product-header{padding:16px 0;}
 .product-header div:last-child{border:none}
 .product-header > div{position:relative;float:left;width:50%;padding:0 16px;text-align:left;border-right:1px solid #5d5b7b}
 .product-header > div > span{display:none;}
 .product-header h3{font-size:2.1rem;margin-bottom:16px}
 .product-header h3 > span{padding-bottom:12px;font-size:1rem;}
 .product-header p{font-size:1.1rem;}
 .product-header img{display:none}
 .product-header a{display:none}
 
 .product-tab-box{height:52px;}
 .product-tab-box ul li{width:33%;line-height:3.8;}
 .productlinks{display:inline-block;width:100%;height:50px;padding:0;}
 
 .product-list-box li{width:100%;height:340px;margin:0 0 16px 0;padding:16px 16px;}
 .product-list-box .product-list-img{height:220px;margin-bottom:20px;line-height:220px;}
 .product-list-box .product-list-dir{margin-bottom:16px;}
 
 /* 제품소개 - 상세보기 */
 .product-view-header{padding:16px 16px 36px 16px;}
 .product-view-header .location{padding:4px 0 16px 8px;font-size:1.2rem;}
 .product-view-header .img-box{float:left;width:100%;margin-bottom:36px}
 .product-view-header .img-box > span{padding:0 16px;margin-left:0}
 .product-view-header .img-box > span img{vertical-align:middle;width:calc(100% - 8px);max-width:280px;height:auto}
 .product-view-header .img-box .img-l{float:left;width:calc(100% - 84px);height:224px;margin:0 4px 8px 0;line-height:224px}
 .product-view-header .img-box .img-thum{width:80px;height:72px;line-height:72px;margin:0 0 4px 0 ;}
 .product-view-header .img-box .img-thum img{width:100% ;max-width:80px;}

 .product-view-header .spac-box{float:left;width:100%;margin:0 4px}
 .product-view-header .spac-box h3{font-size:2.8rem;margin-bottom:16px}
 .product-view-header .spac-box table{width:100%;margin-bottom:24px}
 .product-view-header .spac-box table th{width:90px;padding-left:24px;background:url('/images/front/check_red@3x.png') no-repeat 0 9px;background-size:12px 12px;}
 .product-view-header .spac-box > div{width:100%;text-align:center}

 .product-view-tab-box{height:52px;}
 .product-view-tab-box ul li{line-height:3.8;}
 .viewlinks{height:48px;}

 .product-view-detail-box{display:none;min-height:200px;padding:12px 16px 36px 16px;}
 .product-view-detail-box p{padding-top:16px;padding-bottom:4px;font-size:1.5rem;font-family: 'NanumSquareB';}
 .product-view-detail-box li{font-size:1.4rem;line-height:1.8}
 
 
 /* 홍보센터 - 회사소식 */
 .sub-news-box .news-card{float:none;width:100%;height:440px;margin:0 0 24px 0;}
 .sub-news-box .news-card p{height:155px;margin:16px;color:#666;font-size:1.4rem;line-height:1.8;text-align:left;overflow:hidden;}
 .sub-news-box .news-card .btn-more{position:absolute;left:16px;bottom:16px;font-size:11px;}
 .sub-news-box .news-card .time{position:absolute;right:16px;bottom:19px;font-size:11px;}
 
 .news-view-cont > span{position:absolute;top:-12px;left:0}
 .news-view-cont .text-box{padding-bottom:24px;}
 .news-view-cont .img-box{padding-bottom:24px;}
 .news-view-cont .info-box > span{margin-left:12px;margin-right:12px;font-size:1.2rem;}
 .news-view-cont .info-box{text-align:center;padding-bottom:12px;padding-top:6px}
 .news-view-btn{padding-top:16px;}
 
 /* 홍보센터 - 카탈로그 */
 .catalog-cont > li{width:100%;margin-bottom:40px;}
 .catalog-cont > li figure{margin:0 0 12px 0;}
 .catalog-cont > li > figure > img{max-width:280px;margin-bottom:12px;}
  
  /* 홍보센터 - vod */
  .vod-cont{position:relative;width:100%;}
  
  /* 홍보센터 - ci */
  .ci-dym{margin-bottom:36px}
  .symbol{padding:16px;}
  .ci-dym > img{float:left;margin-right:16px;margin-bottom:8px;width:100px;height:100px}
  .ci-dym h3{line-height:1.8;font-size:2rem;}
  .ci-dym span{font-size:1.2rem;}
  .ci-dym p{margin-top:16px}
  .ci-dym h4{width:100%;margin:0 0 24px 0;font-size:1.3rem}
  .ci-dym ul{margin-top:8px}
  .ci-dym li{float:none;width:100%}
  .ci-dym li > img{width:100%;}
  
  /* 고객지원 - 자주하는 질문 */
  .faq-tag{margin-bottom:24px;}
  .taglinks{height:32px;margin:0 1px;padding:0 12px;font-size:1.3rem;line-height:2.6}
  .faq-accordion-wrap{margin-bottom:8px;}
  .faq-accordion {padding: 14px 0 10px 0;font-size:1.4rem;}
  .faq-accordion:after {top:16px;right:16px}
  .faq-panel {padding: 0 12px;}
  .faq-panel p{padding:0 16px 16px 26px;color:#666}
  .faq-q{top:16px;left:16px;font-size:1.7rem}
  .faq-a{top:3px;left:16px;font-size:1.7rem}
  .faq-title{width:90%;padding-left:38px;line-height:1.5}
  
  /* 고객지원 - qna & a/s 신청 */
  .ask-cont input{width:100%;margin:4px 0}
  .ask-cont .input-address{width:100%;}
  .ask-cont textarea{width:100% ;height:280px;margin:4px 0}
  .ask-cont iframe{width:calc(100% - 22px);height:145px;margin:6px 0;padding:10px;}
  .ask-cont-btn{padding-top:24px;}
  .ask-cont-btn .checkbox-wrap{margin-bottom:24px}
  
  /* 고객지원 - 제품메뉴얼 */
  .manual-cont li{padding:16px 0;}
  .manual-cont h4{padding:0 16px 8px 16px}
  .manual-cont p{padding:0 16px 4px 16px;font-size:1.2rem}
  .manual-cont .down-box{height:40px;margin-top:8px;padding:0 16px;background:url('/images/front/icon_file.png') no-repeat 16px 12px;background-size:14px 14px;background-color:#f9f9f9;font-size:1.3rem;line-height:3}
  .manual-cont .down-box span{width:calc(100% - 40px);padding-left:20px}
  .manual-cont .down-box a{width:40px;height:38px;padding-left:0;background:url('/images/front/icon_down@3x.png')  50% 50% no-repeat;background-size:16px 16px;background-color:#808080;text-indent:-9999px;white-space:no-wrap;overflow:hidden}
    .guide-cont-model{padding:0 16px 4px 16px;font-size:1.2rem}
  
  /* 고객지원 - a/s 규정 */
  .asterm-cont{height:auto;}
  .asterm-card{width:100%;margin:0 0 16px 0;}
  .asterm-card img{margin-top:36px;width:90px;height:90px}
  .asterm-card h4{margin-top:12px}
  .asterm-card ul{margin:24px 16px 24px 16px}
  .asterm-card li{background-size:12px 12px;}
 
 /* 개인정보보호정책 */
 .private-policy-wrap{padding:16px}
 .private-policy-wrap > p{margin-top:12px;font-size:1.3rem;}
 .private-policy-wrap ul{margin:8px 0 12px 26px}
 .private-policy-wrap ul > li{font-size:1.3rem;}
 .private-policy-wrap li{line-height:1.6;font-size:1.4rem;color:#666}
 .private-policy-wrap li h4{margin:16px 0  8px 0}
 .private-policy-wrap ol p{margin-left:12px;margin-bottom:6px;font-size:1.2rem;}
 .private-policy-wrap hr{margin:12px 0;}
 .private-policy-wrap h5{margin:8px 0 12px 16px;font-size:1.2rem;}
 
 .private-policy-s-wrap{padding:12px}
 .private-policy-s-wrap h3{font-size:1.5rem;}
 .private-policy-s-wrap li{font-size:1.2rem;}
 .private-policy-s-wrap li h4{font-size:1.3rem;}
 .private-policy-s-wrap strong{font-size:1.2rem;}
 
 /* 모달팝업 */
 .modal {display: none;padding-top: 0;background-color: #fff}
 .modal-content {background-color: #fff;margin:0;padding: 8px;border: none;width:100%;height:100%;}
 .modal-content iframe{width:100%;height:calc(100% - 36px)}
 
}
