#PURCHASE-GUIDE_PRODUCT-COMPARE .contents_inner {padding-top:145px; max-width:1116px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator.on{max-width:784px; margin:0 auto;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span {display: inline-block; font-size:40px; line-height:40px; vertical-align: bottom;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span.comment{display:none; font-size:16px; color:#666; line-height:100%; letter-spacing:-1px; padding:18px 0 0 20px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator.step2 span.comment{display:inline-block;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .current {float:left;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next {float:right; font-size:26px; color:#ccc;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next:after {content:""; position:relative; top:-1px; width:10px; height:10px; display: inline-block; border-top:2px solid #cccccc; border-right:2px solid #cccccc; transform:rotate(45deg); margin-left:5px; box-sizing: border-box; vertical-align: middle;} #PURCHASE-GUIDE_PRODUCT-COMPARE .fclear {position:relative; clear:both;} #PURCHASE-GUIDE_PRODUCT-COMPARE .steps {margin-top:60px; display: none;} #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2{margin-top:10px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .steps.on {display: block;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list {width:100%; font-size:0; padding-bottom:20px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a {position:relative; display: inline-block; vertical-align: top;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a:before {content:""; position:absolute; top:0; left:0; width:calc(100% + 1px); height:calc(100% + 1px); border:1px solid #cccccc; box-sizing: border-box;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a:after {content:""; position:absolute; top:0; left:0; width:calc(100% - 3px); height:calc(100% - 3px); border:2px solid #e35b0a; opacity:0; transition:opacity 0.3s;z-index: 1} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a .copy {display: table; width:100%; text-align: center;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a .copy .copy_inner {display: table-cell; vertical-align: middle;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a:hover:after {opacity:1;} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_inner{padding:0;} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_inner .pop_contents{margin:0 auto;} /* ============================ STEP1 ============================ */ #INQUIRY_STEP1 .list_box2{position: relative;} #INQUIRY_STEP1 .category.isW{display: block} #INQUIRY_STEP1 .category.isM{display: none} #INQUIRY_STEP1 .category {position:relative; width:100%; border-left:1px solid #ccc; border-right:1px solid #ccc;background: #f6f6f6;height:0;overflow: hidden;transition: height 0.3s; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP1 .category.on{height: 120px;border-top:1px solid #ccc; } #INQUIRY_STEP1 .category .category_inner{ padding:20px;width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP1 .category .category_copy {font-size:16px; color:#222222;line-height: 1;margin-bottom: 20px;} #INQUIRY_STEP1 .category .category_list {width:100%; box-sizing: border-box; font-size:0;} #INQUIRY_STEP1 .category .category_list a {display: inline-block; padding:8px 13px 12px; border:1px solid #cccccc; border-radius: 2px; font-size:16px; color:#222222; vertical-align: top; margin-right:10px;transition: all 0.3s} #INQUIRY_STEP1 .category .category_list a.on {border-color:#da450d;background-color: #fff} #INQUIRY_STEP1 .category .category_list a:hover{border-color:#da450d;} #INQUIRY_STEP1 .category .category_list a:before{display: none} #INQUIRY_STEP1 .category .category_list a:after{display: none} #INQUIRY_STEP1 .category.category2 a{display: none} #INQUIRY_STEP1 .category.category2 a.size_medium, #INQUIRY_STEP1 .category.category2 a.size_large, #INQUIRY_STEP1 .category.category2 a.size_heavy{display: inline-block} #INQUIRY_STEP1 .product_list{max-width:784px; padding-bottom: 30px; margin:0 auto; text-align:left;} #INQUIRY_STEP1 .product_list a.list_box {width:50%;text-align: center;height: 346px;display: inline-block} /* #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(3n):before{width: 100%} #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(3n):after{width: calc(100% - 4px)} */ #INQUIRY_STEP1 .product_list a.list_box .box_inner {display: table;height: 100%;width: 100%} #INQUIRY_STEP1 .product_list a.list_box .box_inner .list_inner {display: table-cell;vertical-align: middle;padding-top: 50px} #INQUIRY_STEP1 .product_list a.list_box .thumb {position: relative;text-align: center;transform: scale(0.9);transition: transform 0.3s} #INQUIRY_STEP1 .product_list a.list_box .thumb>img{} #INQUIRY_STEP1 .product_list a.list_box .thumb .img_area {position: absolute;width: 100%;height: 100%;left: 50%;top: 50%;transform: translate(-50%,-50%);} #INQUIRY_STEP1 .product_list a.list_box .thumb .img_area img{opacity: 1; -webkit-transition: opacity 0.1s; -moz-transition: opacity 0.1s; -ms-transition: opacity 0.1s; -o-transition: opacity 0.1s; transition: opacity 0.1s; } #INQUIRY_STEP1 .product_list a.list_box .thumb .img_area img.off {position: absolute;top: 50%;left: 50%;opacity: 1;transform: translate(-50%,-50%);width: auto;height: auto;max-width: 100%;max-height: 100%} #INQUIRY_STEP1 .product_list a.list_box .thumb .img_area img.on {position: absolute;top: 50%;left: 50%;opacity: 0;transform: translate(-50%,-50%);width: auto;height: auto;max-width: 100%;max-height: 100%} #INQUIRY_STEP1 .product_list a.list_box .copy {height:128px;} #INQUIRY_STEP1 .product_list a.list_box .copy span {font-size:20px; color:#666666; line-height: 30px;} #INQUIRY_STEP1 .product_list a.list_box:hover .thumb .img_area img.off{opacity: 0} #INQUIRY_STEP1 .product_list a.list_box:hover .thumb .img_area img.on{opacity: 1} #INQUIRY_STEP1 .product_list a.list_box:hover .copy span {color: #222} #INQUIRY_STEP1 .product_list a.list_box.on .thumb{transform: scale(1)} #INQUIRY_STEP1 .product_list a.list_box.on .thumb .img_area img.off{opacity: 0} #INQUIRY_STEP1 .product_list a.list_box.on .thumb .img_area img.on{opacity: 1} #INQUIRY_STEP1 .product_list a.list_box.on:after {opacity:1;} #INQUIRY_STEP1 .product_list a.list_box.on .copy span {color: #222} #INQUIRY_STEP1 .btn_next{margin-top: 60px} .btn_next .gu_btn{min-width:160px;} /* ============================ STEP2 ============================ */ #INQUIRY_STEP2 .product_list a {display:block;} #INQUIRY_STEP2 .product_list a:nth-of-type(3n):before{width: calc(100% + 1px)} #INQUIRY_STEP2 .product_list a:nth-of-type(3n):after{width: calc(100% - 3px)} #INQUIRY_STEP2 .product_list a:nth-of-type(4n):before{width: 100%} #INQUIRY_STEP2 .product_list a:nth-of-type(4n):after{width: calc(100% - 4px)} #INQUIRY_STEP2 .product_list a .thumb {padding:45px 0 0;text-align: center} #INQUIRY_STEP2 .product_list a .copy {height:93px;} #INQUIRY_STEP2 .product_list a .copy span {font-size:18px; color:#666666; line-height:25px;} #INQUIRY_STEP2 .product_list a.on:after{opacity: 1} #INQUIRY_STEP2 .product_list a.on .copy span{color: #222} /* ============================ STEP3 ============================ */ #INQUIRY_STEP3 .input_area {width:100%; border:1px solid #cccccc; padding:60px 112px 100px; box-sizing: border-box; margin-bottom:60px;} #INQUIRY_STEP3 .detail_info {position:relative; font-size:0; padding-bottom:60px; border-bottom:1px solid #cccccc;} #INQUIRY_STEP3 .detail_info > div {display: inline-block; vertical-align: top;} #INQUIRY_STEP3 .detail_info .thumb {width:56%;} #INQUIRY_STEP3 .detail_info .thumb img {width:100%; max-width:230px;} #INQUIRY_STEP3 .detail_info .copy {width:44%; color:#222222;} #INQUIRY_STEP3 .detail_info .copy dl dt {font-size:26px; margin-bottom:30px;} #INQUIRY_STEP3 .detail_info .copy dl dd {font-size:16px; margin-bottom:8px; line-height:21px;} #INQUIRY_STEP3 .detail_info .copy dl dd span {display:inline-block; width:198px;vertical-align: top;padding-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP3 .detail_info.none .thumb{width: 45%;vertical-align: middle} #INQUIRY_STEP3 .detail_info.none .copy{font-size: 32px;width: 55%;vertical-align: middle} #INQUIRY_STEP3 .form_area{margin-top: 30px;} #INQUIRY_STEP3 .user_list_area{width: 100%;height: 100%;} #INQUIRY_STEP3 .user_list_area .user_list_area_info{position: absolute;right: 112px;top: 55px;font-size: 14px;color: #666} #INQUIRY_STEP3 .user_list_area ul li{font-size: 0;margin-top:28px} #INQUIRY_STEP3 .user_list_area ul li:first-child{margin-top: 0} #INQUIRY_STEP3 .user_list_area ul li>div{display: inline-block;vertical-align: top;height: 62px;line-height: 62px;} #INQUIRY_STEP3 .user_list_area ul li>div.input_tit{font-size: 18px;color: #222;width: 152px;} #INQUIRY_STEP3 .user_list_area ul li>div.input_box{width: calc(100% - 152px);padding-left: 38px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP3 .user_list_area ul li .input_tit span.required{font-size:18px;color: #e35b0a;padding-left: 4px;} #INQUIRY_STEP3 .user_list_area ul li .input_box input{font-size: 18px;width: 100%;height: 62px;line-height: 62px;color: #999;border-bottom: 1px solid #ccc;vertical-align: top; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* user name */ #INQUIRY_STEP3 .user_list_area ul li.name_area .input_box{font-size: 0} #INQUIRY_STEP3 .user_list_area ul li.name_area .input_box input{width: 48%;display: inline-block;vertical-align: top;} #INQUIRY_STEP3 .user_list_area ul li.name_area .input_box input.input_first_name{margin-right: 2%} #INQUIRY_STEP3 .user_list_area ul li.name_area .input_box input.input_surname{margin-left: 2%} /* user e-mail */ #INQUIRY_STEP3 .user_list_area ul li.mail_area .input_box{font-size: 0} #INQUIRY_STEP3 .user_list_area ul li.mail_area .input_box .cform{display: inline-block;vertical-align: top} #INQUIRY_STEP3 .user_list_area ul li.mail_area .input_box .input_mail_id{width: 40%} #INQUIRY_STEP3 .user_list_area ul li.mail_area .input_box span.cform{width: 6%;text-align: center;font-size: 20px;color: #222} #INQUIRY_STEP3 .user_list_area ul li.mail_area .input_box .input_mail_domain{width: 54%;} /* user contents */ #INQUIRY_STEP3 .user_list_area ul li.contents_area{margin-top: 42px} #INQUIRY_STEP3 .user_list_area ul li.contents_area .input_box{height: 260px} #INQUIRY_STEP3 .user_list_area ul li.contents_area .input_box textarea{width: 100%;height: 100%;overflow-y: auto;padding: 25px 32px;background: #f5f5f5;font-size: 16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* user upload file */ #INQUIRY_STEP3 .user_list_area ul li.file_area{margin-top: 42px;position: relative;} #INQUIRY_STEP3 .user_list_area ul li.file_area>div{vertical-align: top} #INQUIRY_STEP3 .user_list_area ul li.file_area .input_tit{line-height: 1} #INQUIRY_STEP3 .user_list_area ul li.file_area .input_box{height: 100%} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area {position: relative; font-size:0;line-height: 40px} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area #file {position: absolute;left: 0;top: 0;display: inline-block;width:90px;height:40px;cursor:pointer;-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area label {display:inline-block;width: 90px;height: 40px;line-height: 40px;font-size: 14px;text-align: center;margin: 0 auto;border: 1px solid #999;background-color: #fff;cursor:pointer;color:#222;vertical-align: top; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area #file:hover+label{background: #e35b0a;color: #fff;border-color:#e35b0a} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area .input_file_name {width: calc(100% - 140px);background: #fff; margin-left:20px;border:none; height:40px; font-size:14px;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area .btn_delete {position: absolute; right: 0; top: 50%; display: inline-block; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%); display:none;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area .btn_delete span {font-size:16px;color:#999;} #INQUIRY_STEP3 .user_list_area ul li.file_area p.caption {color: #666; margin-top:16px;font-size: 14px;line-height: 1} /* 셀렉트박스 */ #INQUIRY_STEP3 .fclear .gu_sort_area {float:right;margin-bottom:50px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next{text-align: center;margin:30px auto 160px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step2 .btn_next{margin:0;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .btn_next{margin:0;} #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2 .btn_next{position:fixed; left:0; right:0; padding:40px 0; margin:0; background-color:#fff; z-index:10; box-shadow:1px -1px 20px rgba(0,0,0,0.05); transition:bottom 0.35s ease-out; -webkit-transition:bottom 0.35s ease-out; } #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2 .btn_next.on{position:relative; box-shadow:none; margin-bottom:120px;} /*--- 제품 리스트 ---*/ #INQUIRY_STEP2 .product_list.product_container_outer{min-height:300px;} .product_container_outer{width:100%; overflow:hidden; padding-bottom:1px;} .product_container_outer .product_container{position:relative; float: left; width:33.33%; transition:border 0.5s; -webkit-transition:border 0.5s; } .product_container_outer .product_container:before{ content: ""; position: absolute; top: 0; left: 0; width: calc(100% + 1px); height: calc(100% + 1px); border: 1px solid #cccccc; box-sizing: border-box; } .product_container_outer .product_container:after{ content: ""; position: absolute; top: 0; left: 0; width: calc(100% - 3px); height: calc(100% - 3px); border: 2px solid #e35b0a; opacity: 0; transition: opacity 0.3s; pointer-events:none; } .product_container_outer .product_container:nth-of-type(3n):before{width:100%;} .product_container_outer .product_container:nth-of-type(3n):after{width:calc(100% - 4px);} .product_container_outer .product_container:hover {z-index: 9;} .product_container_outer .product_container a{position:relative; display:block; box-sizing:content-box; padding: 34px 30px 39px; max-width:370px; height:392px;} .product_container_outer .product_container.simple, .product_container_outer .product_container.simple a{max-width:370px; height:372px; box-sizing:border-box;} .product_container_outer .product_container a .item_select_check{position:absolute; top:34px; right:30px; width:30px; height:30px; border:solid 1px #222; border-radius:15px; z-index:1; background:url('../../../img/purchase-guide/product-compare/product_select_check.png') no-repeat 50% 50%; background-size:15px auto;} .product_container_outer .product_container a.on .item_select_check{background-color:#e35b0a; border-color:#e35b0a;} .product_container_outer .product_container a p{letter-spacing:-1px;} .product_container_outer .product_container a p.product_name{font-size:24px; line-height:30px; padding-bottom: 20px; height: 74px;} .product_container_outer .product_container:hover a p.product_name:after{margin-left:12px;} .product_container_outer .product_container a .product_img_box{height:240px; text-align:center; margin:0 auto;} .product_container_outer .product_container a .product_img_box > div{position:relative; height:100%; vertical-align: middle; text-align:center; transform:scale(0.9); -webkit-transform:scale(0.9); -ms-transform:scale(0.9); transition:transform 0.3s; -webkit-transition:transform 0.3s; } .product_container_outer .product_container a .product_img_box > div img{position:absolute; top:50%; left:50%; max-width:100%; max-height:100%; margin-left:0; transition:all 0.5s ease-out; -webkit-transition:all 0.5s ease-out; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); } .product_container_outer .product_container a .product_info{font-size:16px;} .product_container_outer .product_container a .product_info li p{float:right; line-height:24px;text-align: right; max-width: 60%; padding-right:2px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} .product_container_outer .product_container a .product_info li p.info_type{float:left; width:inherit; text-align:left; padding-bottom:6px;} .product_container_outer .product_container a .product_info li:last-child p.info_type{padding-bottom:0;} .product_container_outer .product_container a:before {content: '';position: absolute; width: calc(100% + 2px); height: calc(100% + 1px); left: -1px; top: 0; border: 2px solid #e35b0a; box-sizing: border-box; opacity: 0; transition:opacity 0.3s; -webkit-transition:opacity 0.3s; } .product_container_outer .product_container:hover a:before,.product_container_outer .product_container.on a:before{opacity:1;} /*--- product compare popup ---*/ /* Products - detail 페이지 - compare 팝업 */ .gu_popup .pop_inner .btn_unselected{width:16px; height:16px; top:20px; right:14px;} .gu_popup .pop_inner .btn_unselected:before{display:block; content:''; width:100%; height:100%; background:url('../../../img/common/ico_close_gray.png') 50% 50% no-repeat; background-size:contain;} .gu_popup .pop_inner .btn_unselected:before:hover{background-image:url('../../../img/common/ico_close_black.png')} .pop_cnt_inner .product_container{position:relative; float:left; width:calc(25% - 25px); min-width:calc(25% - 32px); min-height:1100px; margin-right:32px;} .pop_cnt_inner .product_container .compare_box{position:relative; background:#fff;} .pop_cnt_inner .product_container .compare_box.product{z-index:0;} .pop_cnt_inner .product_container .compare_box.product table tr td{line-height: 54px; padding-left:5px;} .pop_cnt_inner .product_container.on .compare_box.product{z-index:9;} .pop_cnt_inner .product_container .compare_box.select{position:absolute; top:0; left:0; width:100%; z-index:1;} .pop_cnt_inner .product_container:nth-child(4){margin-right:0;} .pop_cnt_inner .product_container .compare_box .compare_top{position:relative; height:240px; box-sizing:border-box;} .pop_cnt_inner .product_container .compare_box.select .compare_top{text-align: center; padding-top: 100px;} .pop_cnt_inner .product_container .compare_box.select .compare_top.select{padding-top:100px;} .pop_cnt_inner .product_container .compare_box table,.pop_cnt_inner .product_container .compare_box table tbody,.pop_cnt_inner .product_container .compare_box table tbody tr, .pop_cnt_inner .product_container .compare_box table tr, .pop_cnt_inner .product_container .compare_box table tr th, .pop_cnt_inner .product_container .compare_box table tr td{display:block; width:100%; box-sizing:border-box;} .pop_cnt_inner .product_container .compare_box table tbody tr td, .pop_cnt_inner .product_container .compare_box table tr td{height:54px;} .pop_cnt_inner .product_container .compare_box table tr th{min-height:42px; padding:0 0 20px 5px; border-bottom:solid 1px #999;} .pop_cnt_inner .product_container.text .compare_box table tr{height:54px;} .pop_cnt_inner .product_container.text .compare_box table tr:first-child{height:inherit;} .pop_cnt_inner .product_container.text .compare_box table tr td{display:table; padding:0 18px 0 0;} .pop_cnt_inner .product_container.text .compare_box table tr td span{display:table-cell; vertical-align:middle; padding-left:5px;} .pop_cnt_inner .product_container .compare_box table tr td{min-height:54px; border-bottom:solid 1px #ccc;} .pop_cnt_inner .product_container .compare_box.text .compare_top{font-size:40px; line-height:52px; letter-spacing: -1px;} .pop_cnt_inner .product_container.product .compare_box .compare_top > span{display:block; width:100%; height:100%; text-align:center; background:#fff; overflow:hidden;} .pop_cnt_inner .product_container.product .compare_box .compare_top > span img{display:block; position:relative; top:50%; width:auto; height:auto; max-width:100%; max-height:100%; margin:0 auto; transform:translateY(-50%); -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); } .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box{display:inline-block; position:relative; overflow:hidden; max-width:100%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box.on{overflow:inherit; width:100%; max-width:100%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select{display:inline-block; position:relative; width:230px; max-width:100%; font-size:16px; text-align:left; padding:16px 20px 18px; border:solid 1px #222; box-sizing:border-box; transition:all 0.3s; -webkit-transition:all 0.3s; } .gu_popup_bottom{clear:both; text-align:center; padding:60px 0 128px;} .gu_popup_bottom a{display:inline-block; min-width:160px; font-size:16px; text-align:center; padding:13px 0; border:solid 1px #222; vertical-align:bottom; transition:all 0.3s; -webkit-transition:all 0.3s; } .gu_popup_bottom a:hover{background-color:#e35b0a; border-color:#e35b0a; color:#fff;} .container.subNavi_products_excavators .pop_inner.active .ico_drag{position: absolute; top: 50%; left: 50%; z-index: 99999; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .gu_product_top > div.product_btn_container a, .gu_sort_area > div, .gu_sort_name a{vertical-align:top;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area{float:none; width:100%; max-width:230px; margin:0 auto;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name{width:100%; margin:0 auto;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name:before{right:24px} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a:before{display:none;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a{display:inline-block; position:relative; width:100%; max-width:90%; font-size:16px; color:#222; text-align:left; padding:16px 20px 18px; border:solid 1px #222; box-sizing:border-box; transition:all 0.3s; -webkit-transition:all 0.3s; } .pop_cnt_inner .gu_sort_area .gu_sort_name a:hover:after{width:0;} .no-mobile .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a:hover:after,.no-mobile .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a:after{width:0;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_selectbox{max-height:inherit;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_selectbox.on{width:100%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_selectbox .gu_selectbox_inner{width:100%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_custom_scroll .custom_scroll_content{ text-align:left;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_custom_scroll > a{text-align:left; position:relative; padding-left:0; margin-left:17px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_custom_scroll > a:before{display:block; content:''; position:absolute; width:64px; height:1px; background:#fff; bottom:4px; left:0;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select:hover{color:#e35b0a; border:solid 1px #e35b0a;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select:after{display:inline-block; content:''; position: absolute;top: 50%; right: 20px; width:12px; height:7px; margin-bottom:2px; background:url("../../../img/products/detail/btn_down_black.png") no-repeat; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); } .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select:hover:after{background-image:url("../../../img/products/detail/btn_down_orange.png");} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box.on .product_select:after{background-image:url("../../../img/products/detail/btn_up_black.png");} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box.on .product_select:hover:after{background-image:url("../../../img/products/detail/btn_up_orange.png");} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown{position: absolute; box-sizing: border-box; width: 100%; text-align: left; padding: 0 20px 24px; border: solid 1px #222; border-top: 0; background: #fff;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box.on .select_dropdown{top:57px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown .dropdown_list p{font-size: 16px; padding: 24px 0 14px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown .dropdown_list ul li a{display: block; padding: 10px 0;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown .dropdown_list ul li a:hover{color:#888;} .pop_cnt_inner .product_container .gu_sort_area .gu_selectbox{height:inherit;} /* Products - detail 페이지 - compare 팝업 - 스크롤바 */ .pop_cnt_inner::-webkit-scrollbar{width:0;height:5px;} .pop_cnt_inner::-webkit-scrollbar-track{background-color: transparent;} .pop_cnt_inner::-webkit-scrollbar-track-piece{background-color: transparent;} .pop_cnt_inner::-webkit-scrollbar-thumb{background-color: transparent;border-bottom:16px solid rgba(255,255,255,0.5);} .pop_cnt_inner::-webkit-scrollbar-thumb{background-color: transparent;border-bottom:16px solid rgba(0,0,0,0.2);} .pop_cnt_inner::-webkit-scrollbar-button:start{background-color: transparent;} .pop_cnt_inner::-webkit-scrollbar-button:end{background-color: transparent;} .pop_cnt_inner{ /* ie */ scrollbar-face-color: #dfdfdf; scrollbar-base-color: #fff; scrollbar-track-color: #fff; scrollbar-arrow-color: #fff; scrollbar-highlight-color: #fff; scrollbar-3dlight-color: #fff; scrollbar-shadow-color: #fff; scrollbar-darkshadow-color: #fff; } /* print */ .gu_popup .pop_inner.print .pop_contents{padding:80px 0 50px;} .pop_inner.print .pop_cnt_inner {white-space:normal;font-size:9px; padding:0;} .pop_inner.print .pop_cnt_inner .product_container {min-width:calc(25% - 13px);max-width:calc(25% - 13px);margin-right:10px;width:auto;} .pop_inner.print.grid3 .pop_cnt_inner .product_container {min-width:calc(33.33% - 12px);max-width:calc(33.33% - 12px);} .pop_inner.print.grid2 .pop_cnt_inner .product_container {min-width:calc(50% - 12px);max-width:calc(50% - 12px);} .pop_inner.print .pop_cnt_inner .product_container:first-child{padding-left:0;} .pop_inner.print .btn_close_pop {display:none;} .pop_inner.print .gu_popup_bottom a {display:none;} .pop_inner.print .pop_cnt_inner .product_container .compare_box.text .compare_top {font-size:14px; padding-bottom:0;} .pop_inner.print .pop_cnt_inner .product_container .compare_box .compare_top {height:120px;padding-bottom:0; margin-bottom:20px;} .pop_inner.print .pop_cnt_inner .product_container .compare_box.select .compare_top{padding:58px 0 50px;} .pop_inner.print .pop_cnt_inner .product_container.text .compare_box table tr {height:25px;} .pop_inner.print .pop_cnt_inner .product_container.text .compare_box table tr:first-child {height:inherit} .pop_inner.print .pop_cnt_inner .product_container .compare_box table tr th {min-height:24px;padding:0;} .pop_inner.print .pop_cnt_inner .product_container .compare_box table tbody tr td, .pop_inner.print .pop_cnt_inner .product_container .compare_box table tr td {height:25px;min-height:25px;padding:8px 0 0 0;} .pop_inner.print .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a{width:70%; font-size:12px; padding:10px 20px 12px;} .pop_inner.print .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name:before{right:48px;} .pop_inner.print .pop_cnt_inner .product_container .gu_sort_area .gu_sort_name:before{bottom:12px;} .gu_ico_drag{display:none;} /* ================================== Laptop css ================================== */ @media all and (max-width:1280px){ .pop_cnt_inner .product_container .compare_box .compare_top{height:255px; padding-bottom:0;} .pop_cnt_inner .product_container .compare_box.select .compare_top{height:inherit; padding:113px 0 90px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box{display:block;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select{width:90%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown{width:90%; left:5%;} } /* ================================== Tablet css ================================== */ @media all and (max-width: 1080px) { #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list{padding-bottom:5px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span{font-size: 30px;line-height: 30px} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span.comment{font-size:13px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next{font-size: 18px} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next{margin: 50px auto 120px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next .btn_submit{ font-size:13px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next .btn_submit span{ padding:0 12px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a:hover:after {opacity:0;} #PURCHASE-GUIDE_PRODUCT-COMPARE .product_list a.on:after {opacity:1;} #PURCHASE-GUIDE_PRODUCT-COMPARE .contents_inner{padding-top:120px;} .btn_next .gu_btn{width:130px; min-width:inherit; padding:9px 0;} #INQUIRY_STEP1 .product_list{padding-bottom:0;} #INQUIRY_STEP1 .product_list a.list_box{height: 250px;} #INQUIRY_STEP1 .product_list a.list_box .thumb {transform:scale(0.64);} #INQUIRY_STEP1 .product_list a.list_box.on .thumb {transform:scale(0.8);} #INQUIRY_STEP1 .product_list a.list_box .box_inner .list_inner{padding-top: 0} #INQUIRY_STEP1 .product_list a.list_box .copy{height: 50px} #INQUIRY_STEP1 .product_list a.list_box .copy span{font-size: 16px;line-height: 20px;} #INQUIRY_STEP1 .product_list a.list_box .copy span br{display: block} #INQUIRY_STEP1 .product_list a.list_box:hover .thumb .img_area img.off{opacity: 1} #INQUIRY_STEP1 .product_list a.list_box:hover .thumb .img_area img.on{opacity: 0} #INQUIRY_STEP1 .product_list a.list_box:hover .copy span {color: #666} #INQUIRY_STEP1 .product_list a.list_box.on .thumb .img_area img.off{opacity: 0} #INQUIRY_STEP1 .product_list a.list_box.on .thumb .img_area img.on{opacity: 1} #INQUIRY_STEP1 .product_list a.list_box.on .copy span {color: #222} #INQUIRY_STEP1 .category .category_inner{padding: 24px 16px 20px } #INQUIRY_STEP1 .category .category_copy{font-size: 12px;} #INQUIRY_STEP1 .category .category_list a{font-size: 14px;padding: 5px 10px 8px} #INQUIRY_STEP2 .product_list a .thumb{padding: 20px 20px 0 } #INQUIRY_STEP2 .product_list a .thumb img{width: 100%} #INQUIRY_STEP2 .product_list a .copy{height: 58px } #INQUIRY_STEP2 .product_list a .copy span{font-size:14px;line-height: 18px} #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2 .btn_next{padding:45px 0 35px;} #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2 .btn_next.on{margin-bottom:85px;} #INQUIRY_STEP3 .input_area{padding: 75px 56px 58px} #INQUIRY_STEP3 .detail_info .thumb{width: 45%} #INQUIRY_STEP3 .detail_info .copy{width: 55%} #INQUIRY_STEP3 .detail_info .thumb img{max-width: 240px} #INQUIRY_STEP3 .detail_info.none .copy{font-size: 26px} .gu_popup_bottom a{font-size:13px; min-width:130px; padding:9px 0;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li{margin-top: 30px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div{height: 50px;line-height: 50px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li .input_box input{height: 50px;line-height: 50px;font-size: 15px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div.input_tit{font-size: 15px;width: 128px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div.input_box{width: calc(100% - 128px)} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.name_area .input_box input.input_first_name{width: 44%;margin-right: 2%} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.name_area .input_box input.input_surname{width: 52%;margin-left: 2%} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.mail_area .input_box span.cform{font-size: 14px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.contents_area .input_box textarea{padding: 25px 20px;font-size: 13px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area #file{width: 112px;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area #file:hover+label{background-color: #fff;color: #222;border-color:#999} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area label{width: 112px;font-size: 12px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area .input_file_name{width: calc(100% - 200px); white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden;} #INQUIRY_STEP3 .user_list_area ul li.file_area .upload_area .btn_delete{height: 40px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area p.caption{font-size: 12px;margin-top: 10px} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_submit .gu_btn_arrow_right{opacity: 1} /*--- 제품 리스트 ---*/ .product_container_outer .product_container{width:50%;} .product_container_outer .product_container a p.product_name {font-size: 20px; padding-bottom: 25px;} .product_container_outer .product_container a{display:block; padding: 30px 26px; max-width:100%; max-height:100%;} .product_container_outer .product_container.simple, .product_container_outer .product_container.simple a{max-width:100%; max-height:100%;} .product_container_outer .product_container:nth-of-type(2n):after{width:calc(100% - 4px);} .product_container_outer .product_container:nth-of-type(2n):before{width:100%;} .product_container_outer .product_container:nth-of-type(3n):after{width:calc(100% - 3px);} .product_container_outer .product_container:nth-of-type(3n):before{width:calc(100% + 1px); } .product_container_outer .product_container:nth-of-type(6n):before{width:100%;} .product_container_outer .product_container:hover a .product_img_box > div{transform:scale(0.9);} .product_container_outer .product_container:hover a:before{opacity:0;} .product_container_outer .product_container.on a:before{opacity:1;} .product_container_outer .product_container a .item_select_check{width:24px; height:24px; background-size:12px auto;} .product_container_outer .product_container:hover a p.product_name:after{margin-left:8px;} .product_container_outer .product_container .product_info{font-size:13px;} .product_container_outer .product_container a .product_img_box > div img{ transform:scale(1.1) translate(-50%, -50%); -webkit-transform:scale(1.1) translate(-50%, -50%); -ms-transform:scale(1.1) translate(-50%, -50%); } .product_container_outer .product_container a .product_info li p{max-width:70%;} /*--- product compare popup ---*/ .gu_popup{-webkit-overflow-scrolling: touch;} .gu_popup .pop_contents{padding:120px 0;} .pop_cnt_inner{position:relative; padding:0 50px;} .pop_cnt_inner{overflow-x:scroll; width:auto; white-space:nowrap;} .pop_cnt_inner .product_container{float:none; display:inline-block; min-width:258px; min-height:1000px; vertical-align:top;} .pop_cnt_inner .product_container:nth-child(4){margin-right:50px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box{display:block;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select{width:90%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown{width:90%; left:5%;} .gu_popup .pop_inner .btn_unselected{width:20px; height:20px;} .gu_popup_bottom{position:relative;left:50%; z-index:9999; padding-bottom:0; transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); } .mobile .pop_cnt_inner::-webkit-scrollbar{height:0;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name:before{right:28px;} .ico_drag img {margin-top:436px;} .gu_ico_drag{display:block;} } /* ================================== Mobile css ================================== */ @media all and (max-width: 766px){ .container{min-height:inherit;} #PURCHASE-GUIDE_PRODUCT-COMPARE .contents_inner{padding-top: 60px} #INQUIRY_STEP1 .category.isW{display: none} #INQUIRY_STEP1 .category.isM{display: block} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span{font-size: 24px;line-height: 24px;width: 100%} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span.comment{position:absolute; top:20px; left:0; padding:20px 0 0; z-index:1;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next{font-size: 16px;width: 100%;margin-top: 15px;text-align: right} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next:after{width: 8px;height: 8px} #PURCHASE-GUIDE_PRODUCT-COMPARE .steps{margin-top: 40px} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next{margin: 50px auto 60px} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next .btn_submit{ font-size:12px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .btn_next .btn_submit span{ padding:0 10px;} #INQUIRY_STEP1 .product_list a.list_box{width: 50%;height: 100%} #INQUIRY_STEP1 .product_list a.list_box .box_inner .list_inner{padding: 20px 0} #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(3n):before{width: calc(100% + 1px)} #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(3n):after{width: calc(100% - 3px)} #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(2n):before{width: 100%} #INQUIRY_STEP1 .product_list a.list_box:nth-of-type(2n):after{width: calc(100% - 4px)} #INQUIRY_STEP1 .product_list a.list_box .thumb {transform:scale(0.9);} #INQUIRY_STEP1 .product_list a.list_box.on .thumb {transform:scale(1);} #INQUIRY_STEP1 .product_list a.list_box .thumb>img{width: 100%;padding: 0 25px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP1 .product_list a.list_box .copy{padding: 0 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #INQUIRY_STEP1 .product_list a.list_box .copy span{font-size: 14px;line-height: 18px} #INQUIRY_STEP1 .category .category_inner{padding: 22px 15px 20px} #INQUIRY_STEP1 .category .category_copy{font-size: 11px;margin-bottom: 7px} #INQUIRY_STEP1 .category .category_list a{margin-top: 8px;margin-right: 8px} #INQUIRY_STEP1 .category.on{height: 145px} #INQUIRY_STEP1 .category.category2.on{height: 103px} #INQUIRY_STEP2 .product_list{padding-bottom: 0} #INQUIRY_STEP2 .product_list a:nth-of-type(3n):before{width: calc(100% + 1px)} #INQUIRY_STEP2 .product_list a:nth-of-type(3n):after{width: calc(100% - 3px)} #INQUIRY_STEP2 .product_list a:nth-of-type(4n):before{width: calc(100% + 1px)} #INQUIRY_STEP2 .product_list a:nth-of-type(4n):after{width: calc(100% - 3px)} #INQUIRY_STEP2 .product_list a:nth-of-type(2n):before{width: 100%} #INQUIRY_STEP2 .product_list a:nth-of-type(2n):after{width: calc(100% - 4px)} #INQUIRY_STEP2 .product_list a .thumb{padding: 20px 10px 0} #INQUIRY_STEP2 .product_list a .copy{height: 48px} #PURCHASE-GUIDE_PRODUCT-COMPARE #INQUIRY_STEP2 .btn_next.on{margin-top:5px; margin-bottom:25px;} #INQUIRY_STEP3 .input_area{padding: 44px 20px 50px} #INQUIRY_STEP3 .detail_info{padding-bottom: 40px} #INQUIRY_STEP3 .detail_info .thumb{float: none;width: 100%;text-align: center} #INQUIRY_STEP3 .detail_info .thumb img{max-width: 210px} #INQUIRY_STEP3 .detail_info .copy{float: none;width: 100%;margin-top: 15px} #INQUIRY_STEP3 .detail_info.none .thumb{width: 100%} #INQUIRY_STEP3 .detail_info.none .copy{font-size: 21px;line-height: 28px;width: 100%} #INQUIRY_STEP3 .detail_info .copy dl dd{font-size: 14px;line-height: 22px;margin-bottom: 4px} #INQUIRY_STEP3 .detail_info .copy dl dd span{width: 60%} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li{margin-top: 32px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div{display: block;width: 100%;height: 42px;line-height: 42px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div.input_tit{height: unset;line-height: 1;width: 100%;margin-bottom: 3px;font-size: 14px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li>div.input_box{width: 100%;margin:0;padding: 0;font-size: 14px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li .input_box input{height: 42px;line-height: 42px;font-size: 14px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.name_area .input_box input.input_first_name{width: 48%;margin-right: 2%} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.name_area .input_box input.input_surname{width: 48%;margin-left: 2%} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.contents_area .input_box{margin-top: 20px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .input_box{margin-top: 20px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area #file{width: 90px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area label{width: 90px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area .input_file_name{width: calc(100% - 160px);margin-left: 10px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area .btn_delete{height: 40px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area .upload_area .btn_delete span{font-size: 13px} #PURCHASE-GUIDE_PRODUCT-COMPARE .user_list_area ul li.file_area p.caption{margin-top: 20px;line-height: 18px} .gu_sort_area .gu_sort_name{width: 100%} .gu_sort_area .gu_selectbox .gu_selectbox_inner a{font-size: 14px} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_sort_area .gu_selectbox{min-width: 100%} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_contents{width:100%;padding:0;min-height: 100%} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_contents .pop_cnt_tit{font-size: 18px;line-height: 21px} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_contents .pop_cnt_desc{font-size: 13px;line-height: 19px} #PURCHASE-GUIDE_PRODUCT-COMPARE .gu_popup .pop_contents .popup_bottom{margin-top: 27px;} /*--- 제품 리스트 ---*/ .product_container_outer .product_container{float:none; width:100%;} .product_container_outer .product_container:nth-of-type(2n):after{width:100%;} .product_container_outer .product_container:nth-of-type(3n):after{width:100%;} .product_container_outer .product_container:nth-of-type(3n):before{width:100%;} .product_container_outer .product_container:last-child:before{height:100%;} .product_container_outer .product_container:before{width:100%;} .product_container_outer .product_container a p.product_name {font-size: 22px; padding-bottom:4px; } .product_container_outer .product_container.simple, .product_container_outer .product_container.simple a {max-height: 335px;} .product_container_outer .product_container .product_info{font-size:16px;} .product_container_outer .product_container a{height:auto;} .select_title{font-size:12px; margin-bottom:20px;} .nice-select{margin-bottom:16px;} .product_container_outer .product_container a .product_info li p{max-width:inherit;} .btn_next .gu_btn{padding:8px 0;} /*--- product compare popup ---*/ .gu_popup .pop_contents{padding:0;} .pop_cnt_inner{padding:60px 0;} .pop_cnt_inner .product_container{min-height:724px; min-width:184px; margin-right:11px;} .pop_cnt_inner .product_container:first-child{padding-left:20px;} .pop_cnt_inner .product_container .compare_box .compare_top{height:140px; font-size:24px; line-height:32px;} .pop_cnt_inner .product_container .compare_box.text .compare_top{font-size:24px;} .pop_cnt_inner .product_container .compare_box.select .compare_top{height:140px; padding:52px 0 20px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select{width:80%; padding:6px 20px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .product_select, .pop_cnt_inner .product_container .compare_box table tr th, .pop_cnt_inner .product_container .compare_box table tr td{font-size:12px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box .select_dropdown{width:80%; left:10%;} .pop_cnt_inner .product_container .compare_box.select .compare_top .select_box.on .select_dropdown{top:0;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name:before{bottom:50%; transform: translateY(50%); -webkit-transform: translateY(50%); -ms-transform: translateY(50%); } .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_sort_area .gu_sort_name a{font-size:12px; padding:6px 20px 8px;} .pop_cnt_inner .product_container .compare_box table tr th{min-height:56px; padding:20px 0 20px 5px;} .pop_cnt_inner .product_container .compare_box table tr td{min-height:41px;} .pop_cnt_inner .product_container .compare_box.product table tr td{line-height:41px;} .pop_cnt_inner .product_container .compare_box table tbody tr td, .pop_cnt_inner .product_container .compare_box table tr td{height:41px;} .pop_cnt_inner .product_container.text .compare_box table tr{height:41px;} .gu_popup_bottom{bottom:60px; padding-top:40px;} .gu_popup_bottom a{padding:8px 0; font-size:12px;} .ico_drag img {margin-top:315px;} .pop_cnt_inner .product_container .compare_box.select .compare_top .gu_custom_scroll > a:before{width:54px;} } /* ================================== Mobile css ================================== */ @media all and (max-width: 374px){ .product_container_outer .product_container a .product_info li p{max-width:60%;} .btn_next .gu_btn_arrow_left,.btn_next .gu_btn{display:block; width:48%;} .btn_next .gu_btn.gu_btn_arrow_left{float:left;} .btn_next .gu_btn{float:right; padding:14px 0;} } @media all and (max-width: 355px){ #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator span{font-size: 21px;} #PURCHASE-GUIDE_PRODUCT-COMPARE .step_indicator .next{font-size: 15px} }