@charset "euc-kr"; @import url("common.css"); /*서브 비주얼 타이틀*/ .sub{position:relative;} #sv{width:100%; height:149px; background:url("/m/img/sub/sv.jpg") no-repeat; background-size:cover; position:relative;} #sv:before{content:"";display:block; width:124px; height:48px; background:url("/m/img/main/before_bg.png") no-repeat; position:absolute;left:50%; top:0; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); } #sv h2{font-size:36px; font-weight:700; color:#fff;text-align: center; position: relative;top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); } /*농원소개*/ #greeting{} #greeting .top_tit{text-align:center;padding:70px 0 50px;} #greeting .top_tit > p{margin-bottom:20px; font-family: 'Nanum Myeongjo', serif; font-size:28px; color:#322121; font-weight:800; } #greeting .top_tit > p > span{color:#ff4611;} #greeting .top_tit img{display:block; margin:0 auto 10px;} #greeting .top_tit > span{display:block;font-size:16px; color:#84715a} #greeting .con01{position:relative;} #greeting .con01 .img{} #greeting .con01 .img img{width:100%; min-height:322px; height:auto;} #greeting .con01 .txt{width:100%; max-width:480px; position:absolute; left:50%; top:40px; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); } #greeting .con01 .txt img{margin-bottom:40px;} #greeting .con01 .txt_box > p{font-size:14px; color:rgba(50,33,33,0.8);} #greeting .con01 .txt_box > p.mb{margin-bottom:25px;} #greeting .con01 .txt_box{padding:0 16px;} #greeting .con .tit{margin-bottom:20px;} #greeting .con .tit p{font-family: 'Nanum Myeongjo', serif; font-size:30px; font-weight:800; color:#322121;} #greeting .con .tit p span{color:#ff4611;} #greeting .con .txt{margin-bottom:30px;} #greeting .con .txt p{font-size: 15px; color:#777; line-height:24px;} #greeting .con .img{} #greeting .con .img img{width:100%; height:auto; min-height:252px;} #greeting .con02{padding-top:72px; } #greeting .con03{padding-top:46px;} #greeting .con03 ul{} #greeting .con03 ul li{font-size: 15px; color:#777; line-height:24px; position:relative; padding-left:15px;} #greeting .con03 ul li:before{content:""; display:block; width:7px; height:7px; background-color:#777; border-radius:50%; position:absolute; left:0; top:10px;} .hide{display:none;} #greeting .con04{padding:72px 0;} #greeting .con04 > p.logo_tit{margin-bottom:40px;font-family:'East Sea Dokdo', cursive; color:#322121; font-size:57.5px; letter-spacing:-0.5px; text-align:center;} #greeting .con04 > p.logo_tit span{color:#ff4611} #greeting .con04 .store, #greeting .con04 .office{position:relative;} #greeting .con04 .store > p, #greeting .con04 .office > p{width:69px; height:69px; line-height:69px; text-align:center; background-color:#ff4611; font-size:20px; font-weight:700; color:#fff; position:absolute; right:0; top:-16px; z-index:100;} #greeting .con04 .store{width:100%; margin-bottom:60px;} #greeting .con04 .map_area{width:100%;} #greeting .con04 .map_area > div{width:100% !important; padding: 0!important; border: none!important;} #greeting .con04 .map_area > div > div{width:100% !important;} #greeting .con04 .txt{margin-top:50px;} #greeting .con04 .tit{margin-bottom:16px; font-size:23px; font-weight:700; color:#222;} #greeting .con04 ul{border-bottom:1px solid #ebebeb; font-size:0;} #greeting .con04 ul.addr{border-top:1px solid #ebebeb} #greeting .con04 ul li{height:56px; line-height:56px;font-size:13px; color:#222; } #greeting .con04 ul.tel li{font-family: 'Open Sans', sans-serif; font-weight:700; float:left;} #greeting .con04 ul.tel li:first-child{margin-right:130px;} #greeting .con04 ul li span, #greeting .con04 ul li p{display:inline-block; } #greeting .con04 ul li span{width:65px; text-align:center;} #greeting .con04 ul li span img{width:30px; vertical-align:middle;} /*곶감이야기*/ .story_tit{text-align:center;padding:70px 0 50px; } .story_tit > p{margin-bottom:20px; font-family: 'Nanum Myeongjo', serif; font-size:28px; color:#322121; font-weight:800; } .story_tit > p > span{color:#ff4611;} .story_tit img{display:block; margin:0 auto 10px;} .story_tit> span{display:block;font-size:16px; color:#84715a} .story_tab{text-align:center; margin-bottom:70px;} .story_tab ul{font-size:0;} .story_tab ul li{display:inline-block; width:47.09821428571%; height:64px; } .story_tab ul li:first-child{margin-right:5.80357142857%} .story_tab ul li a{display:block; width:100%; line-height:64px; text-align:center; color:#ff4611; font-size:23px; font-weight:800; font-family: 'Nanum Myeongjo', serif; border:1px solid #ff4611; border-radius:5px; box-sizing:border-box; position:relative;} .story_tab ul li.on a:before{content:""; display:block; width:1px; height:71px; background-color:#ff4611; position:absolute; left:50%; bottom:-64px; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); } .story_tab ul li.on a:after{content:""; display:block; width:16px; height:16px; background-color:#ff4611; border-radius:50%; position:absolute; left:50%; bottom:-80px; z-index:1; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); } .story_tab ul li.on a{color:#fff; background-color:#ff4611} /*곶감이야기 영양성분*/ #story01 .content > img{width:100%; min-height:173px; height:auto;} #story01 .con{padding:73px 0;} #story01 .con_tit {text-align:center;margin-bottom:40px;} #story01 .con_tit h2{font-family:'East Sea Dokdo', cursive; color:#322121; font-size:57.5px; font-weight:inherit; line-height:1;} #story01 .con_tit h2 span{color:#ff4611;} #story01 .con_tit p{font-size:15px; font-weight:400; color:#84715a;} #story01 .con .table > p{width:45px; height:44px; margin-bottom: 3px; line-height:44px; text-align:center;background-color:#ff4611; border-radius:50%; font-size:17px; font-weight:700; color:#fff; } #story01 .con .table01{margin-bottom:35px;} #story01 .con .tableSt01{margin-bottom:3px;} #story01 table{width:100%;} #story01 table tr{} #story01 table tr th{padding:10px 0; font-size:12px; font-weight:500; color:#222; background-color:#f5f5f5; border:1px solid #e1e1e1;} #story01 table tr td{padding:10px 0; font-size:12px; font-weight:500; color:#222; border:1px solid #e1e1e1; text-align:center;} #story01 .con02{position:relative} #story01 .con02 .con_tit{margin-bottom:60px;} #story01 .con02 img{width:100%; height:auto; min-height:452px; } #story01 .con02 .con02_box{width:100%;max-width:480px; padding: 48px 16px 30px;position:absolute; left:50%; top:0; box-sizing:border-box; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); } #story01 .con02 .txt{} #story01 .con02 .txt ul{font-size:0;margin-bottom:24px;} #story01 .con02 .txt ul li{display:inline-block;width:106px; height:106px; margin-right:50px; line-height:106px; background-color:#fff; border:5px solid #e1ded7; border-radius:50%; font-size:32px; font-weight:700; color:#322121; text-align:center;} #story01 .con02 .txt ul li:first-child{position:relative;} #story01 .con02 .txt ul li:nth-child(2){position:relative;} #story01 .con02 .txt ul li:first-child:after{content:"";display:block; width:26px; height:26px; background:url("/m/img/sub/story01_icon01.png") no-repeat; position:absolute;right:-42px;top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); } #story01 .con02 .txt ul li:nth-child(2):after{content:"";display:block; width:27px; height:16px; background:url("/m/img/sub/story01_icon02.png") no-repeat; position:absolute;right:-42px;top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); } #story01 .con02 .txt ul li:nth-child(3){border:5px solid #c7b299; color: #ac906f; margin-right:0;} #story01 .con02 .mean{font-size:0} #story01 .con02 .mean dl{display:inline-block; text-align:left; font-size:15px; font-weight:500; color:#222; vertical-align:top;} #story01 .con02 .mean dl.mean01{width:40%} #story01 .con02 .mean dl.mean02{width:60%} #story01 .con02 .mean dl dt{} #story01 .con02 .mean dl dd{font-weight:400; line-height:20px} #story01 .con03{width:100%; max-width:480px; margin:0 auto;} #story01 .con03 .info{} #story01 .con03 .info > div{width:100%;/* height:259px; */padding:45px 76px; border-radius:140px; background-color: rgba(255,255,255,0.5); box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;} #story01 .con03 .info .info01{border:10px solid rgba(199,178,153,0.5); } #story01 .con03 .info .info02{border:10px solid rgba(235,235,235,0.5); margin-top:-27px;} #story01 .con03 .info p{padding-bottom:28px; margin-bottom:22px; font-size:30px; font-weight:700; color:#322121; border-bottom:1px solid #e1e1e1; text-align:center;} #story01 .con03 .info ul{} #story01 .con03 .info ul li{font-size:15px; color:#84715a; line-height:18px; font-weight:400; position:relative; padding-left:16px;} #story01 .con03 .info ul li:before{content:"";display:block; width:5px; height:5px; background-color:#66564c; border-radius:50%; position:absolute; left:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); } #story01 .con03 .info ul li span{color:#66564c; font-weight:700;} /*곶감이야기 곶감요리*/ #story02{margin-bottom:70px;} #story02 .content{} #story02 .content > div{position:relative;} #story02 .content > div .img img{width:100%; vertical-align:bottom;} #story02 .con_tit {margin-bottom:40px;} #story02 .con_tit h2{margin-bottom:10px; font-family:'East Sea Dokdo', cursive; color:#322121; font-size:50px; font-weight:inherit} #story02 .con_tit p{font-size:15px; font-weight:500; color:#ff4611;} #story02 .txt_box {} #story02 .txt_box p{margin-bottom:30px;font-size:15px; line-height:26px; font-weight:500; color:#222;} #story02 .txt_box ul{} #story02 .txt_box ul li{font-size:14px; color:#66564c; line-height:26px; position:relative; padding-left:16px;} #story02 .txt_box ul li:before{content:"";display:block; width:6px; height:6px; border-radius:50%; background-color:#66564c; position:absolute; left:0;top:14px;} #story02 .content .txt{position:absolute; left:0;top:40%; } #story02 .con04 .txt{position:absolute; left:0;top:45%; } #story02 .con01 img{min-height:729px;} #story02 .con02 img{min-height:729px;} #story02 .con03 img{min-height:804px;} #story02 .con04 img{min-height:655px;} #story02 .con05 img{min-height:803px;} /*shopping01*/ #shopping01 .order{text-align:center; padding: 30px 0; } #shopping01 .order ul{font-size:0;} #shopping01 .order ul li{display:inline-block;} #shopping01 .order ul li a{padding:0 15px; font-size:14px; color:rgba(34,34,34,0.7); position:relative;} #shopping01 .order ul li a:after{content:"";display:block; width:1px; height:13px; background-color:#c7c7c7; transition:all 0.3s;position:absolute; right:0;top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); } #shopping01 .order ul li:last-child a:after{display:none;} #shopping01 .order ul li:hover a{color:#ff4611;} #shopping01 .order ul li.on a{color:#ff4611;} #shopping01 .shop ul{width:100%;position:relative;} #shopping01 .shop ul li{width: calc((100% - 0.53191489362%) / 2); float:left; margin-bottom:34px; position:relative; text-align:center; border:1px solid #ebebeb; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;} #shopping01 .shop ul li:nth-child(odd){margin-right:0.53191489362%;} #shopping01 .shop ul li .img{height:0; padding-top:103.7%;} #shopping01 .shop ul li img{width:100%; position:absolute;left:0; top:0;} #shopping01 .shop ul li a{display:block;} #shopping01 .shop ul li .txt{width:100%; height:134px; padding:6px 0 0 0; border-top:1px solid #ebebeb; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;} #shopping01 .shop ul li .txt > span{display:inline-block; vertical-align:top; line-height:30px; width:30px; height:30px; border-radius:50%; color:#fff; font-size:9px; font-weight:500;} #shopping01 .shop ul li .txt > span.gray{ background-color:#555;} #shopping01 .shop ul li .txt > span.orange{background-color:#ff4611;} #shopping01 .shop ul li .txt > span.green{background-color:#39b54a;} #shopping01 .shop ul li .txt > span.blue{background-color:#00a2e6;} #shopping01 .shop ul li .txt > .tit{margin:12px 0 20px; font-size:13px; line-height:18px;color:#333; font-weight:500;} #shopping01 .shop ul li .txt > .price .no_sale{font-size:11px; color:#888; font-weight:700; margin-right:15px;text-decoration: line-through;} #shopping01 .shop ul li .txt > .price .sale{color:#d0111b;font-weight:700;} #shopping01 .btn_group{text-align:center; margin-bottom:65px;} #shopping01 .btn_group ul{font-size:0;} #shopping01 .btn_group ul li{display:inline-block; margin-right:4px;} #shopping01 .btn_group ul li:last-child{margin-right:0;} #shopping01 .btn_group ul li a{display:block; width:46px; height:42px; line-height:42px; border-radius:2px; border:1px solid #ebebeb; font-size:16px; color:#b5b5b5} #shopping01 .btn_group ul li:hover a{background-color:#555;} #shopping01 .btn_group ul li.on a{background-color:#555;} /* 상품 리스트페이지 */ .prd_gall ul{width:100%;position:relative;} .prd_gall ul li{width: calc((100% - 0.53191489362%) / 2); float:left; margin-bottom:34px; position:relative; text-align:center; border:1px solid #ebebeb; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;} .prd_gall ul li:nth-child(odd){margin-right:0.53191489362%;} .prd_gall ul li .img{height:0; padding-top:103.7%;} .prd_gall ul li img{width:100%; position:absolute;left:0; top:0;} .prd_gall ul li a{display:block;} .prd_gall ul li .txt{width:100%; height:134px; padding:6px 0 0 0; border-top:1px solid #ebebeb; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;} .prd_gall ul li .txt > span{display:inline-block; vertical-align:top; line-height:30px; width:30px; height:30px; border-radius:50%; color:#fff; font-size:9px; font-weight:500;} .prd_gall ul li .txt > span.gray{ background-color:#555;} .prd_gall ul li .txt > span.orange{background-color:#ff4611;} .prd_gall ul li .txt > span.green{background-color:#39b54a;} .prd_gall ul li .txt > span.blue{background-color:#00a2e6;} .prd_gall ul li .txt > .tit{margin:12px 0 20px; font-size:13px; line-height:18px;color:#333; font-weight:500; padding:0 12px; word-break:keep-all; word-wrap:break-word;} .prd_gall ul li .txt > .price .no_sale{font-size:11px; color:#888; font-weight:700; margin-right:15px;text-decoration: line-through;} .prd_gall ul li .txt > .price .sale{color:#d0111b;font-weight:700;} /* 상품상세페이지 */ #view{width:100%; min-width:320px;} #view .info{position:relative} #view .info .img{width:100%;} #view .info .img img{width:100%; height:auto;} #view .info .product_ifo{letter-spacing:-0.25px;} #view .info .price_info{padding:30px 0; border-bottom:2px solid #ededed;} #view .info .price_info > p{font-size:23px; color:#333; font-weight:500; margin-bottom:15px; } #view .info .price_info > span{display:block; font-size:18px; color:#888; margin-bottom:35px;} #view .info .price_info dl{font-size:0;} #view .info .price_info dl dt{font-size:18px; color:#333} #view .info .price_info dl dd{display:inline-block;} #view .info .price_info dl dd.sale{font-size:22px; color:#333; margin-right:17px;} #view .info .price_info dl dd.sale > span{font-size:30px; font-weight:500; color:#2e2e2e;} #view .info .price_info dl dd.no_sale{font-size:17px; color:#cfcfcf} #view .info .price_info dl dd.no_sale > span{font-size:23px;text-decoration: line-through;} #view .info .desc{} #view .info .desc ul{padding:30px 0;} #view .info .desc ul li{font-size:17px; color:#646464; font-weight:500; margin-bottom:15px;} #view .info .desc ul li:last-child{margin-bottom:0;} #view .info .desc ul li > span{display:inline-block; width:112px; color:#a9a9a9;} #view .info .desc > p{margin-bottom:7px; font-size:14px; color:#ff4611; font-weight:400} #view .info .desc > p > span{display:inline-block; vertical-align:top;} #view .info .desc > p img{margin-right:10px;} #view .info .select_wrap{padding:16px 0; border-top: 2px solid #ededed; border-bottom: 2px solid #ededed; box-sizing:border-box;} #view .info .select_wrap > div{float:left;} #view .info .select_wrap .txt{width:47.99107142857%;} #view .info .select_wrap .txt span.name{display:inline-block;font-size:14px; color:#333; font-weight:400;line-height:1.4;} #view .info .select_wrap .price{float:right;font-size:12px; color:#222; font-weight:400;} #view .info .select_wrap .price > span{font-size:17px; } #view .info .select_wrap .option{width:110px; font-size:17px; position:relative;} #view .info .select_wrap .option > input{width:100%; font-family:'Lato', sans-serif; font-size:16px; color:#222; background:none; font-weight:bold; text-align:center;opacity:1; webkit-text-fill-color:inherit} #view .info .select_wrap .option .btn_box{} #view .info .select_wrap .option .btn_box button{display:block; width:28px; height:28px; position:absolute;top:0;text-indent:-9999px;} #view .info .select_wrap .option .btn_box .bt_down{left:0; background:url("/m/img/sub/shopping01_view_icon02.png") no-repeat;} #view .info .select_wrap .option .btn_box .bt_up{right:0; background:url("/m/img/sub/shopping01_view_icon03.png") no-repeat;} #view .info .final_price{height:87px; line-height:87px; border-bottom: 2px solid #ededed; box-sizing:border-box;} #view .info .final_price dl{font-weight:700;} #view .info .final_price dl dt{font-size:17px; color:#222; float:left;} #view .info .final_price dl dd{font-size:23px; color:#ff4611; float:right;} #view .info .btn_group{padding:32px 0; border-bottom: 2px solid #ededed; box-sizing:border-box;} #view .info .btn_group ul{} #view .info .btn_group ul li{height:52px; float:left; margin-right:1.33928571429%;} #view .info .btn_group ul li:last-child{margin-right:0;} #view .info .btn_group ul li input[type="button"]{display:block; width:100%; height:100%; line-height:52px;color:#fff; font-size:15px; text-align:center;} #view .info .btn_group ul li:nth-child(1){width:45.98214285714%;} #view .info .btn_group ul li:nth-child(2){width:25.66964285714%;} #view .info .btn_group ul li:nth-child(3){width:25.66964285714%;} #view .info .btn_group ul li:nth-child(1) input[type="button"]{background-color:#fc4513;} #view .info .btn_group ul li:nth-child(2) input[type="button"]{background-color:#007dc9;} #view .info .btn_group ul li:nth-child(3) input[type="button"]{background-color:#555;} #view .n_pay{padding:10px 0 40px;} #view .detail{width:100%; height:100%; position:relative;} #view .detail .detail_tab{height:35px;} #view .detail .detail_tab ul{} #view .detail .detail_tab ul li{width:25%; height:35px; float:left; } #view .detail .detail_tab ul li a{display:block; width:100%; height:100%; line-height:35px; font-size:15px; color:#777; text-align:center;background-color:#f5f5f5; border: 1px solid #c7c7c7; border-right:none; border-bottom:1px solid #555; box-sizing:border-box;} #view .detail .detail_tab ul li:last-child{border-right:1px solid #c7c7c7; box-sizing:border-box;} #view .detail .detail_con{padding:40px 0;} #view .detail .detail_con > div{display:none;} #view .detail .detail_con .product{} #view .detail .detail_con .product img{width:100%!important; height:auto!important;} #view .detail .detail_tab ul li.on a{background-color:#fff; border:1px solid #555; border-bottom:1px solid #fff;} /******************************************************************************* @media *******************************************************************************/ @media all and (max-width:1888px) { .inner1888{padding: 0 16px;} } @media all and (max-width:550px) { #greeting .con04 ul.tel li{float:none;} #greeting .con04 ul.tel li:first-child{margin-right:0; border-bottom:1px solid #ebebeb} } @media all and (max-width:480px) { #greeting .con01 .txt{ top:20px} #greeting .con01 .txt img{margin-bottom:10px;} #greeting .con01 .txt_box > p br{display:none;} #greeting .con01 .txt_box > p.mb{margin-bottom:5px} .story_tit> span br{display:none;} #story01 .con02 .txt ul{text-align:center;} #story01 .con02 .txt ul li{width:86px; height:86px; font-size:24px; line-height:86px; } #story01 .con03 .info > div{padding:45px 60px;} #story02 .con_tit p {word-break:break-word;} #story02 .con_tit p br{display:none;} #story02 .con_tit {margin-bottom: 20px;} #story02 .txt_box p {margin-bottom: 15px;} } @media all and (max-width:440px) { .top_tit > span br{display:none; word-break: break-word;} #story01 .con02 .con02_box {padding:30px 16px 30px;} #story01 .con02 .con_tit {margin-bottom: 30px;} #story01 .con02 .mean dl.mean01 {width: 100%; margin-bottom:20px} #story01 .con02 .mean dl.mean02 {width: 100%;} #story01 .con02 .mean dl dd {word-break: break-word;} #story01 .con02 .mean dl dd br{display:none;} #story02 .con_tit {margin-bottom: 10px;} #story02 .txt_box p {margin-bottom: 10px;} } @media all and (max-width:420px) { #story01 .con02 .txt ul li{width:66px; height:66px; font-size:20px; line-height:66px; } #story01 .con03 .info > div{padding:45px 30px;} } @media all and (max-width:390px) { #shopping01 .order ul li a{padding:0 10px;} #shopping01 .shop ul li .txt > .tit {margin: 5px 0 10px;} #view .detail .detail_tab ul li a{font-size:13px;} } @media all and (max-width:360px) { #story01 .con02 .txt ul li{width:50px; height:50px; font-size:16px; line-height:50px; } } /* 서브탭 리스트 */ #container {position:relative; overflow:hidden; margin:0 auto; box-sizing:border-box;} #container .sticky-wrapper {position:absolute; top:0px; left:0; display: block; width:100%; height: 50px; z-index: 10;} /* 서브메뉴 수정시 추가소스 */ .clear { clear:both; display:block; } .clearfix:after {content: ""; display: block; clear: both;} .clearfix > li {display: block; float:left;} body.scroll_off { overflow:hidden;} /** dropdownlist **/ .dropLst { display:inline-block; /* position:relative; */ vertical-align:middle; color:#666;} .dropLst .txt { position:relative; display:block; text-align:left; text-decoration:none; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; height:40px; padding:0 40px 0 10px; box-sizing:border-box; color:#333; } .dropLst .hidradio { opacity:0; filter:alpha(opacity=0); position:absolute; z-index:-1; top:5px; left:5px; } .dropLst .dlst { display:none; position:absolute; top:100%; z-index:9; } /* box-shadow:1px 1px 1px rgba(0,0,0,.2); -webkit-box-shadow:1px 1px 1px rgba(0,0,0,.2); min-width:100%; */ .dropLst.bottom .dlst { top:auto; bottom:100%; } .dropLst .dlst.aright { right:0; } .dropLst ul { margin-top:-1px; background-color:#fff; max-height:400px; padding:0; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; -webkit-box-sizing:border-box; } .dropLst ul > li { position:relative; } .dropLst ul > li > label { display:block; position:relative; cursor:pointer; } .dropLst ul > li > label > span { display:block; } .dropLst ul > li > a:hover, .dropLst ul > li > label:hover > span, .dropLst ul > li > label.hover > span { /* background-color:#f3f3f3; */ } .dropLst .txt, .dropLst ul { border:1px solid #d7d7d7; } .dropLst .txt, .dropLst li span, .dropLst li a { line-height:38px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .dropLst li span, .dropLst li a { padding:0 10px; } .dropLst li a.selected, .dropLst li a.on, .dropLst li label.on span {/*font-weight:bold;*/} .dropLst li span, .dropLst li a { display:block; } /** 서브 네비게이션 모바일 **/ .mobile_snb {display: block; width:100%; margin:0 auto; height:46px; background:#fff;} .mobile_snb .box {float:left; height:46px; width: 50%; background-color: #3c4247; box-sizing:border-box; } /* background-color: #fff; */ .mobile_snb .box.dep1 {border-right:1px solid #505559;}/*background-color: #003591;*/ .mobile_snb .dropLst .txt, .mobile_snb .dropLst li span, .mobile_snb .dropLst > a {padding-left:10px; width:100%; height: 46px; line-height: 46px; font-size:13px; border:none; z-index: 99; box-sizing:border-box; letter-spacing:-0.5pt;} .mobile_snb .box .dropLst .txt {padding-right:40px; color:#fff;} .mobile_snb .box .dropLst .txt:before {content: ""; position: absolute; top:50%; right:10px; display: block; width: 10px; height: 8px; margin-top:-4px; background:url('/m/img/lnb_arrow.gif') left center no-repeat; background-size:10px auto; -webkit-transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); transition:all 0.2s cubic-bezier(0, 0, 0.25, 1);} .mobile_snb .box .dropLst .txt.on:before {-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);} .mobile_snb .box .dropLst ul {padding:0;} .mobile_snb .box.dep1 .dropLst ul, .mobile_snb .box.dep1 .dropLst ul li {background-color:#f9f9f9; border-bottom:1px solid #ddd;} /* background-color: #003591; */ .mobile_snb .box.dep1 .dropLst ul li:first-child {border-top:1px solid #ddd;} .mobile_snb .box.dep1 .dropLst ul li:last-child {border-bottom:0;} .mobile_snb .box.dep1 .dropLst li .value {padding-left:10px; width:100%; height: 46px; line-height: 46px; font-size:13px; border:none; z-index: 99; box-sizing:border-box; letter-spacing:-0.5pt; color:#555;} .mobile_snb .box.dep1 .dropLst li .value.on {color:#fff; background:#1c4e93;} .mobile_snb .box.dep1 .dropLst .txt {color:#fff; } .mobile_snb .box.dep1 .dropLst .txt:before {background:url('/m/img/lnb_arrow.gif') left center no-repeat; } /* 첫번째 서브메뉴 화살표 위치 */ /* background-position: 0px 0px */ .mobile_snb .box.dep2 .dropLst ul, .mobile_snb .box.dep2 .dropLst ul li {background-color: #f9f9f9;} .mobile_snb .box.dep2 .dropLst ul li {border-bottom:1px solid #ddd;}/*background-color: #fff;*/ .mobile_snb .box.dep2 .dropLst ul li:first-child {border-top:1px solid #ddd;} .mobile_snb .box.dep2 .dropLst li .value {padding-left:10px; width:100%; height: 46px; line-height: 46px; font-size:13px; border:none; z-index: 99; box-sizing:border-box; letter-spacing:-0.5pt; color:#555;} /*color:#003591;*/ .mobile_snb .box.dep2 .dropLst li .value.on {color:#fff; background:#1c4e93;} /*color:#00aeef;*/ .mobile_snb .dropLst {width:100%; box-sizing: border-box;} .mobile_snb .dropLst .dlst {width:100%; left:0;} .mobile_snb .dropLst .dlst ul {border:none;} /******** SUB ********/ /* COMMON */ /*.sub_tit {color:#111; padding:10px 0 20px 0; font-size:24px; line-height:0px; margin-bottom:10px;}*/ .bgnone{background:none !important;} .ready{text-align:center; padding:30px 0;} .clear_both{clear:both; *zoom:1;} .block{display:block} .dott_line{background:url(/img/bg_dott.gif) bottom repeat-x} .icon_1depth{color:#333; font-size:16px; background:url(/img/icon_1depth.gif) no-repeat; padding-top:5px;} .small {background: url('/img/list_dot_g.gif') no-repeat 3px 10px; padding-left: 9px; margin: 3px 0px;} .blue_tt{color:#1b8ed9;} .con_tit {font-size:20px; line-height:24px; letter-spacing:-1.5pt; color:#444; font-weight:700; padding:0 0 15px 0;} .con_tit span.thin{line-height:24px; letter-spacing:-1.5pt; color:#444; font-weight:100;} .table_style{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #333;} .table_style th{color:#444; font-weight:600; text-align:left; padding:14px 0 14px 15px; border-bottom:1px solid #d4d4d4; background-color:#f9f9f9; letter-spacing:-0.5pt;} .table_style td{border-bottom:1px solid #e9e9e9; padding:14px 0 14px 15px; text-align:left} h4.tit_sub {font-size:31px; line-height:37px; letter-spacing:-1.5pt; color:#444; font-weight:100;} span.title_blue {line-height:37px; letter-spacing:-1.5pt; color:#064e91; font-weight:700;} span.title_black {line-height:37px; letter-spacing:-1.5pt; color:#444; font-weight:700;} h5.stit_sub {font-size:16px; line-height:22px; letter-spacing:-0.7pt; color:#888; font-weight:100;} #m_content {padding:10px; overflow:hidden;} .tab{overflow:hidden; margin-bottom:20px;} .tab li{float:left; background:#e5e6e8; padding:10px 15px; margin-right:2px; font-weight:bold; font-size:15px;} .tab li a{color:#6e7377 !important} .tab li.hover{background:#1b8ed9;} .tab li.hover a{color:#fff !important} #btn_totalmenu1 {position:absolute; z-index:999;} #btn_totalmenu1 dl{float:left; background-color:#fff; width:180px; -webkit-box-shadow: 1px 1px 5px #aaa; /* Safari and Chrome */ -moz-box-shadow: 1px 1px 5px #aaa; /* Firefox */ box-shadow: 1px 1px 5px #aaa; /* CSS3 */ filter: progid:DXImageTransform.Microsoft.Shadow(color=#7d7d7d, Direction=120, Strength=5);} #btn_totalmenu1 dd a:link, #btn_totalmenu1 dd a:visited{display:block; width:164px; font-size:0.9em; padding:8px; border-bottom:1px solid #e5e5e5} #btn_totalmenu1 .close{float:right;} #btn_totalmenu1 .close a{display:block; background-color:#363636; padding:8px;} /* catelist */ .mypage_list {background-color:#f0f0f0; padding:20px 10px; } .mypage_list ul{position:relative; overflow:hidden; background-color:#fff; border-right:1px solid #e5e5e5; border-top:1px solid #e5e5e5;} .mypage_list li{position:relative; float:left; width:50%; line-height:46px; border:1px solid #e5e5e5; border-top:0; border-right:0; padding-left:12px; box-sizing:border-box} .mypage_list li a:link, .mypage_list li a:visited{display:block;} .mypage_list li div{position:absolute; right:10px; top:0} .mypage_list dl{padding:5px 0 5px 0; border-bottom:1px dashed #ddd;} .mypage_list dd{font-size:0.9em; line-height:1.7em; } .cate_list_con{border-top:1px solid #c5c5c5; border-bottom:1px solid #ddd; padding:10px 0; background-color:#f5f5f5} .cate_list td{width:33.3333333%; font-size:13px; padding:4px 0 4px 10px;} /* selece */ .prd_sort {position:relative; overflow:hidden;} .prd_sort.search {border-top:1px solid #ddd;} .prd_sort .view_option {position:relative; float:left; width:67px; margin-top:7px; margin-left:10px;} .prd_sort .view_option>a {overflow:hidden; display:block; float:left; margin-left:-1px; width:34px; height:34px; background:url('/m/img/sub/item_list.png') no-repeat 0 0;text-indent:-999em} .prd_sort .view_option>a.button_view {background-position:0 0} .prd_sort .view_option>a.selected.button_view {position:relative;background-position:-80px 0} .prd_sort .view_option>a.button_list {background-position:-40px 0} .prd_sort .view_option>a.selected.button_list{position:relative;background-position:-120px 0} .prd_sort .select_style {position:relative; float:right; padding:8px 0;} .select_style select{font-size:12px; border:1px solid #ddd; background-color:#fff; padding:6px; margin-right:10px;} /* prdlist */ /* 갤러리형 css */ .prd_gall {width:100%; overflow:hidden; margin:0 auto;} .prd_gall li {float:left; width:50%; box-sizing:border-box; margin-bottom:10px;} .prd_gall table {width:94%; margin:0 auto; border-collapse:separate; border-spacing:0px;} .prd_gall table .img{width:100%; max-width:300px; max-height:300px; border:1px solid #ddd;} .prd_gall table .img img{max-width:300px; max-height:300px; width:100%;} .prd_gall th{ word-break: break-all; padding:10px; box-sizing:border-box; font-weight:normal; text-align:left;} .prd_gall th p.tit {font-size:14px; color:#444; padding:0px 0 5px 0} .prd_gall th p.stit {font-size:12px; color:#777; margin-bottom:5px;} .prd_gall td {width:120px;} /* 썸네일형 css */ .prd_list{width:100%; margin:0 auto; border-top:1px solid #ddd} .prd_list li {padding:10px; border-bottom:1px solid #e6e6e6} .prd_list table {width:100%; border-collapse:separate; border-spacing:0px;} .prd_list table .img {width:110px; height:110px; border:1px solid #ddd;} .prd_list table .img img{max-width:110px; max-height:110px;} .prd_list th {word-break: break-all; font-weight:normal; text-align:left; vertical-align:middle;} .prd_list th p.tit {font-size:14px; color:#444; padding:0px 0 5px 0} .prd_list th p.stit {font-size:12px; color:#777; margin-bottom:5px;} .prd_list td {width:120px;} .prd_price {color:#333; font-size:15px; font-weight:600;} /* 페이징 - 더보기 */ .prdlist_more {position:relative; overflow:hidden;text-align:center; margin:15px 0;} .prdlist_more a {display:block; border:1px solid #ddd; line-height:36px; height:38px} .prdlist_more span.arr {width:14px; height:8px; line-height:36px; margin-left:8px; display:inline-block; background:url('/m/img/sub/arrow_bo.png') top center no-repeat;} /* prd view */ .prd_view {position:relative; overflow:hidden; margin-top:55px;} .prd_view dl {padding:15px 0 10px 0;} .prd_view dt {font-size:15px; color:#333; font-weight:600;} .prd_view dd {position:absolute; right:0; top:10px} .prd_view dd a {display:block; border:1px solid #ddd; text-align:center; width:38px; line-height:30px; font-size:12px; } .prd_view .prd_view_img {position:relative;} .prd_view .prd_view_img p.sp_img{position:absolute; z-index:9; bottom:0; left:0} /* 롤링이미지 기능추가 */ .prd_view_img .slider {width:100%; } .prd_view_img .slick-slide {position:relative; margin: 0; padding:0} .prd_view_img .slick-dots{} .prd_view_img .slick-dots {position:absolute; z-index:999; bottom:0; width:100%; min-height:auto; padding:0 0 15px 0; box-sizing:border-box; text-align:center; background:none} .prd_view_img .slick-dots li {float:none; display:inline-block; width:14px; height:14px; margin-right:3px; background:none} .prd_view_img .slick-dots li button{display:block; cursor:pointer; width:12px; height:12px; border-radius:100%; background:#aaaaaa; border:0; font-size:0; margin:0; padding:0; line-height:0} .prd_view_img .slick-dots li.slick-active button{background:#5f6062} .slick-slider {position: relative;display: block;box-sizing: border-box; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent; } .slick-list {position: relative;display: block;overflow: hidden;margin: 0;padding: 0;} .slick-slide {display: none;float: left; height: 100%;min-height: 1px; text-align:center;} .slick-initialized .slick-slide{display: block; } .prd_view_tab{padding:0 0 15px 0;} .prd_view_tab th{width:33.3333%; background:#fff; border-top:1px solid #aaa; height:35px;font-size:14px; color:#777 !important; font-weight:normal} .prd_view_tab th div{color:#777 !important;} .prd_view_tab td{width:33.3333%; text-align:center; font-size:14px; background:#f5f5f5; color:#888; border-top:1px solid #ddd; border-bottom:1px solid #ddd;} .prd_view_tab th a{color:#777;} .prd_view_tab td a{color:#777;} .prd_view_table{border-collapse:separate; border-spacing:0px;} .prd_view_table td.txt{padding:12px 0 0 10px} .prd_view_table .prd_tit {font-size:16px; color:#333; line-height:100%; padding:0 0 8px 0} .more_view{background:#e3e3e3; border-bottom:1px solid #cdcdcd; text-align:center; line-height:20px; font-size:14px; padding:3px 0;} #basket_table {background-color:#f5f5f5; margin:10px auto;} #basket_table td{padding:3px 0 3px 0; height:28px; line-height:100%;} #basket_table td img, input{vertical-align:bottom} .opt_area{position:relative; overflow:hidden;} .opt_area.fixed{position:fixed; width:100%; left:0; bottom:0; z-index:903; box-sizing:border-box;} .opt_area .cart_btn{display:none;} .opt_area.fixed .cart_btn {display:block; width:100%; text-align:center; background:url('/m/img/sub/cart_bg.png') 0 -6px repeat-x; vertical-align:bottom; height:29px;} .opt_area.fixed .cart_btn img {width:80px; cursor:pointer} .opt_area.fixed .opt_area_in {padding:10px 10px 0 10px; background:#fff;} .view_btn{position:relative; overflow:hidden; margin-bottom:30px; padding:10px 0 0 0;} .view_btn.fixed{margin-bottom:0; background:#fff; padding:10px;} .view_btn li{float:left; width:32%; margin:0 2% 0 0} .view_btn.fixed li{float:left; width:32.5%; margin:0 1.25% 0 0} .view_btn li:last-child{margin:0} .view_total_price{background:#fff; color:#6d6e71; border:2px solid #6d6e71; text-align:center; padding:10px 0; font-weight:bold;} .opt_area.fixed .view_total_price{padding:8px 0;} .view_total_price b{font-size:20px;} .buy_btn{position:fixed; right:10px; bottom:50%; z-index:99;} .buy_btn a:link, .buy_btn a:visited{display:block; box-sizing:border-box; width:48px; height:48px; padding:8px 0 0 0; line-height:15px; border:1px solid #2992ef; font-size:13px; letter-spacing:-0.5pt; font-weight:600; background-color:#54a6f2; color:#f0f0f0; text-align:center; } .prd_info{position:relative; padding-top:10px;} .sns_sc {position:absolute; z-index:9; right:0; top:13px; font-size:12px; letter-spacing:-0.5pt; color:#888; vertical-align:middle;} .sns_sc img {margin:0 0.5px; vertical-align:middle;} /*cart*/ .cart_con {position:relative; overflow:hidden; background-color:#f5f5f5; padding:10px 10px 0 10px;} .cart_table .cart_in {position:relative; overflow:hidden; background-color:#fff; margin-bottom:10px; border:1px solid #ddd; padding:10px 8px 15px 10px;} .cart_table .cart_in .cart_check {padding-bottom:12px;} .cart_table .cart_in .cart_check p {display:inline-block; margin-right:5px;} .cart_table .cart_in .cart_check p input[type="checkbox"]{width:18px; height:18px; vertical-align:middle; border:none; background-color:#fff} .cart_table .cart_in .cart_check a:link, .cart_table .cart_in .cart_check a:visited {font-size:15px; color:#333;} .cart_table td {vertical-align:top;} .cart_table td.cart_img img{border:1px solid #ddd;} .cart_table td.cart_txt {padding-left:10px;} /* button */ /*.btn{padding-top:10px; height:32px}*/ /* 네이버체크아웃 삽입에 따른 height값 조정 */ .btn{padding:10px 0 30px 0; height:40px} .gray_box{background:#f1f1f1; margin-top:10px; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; padding:10px 15px;} .graybox{background:#f1f1f1; border:1px solid #e6e6e6; padding:10px; font-size:12px;} .total_price{margin:10px 3% 5px 3%; background:#fff; color:#333; border:2px solid #444; text-align:center; padding:10px 0; font-weight:bold;} .total_price b{font-size:20px;} .total_price_table{} .total_price_table th{color:#333; text-align:center; padding:5px 10px 5px 10px;} .total_price_table td{text-align:center; padding:0 10px 5px 10px;} .total_price_table b{font-size:15px; color:#333} .btn {margin-left:10px; margin-right:10px} /* page_no */ /*.page_no{margin:25px 0; text-align:center;} .page_no td{color:#787878} .page_no b{color:#333333;} .page_no img{padding-left:1px; padding-right:1px}*/ .page_num {position: relative; width: 100%; text-align: center; padding: 15px 0 20px 0 } .page_num ul.pagination { display: inline-block; padding: 0; margin: 0 } .page_num ul.pagination li { display: inline } .page_num ul.pagination li a { color: #666; float: left; padding: 6px 10px; text-decoration: none; border: 1px solid #CBCBCB; margin: 0 1px; font-size:12px; } .page_num ul.pagination li a.active { background: #484C57; color: #FFF; border: 1px solid #484C57 } /* list */ .gray_list li{font-size:12px; color:#787878; line-height:130%; padding-left:8px; background:url(../img/sub/point.gif) 0px 5px no-repeat;} /* 주문 */ .order_tit {width:100%; background:#888; padding:10px 8px; box-sizing:border-box; overflow:hidden;} .order_tit p {float:left; width:calc(100% - 85px); font-size:15px; color:#fff; font-weight:600; letter-spacing:-0.5pt;} .order_tit a:link, .order_tit a:visited {float:right; width:80px; color:rgba(255,255,255,0.9); font-size:12px; letter-spacing:-0.5pt; background:url('/m/img/sub/icon_arr.png') right center no-repeat; padding-right:5px;} .form_tit{color:#333; font-size:15px; font-weight:bold; padding:15px 0 10px 0px;} .order_table {padding:10px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; background-color:#f9f9f9; margin-bottom:10px;} .order_table .order_in {width:94%; margin:0 auto 10px auto; background:#fff; border:1px solid #ddd; padding:10px; box-sizing:border-box;} .order_table .order_in:last-child {margin:0 auto;} .join_input_table{} .join_input_table th {text-align:left; font-size:13px; color:#333; padding:5px 0 5px 10px;} .join_input_table td {text-align:left; font-size:13px; padding:3px 10px 3px 0;} .join_input_table td td{border:0 none; padding:0} .join_input_table td.checkbox{padding:3px 0 10px 10px; vertical-align:middle; } .join_input_table td.radio{padding:3px 0 3px 0; vertical-align:middle; line-height:180%;} .join_input_table td.checkbox input[type="checkbox"]{width:18px; height:18px; vertical-align:middle; border:none; margin:0 4px 1px 0} .join_input_table td input[type="radio"]{width:18px; height:18px; vertical-align:middle; border:none; margin:0 4px 1px 0} .order_table .order_btn {width:100%; padding:0 10px; box-sizing:border-box; margin-top:10px;} .order_table .order_btn input[type='button'] {width:49.5%; margin-right:0.4%;} .join_input_table2{} .join_input_table2 th {text-align:center; font-size:13px; color:#333; padding:5px 0 5px 0; vertical-align:top;} .join_input_table2 td {text-align:center; font-size:13px; padding:3px 0 3px 0;} .join_input_table3{} .join_input_table3 th {text-align:left; font-size:13px; color:#333; padding:5px 0 5px 10px;} .join_input_table3 td {text-align:left; font-size:13px; padding:5px 10px 5px 0;} .join_input_table3 td td{border:0 none; padding:0} .join_input_table3 td.checkbox{padding:3px 0 10px 10px; vertical-align:middle; } .join_input_table3 td.radio{padding:3px 0 3px 0; vertical-align:middle; line-height:180%;} .join_input_table3 td.checkbox input[type="checkbox"]{width:18px; height:18px; vertical-align:middle; border:none; margin:0 4px 1px 0} .join_input_table3 td input[type="radio"]{width:18px; height:18px; vertical-align:middle; border:none; margin:0 4px 1px 0} .input_style{width: 100%; height:32px; padding:5px; background: #fff; color: #666; box-sizing:border-box; border:1px solid #ddd} .textarea{width: 100%; padding:5px; background: #fff; color: #666; box-sizing:border-box; border:1px solid #ddd} .select{width: 100%; height:32px; background: #fff; color: #666; box-sizing:border-box; border:1px solid #ddd} .tmar_2{margin-top:2px} /* 주문완료 */ .order_ok .btn {margin:0;} /****** 회사소개 ******/ /* about */ .about_con {position:relative; overflow:hidden;} .about_con h4 {padding-bottom:18px} .about_con h5 {padding-bottom:30px} .about_con img {max-width:640px; width:100%; margin-bottom:20px;} /* location */ .location_con{position:relative; overflow:hidden} .location_con h4{padding-bottom:15px} .location_con h5{padding-bottom:28px} .map_txt{position:relative; overflow:hidden;} .map_table {width:100%; border-collapse:separate; border-spacing:0px;} .map_table th {font-weight:600; width:70px; color:#333; text-align:left; padding:5px 0 5px 0; vertical-align:top;} .map_table td {padding:5px 0 5px 10px;} .locationBtn {padding-top:20px; text-align:right;} .locationBtn img{} /* pro_main */ .pro_main li{width:100%; display:block; margin-top:10px; text-align:center} .pro_main li img{width:100%; max-width:640px;} /* as_guide */ .as_guide_area {position: relative; display: block; margin-bottom: 80px;} .as_guide_area.guide1 {} .as_guide_area.guide2 { background: url('/customer/img/s01_2_bg.jpg') no-repeat;} .guide4 {position: relative; display: block; background: url('/customer/img/s01_4_bg.jpg') no-repeat; min-height: 142px; padding-top: 30px;} .as_guide_area h3 {padding: 30px 0 40px 10px; font-size:30px; color:#222;border-bottom:2px solid #333;} .as_guide_area h3 .subcopy{margin-top:10px; font-size:16px; color:#888; font-weight:normal} .as_guide_area .as_rule_guide {position: relative; width: 100%;} .as_guide_area h4 {margin: 40px 0 15px 0;} .as_guide_area .small {background: url('/img/list_dot_b.gif') no-repeat 3px center; padding-left: 9px; margin: 5px 0px;} .as_guide_area table tr td {padding:15px 10px 15px 15px;} .as_guide_area table tr td.list p {margin-bottom:8px;} .as_guide_area table tr td.bold {font-weight: bold; color: #333;} .as_guide_area table tr th {padding:12px 0px 12px;} .as_guide_area .as_pay_guide {position: relative; width: 100%; border: 1px solid #ddd; padding: 44px 48px 33px 30px; margin: 20px 0; background: url('/customer/img/s01_2_img01.jpg') no-repeat 670px 40px;} .as_guide_area .as_pay_guide h3 {padding: 0 0 34px 10px; line-height: 100%; margin: 0px; top: 0px;} .as_guide_area .as_pay_guide a {padding: 0px; margin: 0px;} .as_box {width:100%; position: relative; display: block; background: #f9f9f9; margin-top: 20px; padding:15px 0;} .as_box h5 {color: #252525; font-weight: bold; font-size: 16px; margin-bottom: 20px;} ul.list_check li {list-style: none; background: url('/img/check_icon.gif') no-repeat left 6px; padding-left: 16px; margin: 20px;} .as_box p {margin: 20px;} .as_map_area h3 {padding: 20px 0 0 10px; font-size:30px; color:#222; line-height:30px;} /* table */ .table_normal th, .table_normal td{padding:3px; text-align:left; font-weight:normal;} .table_normal th {color:#999999; width:50px; font-size:12px; word-break: break-all; } .table_normal td {font-size:13px; vertical-align:top; word-break: break-all; } .table_normal td select{font-size:13px; border:1px solid #ddd; background-color:#fff; padding:4px;} .table_amount td{padding:0; height:28px; line-height:100%; } .table_amount td img, input{vertical-align:bottom} .table_style {border-top:1px solid #000; border-left:1px solid #ddd;} .table_style th{background:#FAFAFA; border-bottom:1px solid #ddd; border-right:1px solid #ddd; color:#333; padding:8px 10px;} .table_style td{border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:8px 10px 8px 15px;} .table_style .left{text-align:left !important;} .tax_table{border-left:1px solid #ddd !important; border-top:1px solid #ddd !important;} .tax_table td{border-bottom:1px solid #ddd !important; border-right:1px solid #ddd !important; padding:2px !important; font-size:0.8em} /* 150507 */ .board{padding:20px 0;} /*이용안내관련*/ .policy {width:100%; line-height:150%; margin:0 auto;} .policy_head {font-weight:bold; padding-bottom:20px; text-align:center; color:#000; font-size:17px;} .policy_tit {font-weight:bold; padding-bottom:10px; color:#333; font-size:15px;} .dep_tit {padding:0 0 5px 0; font-weight:bold; color:#555;} .dep_cont {padding:7px 10px 20px 15px;} .dep_cont2 {background:#f4f4f4; border:1px solid #e1e1e1; padding:10px; margin:10px 0px;} .dep_box {padding:5px 10px 10px 0px;} .dep_img01 {padding:5px 0 25px 5px;} .dep_tit02 {display:block; padding:5px 0 10px 10px;} .dep_cont02 {display:block; padding:7px 10px 10px 20px;} .dep_img02 {padding:5px 0 25px 5px;} /* 결재 관련 */ .uup {margin-top:-20px; margin-left:27px; padding:0; position:relative;} .down {margin-top:-0px; margin-left:27px; padding:0; position:relative;} .pay_add_tit {font-size: 11px; color: #555;} .pay_add_tit2 {font-size: 11px; color: #f15795;} .pri_box {padding:20px 15px; border:1px solid #ddd; margin:15px 10px;} .pri_box p.tit {margin-bottom:10px; color:#333; font-size:15px; letter-spacing:-0.5pt; font-weight:600;} .pri_box textarea {padding:5px; border:1px solid #ccc; font-size:13px;} .pri_btn{clear:both; overflow:hidden;} .pri_btn a{display:block; font-size:13px; float:left; border:1px solid #ddd; background:#ececec;width:32.6%; box-sizing:border-box;-webkit-box-sizing:border-box; margin-right:1%; text-align:center; padding:5px 0; letter-spacing:-1pt;} .pri_btn a:last-child{margin-right:0;} /* view_review */ .review{padding:10px 0 10px 0} .review_info{color:#787878; font-size:14px; line-height:150%;} .review_title{font-size:12px; line-height:150%; text-align:center; padding:8px 0} .review_con{font-size:12px; background:rgb(247, 247, 247); padding:10px; margin-top:5px;} .qna_con{font-size:12px; background:rgb(247, 247, 247); padding:10px; margin-top:5px;} .info_mbox{margin:0 10px;} .prd_dimg{text-align:left; margin-bottom:30px;} .prd_dimg .title{color:#333; font-size:14px; letter-spacing:-0.5pt; margin-bottom:10px; background:#F9F9F9; border:1px solid #ddd; text-align:center; padding:8px; border-top-color:#333;} .board_btnw{text-align:right; margin:10px 0 0 0} .btn_type2{display: inline-block; background:#fff; color:#555;text-align: center; -webkit-appearance: none; -webkit-border-radius: 0; height: 33px; line-height: 33px;width: 70px;border: 1px solid #ccc;font-size: 12px;letter-spacing: -0.5pt;vertical-align: top; cursor:pointer} .retable{border-top:1px solid #333;} .reinbox{padding:8px 3px;} .reinbox .subject{margin-bottom:5px; font-size:14px; color: #333; letter-spacing:-0.55pt;} .reinbox .writer {overflow:hidden; clear:both; } .reinbox .writer li{float:left; font-size:12px; color:#a0a0a0; padding:0 6px; background:url('/m/img/bbs_list_line.gif') no-repeat left center;} .reinbox .writer li:first-child{padding-left:0; background:none;} /******* 마이페이지 *******/ /* 주문내역 조회 */ .order_search {padding:20px 10px; box-sizing:border-box; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin-bottom:20px; box-shadow:0px 3px 0px #f2f2f2; background:#f9f9f9;} .order_search dl {width:100%; overflow:hidden;} /*.order_search dt {float:left; width:45px; color:#333; font-size:13px; margin-bottom:5px; font-weight:600; line-height:35px;} .order_search dd {float:left; width:calc(100% - 45px); margin-bottom:5px;}*/ .order_search dt {color:#333; font-size:13px; margin-bottom:5px; font-weight:600;} .order_search dd {} .order_search dd select {padding:8px 5px; width:100%; border:1px solid #ccc; font-size:13px;} .order_search dd .setPeriod input[type=button] {width:19%; height:33px; font-size:12px; line-height:31px; letter-spacing:-0.5pt; box-sizing:border-box;} .period_1 {border:1px solid #3e3d3c; background:#3e3d3c; color:#fff; margin:0 2px 0 0; cursor:pointer;} .period_2 {border:1px solid #a3a3a3; background:#fff; margin:0 2px 0 0; cursor:pointer;} .period_2:hover {border:1px solid #3e3d3c !important; background:#3e3d3c !important; color:#fff !important; } .order_search dd .date {margin-top:5px;} .order_search dd .date p {display:inline-block; border:1px solid #ddd; box-sizing:border-box; width:calc(50% - 15px); padding:8px 5px; background:#fff;} .order_search dd .date p input[type=text] {width:calc(100% - 25px);} .order_search dd .date span {width:20px; display:inline-block; text-align:center; line-height:35px;} .order_search input[type=submit] {width:100%; margin-top:10px; text-align:center; background:#555; color:#fff; font-size:13px; letter-spacing:-0.5pt; padding:10px 0;} .order_detail {padding-bottom:15px; box-sizing:border-box;} .order_detail .total_price {margin:10px 0 5px 0;} .order_detail .order_btn {width:100%; box-sizing:border-box; margin-top:10px;} .order_detail .order_btn input[type='button'] {width:49.5%; margin-right:0.4%; font-size:13px; line-height:38px; height:40px; box-sizing:border-box; text-align:center; } .order_detail .order_btn input.btn_orderCancel {background-color:#fff; border:1px solid #d4d4d4; color:#666;} .order_detail .order_btn input.btn_List {background:#333; border:1px solid #333; color:#fff;} .order_info {padding:10px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; background-color:#f9f9f9; margin-bottom:10px; box-sizing:border-box;} .order_info .order_in {position:relative; overflow:hidden; background-color:#fff; margin-bottom:10px; border:1px solid #ddd; padding:10px 8px 15px 10px;} .order_info .order_in .cart_check {padding-bottom:12px;} .order_info .order_in .cart_check p {display:inline-block; margin-right:5px;} .order_info .order_in .cart_check p input[type="checkbox"]{width:18px; height:18px; vertical-align:middle; border:none; background-color:#fff} .order_info .order_in .cart_check a:link, .order_info .order_in .cart_check a:visited {font-size:15px; color:#333;} .order_in table {width:100%;} .order_in td {vertical-align:top;} .order_in td.cart_img {width:60px;} .order_in td.cart_img img {border:1px solid #ddd; max-width:60px;} .order_in td.cart_txt {padding-left:10px;} .order_in .prd_tit a:link, .order_in .prd_tit a:visited {font-size:15px; color:#333;} /* 쿠폰내역 */ .coupon_list {width:100%; border-top:1px solid #333; margin-bottom:15px;} .coupon_list li {border-bottom:1px solid #ddd; padding:15px 10px; box-sizing:border-box;} .coupon_list li div {padding:2px 0; overflow:hidden;} .coupon_list li strong {display:inline-block; width:80px;} .coupon_list li p {display:inline-block; width:calc(100% - 80px);} .coupon_list li.no {text-align:center; line-height:100px;} span.blue {color:#3785e5;} span.red {color:#de0404;} span.gray {color:#aaa;} /* 적립금 안내 */ .reserve_top {margin-bottom:15px} .reserve_top h6 {font-size:13px; letter-spacing:-0.9pt; font-weight:400; color:#888888; position:relative; margin-bottom:10px;} .reserve_top h6 span{font-size:13px !important; letter-spacing:-0.9pt; font-weight:600; color:#333;} .reserve_top .point_txt{letter-spacing:-0.55pt; font-weight:600; color:#333; font-size:13px;} .reserve_top .point_txt2{font-size:15px; font-weight:600; color:#333; padding:0 3px 0 5px;} .reserve_top .slash{font-size:14px; font-weight:400; padding:0 8px 0 10px;} .reserve_top > div {border:2px solid #ddd; padding:10px; font-size:12px; color:#707070; font-weight:600;} .reserve_list {width:100%; border-top:1px solid #333; } .reserve_list li {border-bottom:1px solid #ddd; padding:15px 10px; box-sizing:border-box;} .reserve_list li div {padding:2px 0; overflow:hidden;} .reserve_list li strong {display:inline-block; width:80px;} .reserve_list li p {display:inline-block; width:calc(100% - 80px);} .reserve_list li.no {text-align:center; line-height:100px;} /******************************************************************************* @media 461px~640px *******************************************************************************/ @media all and (min-width:461px) and (max-width:640px) { } /******************************************************************************* @media 320px~ 460px *******************************************************************************/ @media all and (max-width:460px) { /* 공통타이틀 */ h4.tit_sub {font-size:25px; line-height:30px; letter-spacing:-1pt;} span.title_blue {line-height:30px; letter-spacing:-1pt;} span.title_black {line-height:30px; letter-spacing:-1pt;} h5.stit_sub {font-size:14px; line-height:20px; letter-spacing:-0.5pt;} /* table */ .table_style th {font-size:13px;} .table_style td {font-size:13px;} /*** 회사소개 ***/ /* 회사개요 */ .about_con .table_style th {width:30% !important;} .about_con .table_style td {width:70% !important;} /* 오시는 길 */ .map_table th {width:70px; font-size:13px;} .map_table td {font-size:13px;} } .btn_gray_small {background-color:#fff; border:1px solid #d4d4d4; font-size:12px; line-height:30px; height:32px; box-sizing:border-box; text-align:center; color:#666;} .btn_gray_small2 {background-color:#fff; border:1px solid #d4d4d4; font-size:12px; line-height:26px; height:28px; box-sizing:border-box; text-align:center; color:#666;} .btn_black_small {background-color:#333; border:1px solid #333; font-size:12px; line-height:30px; height:32px; box-sizing:border-box; text-align:center; color:#fff;} .btn_gray_list a{display:block; background-color:#fff; border:1px solid #c5c5c5; font-size:13px; line-height:22px; width:70px; height:22px; text-align:center; color:#666; margin:5px 0 0 0;} .btn_white_small{width:81px; height:32px; background:url(../../img/sub/btn_cancel.gif) top center no-repeat; line-height:32px; text-align:center; color:#787878; font-weight:bold; } .btn_small{background-color:#fff; font-size:13px; height:32px; border:1px solid #b8b8b8} .btn_etc{background-color:#fff; width:100%; height:40px; text-align:center; color:#333; border:1px solid #333;} .btn_join:link, .btn_join:visited{margin:0 auto; display:block; background:url(../../img/sub/btn_join.gif) left top no-repeat; width:108px; height:30px; line-height:30px; text-align:center; color:#ffffff; font-weight:bold;} .btn_join2{float:left; display:block; margin:0 1px; background:url(../../img/sub/btn_join.gif) left top no-repeat; width:108px; height:30px; line-height:30px; text-align:center; color:#ffffff; font-weight:bold;} .btn_join3{display:inline-block; margin:0 auto; background:#a3af45; border-radius: 3px; padding:0 20px; height:30px; line-height:30px; text-align:center; color:#ffffff !important; font-weight:bold;} .btn_grat_big{background:#2c2c2c; width:100%; height:40px; text-align:center; color:#ffffff;} /* page_no */ .sub .pager {} .sub .pager ul {font-size:0; text-align:center;} .sub .pager ul li.on a {background-color:#555; color:#fff;} .sub .pager ul li {display:inline-block; vertical-align:top; margin-right:4px;} .sub .pager ul li a:hover {background-color:#555; color:#fff;} .sub .pager ul li a {display:block; width:34px; height:30px; box-sizing:border-box; border-radius:3px; border:1px solid #ebebeb; overflow:hidden; font-size:13px; font-weight:400; color:#b5b5b5; line-height:30px; text-align:center; transition:all 0.3s;} .sub .pager ul li a img {width:100%; height:100%;}