🖥️Fresh#_PC 스킨 가이드

공통

포인트 컬러 일괄 변경하기

1. 컬러코드값 확인 Fresh# 스킨에 적용되어 있는 기본 컬러 코드 #8eb111을 확인합니다.

1. 관리자 > 디자인 메뉴 접속

1. 스타일시트/CSS 변경 좌측 하단 폴더트리 내 스타일시트/CSS더블 클릭하여 아래와 같이 표시된 스타일 시트를 오픈합니다.

1. ctrl+F 검색 후 수정하기 스타일시트 파일을 열어 Ctrl + F(검색)를 누르고 #8eb111를 검색하여 원하는 포인트 컬러 코드로 변경합니다. service.css (총 5개) event.css (총 6개) common.css (총 26개) layer.css (총 22개) goods.css (총 13개) list.css (총 4개) layout.css (총 Top 22개 / Left 15개) member.css (총 20개) board.css (총 15개) mypage.css (총 11개) main.css (총 1개) order.css (총 7개) button.css (총 72개)

1. 마우스 오버시 컬러 #829c00도 검색하여 원하는 포인트 컬러 코드로 변경합니다.

TOP형 메뉴 변경하기

1. 상단 메뉴의 font-size(크기), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 49줄

.top_member_box > li a {
    display: inline-block;
    padding: 4px 0 4px 10px;
    font-size: 12px;
}

layout > layout.css | css/layout/layout.css 53줄

.body-main .top_member_box > li > a {
    color: #fff;
}

2. 장바구니 담긴상품 수량 폰트의 background(배경), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 58줄

.top_member_box > li strong {
    background: #8eb111;
    color: #fff;
    padding: 0px 5px;
    border-radius: 10px;
}

3. 메뉴 폰트의 font-size(크기), font-weight(굵기), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 10줄

#header .gnb .depth0 > li > a {
    display: inline-block;
    padding: 0 23px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    line-height: 49px;
    height: 44px;
}

layout > layout.css | css/layout/layout.css 231줄

.body-main #header .gnb .depth0 > li > a {
    color: #fff;
}

4.메뉴 마우스 오버시 background-color(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 234줄

#header .gnb .depth0 > li > a:hover{
    border-bottom:#8eb011 6px solid;
}

5. 2댑스 메뉴 폰트의 font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 243줄

#header .gnb .depth1 li a{
    display:block;
    /*width:100%;*/
    padding:5px 10px 7px 19px;
    font-size:12px;
}

6. 2댑스 메뉴 마우스 오버시의 background(배경), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 245줄

#header .gnb .depth1 li a.active {
    background: #8eb011;
    color: #ffffff;
}

7. 메뉴영역 하단의 border-bottom(선) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 13줄

.body-main #header_warp {
    border-bottom: #fff 1px solid;
}

left형 메뉴 변경하기

1. 상단 메뉴의 color(색상), font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 41줄

.top_member_box > li a {
    display: inline-block;
    padding: 4px 0 4px 10px;
    color: #888888;
    font-size: 11px;
}

2. 장바구니 담긴상품 수량 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 44줄

.top_member_box > li strong {
    color: #ab3e55;
}

3. 메뉴 폰트의 font-size(크기), font-weight(굵기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 199줄

.sub_menu_box .sub_depth0 > li > a {
    display: block;
    padding: 10px 30px;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
}

4. 2댑스 메뉴 마우스 오버시의 background(배경), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 214줄

.sub_menu_box .sub_depth1 li a.active{
    background:#829c00; 
    color:#ffffff;
}

5. 카테고리 메뉴의 font-size(크기), font-weight(굵기), text-align(정렬) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 212줄

.sub_menu_box .sub_depth1 li a{
    display:block;
    padding:5px 10px 7px 19px;
    font-size:12px;
}

웹폰트 적용하기

1. 관리자 페이지 > 디자인 메뉴에 접속합니다.

2. 좌측 하단 폴더트리 내 “스타일시트/CSS”를 더블 클릭하여 스타일시트 리스트 중 reset.css를 오픈하세요.

3. reset.css 스타일시트의 3번째 줄에 @import url(’외부 스타일시트 경로’)을 추가합니다.

스타일시트 > reset.css | css/reset.css 3줄

@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css');
} /* 3번째줄에 추가*/

4. 13번째 줄의 font-family의 맑은 고딕으로 설정된 폰트를 "나눔고딕" 또는 Nanum Gothic(변경할 폰트명)으로 수정하세요. (한글 폰트 파일명의 경우 " "입력)

스타일시트 > reset.css | css/reset.css 13줄

body,th,td,input,select,textarea,button {
    font-size:12px;
    line-height:1.5;
    font-family:Malgun Gothic,"맑은 고딕",AppleGothic,Dotum,"돋움",sans-serif;
    color:#333
} /* color값은 디자인가이드에 맞게사용 */

※ 웹폰트 사용 시, 속도 저하가 발생할 수 있어 권장하지 않습니다.

검색창 폰트 변경하기

1. 검색창 인풋박스 입력 폰트의 font-size(크기) 값을 변경합니다.

common > common.css | css/common/common.css 47줄

input[type="text"], input[type="password"] {
    padding: 0 10px;
    outline: none;
    font-size: 12px;
}

2. 최근검색어 폰트의 font-size(크기), font-weight(굵기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 108줄

.recent_box dt {
    font-size: 13px;
    font-weight: bold;
}

3. 추천상품 폰트의 font-size(크기), font-weight(굵기), text-align(정렬) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 118줄

.recom_box dt {
    width: 122px;
    padding: 0 0 10px 0;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
}

4. 추천상품명 폰트의 letter-spacing(자간) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 136줄

.recom_tit_box .item_name {
    display: block;
    letter-spacing: -1px;
}

5. 추천상품 가격 폰트의 font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 142줄

.recom_money_box .item_price {
    display: block;
    padding: 7px 0 5px 0;
    font-size: 14px;
}

6. 추천상품 검색창 닫기 폰트의 color(색상), font-size(크기), line-height(행간) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 162줄

.seach_top_all .btn_top_search_close {
    float: right;
    padding: 0 15px 0 15px;
    color: #999999;
    font-size: 11px;
    line-height: 30px;
}

검색창 사이즈 변경하기(배경/라인)

1. 검색창의 height(높이) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 96줄

#header .top_search .top_text_cont .top_srarch_text {
    width: 100%;
    height: 33px;
    padding: 5px 45px 5px 15px;
    box-sizing: border-box;
}

2. 검색창 레이어 영역의 background(배경), border(선) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 98줄

.#header .top_search .search_cont{
    display: block;
    margin: 0;
    font-size: 0;
    background: #ffffff;
    border: #ccc 1px solid;
    position: absolute;
    top: 30px;
    left: -1px;
    width: 336px;
    box-sizing: border-box;
}

3. 추천상품 이미지 영역의 border(선), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 120줄

.recom_box .recom_photo {
    display: table-cell;
    position: relative;
    width: 120px;
    height: 120px;
    border: 1px solid #ececec;
    vertical-align: middle;
}

4. 검색창 레이어 하단 영역의 height(높이), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 160줄

.seach_top_all {
    overflow: hidden;
    width: 100%;
    height: 30px;
    background: #f5f5f5;
    clear: both;
}

쇼핑카트탭 변경하기(폰트/컬러)

1. 쇼핑카트탭 메뉴 선택 시 border-top(선), font-weight(굵기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 572줄

.cart_tab_list .on {
    border-top: 2px solid #<span style="text-align: left; color: rgb(34, 34, 34); text-transform: none; text-indent: 0px; letter-spacing: normal; font-family: Consolas, "Lucida Console", "Courier New", monospace; font-size: 12px; font-style: normal; font-weight: 400; word-spacing: 0px; float: none; display: inline !important; white-space: nowrap; orphans: 2; widows: 2; font-variant-ligatures: normal; font-variant-caps: normal; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">8eb111</span>;
    font-weight: bold;
    padding-top: 0;
}

2. 쇼핑카트탭 상단의 height(높이), border-top(선), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 567줄

#shop_cart_wrap .cart_tab_wrap {
    position: relative;
    height: 39px;
    border-top: 2px solid #333333;
    background: #f2f2f2;
}

3. 쇼핑카트탭에 담긴 상품 이미지의 width(너비), height(높이) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 613줄

.shop_view_tab .prdt_photo_box a > img {
    width: 135px;
    height: 120px;
}

4. 쇼핑카트탭 상단의 font-size(크기), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 615줄

.shop_view_tab .prdt_tit {
    display: block;
    padding: 11px 0 3px 0;
    font-size: 12px;
    color: #4b4b4b;
}

5. 쇼핑카트탭 상단의 font-size(크기), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 617줄

.shop_view_tab .prdt_price strong {
    font-size: 18px;
    color: #000;
}

쇼핑카트탭 변경하기(옵션 시)

1. 옵션선택 버튼의 background(배경), color(색상), text-align(정렬), font-weight(굵기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 581줄

.cart_tab_list .cart_tab_option a {
    display: block;
    padding: 10px 55px;
    background: #6a6a6a;
    color: #ffffff;
    text-align: center;
    font-weight: bold;
    line-height: 19px;
}

2. 상품명의 font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 654줄

.shop_option_cont .shop_option_tit .shop_item_tit {
    display: block;
    padding: 0 0 7px 0;
    font-size: 14px;
}

3. 배송비 내용 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 656줄

.shop_option_cont .shop_option_tit .shop_item_delivery {
    color: #717171;
}

4. 항목 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 674줄

.option_total_box dl dt {
    float: left;
    color: #777777;
}

5. 상품명의 font-weight(굵기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 675줄

.option_total_box dl dd {
    float: right;
    font-weight: bold;
    /* color: #444444; */
}

6. 총 결제 예정금액 폰트의 font-weight(굵기), color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 677줄

.option_total_box .total_price_sec dt {
    font-weight: bold;
    color: #555555;
}

7. 총 결제 예정금액 가격 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 678줄

.option_total_box .total_price_sec strong {
    color: #<span style="text-align: left; color: rgb(34, 34, 34); text-transform: none; text-indent: 0px; letter-spacing: normal; font-family: Consolas, "Lucida Console", "Courier New", monospace; font-size: 12px; font-style: normal; font-weight: 400; word-spacing: 0px; float: none; display: inline !important; white-space: nowrap; orphans: 2; widows: 2; font-variant-ligatures: normal; font-variant-caps: normal; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">829c00</span>;
}

8. 장바구니 버튼의 border(선), background(배경), font-weight(굵기), font-size(크기), color(색상), text-align(정렬) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 680줄

.option_total_box .btn_shop_cart {
    display: block;
    width: 200px;
    height: 43px;
    margin: 0;
    border: 1px solid #cccccc;
    background: #ffffff;
    font-weight: bold;
    font-size: 14px;
    color: #3e3d3c;
    text-align: center;
}

9. 바로구매 버튼의 background(배경), font-weight(굵기), font-size(크기), color(색상), text-align(정렬) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 569줄

#shop_cart_wrap .btn_shop_buy {
    display: block;
    width: 200px;
    height: 45px;
    background: #<span style="text-align: left; color: rgb(34, 34, 34); text-transform: none; text-indent: 0px; letter-spacing: normal; font-family: Consolas, "Lucida Console", "Courier New", monospace; font-size: 12px; font-style: normal; font-weight: 400; word-spacing: 0px; float: none; display: inline !important; white-space: nowrap; orphans: 2; widows: 2; font-variant-ligatures: normal; font-variant-caps: normal; -webkit-text-stroke-width: 0px;">8eb111</span>;
    font-weight: bold;
    font-size: 14px;
    color: #ffffff;
    text-align: center;
}

푸터 변경하기

1. 푸터 메뉴 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 431줄

.foot_list ul li a {
    padding: 0 15px 0 14px;
    color: #666;
}

2. 공지사항 게시판 마우스 오버시 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 259줄

.notice_rolling ul li a:hover{
    text-decoration:underline;
    color:#8eb011;
}

3. 푸터 정보영역 폰트의 color(색상), font-size(크기), line-height(행간) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 435줄

    overflow: hidden;
    padding: 35px 0 35px 0;
    color: #a9a9a9;
    font-size: 11px;
    line-height: 1.8;;}
}

4. 고객센터 번호 폰트의 color(색상), font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 413줄

.content_info .cs_center strong {
    display: block;
    padding: 0;
    color: #8eb111;
    font-size: 26px;
    margin-bottom: 13px;
}

최근 본 상품 변경하기(폰트,컬러)

1. 최근 본 상품 타이틀의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 464줄

.scroll_right_cont h4 {
    padding: 0;
    color: #666666;
    text-align: center;
}

2. 최근 본 상품 오버시 펼침 레이어 영역의width(가로), height(세로), border(선), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 472줄

.scroll_right_cont .src_box {
    position: absolute;
    top: -1px;
    right: -1px;
    width: 191px;
    height: 69px;
    padding: 5px 0 0 7px;
    border: 1px solid #999999;
    background: #ffffff;
    text-align: left;
    z-index: 10;
}  

3. 최근 본 상품의 상품명 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 473줄

.scroll_right_cont .src_box em {
    display: block;
    overflow: hidden;
    width: 115px;
    height: 43px;
    color: #939393;
    word-break: break-all;
}

4. 최근 본 상품의 가격 폰트의color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 474줄

.scroll_right_cont .src_box strong {
    display: block;
    color: #8eb111;
}

5. 페이징 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 484줄

.scroll_right_cont .scr_paging {
    width: 74px;
    margin: 0 auto;
    color: #939393;
    text-align: center;
}

layout > layout.css | css/layout/layout.css 486줄

.scroll_right_cont .scr_paging strong {
    padding: 0 2px 0 2px;
    color: #333;
}

스크롤 시 상단 고정메뉴 변경하기(폰트,배경,투명도)

1. 스크롤시 상단 메뉴 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 232줄

.body-main .headerFix #header .gnb .depth0 > li > a {
    color: #333;
}

2. 스크롤시 상단 메뉴 영역의 background(배경,투명도) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 18줄

.headerFix {
    position: fixed !important;
    top: -127px !important;
    left: 0 !important;
    z-index: 101 !important;
    width: 100% !important;
    min-width: 1200px !important;
    background: rgba(255,255,255,.7) !important;
}

3. 스크롤시 상단 메뉴 영역 하단의 border-bottom(선) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 14줄

.body-main #header_warp.headerFix {
    border-bottom: #ccc 1px solid;
}

메인

진열타입 탭형 변경하기(폰트,컬러)

1. 현재 탭 영역의 background(배경), color(색상) 값을 변경합니다.

main > main.css | css/main/main.css 35줄

.item_hl_tab_type .goods_tab_tit li.on a {
    background: #8eb111;
    color: #fff;
}

2. 상품정보 영역의 background(배경) 값을 변경합니다.

main > main.css | css/main/main.css 26줄

.main_goods_cont .goods_tab_box .item_info_cont {
    background: #fff;
    padding: 15px 20px 20px;
    display: block;
}

3. 브랜드 폰트의 color(색상) 값을 변경합니다.

goods > ㅣlist.css | css/goods/list.css 44줄

.item_tit_box .item_brand {
    display: block;
    color: #888888;
}

4. 상품명 폰트의 font-size(크기) 값을 변경합니다.

goods > ㅣlist.css | css/goods/list.css 45줄

.item_tit_box .item_name {
    display: block;
    padding: 5px 0 0 0;
    font-size: 13px;
}

5. 기존가격 폰트의 color(색상) 값을 변경합니다.

goods > ㅣlist.css | css/goods/list.css 52줄

.item_money_box del {
    display: block;
    color: #888888;
}

6. 가격 폰트의 font-size(크기), color(색상) 값을 변경합니다.

goods > ㅣlist.css | css/goods/list.css 53줄

.item_money_box .item_price {
    display: block;
    padding: 7px 0 5px 0;
    font-size: 14px;
    color: #8eb111;
}

진열타입 백그라운드 이미지 변경하기

1. 진열타입 배경의 백그라운드 이미지 경로를 확인합니다.

2. 변경하고 싶은 진열타입 배경이미지를 확인하고 디자인 > 배너관리에서 변경합니다.

3. 진열타입 배경 영역의 background(배경) 값을 변경합니다.

main > main.css | css/main/main.css 15줄

.main_goods_cont {
    position: relative;
    margin-top: 80px;
    min-height: 840px;
    background: #f9f9f9;
}

진열타입 배너영역 활용하기

1. 진열타입 좌측 배너이미지를 디자인 > 배너관리에서 변경합니다.

2. 진열타입 우측 상품정렬은 상품 > 상품 진열 관리 > 메인페이지 상품진열에서 변경합니다.

상품상세

타임세일 변경하기

1. 타임세일 타이틀 폰트의 font-size(크기) 값을 변경합니다.

event > event.css | css/event/event.css 65줄

.time_sale_tit h2 {
    /* width: 70%; */
    padding: 0 0 30px 0;
    font-size: 24px;
}

2. 타임세일 이미지 상단의 border-bottom(선) 값을 변경합니다.

event > event.css | css/event/event.css 64줄

.time_sale_tit {
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #999999;
}

3. 타임세일 기간 폰트의 color(색상), font-size(크기) 값을 변경합니다.

event > event.css | css/event/event.css 66줄

.time_sale_tit strong {
    position: absolute;
    bottom: 7px;
    right: 10px;
    color: #8eb111;
    font-size: 13px;
}

4. 남은시간 폰트의 font-size(크기) 값을 변경합니다.

event > event.css | css/event/event.css 74줄

.sale_clock .clock_cont .clock_tit {
    padding: 0 30px 0 0;
    font-size: 22px;
}

로케이션 셀렉트박스 변경하기

1. 로케이션 HOME 폰트의 color(색상) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 272줄

.location_cont .local_home {
    color: #777777;
}

2. 로케이션 셀렉트 박스의 border(선), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 277줄

.location_select {
    display: inline-block;
    position: relative;
    min-width: 150px;
    margin: 7px 0 0 0;
    border: 1px solid #999999;
    background: #ffffff;
    z-index: 50;
}

3. 로케이션 셀렉트 박스 펼침 영역의 border(선), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 282줄

.location_select ul {
    display: block;
    position: absolute;
    top: 22px;
    left: 0px;
    width: 100%;
    margin-left: -1px;
    padding: 6px 0 6px 0;
    font-size: 0;
    border: 1px solid #999999;
    background: #ffffff;
}

4. 로케이션 메뉴 폰트의 font-size(크기) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 281줄

.location_select .location_tit a {
    display: block;
    padding: 3px 32px 3px 9px;
    font-size: 11px;
}

5. 로케이션 메뉴 오버시 color(색상), background(배경) 값을 변경합니다.

layout > layout.css | css/layout/layout.css 286줄

.location_select ul li a:hover{
    color:#ffffff;
    text-decoration:none;  
    background:#8eb111;
}

카테고리 상단 변경하기

1. 카테고리 타이틀 폰트의 font-size(크기) 값을 변경합니다.

goods > goods.css | css/goods/goods.css 294줄

.goods_list_item_tit {
    position: relative;
    margin: 0 0 20px 0;
    padding: 0 0 10px 0;
    font-size: 14px;
}

2. 상품 수량 폰트의 color(색상) 값을 변경합니다.

common > common.css | css/common/common.css 329줄

.goods_pick_list .pick_list_num strong {
    color: #8eb111;
}

3. 상품 수량 폰트의 color(색상), font-weight(굵기), background(배경) 값을 변경합니다.

common > common.css | css/common/common.css 335줄

.goods_pick_list .pick_list_box .pick_list label.on {
    color: #8eb111;
    font-weight: bold;
    background: url(../../img/icon/goods_icon/icon_sort_check.png) no-repeat left 5px;
}

4. 상품 정렬 영역의 border-top(선), border-bottom(선) 값을 변경합니다.

common > common.css | css/common/common.css 330줄

.goods_pick_list .pick_list_box {
    height: 28px;
    margin: 0 0 20px 0;
    padding: 9px 0 10px 0;
    border-top: 1px solid #999999;
    border-bottom: 1px solid #dbdbdb;
    clear: both;
}

주문결제

주문서작성/결제 변경하기

1. 최종 결제 금액 폰트의 font-size(크기), font-weight(굵기) 값을 변경합니다.

order > order.css | css/order/order.css 322줄

.payment_final_total dt {
    display: inline-block;
    padding: 0 15px 0 0;
    font-size: 14px;
    font-weight: bold;
}

2. 최종 결제 금액 숫자 폰트의 font-size(크기), color(색상) 값을 변경합니다.

order > order.css | css/order/order.css 323줄

.payment_final_total dd {
    display: inline-block;
    font-size: 30px;
    color: #8eb111;
}

3. 최종 결제 금액 박스 영역의 border(선) 값을 변경합니다.

order > order.css | css/order/order.css 320줄

.payment_final_total {
    padding: 13px 46px 20px 0;
    border: 2px solid #d6d6d6;
    text-align: right;
}

4. 필수 폰트의 color(색상) 값을 변경합니다.

goods > goods.css | css/goods/goods.css 326줄

.payment_final .form_element label.check_s em b {
    color: #8eb111;
}

5. 결제하기 버튼의 width(가로), height(세로), color(색상), font-size(크기), border(선), background(배경) 값을 변경합니다.

스타일시트 > button.css | css/button.css 180줄

.btn_order_buy {
    display: inline-block;
    width: 300px;
    height: 61px;
    line-height: 59px;
    color: #fff;
    font-size: 20px;
    border: 1px solid #8eb111;
    background: #8eb111;
    text-align: center;
}

주문완료 상단 변경하기

1. 주문완료 타이틀 폰트의 font-size(크기), color(색상) 값을 변경합니다.

order > order.css | css/order/order.css 14줄

.order_wrap .order_tit h2 {
    float: left;
    font-size: 28px;
    color: #222222;
}

2. 주문완료 안내 폰트의 font-size(크기) 값을 변경합니다.

order > order.css | css/order/order.css 332줄

.order_end_completion strong {
    font-size: 22px;
}

3. 서브 폰트의 font-size(크기) 값을 변경합니다.

order > order.css | css/order/order.css 333줄

.order_end_completion em {
    font-size: 14px;
}

주문 요약정보 변경하기

1. 무통장 입금 폰트의 font-size(크기) 값을 변경합니다.

order > order.css | css/order/order.css 337줄

.pay_with_list > strong {
    display: block;
    font-size: 13px;
}

2. 금액 숫자 폰트의 color(색상), font-size(크기) 값을 변경합니다.

order > order.css | css/order/order.css 28줄

.order_table_type td > strong {
    color: #333333;
}

order > order.css | css/order/order.css 226줄

.order_payment_sum {
    font-size: 18px;
}

3. 확인 버튼의 width(가로), height(세로), color(색상), font-size(크기), border(선), background(배경) 값을 변경합니다.

스타일시트 > button.css | css/button.css 184줄

.btn_order_end_ok {
    display: inline-block;
    width: 200px;
    height: 61px;
    line-height: 59px;
    color: #fff;
    font-size: 16px;
    border: 1px solid #8eb111;
    background: #8eb111;
    text-align: center;
}

3. 확인 버튼 마우스 오버시 border(선), background(배경) 값을 변경합니다.

스타일시트 > button.css | css/button.css 186줄

.btn_order_end_ok:hover {
    border: 1px solid #829c00;
    background: #829c00;
}