/* BASIC css start */ @font-face { font-family: 'GT-America-Mono',; src: url('https://th3point.speedgabia.com/font/GT-America-Mono-Regular-Trial.otf'), src:url('https://th3point.speedgabia.com/font/GT-America-Mono-Regular-Italic-Trial.woff2') format('woff2'), url('https://th3point.speedgabia.com/font/GT-America-Mono-Regular-Trial.otf') format('open type'); font-weight:normal; font-style:normal; font-display: swap; } .section{text-align: center;} .section .sec_inner{padding:0; margin:0 auto} .section h2{ font-family: 'GT-America-Mono', 'Noto Sans Mono','Noto Sans KR', monospace; font-size:15px; color:#333333; font-weight:400;margin-bottom:30px } .more{display:flex; align-items:center; justify-content:center;} .more a{color: #5d5d5d;font-family: 'Lato', sans-serif;border:1px solid #d8d8d8; font-size:13px; border-radius:20px ;padding:10px 37px; display:inline-block; font-weight:500;} #container{padding-top:0 !important} #sec1{} #sec1 .swiper{padding-bottom:0} #sec1 .swiper>ul{} #sec1 .swiper>ul>li{position: relative;width: 100%;} #sec1 .swiper>ul>li>a{display: block;width: 100%;} #sec1 .swiper>ul>li>a>img{width: 100%;} #sec1 .swiper>ul>li>.txt{position: absolute; left:10%; top: 50%;} #sec1 .swiper>ul>li>.txt.act{} #sec1 .swiper>ul>li>.txt>*{position: relative; left: -100px;opacity: 0;} #sec1 .swiper>ul>li>.txt.act>*{left: 0px;opacity: 1;} #sec1 .swiper>ul>li>.txt p.sub{letter-spacing: -.6px; margin-bottom: 5px; transition: left .5s, opacity .8s;font-family: 'GT-America-Mono','Noto Sans Mono','Noto Sans KR', monospace;; font-size: 14px;color: #494949;} #sec1 .swiper>ul>li>.txt h2{letter-spacing: -.6px;transition: left .7s,opacity .8s;margin-left: -2px; font-family: 'GT-America-Mono','Noto Sans Mono','Cutive Mono''Noto Sans KR', monospace; font-size: 18px;color: #1a1a1a;line-height:1.2; margin-top:15px} #sec1 .swiper>ul>li>.txt a{margin-top: 25px; transition: left 1s,opacity .8s;display: inline-block; color: #898989;font-family: 'GT-America-Mono','InfinitySans-RegularA1'; font-size: 12px;} .sec1_bar{border-bottom: 0px solid #eee; width:100%} .sec1_bar .swiper{margin:0 auto; height: 45px;} .sec1_bar .swiper ul{width: 100%;} .sec1_bar .swiper ul li.swiper-slide{} .sec1_bar .swiper ul li.swiper-slide p{display: flex; align-items: center; justify-content: center;font-family: 'GT-America-Mono','Noto Sans Mono','Noto Sans KR', font-size: 12px ; color: #333333; padding: 9px 0; } .sec1_bar p span{display: flex; margin-right: 10px;} .sec1_bar p span img{transform:scale(.66); transform-origin:center;} #sec2{margin-top:80px} #sec2 .sec2_top{display: flex; justify-content: space-between; align-items: center;margin-bottom:0px} #sec2 .sec2_top h2{margin:10px;} #sec2 .sec2_top .right{display:flex} #sec2 .swiper ul.swiper-slide{display:flex; flex-wrap:wrap} #sec2 .swiper li .thumb{position:relative padding:0,10px;} #sec2 .swiper li .thumb span.sticker{font-family:'GT-America-Mono', 'Noto Sans Mono','Noto Sans KR', monospace; z-index:1; position:absolute; width:10px; height:10px; display:inline-block; color:#b51212; background-color:(0, 0, 0, 0) border-radius:50%; line-height:40px; text-align:center; left:12px; top: -10px; font-size:12px; font-weight:300} #sec2 .swiper-pagination{position:unset} #sec2 .swiper-pagination-bullets.swiper-pagination-horizontal{left:unset; top:unset; width:auto;} #sec2 .swiper-pagination-bullet {width: 20px;height: 20px;text-align: center;line-height: 20px;box-sizing:unset; font-weight:400; font-size: 11px;color: #5d5d5d; opacity: 1; background: rgba(0, 0, 0, 0);font-family: 'Noto Sans Mono','Noto Sans KR', monospace;border:1px solid #ccc } #sec2 .swiper-pagination-bullet-active { color: #fff;background: #333333;} #sec3{width: 100%; position: relative;margin-top:5px} #sec3 .bg{width: 100%;} #sec3 .bg img{width: 100%;} #sec3 .txt_cont{ } #sec3 .txt_cont .txt_inner{padding:-50px 5% 5px} #sec3 .txt_cont .txt_inner>*{font-family:'GT-America-Mono', 'Noto Sans Mono','Noto Sans KR', monospace;} #sec3 .txt_cont .txt_inner p.tit{color: #fff;font-size: 12px; font-weight: 400; margin-bottom: 13px;} #sec3 .txt_cont .txt_inner h3{color: #000; font-size: 16px; font-weight: 500; margin-bottom: 10px;} #sec3 .txt_cont .txt_inner p.cont{color: #474747; font-size: 12x; line-height: 1.6; font-weight: 400; margin-bottom: 20px;} #sec3 .txt_cont .txt_inner>a{color: #474747; font-size: 12px; display: block;} #sec3 .swiper{padding-bottom:60px; padding-left:15px; padding-top:15px} #sec3 .swiper ul.swiper-wrapper{display: flex; align-items: flex-end;} #sec3 .swiper ul.swiper-wrapper li.swiper-slide{padding: 0px 0px 40px; border-radius: 10px;overflow:hidden;background-color: #fff;box-shadow: 0 0 20px rgba(0, 0, 0, .1);width:40%} #sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb{width: 100%;padding-bottom: 0px;transition: padding-bottom .3s; } #sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb a{display: block; width: 100%; text-align: center;} #sec3 .swiper ul.swiper-wrapper li.swiper-slide .thumb a img{} #sec3 .swiper ul.swiper-wrapper li.swiper-slide .info{padding-bottom:20px} #sec3 .swiper ul.swiper-wrapper li.swiper-slide .info p{text-align: center;} #sec3 .swiper ul.swiper-wrapper li.swiper-slide a.view_more{text-align: center;transition:color .2s; display: block; font-family: 'GT-America-Mono','Noto Sans KR', sans-serif;color:#474747; font-size:11px; font-weight:400 } #sec3 .swiper-pagination{bottom:0px; top:unset} #sec3 .swiper-pagination-bullet{width: 30px; height: px; border-radius: 0; background-color:#9c8f87; } #sec3 .swiper-pagination-progressbar{background-color:rgba(0,0,0,0.09); height:4px !important} #sec3 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color:#333} #sec4{margin-top:20px} #sec4 .sec_inner{} #sec4 .sec_inner h2{} #sec4 .sec_inner h2 a.more{} #sec4 .sec_inner .sec4_cont{} #sec4 .sec_inner .sec4_cont ul{} #sec4 .sec_inner .sec4_cont ul li{width:60%; } #sec4 .sec_inner .sec4_cont ul li a{display: block; width: 100%;} #sec4 .sec_inner .sec4_cont ul li a img{width:100%} #sec4 .sec_inner .sec4_cont ul li a .info{position: absolute;width: 100%; bottom: 0px; left: 0;padding:px 10px;} #sec4 .sec_inner .sec4_cont ul li a .info .inner{background-color: rgba(255,255,255,.25);transition: background-color .5s; padding: 25px 0 15px;} #sec4 .sec_inner .sec4_cont ul li a .info .inner p{text-align: center;} #sec4 .sec_inner .sec4_cont ul li a .info .inner p.brandname{font-family: 'GT-America-Mono','Noto Sans Mono','Noto Sans KR', font-size: 15px; color: #000; font-weight: 400; margin-bottom: 5px;} #sec4 .sec_inner .sec4_cont ul li a .info .inner p.txt{font-family:'GT-America-Mono', 'Noto Sans Mono','Noto Sans KR',font-size: 12px; color: #fff; font-weight: 400;} #sec5{width: 100%;margin-top:10px} #sec6{margin-top:5px} #sec6-1{width: 100%;margin-top:20px} #sec6-1 a{display: block;width: 100%;} #sec6-1 a img{width: 100%;} #sec7{width: 100%;margin-top:20px} #sec7 a{display: block;width: 100%;} #sec7 a img{width: 100%;} /* sec8 */ #sec8{margin:120px 0 0px} #sec8 h2{margin-bottom:30px} #sec8 .sec8_review{} #sec8 .sec8_review>div{width: 100%;} #sec8 .sec8_review>div>ul{width: 100%; display:flex; justify-content:space-between;} #sec8 .sec8_review>div>ul>li{width: 48.5%; } #sec8 .li_review .rv_main{ width: 100%; border-bottom: 1px solid #f2f2f2;} #sec8 .li_review .rv_main .thumb{width:110%; } #sec8 .li_review .rv_main .thumb a{display: block; width: 100%; } #sec8 .li_review .rv_main .thumb a img{width: 100%; object-fit: cover;} #sec8 .li_review .rv_main .rv_main_cont{width: 100%; padding: 15px 0;} #sec8 .li_review .rv_main .rv_main_cont .rv_cont{font-size: 12px; font-family: 'GT-America-Mono','Noto Sans Mono','Noto Sans KR', monospace; text-overflow: ellipsis; overflow: hidden; color:#575757; line-height:1.4 } #sec8 .li_review .rv_mini{width: 100%; display: flex; align-items: center; justify-content: left; padding:17px 0;} #sec8 .li_review .rv_mini ul {} #sec8 .li_review .rv_mini ul li {font-family: 'GT-America-Mono','Noto Sans Mono','Noto Sans KR', monospace;font-size: 12px; color: #656565;margin-bottom:4px;} #sec8 .li_review .rv_mini ul li:nth-child(2){display:flex; align-items:center} #sec8 .li_review .rv_mini ul li span {font-family:'GT-America-Mono','Noto Sans Mono','Noto Sans KR', monospace; margin-right:10px;display:flex; align-items:center; color:#000} #sec8 .li_review .rv_mini ul li span img{display:inline-block; margin-right:4px; transform:scale(.9)} #sec8 .li_review .rv_mini ul li span:nth-child(2) img{margin-top:2px} /* 슬라이드띠배너*/ .marquee-container {margin-top:0px; margin-bottom:1px; overflow: hidden; white-space: nowrap; width: 100%; color: #000; position: relative; height: 35px; display: flex; align-items: center; cursor: default; background-color: #eee; color: #111; } .marquee { display: flex; animation: scroll 30s linear infinite; /* 끊김 없이 반복 애니메이션 */ font-size: 12px; font-weight: 400; font-family: ="GT-America-Mono"; } .marquee span { padding: 0px 20px; letter-spacing: 0.1em; } @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(-50%); /* 절반만 이동 */ } } /* BASIC css start */ .main_cate_wrap2{font-family: 'GT-America-Mono','DM Mono','42dot Sans' ,"Roboto Mono", monospace; margin:0 ; } .main_cate_wrap2 ul{overflow: hidden;} .main_cate_wrap2 ul li{ float: left; width: 50%;} .main_cate_wrap2 ul li a{ display:block; border: 1px solid #fff; border-right: 0; } .main_cate_wrap2 ul li:nth-child(2n){border-left:0px solid #fff;} .main_cate_wrap2 ul li:nth-child(n+3){border-bottom:0px solid #fff;} .main_cate_wrap2 ul li a .thumb{ position: relative; } .main_cate_wrap2 ul li a .thumb img{ width: 100%;} .main_cate_wrap2 ul li a .thumb .cover_text{ opacity:0; transition-duration: 0.8s; padding-top: 95%; padding-left: 0; font-size: 14px; background: #111; color: #fff; position: absolute; top:0; left: 0; width: 100%; height: 100%; padding-top: 50%; text-align: center;} .main_cate_wrap2 ul li a .thumb .cover_text p .main_title {font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace; position: absolute; color: #fff; bottom: 20px; left: 40px;line-height: 10px; font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace;text-align: center; } .main_cate_wrap2 ul li a .thumb .cover_text p.sub_title { font-family:'GT-America-Mono','42dot Sans' "DM Mono",'IBM Plex Sans KR', monospace; text-align: left; font-size: 14px; bottom: 0px; font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace;text-align: center; } .main_cate_wrap2 ul li:hover a .thumb .cover_text{ opacity: 0.8; } /* BASIC css start */ .main_cate_wrap{font-family: 'GT-America-Mono','DM Mono','42dot Sans' ,"Roboto Mono", monospace; margin:0 ; } .main_cate_wrap ul{overflow: hidden;} .main_cate_wrap ul li{ float: left; width: 100%;} .main_cate_wrap ul li a{ display:block; border: 1px solid #fff; border-right: 0; } .main_cate_wrap ul li:nth-child(2n){border-right:1px solid #fff;} .main_cate_wrap ul li:nth-child(n+3){border-bottom:1px solid #fff;} .main_cate_wrap ul li a .thumb{ position: relative; } .main_cate_wrap ul li a .thumb img{ width: 100%;} .main_cate_wrap ul li a .thumb .cover_text{ opacity:0; transition-duration: 0.8s; padding-top:20px; padding-left: 0; font-size: 14px; background: #111; color: #fff; position: absolute; top:0; left: 0; width: 100%; height: 100%; padding-top: 50%; text-align: center;} .main_cate_wrap ul li a .thumb .cover_text p .main_title {font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace; position: absolute; color: #fff; bottom: 20px; left: 40px;line-height: 10px; font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace;text-align: center; } .main_cate_wrap ul li a .thumb .cover_text p.sub_title { font-family:'GT-America-Mono','42dot Sans' "DM Mono",'IBM Plex Sans KR', monospace; text-align: left; font-size: 14px; bottom: 0px; font-family: 'GT-America-Mono','42dot Sans' ,"Roboto Mono", monospace;text-align: center; } .main_cate_wrap ul li:hover a .thumb .cover_text{ opacity: 0.8; } /* BASIC css end */