/*
	CSS : main
*/

/*공통*/
.content {width: 100%;max-width: 1200px;margin: 0 auto;position: relative;}
.content:after {content:''; display:block; clear:both;}
.wrap-css {padding: 50px 0; margin-bottom: 35px;}
.best-item{padding-bottom: 80px;}
.img-box img,
.img-box source {width: 100%;}
.at-body {max-width: 100%;}

/*중간 배너*/
.view_baner {width: 100%;border: 1px solid #ddd;margin: 20px 0; margin-top: 60px;}
.view_baner:after {display: block;content: "";clear: both;}
.view_baner ul {float: left;}
.view_baner ul:first-child {width: 100%;max-width: 230px;}
.view_baner ul li {text-align: center;font-size: 18px;cursor: pointer;}
.view_baner ul:first-child li {display: block;width: 100%;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
.view_baner ul:first-child li span {display: flex;width: 100%;height: 119px;vertical-align: middle;align-items: center;justify-content: center;}
.view_baner ul:first-child li:hover {background:#ff4900; color:white;}
.view_baner ul:first-child li span.active {background:#ff4900; color:white;}
.view_baner ul:first-child li:last-child {border-bottom: none;}
.view_baner ul:first-child li span.active .text_title ,
.view_baner ul:first-child li:hover .text_title {border-bottom: 1px solid #fff; display:inline-block; padding-bottom: 2px; margin-top: 2px;}
.view_baner ul:first-child li span br {display:none;}

.view_baner ul:last-child {width: 100%;max-width: 968px;}
.view_baner ul:last-child li {display: none;opacity: 0;}
.view_baner ul:last-child li img {max-width: 100%;width: 100%;}
.view_baner ul:last-child li.active {display: block;opacity: 1;}

@media (max-width:991px) {
.view_baner ul:first-child li span {height: 89px;}
}

/*리스트 베너*/
.list_baner {margin-bottom: 20px;}
.list_baner:after {display: block;content: '';clear: both;}
.list_baner li {float: left;width: 24.5%; margin-right: 0.66%;}
.list_baner li:nth-child(7){margin-right: 0;}
.list_baner li img {max-width: 100%;}

@media (max-width:991px) {
.list_baner {margin-bottom: 15px;}
}

@media (max-width:767px) {
.list_baner {margin-bottom: 10px;}
}

@media (max-width:480px) {
.list_baner {margin-bottom: 0;}
}

/*소개영상*/
.video-box	{background-image: url(/img/main/main-bg.jpg);background-size: cover;}
.best-item  {background-image: url(/img/main/back.png);background-size: cover;}
.video-box .title-box h3 {color: #fff;}
.best-item .title-box h3 {color: ;}
.video-box .title-box p,
.best-item .title-box p {color: #666666;}

.best-item .item-row:hover .img-wrap .border-line > a {border-color: #2a8bd8;}
.best-item .more-view {}

/*중간 pick*/
.pick {width: 100%;}
.pick .content > h3 {margin-bottom: 30px;}
.pick .miso-item .item-list {background-color: #fff;}
.pick .content {width: 100%;max-width: 1200px;margin: 0 auto;text-align: center;}
.pick .miso-item-slider {position: absolute;transform: translate(0,10%);
-webkit-transform: translate(0,10%);
-moz-transform: translate(0,10%);
-ms-transform: translate(0,10%);
-o-transform: translate(0,10%);
transform: translate(0,10%);
}
.pick .miso-item-slider .bg-white {background-color: transparent;}
.pick .miso-item-slider .item-list {border: none;}
.choice-btn {display: table;width: 35%; margin:20px auto; }
.choice-btn > li {display: inline-block;width: 32%;text-align: center;font-size: 15px; font-weight: 600; padding: 10px 0;border: 1px solid #ddd;cursor: pointer; border-radius:60px/60px; margin-right:2%; margin-bottom: 50px;}
.choice-btn > li:last-child {margin-right:0;}
.choice-btn > li.on {background-color: #ff4900;color:#fff;}
.choice-list > li {visibility: hidden;height: 0;}
.choice-list > li.on {visibility: visible;height: auto;;}

.center-baner img {width: 100%;}

/*하단 리뷰*/
.review {padding: 50px 0;}
.review .miso-post-list .post-wrap {margin: 0; margin-top: 0px; width: 100%;}
.review .view:after {display: block;content: '';clear: both;}
.review .view {display: inline-block;width: 35.5%; float: left; margin-right: 3.3%;}
.review .view2{width: 61%; margin-right: 0; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd;}
.review .view > li {padding: 25px 20px;background-color: #fff;display: inline-block;vertical-align: top; width:100%;}
.review .view2 > li{border-right: 1px solid #ddd;} 
.review .view2> li:first-child{border-left: 1px solid #ddd;} 
.review .view2> li:last-child {width: 49.26%; border-right:0;}
.review .view > li.service{padding: 0; width: 50.2%;}
.review .view > li .view_txt {width: 100%;border-bottom: 2px solid #666666;}
.review .view2 > li .view_txt{border:0;	}
.review .view > li .view_txt:after {display: block;content: '';clear: both;}
.review .view > li .view_txt h4 {display: inline-block;font-size: 18px;margin-top: 0;padding: 5px 15px;text-align: center;border: 1px solid #717373;border-radius: 50px;}
.review .view > li.review-box .view_txt h4,
.review .view > li.board-box .view_txt h4 {font-size: 12px; font-weight: 600; border:none;}

.review .reviewWrap li{padding: 0;}
.review .reviewWrap li h4{padding: 0;margin: 0; margin-bottom: 15px;}
.review .reviewWrap .miso-post-list .post-wrap{margin-top: 0;}

.review .view > li:last-child .view_txt h4 {border:none; margin:0; padding:0 0 18px; font-size: 24px;}
.review .view > li:last-child .view_txt h4 img {margin-right: 10px;}
.review .view > li .view_txt a {float: right;display: block;}

.review .tell_box {width: 61%;border: 1px solid #ddd;border-right: none;border-bottom: none;display: inline-block;border-top: none; vertical-align:top;}
.review .tell_box li {width: 16.266%;text-align: center;text-align: center;border-top: 1px solid #ddd;border-right: 1px solid #ddd;border-bottom: 1px solid #ddd;display: table-cell;vertical-align: middle;font-size: 17px;padding: 20px 0;}
.review .tell_box li a span{width: 100%; display:inline-block; font-weight: 500; font-size: 16px; padding-top: 15px; color:#444;}

.service .service-box {padding: 25px 20px;}
.service .service-box h2{font-weight: 600; font-size: 18px; padding-bottom: 20px ; line-height:1.1;}
.service .service-box a {font-size: 36px;color:#ff4900;font-weight: 600;display: block;}
.service .service-box .cs {margin-top:15px;}

/* 타이틀 CSS */
.title-box {font-size: 30px;position: relative;margin-bottom: 40px; text-align: center; position:relative; }
.title-box h3 {position: relative;width: 100%;margin: 0 auto;z-index: 1;margin-bottom: 10px;font-weight: 600; font-size: 32px; color:#000; line-height:1.1;}

.title-box h3 b {margin-top: 12px;display: inline-block;font-size: 45px;}
.title-box img {margin-right: 5px;vertical-align: top;width: 100px;}
.title-box .title-more {position:absolute; top:50%; right:0; transform:translateY(-50%);}
.title-box .title-more img {width:auto; margin:0; vertical-align:middle;}
.title-box p {font-size: 18px;color:#4f4f4f;}
.pick .title-box{margin-bottom: 30px;}
.carousel-indicators li {width: 40px;height: 7px;border: none;background-color: #fff;}
.carousel-indicators li.active {width: 40px;height: 7px;border: none;background-color: #0058ac;}

.review .view > li:last-child .miso-post-list .post-list li {}
.review .view2 > li:last-child .miso-post-list .post-list li{margin: 0; } 
.board-box .miso-post-list .post-list li{padding-bottom: 0!important;}
.review .view > li:last-child .miso-post-list .post-list li a {font-size: 16px; color:#666; font-weight: 400;}

.pick .title-box h3 b {color: #2895e2;}
.pick .best-item h3 b {color: #f5a402;}
.pick .device-item h3 b {color: #2ba266;}

.miso-item .item-list {padding-top: 0;}

#loler {margin: 30px 0;}
#loler > div {display: table;padding: 0;width: 100%;}
#loler > div > div {display: table-cell;width: 50%;}
#loler > div > div.left-box {padding-right: 15px;}
#loler > div > div.right-box {padding-left: 15px;}
#loler > div > div h3 {font-size: 26px;margin-bottom: 20px;margin-top: 0;}
#loler > div > div .view-box {border-top: 3px solid #db096c;background-color: #f1f6f8;padding:30px 40px;}
#loler > div > div .add-txt {margin-top: 25px;font-size: 13px;}
#loler > div > div .post-row a {font-size: 16px;}

@media (max-width:1215px) {
	.view_baner ul:first-child {max-width: 100%;}
	.view_baner ul:first-child li {width: 33.333%;float: left;}
	.view_baner ul:first-child li:last-child  {border-bottom: 1px solid #ddd; border-right:0;}
	.view_baner ul:last-child {width: 100%;max-width: none;}
}
@media (max-width:991px) {
	.title-box .title-more {display:none;}
	.content {padding: 0 15px;}
	.review {padding:30px 0 15px;}
	.review .tell_box ul {width: 100%!important;}
	.review .view{width: 100%; margin-right: 0; margin-bottom:25px;}
	.review .view > li.service{width: 100%;}
/* 	.service .service-box{padding: 45px 40px;} */
	.service .service-box h2{font-size: 22px; text-align: left; padding-bottom: 18px;}
	.service .service-box .cs{margin-top: 25px;}
	
	.compare {display: none;}
	.miso-item .item-list {padding-bottom: 0;}
	.pick .content .choice-btn {width:100%; margin-bottom: 20px;}
	.at-body {padding-top: 66px!important;}
	.at-body.sub-body {padding-top:0 !important; padding-left:15px; padding-right:15px;}

	.list_baner li {float: left; width: 48.87%; margin: 10px 0;margin-right: 2.22%;}
	.list_baner li:nth-child(4n){margin-right: 0;}

	.review .tell_box{width: 100%;}
	.review .tell_box li{width: 33.3%; float: left; box-sizing:border-box;}
	.review .tell_box li:nth-child(1),.review .tell_box li:nth-child(2),.review .tell_box li:nth-child(3){border-bottom: 0;}
	.review .tell_box li a{display:block;} 
	.review .tell_box li a span{font-size: 17px;}
	.review .view2 > li{border-right: 0;}
	.review .view2> li:last-child{width: 100%; border-left: 1px solid #ddd; padding: 25px 20px;}
	.review .view > li:last-child .view_txt h4{font-size:19px; }
	.review .view > li:last-child .miso-post-list .post-list li a{font-size: 17px;}
	.review .view2 > li:last-child .miso-post-list .post-list li{margin-bottom: 10px;}
}

@media (max-width:767px) {
	
	.view_baner ul:first-child li span {padding: 15px 0;}
	.review .view > li {width: 100%;margin-bottom: 20px;}
	.list_baner li img {width: 100%;}
	
	.choice-btn > li {font-size: 12px;padding: 10px 0; margin-bottom:25px;}
	.service-box img {max-width: 100%;}
	.review .tell_box li {}
	#loler > div > div {width: 100%;display: block;}
	#loler > div > div.left-box {padding-right: 0;}
	#loler > div > div.right-box {padding-left: 0;padding-top: 30px;}
}	
@media (max-width:480px) {
	.view_baner ul:first-child li span {padding: 7px 5px;font-size: 14px;}
	.view_baner ul:first-child li span br {display:block;}
	.review .tell_box ul:first-child li {width: 50%;}
	.review .tell_box ul:last-child li {display: block!important;height: auto;}
	.review .tell_box ul:last-child li div:first-child {padding: 20px 0px;}

/* 	.miso-item .item-list {margin-right: 0!important;}
	.miso-item .item-wrap {margin-right: 0!important;} */
	.review .tell_box li {font-size: 13px;}
	.title-box h3 b {font-size: 24px;}
	.title-box img {width: 63px;}
}

@media all and (min-width:1920px) {

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

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

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

}
@media all and (max-width:991px) {
	.review .view > li {display: block;width: 100%; padding:0;}
}
@media all and (max-width:767px) {
	.title-box > h3 {font-size: 34px;margin-bottom: 5px;}
	.video-box iframe {height: 400px;}
	.review .view > li {margin-bottom: 0;}
}
@media all and (max-width:480px) {
	.title-box > h3 {font-size: 30px;}
	.title-box p {font-size: 14px;}
	.video-box iframe {height: 300px;}
	.review .view {display: block;background-color: #fff;}
	.review .view > li .view_txt h4 {font-size: 12px;margin-bottom:0;}
	.review .view > li .view_txt a {margin-top: 0;}
}