@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

/* 메인 공통 */
.tit .grad{display: block; padding: 0 0 15px; line-height: 100%; font-size: 14px; font-weight: 700; letter-spacing: 2px; background: #a50034; background: linear-gradient(90deg, rgba(165,0,52,1) 0%, rgba(58,36,170,1) 100%);  color: transparent; -webkit-background-clip: text;}
.tit h2{font-size: 40px; font-weight: 200;}
/* ONLY FOR IE */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){
    .tit .grad{background: transparent;  color: #a50034; -webkit-background-clip: initial;}
}

.board ul{box-sizing: border-box; border-top: 2px solid #111; margin: 20px 0 0;}
.board ul li{padding: 31px 0 31px; box-sizing: border-box; border-bottom: 1px solid #ddd;}
.board ul li:last-child{border-bottom-color: #111;}
.board ul li a{display: block;}
.board ul li a:after{content: ""; display: block; clear: both;}
.board ul li a .img{float: left; position: relative; width: 235px; height: 144px; border-radius: 0 0 33px 0; overflow: hidden; background: #e7e7e7 url(../img/main/no_image.jpg) no-repeat center; background-size: 50%;}
.board ul li a .img img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 100%; /*height: 100%;*/ max-width: none; min-height: 100%; min-width: 100%; object-fit: cover;}
.board ul li a .list_txt{float: left; width: calc(100% - 235px); box-sizing: border-box; padding: 0 0 0 40px;}
.board ul li a .list_txt .list_type{display: block; line-height: 100%; padding: 14px 0 0; font-size: 14px; color: #aa274c;}
.board ul li a .list_txt .list_title{display: block; padding: 11px 0 14px; font-size: 20px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.board ul li a .list_txt .list_cont{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; line-height: 20px; height: 60px; font-size: 14px; color: #555;}
.board ul li a .list_txt .list_date{display: block; font-size: 14px; color: #555; padding: 4px 0 0;}
@media all and (max-width: 1600px){
    .board ul li a .list_txt{padding: 0 0 0 4%;}
}
@media all and (max-width: 1280px){
    .tit .grad{padding: 0 0 8px; font-size: 13px;}
    .tit h2{font-size: 32px;}
}
@media all and (max-width: 1024px){
    .board ul li{padding: 20px 10px;}
}
@media all and (max-width: 768px){
    .tit .grad{padding: 0 0 4px; font-size: 12px; letter-spacing: 1.5px;}
    .tit h2{font-size: 24px;}

    .board ul{margin: 12px 0 0;}
}
@media all and (max-width: 568px){
    .tit h2{font-size: 20px; line-height: 120%;}

    .board ul{border: none; margin: 0; padding: 20px 0 0;}
    .board ul:after{content: ""; display: block; clear: both;}
    .board ul li{float: left; width: 49%; margin: 0 0 0 2%; padding: 0; border-bottom: none;}
    .board ul li:first-child{margin: 0;}
    .board ul li:nth-child(n + 3){display: none;}
    .board ul li a .img{float: none; width: 100%;}
    .board ul li a .list_txt{float: none; width: 100%; padding: 15px 0 0;}
    .board ul li a .list_txt .list_type{padding: 0; font-size: 11px;}
    .board ul li a .list_txt .list_title{padding: 3px 0; font-size: 16px;}
    .board ul li a .list_txt .list_cont{-webkit-line-clamp: 2; height: 40px; font-size: 13px;}
    .board ul li a .list_txt .list_date{font-size: 12px;}
}



/* 비주얼 */
.visual{position: relative; max-width: 2000px; margin: 0 auto;}
.visual .main_slider{margin-bottom: 0;}
.visual .main_slider .slide_item{position: relative; display: block !important;}
.visual .main_slider .slide_item .img img{width: 100%; height: auto;}
.visual .main_slider .slide_item .img img.v_mobile{display: none;}
.visual .main_slider .slide_item .inner{position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; display: flex; align-items: center;}
/* .visual .main_slider .slide_item .inner .slide_txt{color: #fff;} */
.visual .main_slider .slide_item .inner .slide_txt .sup{padding: 0 0 0.781vw; font-size: 1.302vw; font-weight: 200;}
.visual .main_slider .slide_item .inner .slide_txt h3{padding: 0 0 2.083vw; font-size: 2.865vw; font-weight: 500;}
.visual .main_slider .slide_item .inner .slide_txt .desc{font-size: 0.990vw; font-weight: 300;}
.visual .main_slider .slide_item .inner .slide_txt .view{padding: 1.927vw 0 0;}
.visual .main_slider .slide_item .inner .slide_txt .view:after{content: ""; display: block; clear: both;}
.visual .main_slider .slide_item .inner .slide_txt .view a{float: left; display: block; box-sizing: border-box; margin: 0 12px 0 0; padding: 7px 33px; border: 1px solid #111111; border-radius: 0 0 15px 0; font-size: 13px; background: transparent;}
.visual .main_slider .slide_item .inner .slide_txt .view a.white{background: #fff; color: #111;}
.visual .main_slider .slide_item .inner .slide_txt .view a:last-child{margin: 0;}
/* .visual .slick-dots{bottom: 102px; bottom: 12.75%;}
.visual .slick-dots > li{width: 122px; height: auto; margin: 0 6px; padding: 0 0 5px; text-align: center;}
.visual .slick-dots > li:before{content: ""; position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 2px; background: rgba(255,255,255,0.18);}
.visual .slick-dots > li:after{content: ""; position: absolute; bottom: 0; left: 0; display: block; width: 0%; height: 2px; background: #fff;}
.visual .slick-dots > li.slick-active:after{animation: width 3s linear;}
.visual .slick-dots > li.paused.slick-active:after{animation-play-state: paused;}
.visual .slick-dots > li.btn{width: auto; height: auto; margin: 0 6px; padding: 0;}
.visual .slick-dots > li.btn:before,
.visual .slick-dots > li.btn:after{display: none;}
.visual .slick-dots > li.btn .btn_stop{position: relative; display: inline-block; width: 10px; height: 14px; vertical-align: middle; margin: 32px 0 0 0; font-size: 0; text-indent: -9999px;}
.visual .slick-dots > li.btn .btn_stop:before{content: ""; position: absolute; top: 0; left: 0; display: block; width: 4px; height: 14px; background: #fff;}
.visual .slick-dots > li.btn .btn_stop:after{content: ""; position: absolute; top: 0; right: 0; display: block; width: 4px; height: 14px; background: #fff;}
.visual .slick-dots > li.btn .btn_stop.on:before{width: auto; height: auto; border-width: 7px; border-style: solid; border-color: transparent transparent transparent #fff; background: transparent;}
.visual .slick-dots > li.btn .btn_stop.on:after{display: none;}
.visual .slick-dots > li > button{display: inline-block; width: 100%; height: 20px; padding: 0; font-size: 13px; color: rgba(255,255,255,0.5); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; word-spacing: 0.5px;}
.visual .slick-dots > li:hover > button{color: #fff;}
.visual .slick-dots > li.slick-active > button{color: #fff;}
.visual .slick-dots > li > button::before{display: none;} */



/* .visual .state{position: absolute; width:100%; bottom: 100px; left: 50%; transform: translateX(-50%); text-align: center;}
.visual .state span{display: inline-block; padding: 0 8px; vertical-align: middle; font-size: 13px; color: #111111;}
.visual .state .progress{position: relative; display: inline-block; vertical-align: middle; width: 200px; height: 2px; margin: 0 auto 0; background: rgba(0,0,0,0.18);}
.visual .state .progress .pro_bar{position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #111111}
.visual .state .progress .pro_bar.pro_ani{animation: width 3s linear;}
.visual .state .progress .pro_bar.pro_ani.pause{animation-play-state: paused;}

.visual .state .btn_stop{position: relative; display: inline-block; width: 10px; height: 14px; vertical-align: middle; margin: 0 0 0 10px; font-size: 0; text-indent: -9999px;}
.visual .state .btn_stop:before{content: ""; position: absolute; top: 0; left: 0; display: block; width: 4px; height: 14px; background: #111111;}
.visual .state .btn_stop:after{content: ""; position: absolute; top: 0; right: 0; display: block; width: 4px; height: 14px; background: #111111;}
.visual .state .btn_stop.on:before{width: auto; height: auto; border-width: 7px; border-style: solid; border-color: transparent transparent transparent #fff; background: transparent;}
.visual .state .btn_stop.on:after{display: none;} */


.visual .slick-counter{position: absolute; width:100%; bottom: 100px; left: 50%; transform: translateX(-50%); text-align: center;}
.visual .slick-counter span{display: inline-block; padding: 0 8px; vertical-align: middle; font-size: 13px; color: #111111;}
.visual .slick-counter .progress{position: relative; display: inline-block; vertical-align: middle; width: 200px; height: 2px; margin: 0 auto 0; background: rgba(0,0,0,0.18);}
.visual .slick-counter .progress .pro_bar{position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #111111}
.visual .slick-counter .progress .pro_bar.pro_ani{animation: width 3s linear;}
.visual .slick-counter .progress .pro_bar.pro_ani.pause{animation-play-state: paused;}

.visual .slick-counter .btn_stop{position: relative; display: inline-block; width: 10px; height: 14px; vertical-align: middle; margin: 0 0 0 10px; font-size: 0; text-indent: -9999px;}
.visual .slick-counter .btn_stop:before{content: ""; position: absolute; top: 0; left: 0; display: block; width: 4px; height: 14px; background: #111111;}
.visual .slick-counter .btn_stop:after{content: ""; position: absolute; top: 0; right: 0; display: block; width: 4px; height: 14px; background: #111111;}
.visual .slick-counter .btn_stop.on:before{width: auto; height: auto; border-width: 7px; border-style: solid; border-color: transparent transparent transparent #fff; background: transparent;}
.visual .slick-counter .btn_stop.on:after{display: none;}






.visual > .btn{position: absolute; top: 50%; transform: translateY(-50%); display: block; width: 70px; height: 70px; font-size: 0; text-indent: -9999px; background-color: rgba(0,0,0,0.35); background-position: center; background-repeat: no-repeat;}
/* .visual > .btn:hover,
.visual > .btn:focus{background-color: rgba(0,0,0,0.5);} */
/* .visual > .btn_prev{left: 0; background-image: url("../img/main/btn_r_prev.png");}
.visual > .btn_next{right: 0; background-image: url("../img/main/btn_r_next.png");} */
.visual .slick-dots{width: 200px; height: 25px; left: 50%; transform: translateX(-50%); bottom: 30px; z-index: 4; margin: 0 0 0 -12px; opacity: 0;}
.visual .slick-dots li{/*width: 50%;*/ margin: 0; padding: 0; background: rgba(221, 221, 221, 0.5); box-sizing: border-box; border: 1px solid #000;}
.visual .slick-dots li button{width: 100%; height: 100%; margin: 0; padding: 0;}
.visual .slick-dots li button:before,
.visual .slick-dots li button:after{display: none;}


.visual > .btn{position: absolute; top: 50%; transform: translateY(-50%); display: inline-block; text-indent: -9999px; font-size: 0; width: 23px; height: 38px;}
.visual > .btn_prev{left: 4%; background: url("../img/main/btn_r_arrow.png") no-repeat; background-position: top left;}
.visual > .btn_next{right: 4%; background: url("../img/main/btn_r_arrow.png") no-repeat; background-position: top right;}
@keyframes width{
    0%{width: 0;}
    100%{width: 100%;}
}
@media all and (max-width: 1820px){
    .visual .main_slider .slide_item .inner{max-width: none; width: 80%; padding: 0 !important;}
}
@media all and (max-width: 1600px){
    .visual .slick-dots{bottom: 88px;}
}
@media all and (max-width: 1200px){
    .visual .main_slider .slide_item .inner .slide_txt .sup{font-size: 15px;}
    .visual .main_slider .slide_item .inner .slide_txt h3{font-size: 30px;}
    .visual .main_slider .slide_item .inner .slide_txt .desc{font-size: 13px;}
    .visual .main_slider .slide_item .inner .slide_txt .view{padding: 1.927vw 0 8vw;}
}
@media all and (max-width: 1024px){
    .visual .main_slider .slide_item .inner .slide_txt .view{padding: 1.927vw 0 0;}
    .visual .slick-counter {bottom:30px;}
    .visual .slick-dots{bottom: 20px;}
    .visual .slick-dots > li{width: 20px;}
    .visual .slick-dots > li > button{font-size: 0; text-indent: -9999px;}
}
@media all and (max-width: 768px){
    .visual .main_slider .slide_item .img img.v_pc{display: none;}
    .visual .main_slider .slide_item .img img.v_mobile{display: block;}
    .visual .main_slider .slide_item .inner{align-items: flex-start;}
    .visual .main_slider .slide_item .inner .slide_txt{padding: 22vw 0 0; text-align: center; margin: 0 auto;}
    .visual .main_slider .slide_item .inner .slide_txt .sup{padding: 0 0 1vw; font-size: 16px;}
    .visual .main_slider .slide_item .inner .slide_txt h3{padding: 0 0 4vw; font-size: 5.2vw;}
    .visual .main_slider .slide_item .inner .slide_txt .desc{display: none;}
    .visual .main_slider .slide_item .inner .slide_txt .view{padding: 0 0 0;}
    .visual .main_slider .slide_item .inner .slide_txt .view a{float: none; display: inline-block;}
    .visual .slick-counter {bottom:70px;}
    .visual .slick-dots{bottom: 18%;}
}
@media all and (max-width: 568px){
    .visual .main_slider .slide_item .inner{width: 75%;}
    .visual .main_slider .slide_item .inner .slide_txt .sup{font-size: 13px;}
    .visual .main_slider .slide_item .inner .slide_txt .desc{font-size: 12px; line-height: 150%;}
    .visual .main_slider .slide_item .inner .slide_txt .view a{margin: 0 2% 0 0; padding: 1% 5%; font-size: 12px;}
    .visual .slick-counter {bottom:70px;}
    .visual > .btn{width: 18px; height: 29px;}
    .visual > .btn_prev{background-size: 55px;}
    .visual > .btn_next{background-size: 55px;}
}
@media all and (max-width: 460px){
    .visual .slick-counter {bottom:50px;}
}

/* 업종별 추천제품 */
.by_industry{position: relative; width: 100%; max-width: 1140px; margin: -68px auto 0; box-sizing: border-box; padding: 18px 45px 12px 55px; background: #fff; border-radius: 0 0 40px 0; overflow: hidden; box-shadow: 0px 3px 27px 0px rgba(0,0,0,0.13);}
.by_industry:after{content: ""; display: block; clear: both;}
.by_industry .tit{float: left; width: calc(100% - 650px);}
.by_industry .tit h2{line-height: 150%; padding: 7px 0; letter-spacing: 0.25px; font-size: 25px; font-weight: 500;}
.by_industry .tit .desc{line-height: 140%; font-size: 14px; color: #555;}
.by_industry .tit .desc br:nth-of-type(2){display: none;}
.by_industry ul{float: right; width: 650px;}
.by_industry ul:after{content: ""; display: block; clear: both;}
.by_industry ul li{float: left; width: calc(100% / 6);}
.by_industry ul li a{position: relative; display: block; box-sizing: border-box; padding: 80px 0 0; text-align: center; font-size: 15px;}
.by_industry ul li a:before{content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: block; width: 78px; height: 78px; border-radius: 50%; background: #f6f6f6 url("../img/main/by_industry07.png") no-repeat center;}
.by_industry ul li:nth-child(2) a:before{background-image: url("../img/main/by_industry08.png");}
.by_industry ul li:nth-child(3) a:before{background-image: url("../img/main/by_industry09.png");}
.by_industry ul li:nth-child(4) a:before{background-image: url("../img/main/by_industry10.png");}
.by_industry ul li:nth-child(5) a:before{background-image: url("../img/main/by_industry11.png");}
.by_industry ul li:nth-child(6) a:before{background-image: url("../img/main/by_industry12.png");}
@media all and (max-width: 1200px){
    .by_industry{width: calc(100% - 50px); padding: 15px 30px;}
    .by_industry .tit{width: 250px;}
    .by_industry ul{float: left; width: calc(100% - 250px); box-sizing: border-box; padding:  0 0 0 25px;}
}
@media all and (max-width: 1024px){
    .by_industry{margin: 30px auto 0;}
    .by_industry .tit{float: none; width: 100%;}
    .by_industry .tit h2{padding: 0; font-size: 20px;}
    .by_industry .tit .desc{padding: 5px 0 0;}
    .by_industry .tit .desc br{display: none;}
    .by_industry ul{float: none; width: 100%; padding: 20px 0 0;}
}
@media all and (max-width: 768px){
    .by_industry{width: calc(100% - 30px); margin: -5% auto 0; padding: 15px 20px;}
    .by_industry .tit{text-align: center;}
    .by_industry ul li{width: calc(100% / 3);}
    .by_industry ul li a{padding: 80px 0 10px;}
}
@media all and (max-width: 568px){
    .by_industry .tit h2{font-size: 18px;}
    .by_industry .tit .desc{font-size: 13px;}
    .by_industry .tit .desc br:nth-of-type(2){display: block;}
    .by_industry ul li a{padding: 74px 0 10px; font-size: 14px;}
    .by_industry ul li a:before{width: 70px; height: 70px; background-size: 50%;}
}

/* LG공식전문점의 추천제품 */
.recommended_product{overflow: hidden; padding: 0 0 93px; margin: 100px 0 0;}
.recommended_product .tit h2 br{display: none;}
.recommended_product .tit .control{position: absolute; top: 20px; right: 0;}
.recommended_product .tit .control a{display: inline-block; margin: 0 0 0 32px; text-indent: -9999px; font-size: 0; width: 23px; height: 38px;}
.recommended_product .tit .control a:nth-of-type(1){margin: 0;}
.recommended_product .tit .control a.btn_prev{background: url("../img/main/btn_r_arrow.png") no-repeat; background-position: bottom left;}
.recommended_product .tit .control a.btn_prev:hover,
.recommended_product .tit .control a.btn_prev:focus{background-position: top left;}
.recommended_product .tit .control a.btn_next{background: url("../img/main/btn_r_arrow.png") no-repeat; background-position: bottom right;}
.recommended_product .tit .control a.btn_next:hover,
.recommended_product .tit .control a.btn_next:focus{background-position: top right;}
.recommended_product .tit .control a.btn_stop{background: url("http://www.placehold.it/20x20") no-repeat;}
.recommended_product .list{width: 2000px; padding: 47px 0 45px;}
.recommended_product .slick-list{padding: 0 25.25% 0 0;}
.recommended_product .list li{float: left; margin: 0 30px 0 0;}
.recommended_product .list li a{display: block;}
.recommended_product .list li a *{display: block;}
.recommended_product .list li a .img{position: relative; width: 344px; height: 292px; border-radius: 0 0 33px 0; overflow: hidden;}
.recommended_product .list li a .img:before{content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); display: block; width: 94px; height: 94px; background: url("../img/main/recommend_plus.png") no-repeat center; opacity: 0; transition: all 0.3s;}
.recommended_product .list li a:hover .img:before,
.recommended_product .list li a:focus .img:before{z-index: 1; opacity: 1; transform: translate(-50%, -50%) scale(1);}
.recommended_product .list li a .img:after{content: ""; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 0; transition: opacity 0.3s;}
.recommended_product .list li a:hover .img:after,
.recommended_product .list li a:focus .img:after{opacity: 1;}
.recommended_product .list li a .img img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 100%; height: 100%; max-width: none; min-height: 100%; min-width: 100%; object-fit: cover;}
.recommended_product .list li a .txt{padding: 35px 0 0;}
.recommended_product .list li a .txt .p_name{font-size: 20px; font-weight: 500;}
.recommended_product .list li a .txt .p_num{padding: 0 0 8px; font-size: 15px; }
.recommended_product .list li a .txt .cont{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 20px; height: 40px; font-size: 14px; color: #555;}
.recommended_product .state{text-align: center;}
.recommended_product .state span{display: inline-block; padding: 0 8px; vertical-align: middle; font-size: 13px;}
.recommended_product .state .progress{position: relative; display: inline-block; vertical-align: middle; width: 200px; height: 2px; margin: 0 auto 0; background: #d1d1d1;}
.recommended_product .state .progress .pro_bar{position: absolute; top: 0; left: 0; /*width: main.js;*/ height: 100%; background: #000}
.recommended_product .state .btn_stop{position: relative; display: inline-block; width: 10px; height: 14px; vertical-align: middle; margin: 0 0 0 10px; font-size: 0; text-indent: -9999px;}
.recommended_product .state .btn_stop:before{content: ""; position: absolute; top: 0; left: 0; display: block; width: 4px; height: 14px; background: #000;}
.recommended_product .state .btn_stop:after{content: ""; position: absolute; top: 0; right: 0; display: block; width: 4px; height: 14px; background: #000;}
.recommended_product .state .btn_stop.on:before{width: auto; height: auto; border-width: 7px; border-style: solid; border-color: transparent transparent transparent #000; background: transparent;}
.recommended_product .state .btn_stop.on:after{display: none;}
@media all and (max-width: 1600px){
    .recommended_product .tit .control{right: 20px;}
}
@media all and (max-width: 1280px){
    .recommended_product .tit .control{top: 13px; right: 15px;}
}
@media all and (max-width: 1024px){
    .recommended_product{padding: 0 0 50px; margin: 50px 0 0;}
}
@media all and (max-width: 768px){
    .recommended_product .tit .control{top: 0; right: 10px;}
    .recommended_product .list{padding: 30px 0 30px;}
    .recommended_product .list li a .txt{padding: 20px 0 0;}
    .recommended_product .list li a .txt .p_name{font-size: 18px;}
    .recommended_product .list li a .txt .p_num{padding: 0; font-size: 14px;}
    .recommended_product .list li a .txt .cont{font-size: 13px;}
}
@media all and (max-width: 568px){
    .recommended_product .tit{position: relative; box-sizing: border-box; padding: 0 48px 0 0;}
    .recommended_product .tit .control{display: none; top: 50%; transform: translateY(-50%); right: 0;}
    .recommended_product .tit .control a{width: 13px; height: 21px; margin: 0 0 0 18px; background-size: 43px !important;}
    .recommended_product .list{width: auto; padding: 20px 0 20px;}
    .recommended_product .slick-list{padding: 0;}
    .recommended_product .slick-list .slick-slide{opacity: 0.5;}
    .recommended_product .slick-list .slick-slide.slick-current{opacity: 1;}
    .recommended_product .list li a{padding: 0 5px;}
    .recommended_product .list li a .img{width: 100%; height: 220px;}
    .recommended_product .list li a .img img{width: 100%;}
    .recommended_product .list li a .txt{padding: 15px 0 0;}
    .recommended_product .list li a .txt .p_name{font-size: 17px;}
}

/* 설치사례 */
.installation_case{float: left; width: 50%; box-sizing: border-box; padding: 0 30px 0 0;}
@media all and (max-width: 1280px){
    .installation_case{padding: 0 15px 0 0;}
}
@media all and (max-width: 1024px){
    .installation_case{float: none; width: 100%; padding: 0 0 50px;}
}

/* 공지사항 */
.notice{float: right; width: 50%; box-sizing: border-box; padding: 0 0 0 30px;}
@media all and (max-width: 1280px){
    .notice{padding: 0 0 0 15px;}
}
@media all and (max-width: 1024px){
    .notice{float: none; width: 100%; padding: 0;}
}

/* LG전자 B2B 온라인인증점 */
.banner{margin: 100px 0 100px;}
.banner .img{float: left; position: relative; margin-top:-4.5%;}
.banner .img img{width: auto; height: 370px;}
.banner .img .code .company {position:absolute; left:26%; top:28%; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:500; width:74%; padding:0 0 0 0;}
.banner .img .code .number {position:absolute; right:5%; top:22%; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:500; width:auto; padding:0 0 0 0; text-decoration: underline;text-underline-position: under;}
.banner .img .code .company {font-size : 41px}
.banner .img .code .number {font-size : 20px}
/*.banner .account{float: left; width: calc(100% - 1000px); height: 370px; box-sizing: border-box; padding: 50px 0 0 50px; border-radius: 0 0 33px 0; background: #eee;} */
.banner .account{float: left; width: calc(100% - 1000px); box-sizing: border-box; padding: 50px 0 0 50px; border-radius: 0 0 33px 0; background: #eee;}
.banner .account .list{padding: 10px 0 0;}
.banner .account .list li{padding: 0 0 35px 0;}
.banner .account .list li:last-child{padding: 0;}
.banner .account .list li .bank{font-size: 18px; color: #222;}
.banner .account .list li .bank span{font-size: 14px; color: #666;}
.banner .account .list li .num{padding: 8px 0 0; font-size: 32px; font-weight: 700; color: #222;}
@media all and (max-width: 1430px){
    .banner{margin: 80px 0;}
    .banner .img{width: 800px;}
    .banner .img img{height: 296px;}
    .banner .account{width: calc(100% - 800px); height: 296px; padding: 30px 0 0 6%;}
    .banner .account .list{padding: 15px 0 0;}
    .banner .account .list li{padding: 0 0 10px;}
    .banner .img .code .company {font-size : 40px}
    .banner .img .code .number {font-size : 20px}
}
@media all and (max-width: 1280px){
    .banner .account{padding: 30px 0 0 4%;}
    .banner .account .list li .num{font-size: 27px;}
    .banner .img .code .company {font-size : 30px}
    .banner .img .code .number {font-size : 15px}
    .banner .img .code .company {top:31%;}
    .banner .img .code .number {top:21%;}
}
@media all and (max-width: 1200px){
    .banner .img{width: 700px;}
    .banner .img img{height: 259px;}
    .banner .account{width: calc(100% - 700px); height: 259px;}
    .banner .account .list li .num{font-size: 24px;}
}
@media all and (max-width: 1024px){
    .banner{margin: 50px 0;}
    .banner .img{float: none; width: 100%;}
    .banner .img img{width: 100%; height: auto;}
    .banner .account{float: none; width: 100%; height: auto; padding: 30px 30px; border-radius: 0;}
    .banner .account:after{content: ""; display: block; clear: both;}
    .banner .account .tit{float: left; width: 160px;}
    .banner .account .list{float: left; width: calc(100% - 160px); padding: 0;}
    .banner .account .list li{float: left; box-sizing: border-box; padding: 0 20px 0 0 !important;}
    .banner .account .list li .num{font-size: 20px;}
}
@media all and (max-width: 768px){
    .banner{margin: 30px 0;}
    .banner .img .code {font-size:17px;}
    .banner .account{padding: 30px 20px;}
    .banner .account .tit{width: 140px;}
    .banner .account .list{width: calc(100% - 140px);}
    .banner .account .list li .bank{font-size: 16px;}
    .banner .account .list li .num{padding: 0; font-size: 17px;}
    .banner .img .code .company {font-size : 26px}
    .banner .img .code .number {font-size : 13px}
    .banner .img .code .company {top:31%;}
    .banner .img .code .number {top:20%;}
}
@media all and (max-width: 568px){
    .banner .img .code {font-size:12px;}
    .banner .account .tit{float: none; width: 100%;}
    .banner .account .list{float: none; width: 100%; padding: 15px 0 0;}
    .banner .account .list li{float: none; width: 100%; padding: 0 0 5px 0 !important;}
    .banner .account .list li:last-child{padding-bottom: 0 !important;}
    .banner .img .code .company {font-size : 18px}
    .banner .img .code .number {font-size : 9px}
    .banner .img .code .company {top:30%;}
    .banner .img .code .number {top:20%;}
}
@media all and (max-width: 460px){
    .banner .img .code .company {font-size : 17px}
    .banner .img .code .number {font-size : 8px}
    .banner .img .code .company {top:29%;}
    .banner .img .code .number {top:18%;}
}

@media all and (max-width: 480px) {
    .div_popup {width: 100% !important;}
}

/*팝업*/
.div_popup {border:1px solid #222; box-sizing:border-box;}
.div_popup .divpop-img {}
.div_popup .divpop-bottom {background:#222;  text-align:center;}
.div_popup .divpop-bottom td {overflow:hidden;}
.div_popup .divpop-bottom td a {display:block; width:50%; float:left; padding:10px 0; color:#dbdbdb; position:relative;}
.div_popup .divpop-bottom td a::after {content:""; position:absolute; top:50%; right:0; transform:translateY(-50%); display:block; width:1px; height:15px; background:#555;}
.div_popup .divpop-bottom td a:last-child::after {content:none;}
/*팝업*/