@charset "utf-8";

/*visual slide banner*/
.slide_box {position: relative;}
.slide_box img {width: 100%;}
.slide_box .slidecontrol {position: absolute; left:20px; bottom: 20px; width: 52px; height: 26px; z-index:8888; border-radius: 20px; background: rgba(0,0,0,0.4);  font-family: Tahoma; font-size: 13px; color:#fff;}
.slidecontrol .num {position: absolute; left: 15px; top: 5px;}
.slidecontrol .num strong {margin-right: 2px;}
.slidecontrol .num em {display: inline-block; width:14px; color: #ebebeb; font-style: normal;}
/*.coverbanner {padding-top: 55px;}*/
.visual_slide {width: 100%; float: left; height:auto; display: none;}
.visual_slide.on {display: block;}
/*190403_개발용수정(s)*/
.tabbanner{width: 8000px; position: relative;}
.tabbanner{ position: relative; overflow-x : scroll; -ms-overflow-style: none;}
.tabbanner::-webkit-scrollbar{ display : none;}
/*190403_개발용수정(e)*/

/*notice*/
#visual-box {background: #ededed;}
#visual-box .notice {padding:12px 18px; background-color: #fff; border-bottom: 1px solid #eeeeee;}
#visual-box .notice .n_l {position: relative; float: left; width:40px;}
#visual-box .notice .n_l img {}
#visual-box .notice .n_l span.num {position: absolute; top: 0; right: 8px; display: block; width: 16px; height: 16px; text-align: center; background: red; border-radius: 8px;}
#visual-box .notice .n_l span.num i {color:#fff; display: inline-block; font-style: normal; font-size: 11px; font-family: 'tahoma'; font-weight: bold; vertical-align: 1px;}
#visual-box .notice .n_r {float: left; width: 75%; margin-top: 5px; margin-bottom: 5px; margin-left: 4px; height:18px; overflow: hidden;}
#visual-box .notice .n_r ul {line-height: 20px;}
#visual-box .notice .n_r ul li {}
#visual-box .notice .n_r ul li a {font-size:15px; letter-spacing:-1px;}
#visual-box .notice .n_r ul li a.on {}

/* 240607 trial (s) */
.trial {min-width: 360px;padding: 28px 58.5px;background-color: #fff;font-family: 'pretendard', sans-serif;text-align: center;}
.trial input {appearance: auto;}
.trial .tit1, .trial .tit2 {font-weight: 600;color: #000}
.trial .tit1 {font-size: 24px;line-height: 32px;}
.trial .tit1 .strong {color: #744eff}
.trial .txt1 {margin: 22px 0 30px;font-size: 18px;font-weight: 500;line-height: 26px;color: #515151}
.trial .btn {border-radius: 10px;background: #744eff;font-family:'pretendard', sans-serif;font-weight: 600;color: #fff}
.trial .btn_apply {padding: 15.5px 80px;font-size: 24px;word-break: keep-all;}

.trial, .trial .modal, .trial .modal_inner, .trial .other_text {box-sizing: border-box;}
.trial .modal {position: fixed;left: 0;top: 0;width: 100%;height: 100%;padding: 0 20px;background: rgba(0, 0, 0, 0.5);z-index: 9000;}
.trial .modal_inner {position: absolute;left: 50%;top: 50%;width: 320px;padding: 20px 10px;border-radius: 15px;background: #fff;z-index: 9001;transform: translate(-50%, -50%);}
.trial .modal_apply {text-align: left;}
.trial .tit2 {font-size: 22px;text-align: center;}
.trial .check {margin: 20px 0 24px;font-size: 12px;font-weight: 500;color: #f03e3e}
.trial .check .txt2 {margin-bottom: 8px;}
.trial .question {display: flex;align-items: center;position: relative;font-size: 16px;font-weight: 500;color: #000}
.trial .question::before {display: inline-block;position: relative;left: 0;width: 3px;height: 18px;margin-right: 8px;background: #744eff;content: '';}
.trial .input_list {display: flex;flex-wrap: wrap;align-items: center;margin: 16px 0 24px}
.trial .other_text {width: 146px;height: 22px;margin-left: 4px;outline: 1px solid #ccc;border: none;font-size: 12px;font-family: 'pretendar', sans-serif;}
.trial .other_text:active, .trial .other_text:focus {outline: 1px solid #444;}
.trial .label_txt {margin: 0 12px 0 4px;}
.trial .label_txt:last-of-type {margin-right: 0;}
.trial .label_txt, .trial .label_txt2 {font-size: 12px;}
.trial .input_wrap {margin: 16px 0 0;}
.trial .btn_list {display: flex;}
.trial .btn_list .btn {width: 50%;padding: 12px 44px;font-size: 16px;}
.trial .btn_list .btn:last-of-type {margin-left: 16px;background: #ccc}
.trial .modal_complete {font-size: 18px;font-weight: 500;line-height: 24px;color: #000}
.trial .modal_complete .ico {position: relative;width: 40px;height: 40px;margin: 0 auto;background: #744eff;border-radius: 50%;}
.trial .modal_complete .ico::before {position: absolute;left: 50%;top: 50%;width: 24px;height: 24px;background: url("../img/main/ico_check.png") center / cover no-repeat;transform: translate(-50%, -50%);content: '';}
.trial .modal_complete .txt3 {margin: 16px 0;}
.trial .modal_complete .modal_inner {padding: 21px 52px 25px;}
.trial .modal_complete .btn_modal_close {position: absolute;top: 21px;right: 16px;width: 24px;height: 24px;background: url("../img/main/ico_close.png") center / cover no-repeat;}
.trial .ally_hidden {overflow:hidden;position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);-webkit-clip-path:inset(50%);clip-path:inset(50%);}

/* 240611 error (s) */
.trial .error_txt {display: none;margin-top: 16px;font-weight: 600;font-size: 13px;line-height: 18px;color: #ff0000}
.trial .error .ico {background: none;}
.trial .error .ico::before {width: 100%;height: 100%;background: url("../img/main/ico_error.png") center / cover no-repeat}
.trial .error .error_txt {display: block;}
/* 240611 error (e) */

.trial .modal_apply, .trial .modal_complete {display: none;}
.trial input[type=radio] {appearance: none;width: 14px;height: 14px;border-radius: 50%;border: 1px solid #767676;}
.trial input[type=radio]:checked {background:#744eff;border: 3px solid #fff;box-shadow: 0 0 0 1px #744eff}
/* 240607 trial (e) */

/*kovien*/
#visual-box .kovien {position: relative; margin-top:6px; padding:20px 0 20px 20px; background: #fff; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;}
#visual-box .kovien .titlebox {position: relative; margin-right: 20px; padding-bottom: 10px;}
#visual-box .kovien .titlebox p {font-family: 'NSBold'; font-size: 18px; color:#000;}
#visual-box .kovien .titlebox span {position: absolute; top:5px; right: 0; font-size: 11px; color:#333;}
#visual-box .kovien .titlebox span i {display: inline-block; width: 8px; height: 8px; margin-left: 4px; background:url(../img/main/plus.png); background-size: auto 8px;}
/*190403_개발용수정(s)*/
#visual-box .kovien .scroll_div {position: relative;overflow-x : scroll; -ms-overflow-style: none;}
#visual-box .kovien .scroll_div::-webkit-scrollbar{ display : none;}
/*190403_개발용수정(e)*/
#visual-box .kovien .scroll_container {position: relative; width: 3000px;}
#visual-box .kovien ul.thumb {position: relative;}
#visual-box .kovien li.thumb_wrap {float: left; width: 500px; margin-right: 10px; -webkit-box-sizing: border-box; -box-sizing: border-box;} 
#visual-box .kovien li.thumb_wrap.on {display: block;} 
#visual-box .kovien .thumb a {display: block; position: relative;}
#visual-box .kovien .thumb_img {position: relative; padding-top: 58.25%;overflow: hidden;} 
#visual-box .kovien .thumb_img:before {content: ''; display: block; position: absolute; right: 0; bottom: 0; left: 0; height: 18%; z-index: 99; background:-webkit-gradient(linear,0 0,0 100%,color-stop(0,transparent),color-stop(100%,rgba(0,0,0,.5))) }
#visual-box .kovien .thumb_img span {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 98;} 
#visual-box .kovien .thumb_img span.thumbimg1 {background: url(../img/main/koviun_thumb1.jpg) no-repeat; background-size: cover;} 
#visual-box .kovien .thumb_img span.thumbimg2 {background: url(../img/main/koviun_thumb2.jpg) no-repeat; background-size: cover;} 
#visual-box .kovien .thumb_wrap .cate {position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 6px; z-index: 100;}
#visual-box .kovien .thumb_wrap .cate span {display: inline-block; font-family: NSBold; font-size: 11px; color:#fff;}
#visual-box .kovien .thumb_wrap span.title {display:block; margin-top:10px; font-family: NS; font-size: 16px; color:#000;}




/*program tab*/
#visual-box .programtab {position: relative; width: 100%; background: #fff; margin-top:6px; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;}
#visual-box .programtab .covercontents {width: 340px; margin:0 auto; overflow:hidden; text-align: center;padding: 55px 0;}
#visual-box .programtab .covercontents ul.tabcontents {width: 2380px;}
#visual-box .programtab .covercontents .tabcontents li {float: left; width: 340px; color:#252525; letter-spacing: -0.5px; display: none;}
#visual-box .programtab .covercontents .tabcontents li.on {display: block;}
#visual-box .programtab .covercontents .tabcontents li p {margin:0 auto 25px; margin-bottom: 20px; width: 132px; height: 140px; background: url(../img/main/main.png) no-repeat; background-size: auto 400px; text-indent: -9999px;}
#visual-box .programtab .covercontents .tabcontents li.archi p {background-position: 0 -12px;}
#visual-box .programtab .covercontents .tabcontents li.kitchen p {background-position: -134px -12px;}
#visual-box .programtab .covercontents .tabcontents li.bath p {background-position: -267px -12px;}
#visual-box .programtab .covercontents .tabcontents li.builtin p {background-position: -401px -12px;}
#visual-box .programtab .covercontents .tabcontents li.khr p {background-position: -535px -12px;}
#visual-box .programtab .covercontents .tabcontents li strong {display:block; font-size:22px; margin-bottom: 6px; font-family: 'NBGBold';}
#visual-box .programtab .covercontents .tabcontents li > span {display:block; margin-bottom: 24px; font-size: 15px;}
#visual-box .programtab .covercontents .tabcontents li a span {display: inline-block; font-size: 13px; color:#6f28e4;}
#visual-box .programtab .covercontents .tabcontents li a span i {display: inline-block; margin-left: 5px; vertical-align: -1px; width:6px; height: 10px; background: url(../img/main/main.png) no-repeat; background-position: 0 0; background-size: auto 400px;}
#visual-box .programtab .thumb_nav {position: absolute;left: 0;top: 50%;width: 100%;transform: translateY(-50%);}
#visual-box .programtab .prev_btn {position: absolute; left: 20px; top: 0; margin: auto; width: 25px; height: 25px; cursor: pointer; background: url(../img/main/prev_btn.png) no-repeat 0 0 / 100%; z-index: 101;}
#visual-box .programtab .next_btn {position: absolute; right: 20px; top: 50%; margin: auto; width: 25px; height: 25px; cursor: pointer; background: url(../img/main/next_btn.png) no-repeat 0 0 / 100%; z-index: 101;}
/*190403_개발용수정(s)*/
.swiper-container {width: 100%; height: 100%; margin-left: auto; margin-right: auto;}
.swiper-slide {text-align: center; font-size: 18px; background: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
/*190403_개발용수정(e)*/


/*info*/
#visual-box .info {margin-top:6px; /*margin-bottom: 15px;*/ padding: 25px 20px; background: #fff; border-top: 1px solid #eeeeee;}
#visual-box .info .wrap {border:1px solid #e8e8e8;}
#visual-box .info .wrap .inner {padding: 18px;}
#visual-box .info .box.cs {/*margin-bottom: 25px;*/}
#visual-box .info .boxtit {margin-bottom: 8px;}
#visual-box .info .boxtit strong {font-size: 17px; font-family: 'NSBold';}
#visual-box .info .boxtit em {display: inline-block; margin-left: 3px; font-family: '돋움, Dotum'; font-size: 11px; font-style: normal;}
#visual-box .info .box p {font-family: NS; font-size: 13px; font-weight: normal; line-height: 20px; color:#8e8e8e;}
#visual-box .info .box.cs .tell {margin-bottom: 4px; color:#444;}
#visual-box .info .box.cs .fax {margin-bottom:8px; color:#444;}
#visual-box .info .box.cs .tell span, #visual-box .info .box.cs .fax span {font-family: 'NBG'; font-size: 16px;}
#visual-box .info .box.cs .tell span.tell, #visual-box .info .box.cs .fax span.fax {margin-right: 4px; font-size: 14px; vertical-align: 1px;}
#visual-box .info .box.cs .day span {float: left; display: block; width: 65px; text-align: left;}
#visual-box .info .box.cs .day span.border {margin-top: 5px; width: 1px; height:12px; background:#ccc; margin-right:10px;}
#visual-box .info .box.bank em {display: block; margin-bottom: 8px; font-family: 'NBG'; font-size: 18px; font-style: normal;}
#visual-box .info .box.bank p span.border {display: inline-block; margin:-2px 10px; width: 1px; height:12px; background:#ccc;}
#visual-box .info .box.bank a {display:block; width: 360px; height: 88px;}










@media all and (max-width: 640px){

	#visual-box .kovien .thumb_img:before {height: 26%;}
	#visual-box .kovien .scroll_container {width: 2000px;}
	#visual-box .kovien li.thumb_wrap {width: 320px;} 

	/*programtab*/
	#visual-box .programtab .covercontents {padding: 35px 0;}
	#visual-box .programtab .covercontents .tabcontents li p {margin-bottom: 18px; width: 107px; height: 113px; background-size: auto 400px;}
	#visual-box .programtab .covercontents .tabcontents li.archi p {background-position: 0 -157px;}
	#visual-box .programtab .covercontents .tabcontents li.kitchen p {background-position: -108px -157px;}
	#visual-box .programtab .covercontents .tabcontents li.bath p {background-position: -216px -157px;}
	#visual-box .programtab .covercontents .tabcontents li.builtin p {background-position: -325px -157px;}
	#visual-box .programtab .covercontents .tabcontents li.khr p {background-position: -433px -157px;}
	#visual-box .programtab .covercontents .tabcontents li strong {font-size: 20px;}
	#visual-box .programtab .covercontents .tabcontents li > span {font-size:14px; margin-bottom: 20px;}
	#visual-box .programtab .covercontents .tabcontents li a span {}
	#visual-box .programtab .covercontents .tabcontents li a span i {background-size: auto 390px;}
	#visual-box .kovien .scroll_container .prev_btn, #visual-box .kovien .scroll_container .next_btn {width: 20px; height: 50px; margin-top: -20px;}


	
}


@media all and (max-width: 320px){

	#visual-box .programtab .covercontents .tabcontents li {width: 320px;}

}