/************************************************************************************************************************************************ *************************************************************************************************************************************************/ main section.brand_section .visual .visual_inner {width:100%;} /* BIKE - VISUAL COPY */ .visual_copy {position:absolute;bottom:-225px;right:50px;opacity:0;} .visual_copy .visual_copy_inner {position:relative;background:url(/frontend/assets/images/cont/bike_visual_copy_bg.png) repeat;color:#ffcc00;padding:55px;width:506px;transition:all 0.5s;} .visual_copy .visual_copy_inner p {color:#fff;--background:#f00;} .visual_copy .visual_copy_inner .txt {font-size:48px; letter-spacing:4px;} .visual_copy .visual_copy_inner .txt.t1 {margin-bottom:30px;font-weight:bold;} .visual_copy .visual_copy_inner .txt.t2 {margin-bottom:0px;} .visual_copy .visual_copy_inner .txt.t2.mb30 {margin-bottom:30px !important;} .visual_copy .visual_copy_inner .txt.t3 {margin-bottom:0px;--color:#fbf523;} .visual_copy .visual_copy_inner .txt2 {line-height:24px;color:#fff;--font-family:"NotoR", dotum, arial, san-serif;--text-transform:uppercase;} .visual_copy .visual_copy_inner span.line {width:20px;height:1px;background-color:#fff;display:inline-block;margin-top:55px;margin-bottom:30px;} .visual_copy .visual_copy_inner span.bar {width:20px; height:1px; background:#cccccc; display:block; margin-bottom:20px;margin-top:110px;} .visual_copy .visual_copy_inner .txt span {display: inline-block;float: left;} .visual_copy .visual_copy_inner .txt:after {content:"";display:block;clear:both;} .visual_copy .visual_copy_inner .slash {display:block;position:absolute;top:-10px;right:50px;width:17px;height:22px;margin:0;background:url(/frontend/assets/images/icons/slash.png) 0 0 no-repeat;} main section.brand_section .visual_title .text_inner {font-family:"NotoR", dotum, arial, san-serif;} /* BIKE - VISUAL TITLE */ .visual_title {position:absolute;top:110px;left:50px;;font-weight:bold;} .visual_title h2 {font-size:36px;color:#000;font-weight:bold;opacity:0;font-family:"NotoB", dotum, arial, san-serif;display:none;} .visual_title .line {display:inline-block;width:20px;height:1px;background:#cccccc;margin:30px 0 60px 0;opacity:0;display:none;} .visual_title ul {opacity:0;} .visual_title p {opacity:0;} .visual_title .txt {font-weight:normal;line-height:20px;font-size:14px;color:#7b7a7a;width:242px;margin-top:27px;} .visual_title .txt.colorFFF {color:#fff;} .visual_title h2.white {color:#fff !important;} .visual_title h2.black {color:#000 !important;} @media all and (min-width: 100px) and (max-width: 640px) { main section.brand_section .visual .visual_cont {min-height:460px;} body.main main section.brand_section .visual .visual_cont {min-height:0px;} .visual_copy {bottom:17px;position:relative;right:initial;} .visual_copy .visual_copy_inner {margin:-150px auto;padding:15px 25px;width:200px;transition:all 0.5s;} .visual_copy .visual_copy_inner .txt.t1 {margin:0;letter-spacing:6px;font-size:24px;} .visual_copy .visual_copy_inner .txt.t2 {margin:0;letter-spacing:24px;font-size:24px;} .visual_copy .visual_copy_inner .txt.t3 {margin:0;letter-spacing:15px;font-size:24px;} .visual_copy .visual_copy_inner .txt {margin-bottom:25px;} .visual_copy .visual_copy_inner span {margin:3px 0 18px 0;} .visual_copy .visual_copy_inner span.line{width:10px;margin:37px 0 12px;} .visual_copy .visual_copy_inner .txt2 {margin:0 0 22px;font-size:12px;line-height:18px;word-spacing:2.4px;} .visual_copy .visual_copy_inner .slash {width:17px;height:22px;top:-12px !important;right:25px;background-size:8px 11px;} .story .visual_copy .visual_copy_inner .slash {top:-17px !important;} .visual_inner {margin-bottom:100px;} .visual_title {left:25px;top:60px;} .visual_title h2 {display:none;} .visual_title .line {margin:0px 0 20px 0;display:none;} .visual_title .txt {font-size:12px;} .visual_title .text_inner {font-size:18px;height:30px;line-height:30px;transition:all 0.5s;} .bike.lineup .lineup_content ul li p.best span {left:60% !important;} } @media all and (min-width: 640px) and (max-width: 1024px) { main section.brand_section .visual .visual_cont {min-height:600px;} body.main main section.brand_section .visual .visual_cont {min-height:0px;} .visual_copy {--margin-top:120px;position:relative;right:initial;--bottom:initial;} .visual_copy .visual_copy_inner {margin:0px auto;padding:50px;width:400px;transition:all 0.5s;} .visual_copy .visual_copy_inner .txt.t1 {letter-spacing:13px;} .visual_copy .visual_copy_inner .txt.t2 {letter-spacing:49px;} .visual_copy .visual_copy_inner .txt.t3 {letter-spacing:31px;} .visual_copy {bottom:240px;position:relative;right:initial;} .visual_inner {margin-bottom:-300px;} .visual_title {position:absolute;left:50px;margin-top:60px;top:initial;} .visual_title h2 {display:none;} .visual_title {top:0px;} .visual_title .line {margin:20px 0 20px 0;display:none;} .visual_title .text_inner {font-size:30px;height:50px;line-height:50px;transition:all 0.5s;} .bike.lineup .lineup_content ul li p.best span {left:60% !important;} } @media all and (min-width: 1025px) and (max-width: 1279px) { .visual_copy .visual_copy_inner {padding:50px;transition:all 0.5s;} .visual_copy .visual_copy_inner {margin:0 auto;padding:50px;width:398px;} .visual_copy .visual_copy_inner .txt.t1 {letter-spacing:13px;} .visual_copy .visual_copy_inner .txt.t2 {letter-spacing:49px;} .visual_copy .visual_copy_inner .txt.t3 {letter-spacing:31px;} .visual_copy {bottom:-148px;} .visual_title .line {margin:30px 0 30px 0;} .visual_title .text_inner {font-size:30px;height:55px;line-height:50px;transition:all 0.5s;} } @media all and (min-width: 1280px) and (max-width: 1620px) { .visual_title .line {margin:30px 0 30px 0;} .visual_title .text_inner {font-size:48px;height:55px;line-height:64px;transition:all 0.5s;} } @media all and (min-width: 1700px) and (max-width: 3000px) { .visual_title {left:50%;margin-left:-794px;} .visual_title .text_inner {font-size:48px;height:55px;line-height:64px;transition:all 0.5s;} } /* box long letter spacing txt */ .visual_copy.mountain .visual_copy_inner .txt.t1 {transition:all 0.5s;width:106%;} .visual_copy.mountain .visual_copy_inner .txt.t1 span {width: 12.5%;margin-right: 0%;} .visual_copy.mountain .visual_copy_inner .txt.t2 {transition:all 0.5s;width:125%;} .visual_copy.mountain .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.hybrid .visual_copy_inner .txt.t1 {transition:all 0.5s;width:113%;} .visual_copy.hybrid .visual_copy_inner .txt.t1 span {width: 16.6%;margin-right: 0%;} .visual_copy.hybrid .visual_copy_inner .txt.t2 {transition:all 0.5s;width:125%;} .visual_copy.hybrid .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.foldingMini .visual_copy_inner .txt.t1 {transition:all 0.5s;width:113%;} .visual_copy.foldingMini .visual_copy_inner .txt.t1 span {width: 14.2%;margin-right: 0%;} .visual_copy.foldingMini .visual_copy_inner .txt.t2 {transition:all 0.5s;width:109%;} .visual_copy.foldingMini .visual_copy_inner .txt.t2 span {width: 11.1%;margin-right: 0%;} .visual_copy.road .visual_copy_inner .txt.t1 {width:125%;;transition:all 0.5s;} .visual_copy.road .visual_copy_inner .txt.t1 span {width: 25%;margin-right: 0%;} .visual_copy.road .visual_copy_inner .txt.t2 {width:125%;;transition:all 0.5s;} .visual_copy.road .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .company_main .visual_copy.itd .visual_copy_inner .txt.t1 {transition:all 0.5s;width:111%;} .company_main .visual_copy.itd .visual_copy_inner .txt.t1 span {width: 14.2%;margin-right: 0%;} .company_main .visual_copy.itd .visual_copy_inner .txt.t2 {transition:all 0.5s;width:106%;} .company_main .visual_copy.itd .visual_copy_inner .txt.t2 span {width: 11.1%;margin-right: 0%;} .visual_copy.creative .visual_copy_inner .txt.t1 {width:109%;;transition:all 0.5s;} .visual_copy.creative .visual_copy_inner .txt.t1 span {width: 14.2%;margin-right: 0%;} .visual_copy.creative .visual_copy_inner .txt.t2 {width:108%;;transition:all 0.5s;} .visual_copy.creative .visual_copy_inner .txt.t2 span {width: 12.5%;margin-right: 0%;} .visual_copy.innovation .visual_copy_inner .txt.t1 {width:109%;;transition:all 0.5s;position:relative;} .visual_copy.innovation .visual_copy_inner .txt.t1 span {letter-spacing:4px;} .visual_copy.innovation .visual_copy_inner .txt.t1 span.st1 {width: 40%;margin-right: 6%;} .visual_copy.innovation .visual_copy_inner .txt.t1 span.st2 {width: 40%;margin-right: 0%;} .visual_copy.innovation .visual_copy_inner .txt.t2 {width:109%;;transition:all 0.5s;} .visual_copy.innovation .visual_copy_inner .txt.t2 span {width: 14.2%;margin-right: 0%;} .visual_copy.fixie .visual_copy_inner .txt.t1 {width:117%;;transition:all 0.5s;} .visual_copy.fixie .visual_copy_inner .txt.t1 span {width: 20%;margin-right: 0%;} .visual_copy.fixie .visual_copy_inner .txt.t2 {width:125%;;transition:all 0.5s;} .visual_copy.fixie .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.diamondback .visual_copy_inner .txt.t1 {width:107%;;transition:all 0.5s;} .visual_copy.diamondback .visual_copy_inner .txt.t1 span {width: 11.1%;margin-right: 0%;} .visual_copy.diamondback .visual_copy_inner .txt.t2 {width:113%;;transition:all 0.5s;} .visual_copy.diamondback .visual_copy_inner .txt.t2 span {width: 16.6%;margin-right: 0%;} .visual_copy.raleigh .visual_copy_inner .txt.t1 {width:110%;transition:all 0.5s;} .visual_copy.raleigh .visual_copy_inner .txt.t1 span {width: 14.2%;margin-right: 0%;} .visual_copy.raleigh .visual_copy_inner .txt.t2 {width:110%;transition:all 0.5s;} .visual_copy.raleigh .visual_copy_inner .txt.t2 span {width: 14.2%;margin-right: 0%;} .visual_copy.benetton .visual_copy_inner .txt.t1 {width:108%;transition:all 0.5s;} .visual_copy.benetton .visual_copy_inner .txt.t1 span {width: 12.5%;margin-right: 0%;} .visual_copy.benetton .visual_copy_inner .txt.t2 {width:104%;transition:all 0.5s;} .visual_copy.benetton .visual_copy_inner .txt.t2 span {width: 9%;margin-right: 0%;} .visual_copy.chevrolet .visual_copy_inner .txt.t1 {width:125%;transition:all 0.5s;} .visual_copy.chevrolet .visual_copy_inner .txt.t1 span {width: 25%;margin-right: 0%;} .visual_copy.chevrolet .visual_copy_inner .txt.t2 {width:125%;transition:all 0.5s;} .visual_copy.chevrolet .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.chevrolet .visual_copy_inner .txt.t3 {width:104%;transition:all 0.5s;} .visual_copy.chevrolet .visual_copy_inner .txt.t3 span {width: 10%;margin-right: 0%;} .visual_copy.roadmaster .visual_copy_inner .txt.t1 {width:117%;transition:all 0.5s;} .visual_copy.roadmaster .visual_copy_inner .txt.t1 span {width: 20%;margin-right: 0%;} .visual_copy.roadmaster .visual_copy_inner .txt.t2 {width:141%;transition:all 0.5s;} .visual_copy.roadmaster .visual_copy_inner .txt.t2 span {width: 33.3%;margin-right: 0%;} .visual_copy.roadmaster .visual_copy_inner .txt.t3 {width:117%;transition:all 0.5s;} .visual_copy.roadmaster .visual_copy_inner .txt.t3 span {width: 20%;margin-right: 0%;} .visual_copy.corex .visual_copy_inner .txt.t1 {width:110%;transition:all 0.5s;} .visual_copy.corex .visual_copy_inner .txt.t1 span {width: 14.2%;margin-right: 0%;} .visual_copy.corex .visual_copy_inner .txt.t2 {width:141%;transition:all 0.5s;} .visual_copy.corex .visual_copy_inner .txt.t2 span {width: 33.3%;margin-right: 0%;} .visual_copy.corex .visual_copy_inner .txt.t3 {width:108%;transition:all 0.5s;} .visual_copy.corex .visual_copy_inner .txt.t3 span {width: 12.5%;margin-right: 0%;} .visual_copy.alton .visual_copy_inner .txt.t1 {width:104%;transition:all 0.5s;} .visual_copy.alton .visual_copy_inner .txt.t1 span {width: 10%;margin-right: 0%;} .visual_copy.alton .visual_copy_inner .txt.t2 {width:113%;transition:all 0.5s;} .visual_copy.alton .visual_copy_inner .txt.t2 span {width: 16.6%;margin-right: 0%;} .visual_copy.alton .visual_copy_inner .txt.t3 {width:110%;transition:all 0.5s;} .visual_copy.alton .visual_copy_inner .txt.t3 span {width: 14.2%;margin-right: 0%;} .visual_copy.child .visual_copy_inner .txt.t1 {width:117%;transition:all 0.5s;} .visual_copy.child .visual_copy_inner .txt.t1 span {width: 20%;margin-right: 0%;} .visual_copy.child .visual_copy_inner .txt.t2 {width:125%;transition:all 0.5s;} .visual_copy.child .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.others .visual_copy_inner .txt.t1 {width:113%;transition:all 0.5s;} .visual_copy.others .visual_copy_inner .txt.t1 span {width: 16.6%;margin-right: 0%;} .visual_copy.others .visual_copy_inner .txt.t2 {width:125%;transition:all 0.5s;} .visual_copy.others .visual_copy_inner .txt.t2 span {width: 25%;margin-right: 0%;} .visual_copy.ditto .visual_copy_inner .txt.t1 {width:125%;transition:all 0.5s;} .visual_copy.ditto .visual_copy_inner .txt.t1 span {width: 25%;margin-right: 0%;} .visual_copy.ditto .visual_copy_inner .txt.t2 {width:125%;transition:all 0.5s;} .visual_copy.ditto .visual_copy_inner .txt.t2 span {width: 100%;margin-right: 0%;} .visual_copy.ditto .visual_copy_inner .txt.t3 {width:141%;transition:all 0.5s;} .visual_copy.ditto .visual_copy_inner .txt.t3 span {width: 33.3%;margin-right: 0%;} .bike.lineup {font-size:14px;z-index:10;} .bike.lineup .lineup_header {margin-bottom:150px;} .bike.lineup .lineup_header h3 {font-size:48px;letter-spacing:48px;margin-bottom:65px;} .bike.lineup .lineup_header h3 span {padding-left:30px;} .bike.lineup .lineup_header .line_up_dtop {display:inline-block;height:30px;} .bike.lineup .lineup_header .line_up_dtop li {position:relative;display:inline-block;width:217px;height:30px;margin-right:7px;padding-left:20px;color:#7b7a7a;border-bottom:5px solid #e5e5e5; background:url(/frontend/assets/images/icons/bike_tab_blit_out.png) right center no-repeat;font-family:"dpm", arial, san-serif;} .bike.lineup .lineup_header .line_up_dtop li a {display:block;height:100%;width:100%;font-family:"dpm", arial, san-serif;} .bike.lineup .lineup_header .line_up_dtop li.srh {width:300px;padding-right:20px;background:url(/frontend/assets/images/icons/srh_bg.png) right center no-repeat;} .bike.lineup .lineup_header .line_up_dtop li.srh div {} .bike.lineup .lineup_header .line_up_dtop li.srh div input {border:0px;position:absolute;left:60px;top:0px;width:240px;height:28px;} .bike.lineup .lineup_header .line_up_dtop li.srh div input label {} .bike.lineup .lineup_header .line_up_dtop li.on {border-bottom:5px solid #ffc000;color:#ffc000;} .bike.lineup .lineup_header .line_up_dtop li.on {background:url(/frontend/assets/images/icons/bike_tab_blit_ov.png) right center no-repeat;} .bike.lineup .lineup_header .line_up_mobile {display:none;width:100%;} .bike.lineup .lineup_header .line_up_mobile li {position:relative;float:left;width:100%;height:70px;line-height:70px;color:#fff;font-size:24px;background-color:#999999;} .bike.lineup .lineup_header .line_up_mobile li.selec {background-color:#ffc000;} .bike.lineup .lineup_header .line_up_mobile li.selec select {height:100%;width:100%;border:0px;background:none;text-indent:10px;vertical-align:top;} .bike.lineup .lineup_header .line_up_mobile li.selec select option {color:#7b7a7a;} .bike.lineup .lineup_header .line_up_mobile li input {width:100%;height:68px;border:0px;background:none;text-indent:10px;} .bike.lineup .lineup_header .line_up_mobile li label {position:absolute;left:10px;top:0px;width:100%;height:70px;line-height:70px;text-align:left;} .bike.lineup .lineup_header .line_up_mobile li.product {width:47%;padding-right:2%;} .bike.lineup .lineup_header .line_up_mobile li.product div {vertical-align:middle;height:70px;background:#999999 url(/frontend/assets/images/icons/srh_white_bg.png) right center no-repeat;} .bike.lineup .lineup_header .line_up_mobile:after {content:"";display:block;clear:both;} @media all and (min-width: 100px) and (max-width: 640px) { .bike.lineup .lineup_header .line_up_mobile li.selec select {-webkit-appearance: none;--background:url('/frontend/assets/images/icons/select_arrow.png') 96% center no-repeat !important;} .bike.lineup .lineup_header h3 {letter-spacing:22px;font-size:24px;} .bike.lineup .lineup_header {margin-bottom:50px;text-align:center;} .bike.lineup .lineup_header .line_up_dtop {display:none;} .bike.lineup .lineup_header .line_up_mobile {text-align:center;display:block;width:initial;} .bike.lineup .lineup_header .line_up_mobile li {float:none;width:100%;margin:0 auto;font-size:12px;height:35px;line-height:35px;} .bike.lineup .lineup_header .line_up_mobile li input {height:35px;} .bike.lineup .lineup_header .line_up_mobile li label {height:35px;line-height:35px;} .bike.lineup .lineup_header .line_up_mobile li.product {width:98%;padding-right:2%;margin-top:10px;} .bike.lineup .lineup_header .line_up_mobile li.product div {height:35px;background-size:20px;;} .bike.lineup .lineup_header .line_up_mobile {padding:0 25px;} .bike.lineup .lineup_header .line_up_mobile li.selec select {width:inherit;-webkit-appearance: none;background:url(/frontend/assets/images/icons/multi_select_arrow.png) 96% center no-repeat;background-size:4%;} .spec_table .table_cont th {text-indent:0px !important;padding:10px;} .spec_table .table_cont td {text-indent:0px !important;padding:10px;} } @media all and (min-width: 640px) and (max-width: 1024px) { .bike.lineup .lineup_header {margin-bottom:50px;text-align:center;} .bike.lineup .lineup_header .line_up_dtop {display:none;} .bike.lineup .lineup_header .line_up_mobile {display:block;} .bike.lineup .lineup_header .line_up_mobile li.selec select {width:inherit;-webkit-appearance: none;background:url(/frontend/assets/images/icons/multi_select_arrow.png) 96% center no-repeat; background-size:2%;} .spec_table .table_cont th {text-indent:0px !important;padding:10px;} .spec_table .table_cont td {text-indent:0px !important;padding:10px;} } @media all and (min-width: 1024px) and (max-width: 1620px) { .bike.lineup .lineup_header .line_up_dtop li.srh {margin-top:30px;display:block;width:100%;padding:0px;} .bike.lineup .lineup_header .line_up_dtop li.srh div {padding-left:20px;} .bike.lineup .lineup_header .line_up_dtop li.srh div input {width:350px;} } .bike.lineup .lineup_content {text-align:center;font-size:14px;color:#cccccc;} .bike.lineup .lineup_content ul {display:inline-block;width:1628px;--margin-top:100px;} .bike.lineup .lineup_content ul li {position:relative;float:left;width:375px;--border-bottom:1px solid #e6e6e6;--background-color:#f00;} .bike.lineup .lineup_content ul li .lineup_inner {border:1px solid #fff;padding-right:20px;padding-left:20px;padding-top:37px;padding-bottom:50px;margin-top:37px;margin-bottom:50px;} .bike.lineup .lineup_content ul li:hover .lineup_inner {border:1px solid #fe7700;} .bike.lineup .lineup_content ul li h4 {} .bike.lineup .lineup_content ul li span.line {width:20px;height:1px;background:#ededed;display:inline-block;margin:13px 0 13px 0;} .bike.lineup .lineup_content ul li .name {font-family:"dpl";letter-spacing:1px;font-size:14px;margin-bottom:30px;} .bike.lineup .lineup_content ul li .sname {font-family:"dpl";font-size:21px;margin-bottom:25px;height:14px;color:#000;} .bike.lineup .lineup_content ul li p img {width:100%;} .bike.lineup .lineup_content ul li .price {font-size:18px;margin-top:36px;color:#7b7a7a;} .bike.lineup .lineup_content ul li .txt {font-family:"NotoL", dotum, arial, san-serif;font-weight:700;line-height:26px;font-size:14px;margin-top:10px;color:#7b7a7a;} .bike.lineup .lineup_content ul li.on {color:#fe7700;} .bike.lineup .lineup_content ul li.on .txt{color:#fe7700;} .bike.lineup .lineup_content ul li.on span.line {background:#fe7700;} .bike.lineup .lineup_content ul:after{content:"";display:block;clear:both;} .bike.lineup .lineup_header.result_header {position:relative;margin-bottom:20px;margin-top:33px;} .bike.lineup .lineup_header.result_header .title {position:relative;margin-left:500px;--margin-bottom:100px;text-align:right;border-bottom:1px solid #eaeaea;} .bike.lineup .lineup_header.result_header .title h3 {display:inline-block;margin-bottom:0px;line-height:75px;letter-spacing:0px;} .bike.lineup .lineup_header.result_header .title h3 span {padding-left:50px;} .bike.lineup .lineup_header.result_header .line_up_dtop {position:absolute;left:0px;bottom:0px;height:35px;} .bike.lineup .lineup_content .total_result {text-align:right;--margin-bottom:100px;} .bike.lineup .lineup_content .total_result p {display:inline-block;color:#7b7a7a;font-family:"dpm", arial, san-serif;} .bike.lineup .lineup_content .total_result span {display:inline-block;margin-left:30px;color:#fe7700;} @media all and (min-width: 100px) and (max-width: 1024px) { .bike.lineup .lineup_header.result_header .title {margin-left:0px;} } @media all and (min-width: 100px) and (max-width: 640px) { .bike.lineup .lineup_content .total_result p {margin-right:25px;} .bike.lineup .lineup_header.result_header .title h3 {margin-right:25px;} .bike.lineup .lineup_header.result_header .title h3 span {padding-left:10px;} } @media all and (min-width: 100px) and (max-width: 407px) { .bike.lineup .lineup_content ul {width:100%} .bike.lineup .lineup_content ul li {width:100%} .bike.lineup .lineup_content {overflow:hidden;} } @media all and (min-width: 408px) and (max-width: 930px) { .bike.lineup .lineup_content ul {width:375px} .bike.lineup .lineup_content {overflow:hidden;} .bike.lineup {margin-top:0px;} .smartResult .noneProduct {text-align:center;padding-top:50px;} } @media all and (min-width: 930px) and (max-width: 1279px) { .bike.lineup .lineup_content ul {width:814px;width:750px;} } @media all and (min-width: 1280px) and (max-width: 1600px) { .bike.lineup .lineup_content ul {width:1221px;width:1130px} } @media all and (min-width: 100px) and (max-width: 720px) { .bike.lineup .lineup_content ul li .txt {font-size:14px;} } .load_more {padding:40px;color:#333333;text-align:center;border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;margin-top:-2px;} .load_more span {display:inline-block;padding-right:24px;background:url(/frontend/assets/images/icons/load_more.png) right center no-repeat;} .bike2.banner {text-align:center;font-family:"NotoL", dotum, arial, san-serif;} .bike2.banner ul {} /*.bike2.banner ul li {position:relative;float:left;width:23%;margin-right:2.2%;background:#f8f8f8;padding:30px 0;border:1px solid #dadada;margin-bottom:60px;}*/ .bike2.banner ul li.last {margin-right:0px;} .bike2.banner ul li div {--width:230px;display:inline-block;} .bike2.banner ul li h3 {font-size:24px;font-weight:normal;color:#333333;margin-bottom:65px;} .bike2.banner ul li span {width:20px;height:1px;display:inline-block;display:none;background-color:#999;margin:30px 0 30px 0;} .bike2.banner ul li p {margin-bottom:20px;font-size:14px;line-height:20px;color:#333333;} .bike2.banner ul li p.txt {margin-bottom:0px;color:#7b7a7a;height:60px;font-weight:700;} .bike2.banner ul li.last {--border-bottom:0px;} .bike2.banner ul:after {content:"";display:block;clear:both;} @media all and (min-width: 100px) and (max-width: 640px) { .bike2.banner {} .bike2.banner img{width:100%;} .bike2.banner ul li {width:100%;} .bike2.banner ul li div {width:initial;padding:0 25px;padding-top:5px;} .bike2.banner ul li.last div {border-bottom:0px;} body.main .bike.banner ul {padding:0px;} } @media all and (min-width: 640px) and (max-width: 1024px) { .bike2.lineup {padding-bottom:0px;} .bike2.banner {text-align:left;} .bike2.banner ul li {float:none;width:100%;padding:0px;margin-bottom:50px;border:1px solid #e6e6e6;} .bike2.banner ul li div {width:initial;padding:40px;} .bike2.banner ul li span {display:none;} .bike2.banner ul li p.txt {margin-top:10px;width:80%;} .bike2.banner ul li p.img {position:absolute;right:40px;top:50px;} .bike2.banner {padding-bottom:0px;} } @media all and (min-width: 100px) and (max-width: 640px) { .bike.banner ul li {border:1px solid #e6e6e6} } /************************************************************************************************************************************************ *************************************************************************************************************************************************/ .brand_detail_head {font-size:14px;} .brand_detail_head .cont {} .brand_detail_head .cont > li {float:right;} .brand_detail_head .cont .cont_description {width:34%;padding-top:170px;} .brand_detail_head .cont .cont_description h2 {font-size:36px;font-weight:bold;} .brand_detail_head .cont .cont_description span.line {display:block;width:20px;height:1px;background-color:#cccccc;margin:30px;} .brand_detail_head .cont .cont_description .decs {} .brand_detail_head .cont .cont_description .decs li {font-size:15px;font-weight:700;margin-bottom:20px;color:#565656;} .brand_detail_head .cont .cont_description .price_comment {margin-top:48px;color:#fe7700;line-height:18px;} .brand_detail_head .cont .cont_description .price_comment dl {} .brand_detail_head .cont .cont_description .price_comment dt {font-family:"dpm", arial, san-serif;padding-left:25px;margin-bottom:10px;background:url(/frontend/assets/images/icons/bike_detail_info_icon.png) left center no-repeat;} .brand_detail_head .cont .cont_description .price_comment dd {font-weight:700;} .brand_detail_head .cont .cont_description a.facebook {display:block;border:1px solid #999999;background:url(/frontend/assets/images/icons/footer_facebook.png) center bottom no-repeat;width:38px;height:38px;text-indent:9999px} .brand_detail_head .cont .cont_description .btns {display:inline-block;margin-top:30px;padding:30px 10px 0px 10px;border-top:4px solid #fbf523} .brand_detail_head .cont .cont_description .btns li {float:left;margin-right:10px;text-align:center;} .brand_detail_head .cont .cont_description .btns li a {display:block;width:166px;height:43px;line-height:43px;border:1px solid #333333;color:#333333;} .brand_detail_head .cont .cont_description .btns li.on a {border:1px solid #333333;color:#333333;font-weight:700;} .brand_detail_head .cont .cont_description .btns li a:hover {color:#ffcc00;border:1px solid #ffcc00;} .brand_detail_head .cont .cont_description .btns li.last {margin-right:0px;} .brand_detail_head .cont .cont_description .btns:after {content:"";display:Block;clear:both;} .brand_detail_head .cont .top_spec {width:66%;border-bottom:4px solid #fbf523;} .brand_detail_head .cont .top_spec p {font-family:"dpl", arial, san-serif;} .brand_detail_head .cont .top_spec p img {width:100%;} .brand_detail_head .cont .top_spec .thumb {text-align:center;} .brand_detail_head .cont .top_spec .thumb ul {display:inline-block;} .brand_detail_head .cont .top_spec .thumb ul li {float:left;padding:3px;border:1px solid #cccccc;margin-right:10px;} .brand_detail_head .cont .top_spec .thumb ul li a img {width:100%;} .brand_detail_head .cont .top_spec .thumb ul li.on {border:4px solid #fe7700;padding:0px;} .brand_detail_head .cont .top_spec .thumb ul:after {content:"";display:block;clear:both;} .brand_detail_head .cont .top_spec p {text-align:right;padding:20px 0;letter-spacing:3px;} .brand_detail_head .cont:after {content:"";display:block;clear:both;} .spec_head {margin-bottom:30px;} .spec_head h3 {display:inline-block;} .spec_head a {display:inline-block;font-size:14px;margin-left:20px;padding-left:20px;color:#fe7700;background:url(/frontend/assets/images/icons/tip_arrow_left.png) left center no-repeat;} .spec_table table {display:table;width:100%;line-height:16px;} .spec_table .table_cont {margin-bottom:30px;border-top:1px solid #000;border-bottom:1px solid #000;} .spec_table .table_cont tr {display:table-row;} .spec_table .table_cont th {font-weight:700;display:table-cell;text-align:left;border-bottom:1px solid #ededed;text-indent:10px;color:#565656;border-right:1px solid #ededed;padding:17px 0 17px;white-space:normal;} .spec_table .table_cont td {font-weight:700;display:table-cell;border-bottom:1px solid #ededed;border-right:none;text-align:left;text-indent:30px;color:#565656} .spec_table .table_cont th a:hover {color:#ff0000;} .spec_table .table_cont img {width:100%;} .spec_table .goList {position:relative;margin-top:30px;} .spec_table .goList a {display:block;position:absolute;right:0px;cursor:pointer;padding:0px 30px 0px 30px;height:43px;line-height:43px;border:1px solid #666666;background:#666666;color:#fff;} @media all and (min-width: 100px) and (max-width: 640px) { .spec_table .table_cont th {font-size:11px;width:100px;} .spec_table .table_cont td {font-size:11px;padding:0 10px;text-indent:0px;} .brand_detail_head .cont .cont_description .price_comment br {display:none;} .spec_table .goList a {position:relative;text-align:center;} } .data_table {position:fixed;top:0px;left:0px;width:100%;height:100%;z-index:100;display:none;} .data_table.on {display:block;} .data_table .dim {position:absolute;top:0px;left:0px;width:100%;height:100%;background:#000;opacity:0.8;} .data_table .data_cont {position:relative;overflow-y:auto;height:100%;padding:0 50px;} .data_table .data_cont .data_wrap {position:relative;top:100px;margin:0 auto;margin-bottom:100px;max-width:1000px;background:#fff;border:10px solid #ffff33;} .data_table .data_cont .data_wrap .data_inner {padding:56px;} .data_table .data_cont .data_wrap .data_inner .img {text-align:center;margin-bottom:80px;} .data_table .data_cont .data_wrap .data_inner .img img {width:100%;max-width:774px;} .data_table .data_cont .data_wrap .data_inner .lists {margin-bottom:60px;} .data_table .data_cont .data_wrap .data_inner .lists ul {} .data_table .data_cont .data_wrap .data_inner .lists ul li {position:relative;float:left;width:50%;height:60px;margin-bottom:30px;color:#666666;} .data_table .data_cont .data_wrap .data_inner .lists ul li span {display:inline-block;position:absolute;top:0px;left:0px;width:21px;height:21px;line-height:21px;text-align:center;color:#fff;background:url(/frontend/assets/images/icons/bike_data_table_no_bg.png) center center no-repeat;} .data_table .data_cont .data_wrap .data_inner .lists ul li dl {padding-left:32px;} .data_table .data_cont .data_wrap .data_inner .lists ul li dt {font-size:18px;margin-bottom:10px;color:#323131;} .data_table .data_cont .data_wrap .data_inner .lists ul li dd {margin-bottom:5px;line-height:20px;font-weight:100;color:#323131;} .data_table .data_cont .data_wrap .data_inner .lists ul:after {content:"";display:block;clear:both;} .data_table .data_cont .data_wrap .data_inner .txts {background:#f5f5f5;padding:30px;} .data_table .data_cont .data_wrap .data_inner .txts ul {} .data_table .data_cont .data_wrap .data_inner .txts ul li {margin-bottom:14px;color:#7b7a7a;} .data_close {position:absolute;top:50px;right:50px;display:inline-block;z-index:10;} @media all and (min-width: 641px) and (max-width: 1024px) { .data_table .data_cont .data_wrap .data_inner {padding:30px;} .data_table .data_cont .data_wrap .data_inner .lists ul li {width:50%;} } @media all and (min-width: 100px) and (max-width: 640px) { .data_table .data_cont {padding:0 25px;} .data_table .data_cont .data_wrap .data_inner .img {margin-bottom:40px;} .data_table .data_cont .data_wrap .data_inner .lists ul li span {font-size:12px;} .data_table .data_cont .data_wrap .data_inner .lists ul li {margin-bottom:10px;} .data_table .data_cont .data_wrap .data_inner .lists ul li dt {font-size:12px;} .data_table .data_cont .data_wrap .data_inner .lists ul li dd {font-size:12px;} .data_table .data_cont .data_wrap {top:50px;} .data_table .data_cont .data_wrap .data_inner {padding:20px;} .data_table .data_cont .data_wrap .data_inner .lists ul li {width:100%;height:inherit;} .data_table .data_cont .data_wrap .data_inner .txts ul li {font-size:12px;line-height:16px;} .data_table .data_close {position:absolute;top:25px;right:25px;} .data_table .data_close {width:15px;} .data_table .data_close img {width:100%;} } .otherCate {float:left;width:34%;max-width:367px;} .otherCate ul {} .otherCate ul li {} .otherCate ul li > div {border-bottom:5px solid #f0f0f0;padding-bottom:30px 30px 00px 30px;margin-bottom:110px;} .otherCate ul li h2 {font-weight:bold;font-size:30px;color:#000;} .otherCate ul li span.line {display:block;width:20px;height:1px;background-color:#cccccc;margin:30px 0;} .otherCate ul li dl {margin-bottom:30px;width:100%;} .otherCate ul li dl dt {color:#000;font-size:24px;margin-bottom:50px;line-height:35px;letter-spacing:-1px;} .otherCate ul li dl dd {line-height:20px;color:#7b7a7a;font-weight:700;} .otherCate ul li p {margin-bottom:30px;position:relative;overflow:hidden;} .otherCate ul li p img {width:100%;} .otherCate ul li p + a {font-family:"dpm", arial, san-serif;display:block;width:53px;padding:20px 20px 20px 10px;font-weight:700;background:url(/frontend/assets/images/icons/more_plus.png) right center no-repeat;} .otherCate ul li.on > div {border-bottom:5px solid #ffc000;} .otherCate ul li.on a {color:#ffc000;background:url(/frontend/assets/images/icons/more_plus_ov.png) right center no-repeat;} .otherCate ul li:hover > div {border-bottom:5px solid #ffc000;} .otherCate ul li:hover a {color:#ffc000;background:url(/frontend/assets/images/icons/more_plus_ov.png) right center no-repeat;} .edit_view {color:#7b7a7a;} .edit_view .cont {float:right;width:66%;} .edit_view .cont .viewer {} .edit_view .cont .viewer p {padding:10px 0;} .edit_view .cont .viewer p img {width:100%;} .edit_view:after {content:"";display:block;clear:both;} .edit_view .cont > p {color:#ffc000;} @media all and (min-width: 640px) and (max-width: 1279px) { .brand_detail_head .cont .top_spec {width:100%;} .brand_detail_head .cont > li {float:none;} .brand_detail_head .cont .cont_description {position:relative;padding-top:0px;width:100%;border-bottom:4px solid #fbf523;padding:50px 0 20px 0;} .brand_detail_head .cont .cont_description h2 {display:none;} .brand_detail_head .cont .cont_description span.line {display:none;} .brand_detail_head .cont .cont_description .btns {position:absolute;right:0px;bottom:20px;border-top:0px;} .edit_view .section_inner > div {float:none;} .edit_view .cont {width:100%;padding-bottom:100px;border-bottom:1px solid #cccccc;} .otherCate {width:100%;max-width:initial;} .otherCate ul li {float:left;width:50%;} .otherCate ul li > div {padding:100px 30px 00px 30px;} .otherCate ul:after {content:"";display:block;clear:both;} .otherCate ul li dl dt {height:70px;} } @media all and (min-width: 100px) and (max-width: 639px) { .brand_detail_head {margin-top:100px} .brand_detail_head .cont .top_spec {width:100%;} .brand_detail_head .cont > li {float:none;} .brand_detail_head .cont .cont_description {position:relative;padding-top:0px;width:100%;border-bottom:4px solid #fbf523;padding:50px 0 20px 0;} .brand_detail_head .cont .cont_description h2 {display:none;} .brand_detail_head .cont .cont_description span.line {display:none;} .brand_detail_head .cont .cont_description .btns {width:100%;padding:30px 0 0 0px;font-size:12px;} .brand_detail_head .cont .cont_description .btns li {width:100%;--width:48%;--margin-right:2%} .brand_detail_head .cont .cont_description .btns li a {width:100%;} .edit_view {font-size:12px;} .edit_view .section_inner > div {float:none;} .edit_view .cont {width:100%;padding-bottom:100px;border-bottom:1px solid #cccccc;} .spec_head h3 {font-size:24px;} .spec_head a {font-size:12px;} .otherCate {width:100%;max-width:initial;} .otherCate ul li > div {padding:100px 0px 0px 0px;} .otherCate ul li h2 {font-size:15px;} .otherCate ul li dl dt {font-size:14px;} .otherCate ul li dl dd {font-size:12px;} .brand_detail_head .cont .top_spec .thumb ul li {width:53px;height:33px;} .brand_detail_head .cont .top_spec p {font-size:12px;} .brand_detail_head .cont .cont_description .decs {font-size:12px;} .brand_detail_head .cont .cont_description {border-bottom:0px;} .bike.banner ul {padding:0 25px;} } .spec_table .table_cont {border-bottom:0px;} .prod_cont_table {border-bottom:1px solid #000} .comment {color:#ffc000;} .brand_detail_head .cont .cont_description span.line {margin-left:0px;} .prod_cont_table tbody tr.last th {border-bottom:1px solid #000;} .prod_cont_table tbody tr.last td {border-bottom:1px solid #000;} .table_cont p img {width:100%;} .spec_table p img {width:100%;} @media all and (min-width: 100px) and (max-width: 640px) { .product_detail section .section_inner {padding:0 25px;} .edit_view .cont {border-bottom:0px;} .otherCate ul li > div {padding-top:0px;} } .bike.lineup .lineup_content ul li h4 {height:35px;} .bike.lineup .lineup_content ul li .txt {height:14px;--padding:0 40px;} .bike.lineup .lineup_content ul li p.img {height:220px;} .bike.lineup .lineup_content ul li p.iot {height:inherit;position:relative;} .bike.lineup .lineup_content ul li p.iot img {width:inherit;position:absolute;top:-20px;left:50%;margin-left:-40px;} .bike.lineup .lineup_content ul li p.best {--height:55px;position:relative;} .bike.lineup .lineup_content ul li p.best img {display:none;width:100%;position:absolute;top:-230px;left:6%;} .bike.lineup .lineup_content ul li p.best span {display:inline-block;width:55px;height:55px;position:absolute;top:-230px;left:6%;background:url(/frontend/assets/images/icons/bike_best_icon.png) 0 0 no-repeat;} .bike.lineup .lineup_content ul li.on p.best span {background:url(/frontend/assets/images/icons/bike_best_icon_ov.png) 0 0 no-repeat;} @media all and (min-width: 100px) and (max-width: 1024px) { .bike.lineup .lineup_content ul li p.best span {background:url(/frontend/assets/images/icons/bike_best_icon_m.png) 0 0 no-repeat;background-size:40px;} .bike.lineup .lineup_content ul li.on p.best span {background:url(/frontend/assets/images/icons/bike_best_icon_ov_m.png) 0 0 no-repeat;background-size:40px;} .bike.lineup .lineup_content ul li p.best {width:40px;} .bike.lineup .lineup_content ul li p.best img {width:100%} } .bike.lineup .lineup_content ul li {opacity:0;} .bike.lineup .lineup_content ul li.view {opacity:1;transition:all 0.5s ;} .m .bike.lineup .lineup_content ul li {opacity:1;} .brand_section.category .visual_copy .visual_copy_inner {border:10px solid #fbf523;color:#fbf523;padding:55px;width:515px;background:none;transition:all 0.5s;} .brand_section.category .visual_copy .visual_copy_inner .txt {font-size:48px;} .brand_section.category .visual_copy .visual_copy_inner .txt.t1 {margin-bottom:55px;font-weight:bold;color:#fbf523;} .brand_section.category .visual_copy .visual_copy_inner .txt.t2 {margin-bottom:0px;color:#fbf523;} .brand_section.category .visual_copy .visual_copy_inner .txt.t3 {letter-spacing:50.5px;} .brand_section.category .visual_copy .visual_copy_inner .txt2 {font-size:14px;line-height:20px;color:#7b7a7a;} .brand_section.category .visual_copy .visual_copy_inner span.line {width:20px;height:1px;background-color:#fff;display:none;margin-top:55px;margin-bottom:30px;} .brand_section.category .visual_copy .visual_copy_inner .txt span {display: inline-block;float: left;} .brand_section.category .visual_copy .visual_copy_inner .txt:after {content:"";display:block;clear:both;} .brand_section .visual_copy .visual_copy_inner .slash {top:-16px;background:url(/frontend/assets/images/icons/slash_bike.png) 0 0 no-repeat} .bike.lineup .lineup_content ul li .lineup_inner {position:relative;} .bike.lineup .lineup_content ul li:hover .lineup_inner {border:1px solid #fff;} .bike.lineup .lineup_content ul li p.line {position:absolute;top:0px;left:0px;width:100%;height:100%;} .bike.lineup .lineup_content ul li p.line span:nth-child(1) {position:absolute;top:0px;left:0px;width:0%;height:1px;transition:all 0.75s;} .bike.lineup .lineup_content ul li p.line span:nth-child(2) {position:absolute;top:0px;right:0px;width:1px;height:0%;transition:all 0.75s;} .bike.lineup .lineup_content ul li p.line span:nth-child(3) {position:absolute;bottom:0px;left:100%;width:0%;height:1px;transition:all 0.75s;} .bike.lineup .lineup_content ul li p.line span:nth-child(4) {position:absolute;top:100%;left:0px;width:1px;height:0%;transition:all 0.75s;} .bike.lineup .lineup_content ul li.on p.line span {background:#fe7700;} .bike.lineup .lineup_content ul li.on p.line span:nth-child(1) {position:absolute;top:0px;left:0px;width:100%;height:1px;transition:all 0.75s;} .bike.lineup .lineup_content ul li.on p.line span:nth-child(2) {position:absolute;top:0px;right:0px;width:1px;height:100%;transition:all 0.75s;} .bike.lineup .lineup_content ul li.on p.line span:nth-child(3) {position:absolute;bottom:0px;left:0px;width:100%;height:1px;transition:all 0.75s;} .bike.lineup .lineup_content ul li.on p.line span:nth-child(4) {position:absolute;top:0px;left:0px;width:1px;height:100%;transition:all 0.75s;} /*product detail*/ .swipe-wrap {width:3072px;} .swipe {overflow: hidden;visibility: hidden;position: relative;} .swipe-wrap {overflow: hidden;position: relative;} .swipe-wrap > div {float:left;width:100%;position: relative;} .visual_copy .visual_copy_inner {height:450px;} .visual_copy .visual_copy_inner .txt {margin-bottom:20px !important;} .visual_copy .visual_copy_inner .txt.t1 {letter-spacing:0px;} .visual_copy .visual_copy_inner .txt.t2 {letter-spacing:0px;} .visual_copy .visual_copy_inner .txt.t3 {letter-spacing:0px;} .visual_copy .visual_copy_inner .txt.t4 {letter-spacing:0px;} /* bike */ @media all and (min-width: 1024px) and (max-width: 1252px) { main section.brand_section {padding-bottom:200px;transition:all 0.5s;} } .currentMenu {padding:23px;background:#fff;display:none;width:100%;height:initial !important;border-top:0 !important;border-bottom:1px solid #e6e6e6;} .currentMenu.on {display:block;} #header .header_title ul.currentMenu li {position:relative;text-align:left;margin-bottom:26px;} #header .header_title ul.currentMenu li a {color:#cccccc;font-size:36px;} #header .header_title ul.currentMenu li.on a {color:#ffc000;} #header .header_title ul.currentMenu li a:hover {color:#ffc000;text-decoration:underline;} @media all and (min-width: 100px) and (max-width: 640px) { .brand_section .visual_copy {padding:15px 25px;} .brand_section .visual_copy .visual_copy_inner {padding:0px;padding:15px 25px;margin:-150px auto;width:initial !important;transition:all 0.5s;} #header .header_title ul.currentMenu li {position:relative;text-align:left;margin-bottom:13px;} #header .header_title ul.currentMenu li a {color:#cccccc;font-size:18px;} } @media all and (min-width: 100px) and (max-width: 407px) { .bike.lineup .lineup_content ul {width:100%} .bike.lineup .lineup_content ul li {width:100%} .bike.lineup .lineup_content {overflow:hidden;} } @media all and (min-width: 408px) and (max-width: 930px) { .bike.lineup .lineup_content ul {width:375px} .bike.lineup .lineup_content {overflow:hidden;} } @media all and (min-width: 930px) and (max-width: 1279px) { .bike.lineup .lineup_content ul {width:814px;width:750px;} } @media all and (min-width: 1280px) and (max-width: 1600px) { .bike.lineup .lineup_content ul {width:1125px} } @media all and (min-width: 1600px) and (max-width: 3000px) { .bike.lineup .lineup_content ul {width:1500px} } .visual_title {top:70px;} .visual_title .text_inner {font-size:24px;line-height:34px;height:50px;--opacity:0.8;letter-spacing:0px;} .bike.lineup .lineup_header h3 {font-family:"NotoB", dotum, arial, san-serif} .visual_copy .visual_copy_inner .txt {font-family:"NotoB", dotum, arial, san-serif;font-weight:bold;letter-spacing:0px !important;} .visual_copy .visual_copy_inner span.line {display:none;} .visual_copy .visual_copy_inner .txt2 {position:absolute;bottom:50px;margin-right:50px;} @media all and (min-width: 641px) and (max-width: 1023px) { .visual_title {margin-top:0px;} } @media all and (min-width: 100px) and (max-width: 640px) { .visual_title {top:50px;} .visual_copy .visual_copy_inner .txt {font-size:24px;line-height:24px;} .visual_title .text_inner {font-size:24px;height:34px;line-height:34px;transition:all 0.5s;} .visual_copy .visual_copy_inner .txt2 {position:absolute;bottom:50px;margin-right:25px;} }