@font-face {
    font-family: "NotoSansCJK";
    font-weight: 100;
    font-display: block;
    src: local("※"), url("//dreamgreen.co.kr/assets/ui/font/NotoSansCJK_Light.woff2?v=1912302") format("woff2"), local("※"), url("//dreamgreen.co.kr/assets/ui/font/NotoSansCJK_Light.woff?v=1912302") format("woff")
}

@font-face {
    font-family: "NotoSansCJK";
    font-weight: 600;
    font-display: block;
    src: local("※"), url("//dreamgreen.co.kr/assets/ui/font/NotoSansCJK_Medium.woff2?v=1912302") format("woff2"), local("※"), url("//dreamgreen.co.kr/assets/ui/font/NotoSansCJK_Medium.woff?v=1912302") format("woff")
}

:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #fe5a0e;
    --secondary: #6c757d;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --emp: #4285F4;
    --dark-toggle: #000;
    --light-toggle: #4285F4;
    --disable: #cccccc;
    --buda-black: #000;
}

:root body{
    --para-color: #9b9b9b;
    --heading-color: #1b1a1a;
    --heading-buda-color: #fff;
    --intranet-color: #4285F4;
    --theme-light: #efefef;
    --primary-color: #fe5a0e;
    --bg-light: #f7f9fa;
    --bg-white: #fff;
    --border-radius: 6px;
    --bg-color: #fff;
    --bg-buda-color: #1e1f21;
    --menu-bg-color: #fff;
    --gun-color: #fff;
    --footer-bg: #fff;
    --bg-border: #e9e9e9;    
    --breadcrumb-bg: #e9e9e9;
    --card-bg: #fff;
    --nav-color: #000;
    --th-bg: #fff;
    --header-bottom_bar: #e5e5e5;
    --table-top-border: #222222;
    --table-th-border: #f0f0f0;
    --table-th-bg: #fff;
    --table-thead-th-bg: #efefef;
    --box-bg: #f7f7f7;
    --box-border: #f0f0f0;
    --bg-buda: #333;
    --box-border-bottom: #f0f0f0;
    --btn-bg-color: #343434;
    --btn-buda-bg-color: #000;
    --btn-sub_bg-color: #E5E5E5;
    --btn-color: #fff;
    --btn-top-bg: rgba(255, 255, 255, 0.9);
    --btn-top-color: #222;
    --hr-bar: #ededed;
    --input-bg: #fff;
    --item-box-border: #E5E5E5;
    --item-box-bg: #E4E4E4;
    --item-sub-box-bg: #fff;
    --item-sub_txt: #999;
    --item-price: #000;
    --item-member_bg: #fcf3ea;
    --item-member_border: #f99475;
    --item-member_txt: #000;
    --item-deco_border: #222222;
    --cart-level-on-bg: #222222;
    --cart-level-bg:#fff;
    --cart-level-border:#e8e8e8;
    --cart-level-angle: #cecece;
    --board-title-bg: #fff;
    --board-content-bg: #fcfcfc;
    --sign-bottom: #222222;
    --sign-border: #e5e5e5;
    --slider-box-board: #fff;
    --slider-box-bg: #fff;
    --slider-box-bg-hover: #343a40;
    --slider-color: #fff;
    --slider-color-hover: #222222;
    --blockquote-border: #4285F4;
    --blockquote-bg: #efefef;
    --order-button-bg: #ffc107;
    --order-button-border: #FCD200;
    --order-bottom-bg: #fff;
    --input-readonly-bg: #e9e9e9;  
    --fc-sun-color: #e53e30;  
    --fc-set-color: #006f80;  
    --fc-order-color: #1b1a1a;  
    --fc-today-color: #fff;  
}
  
:root body[data-darkmode=on] {
    --para-color: #afafaf;
    --heading-color: #fff;
    --heading-buda-color: #fff;
    --intranet-color: #4285F4;
    --theme-light: #efefef;
    --primary-color: #fe5a0e;
    --bg-light: #222;
    --bg-white: #222;
    --border-radius: 6px;
    --bg-color: #1e1f21;
    --bg-buda-color: #1e1f21;
    --menu-bg-color: #343a40;
    --gun-color:#efefef;
    --footer-bg: #000;
    --bg-border: #333;
    --bg-buda: #333;
    --breadcrumb-bg: #333;
    --card-bg: #222;
    --nav-color: #fff;
    --th-bg: #333;
    --header-bottom_bar: #000;
    --table-top-border: #fff;
    --table-th-border: #fff;
    --table-th-bg: ;
    --table-thead-th-bg: #000;
    --box-bg: #343a40;
    --box-border: #000;
    --box-border-bottom: #fff;
    --btn-bg-color: #000;
    --btn-buda-bg-color: #000;
    --btn-sub_bg-color: #343a40;
    --btn-color: #fff;
    --btn-top-bg: #000;
    --btn-top-color: #fff;
    --hr-bar: #343a40;
    --input-bg: #343a40;
    --item-box-border: #343a40;
    --item-box-bg: #343a40;
    --item-sub-box-bg: #343a40;
    --item-sub_txt: #fff;
    --item-price: #fff;
    --item-member_bg: #343a40;
    --item-member_border: #fff;
    --item-member_txt: #fff;
    --item-deco_border: #000;
    --cart-level-on-bg: #000;
    --cart-level-bg:#343a40;
    --cart-level-border:#343a40;
    --cart-level-angle: #fff;
    --board-title-bg: #343a40;
    --board-content-bg: #1e1f21;
    --sign-bottom: #fff;
    --sign-border: #343a40;
    --slider-box-board: #343a40;
    --slider-box-bg: #343a40;
    --slider-box-bg-hover: #fff;
    --slider-color: #fff;
    --slider-color-hover: #343a40;
    --blockquote-border: #fff;
    --blockquote-bg: #343a40;
    --order-button-bg: #ffc107;
    --order-button-border: #FCD200;
    --order-bottom-bg: #afafaf;
    --input-readonly-bg: #000;  
    --fc-sun-color: #e53e30;  
    --fc-set-color: #006f80;  
    --fc-order-color: #1b1a1a;  
    --fc-today-color: #fff; 
}

html,
body {
    border: none;
    font-weight: 100;
    font-family: "NotoSansCJK", "Lucida Grande", "Open Sans", "roboto", "AppleGothic", "Arial", "Meiryo", "Hiragino Kaku Gothic Pro", "NanumBarunGothic", "Malgun Gothic", "dotum", "돋음", "sans-serif";
    letter-spacing: -0.02rem;
    font-size: 15px;
    line-height: 1.7;
    color: var(--heading-color);
    overflow-x: hidden;
    word-break: keep-all;
    background-color: var(--bg-color);
}


/* Darkmode Toggle */
.darkmode {
    bottom: 40px;
    right: 140px;
    position: fixed;
    width: 70px;
    z-index: 10;
}

body[data-darkmode=on] .darkmode > .inner{
    background-color: rgba(255,255,255,0.25);
}
.darkmode > .inner{
    position: relative;
    display: inline-flex;
    padding: 5px;
    border-radius: 1.5em;
    background-color: rgba(0,0,0,0.1);
}
.darkmode label {
    cursor: pointer;
}
.darkmode label:first-of-type{
    padding: 5px 5px 5px 10px;
    border-radius: 50% 0 0 50%;
}
.darkmode label:last-of-type{
    padding: 5px 18px 5px 5px;
    border-radius: 0 50% 50% 0;
}
.darkmode i{
    font-size: 1.5em;
    color: #aaa;
}
.darkmode input[type=radio]{
    display: none;
}
.darkmode input[type=radio]:checked + label > i {
    color: #fff;
    transition: all 0.35s ease-in-out;
}
.darkmode .darkmode-bg{
    width: 39px;
    height: 33px;
    position: absolute;
    left: 5px;
    border-radius: 50px 15px 15px 50px;
    z-index: -1;
    transition: all 0.35s ease-in-out;
    background-color: var(--light-toggle);
}
#toggle-radio-dark:checked ~ .darkmode-bg{
    border-radius: 15px 50px 50px 15px;
    top: 4px;
    left: 42px;
    background-color: var(--dark-toggle);
}

@media (max-width: 1279px) {

    html,
    body {
        font-size: 16px;
        line-height: 1.5
    }

    .darkmode .darkmode-bg {
        width: 40px;
        height: 35px;
    }
    
    #toggle-radio-dark:checked ~ .darkmode-bg{
        border-radius: 15px 50px 50px 15px;
        top: 5px;
        left: 44px;
    }
    
}

@media (max-width: 767px) {

    html,
    body {
        font-size: 14px
    }

    .darkmode .darkmode-bg{
        width: 36px;
        height: 31px;
        position: absolute;
        left: 5px;
        border-radius: 50px 15px 15px 50px;
        z-index: -1;
        transition: all 0.35s ease-in-out;
        background-color: var(--light-toggle);
    }
    #toggle-radio-dark:checked ~ .darkmode-bg{
        border-radius: 15px 50px 50px 15px;
        top: 5px;
        left: 40px;
    }
    
}

@media (max-width: 320px) {

    html,
    body {
        overflow-x: scroll
    }

    html .container,
    body .container {
        overflow: hidden
    }
}

html,
body,
div,
ul,
li,
dl,
dt,
dd,
ol,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset {
    margin: 0;
    padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
th {
    font-weight: 600
}

html {
    -webkit-text-size-adjust: none
}

ul,
ol,
dl {
    list-style: none
}

address,
em,
i {
    font-style: normal
}

img {
    border: 0;
    vertical-align: top
}

fieldset {
    border: 0
}

table {
    border-collapse: collapse;
    table-layout: fixed;
    border-spacing: 0px
}

button {
    border: none;
    background: none;
    cursor: pointer;
    outline: none;
    padding: 0px;
    font-weight: 100;
    font-family: NotoSansCJK, "Lucida Grande", "Open Sans", "roboto", "AppleGothic", "Arial", "Meiryo", "Hiragino Kaku Gothic Pro", "NanumBarunGothic", "Malgun Gothic", dotum, "돋음", "sans-serif";
    letter-spacing: -0.05rem
}

input[type=text],
input[type=password],
input[type=tel],
input[type=email],
input[type=button],
input[type=submit],
input[type=reset],
button,
select,
textarea {
    font-weight: 100;
    font-family: NotoSansCJK, "Lucida Grande", "Open Sans", "roboto", "AppleGothic", "Arial", "Meiryo", "Hiragino Kaku Gothic Pro", "NanumBarunGothic", "Malgun Gothic", dotum, "돋음", "sans-serif"
}

a,
a:active,
a:link,
a:visited,
a:hover {
    text-decoration: none
}

a {
    color:var(--heading-color);
}

header,
footer,
main {
    display: block;
    clear: both
}

hr {
    margin: 0;
    border-top: 1px solid #222222;
    border-bottom: 0
}

.blind {
    display: block;
    position: absolute !important;
    top: -2000em;
    left: -2000em;
    width: 1px;
    height: 1px;
    text-indent: 2000em;
    font-size: 1px;
    overflow: hidden
}

.ie8 {
    overflow: scroll
}

.ie8 body {
    overflow: auto;
    font-weight: normal;
    font-family: "맑은 고딕", "Malgun Gothic", "돋움", Dotum, "굴림", Gulim, Helvetica, sans-serif
}

.ie8 input[type=text],
.ie8 input[type=password],
.ie8 input[type=tel],
.ie8 input[type=email],
.ie8 input[type=button],
.ie8 input[type=submit],
.ie8 input[type=reset],
.ie8 button,
.ie8 select {
    font-weight: normal;
    font-family: "맑은 고딕", "Malgun Gothic", "돋움", Dotum, "굴림", Gulim, Helvetica, sans-serif
}

.ie8 h1,
.ie8 h2,
.ie8 h3,
.ie8 h4,
.ie8 h5,
.ie8 h6,
.ie8 strong,
.ie8 b {
    font-weight: bold
}

.wrap {
    width: 100%;
    /*max-width: 1279px;*/
    margin: 0 auto;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

.wrap:after {
    content: '';
    display: block;
    clear: both
}

.skip_navi {
    position: relative;
    height: 0px
}

.skip_navi a {
    padding: 5px 20px;
    display: block;
    position: absolute;
    top: -100px;
    left: 0px;
    z-index: 10;
    background: #222222;
    outline-color: #4285F4;
    color: #ffffff;
    font-size: 15px
}

.skip_navi a:focus,
.skip_navi a a:hover,
.skip_navi a a:active {
    top: 0px
}

.top_bnr {
    display: block;
    height: 50px
}

.top_bnr .wrap {
    height: 100%;
    display: block
}

.top_bnr a {
    display: block;
    width: 1240px;
    height: 100%;
    margin: 0 auto
}

.top_bnr .btn_close {
    top: 50%;
    right: 35px;
    margin-top: -10px;
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

.top_bnr.show {
    display: block;
    background: #263171 url(https://dreamgreen.co.kr/assets/ui/img/bnr/bnr_top01.png?v=20220221) no-repeat top center;
    background-size: auto 100%
}

.top_bnr.show+header {
    top: 50px
}

.top_bnr.show+header.fix {
    top: 0px
}

@media (max-width: 1279px) {
    .top_bnr.show+header {
        top: 0
    }

    .top_bnr.show+header .gnb {
        top: 50px
    }
}

@media (max-width: 767px) {
    .top_bnr.show+header {
        top: 0
    }

    .top_bnr.show+header .gnb {
        top: 80px
    }

    .top_bnr.show+header.over .gnb {
        top: 80px
    }

    .top_bnr .btn_close {
        top: 50%;
        right: 15px;
        margin-top: -12px;
        width: 25px;
        height: 25px
    }
}

header {
    width: 100%;
    height: 87px;
    position: absolute;
    top: 0px;
    left: 0px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 5
}

header .logo {
    float: left;
    display: block;
    position: relative;
    margin: 35px 20px 0px 30px;
    width: 200px;
    height: 50px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/logo.svg") no-repeat 0 0
}

header .ico_menu {
    display: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 2.6%;
    width: 26px;
    height: 21px
}

header .ico_menu span {
    position: relative;
    display: inline-block;
    margin: 9px 0
}

header .ico_menu span,
header .ico_menu span:before,
header .ico_menu span:after {
    width: 100%;
    height: 3px;
    background-color: #ffffff
}

header .ico_menu span:before,
header .ico_menu span:after {
    content: '';
    position: absolute;
    left: 0
}

header .ico_menu span:before {
    top: -9px
}

header .ico_menu span:after {
    top: 9px
}

@media (max-width: 1279px) {
    header {
        height: 60px
    }

    header .logo {
        width: 200px;
        height: 50px;
        margin: 10px 0px 0px 2.6%;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/logo.svg") no-repeat 0 0;
        background-size: 100%
    }

    header .ico_menu {
        display: block
    }
}

@media (max-width: 767px) {
    header {
        min-width: 320px;
        height: 44px
    }

    header .logo {
        width: 130px;
        height: 24px;
        margin: 10px 4px 8px 6.25%
    }

    header .logo.logo_sp {
        width: 82px;
        margin: 0 0 0 6.25%
    }

    header .ico_menu {
        width: 18px;
        height: 15px;
        right: 6.25%
    }

    header .ico_menu span {
        margin: 6px 0px;
        position: absolute
    }

    header .ico_menu span,
    header .ico_menu span:before,
    header .ico_menu span:after {
        height: 2px
    }

    header .ico_menu span:before {
        top: -6px
    }

    header .ico_menu span:after {
        top: 6px
    }
}

header .ico_down1 {
    vertical-align: middle;
    margin-left: 16px
}

header .ico_site_map {
    vertical-align: middle;
    position: relative;
    display: inline-block;
    margin: 5px 0;
    margin: -3px 6px 0px 0px
}

header .ico_site_map,
header .ico_site_map:before,
header .ico_site_map:after {
    width: 15px;
    height: 2px;
    background-color: #ffffff
}

header .ico_site_map:before,
header .ico_site_map:after {
    content: '';
    position: absolute;
    left: 0
}

header .ico_site_map:before {
    top: -5px
}

header .ico_site_map:after {
    top: 5px
}

header .wrap {
    max-width: 1920px;
    height: 100%
}

header .gnb,
header .lnb {
    float: left;
    display: block
}

header .gnb li,
header .lnb li {
    float: left
}

@media (max-width: 1279px) {
    header .gnb {
        display: none;
        width: 100%;
        height: 100%;
        max-width: 320px;
        position: fixed;
        top: 0px;
        right: 0px;
        z-index: 6;
        overflow-y: scroll;
        background: var(--bg-color);
        color: var(--heading-color);
    }
}

@media (max-width: 767px) {
    header .gnb {
        max-width: 100%;
        height: 100%
    }
}

header .gnb .main_menu,
header .gnb .lnb .mn,
header .lnb .gnb .mn {
    font-size: 17px;
    font-weight: 600;
    line-height: 90px;
    height: 90px;
    display: inline-block;
    color: #ffffff;
    padding: 0 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    margin-right: 4px
}

header .gnb .main_menu:before,
header .gnb .lnb .mn:before,
header .lnb .gnb .mn:before {
    content: "";
    width: 100%;
    height: 2px;
    display: block;
    position: absolute;
    background: #ffffff;
    bottom: 0px;
    left: 50%;
    width: 0;
    margin-left: 0;
    visibility: hidden
}

header .gnb .main_menu .ico_angle_down,
header .gnb .lnb .mn .ico_angle_down,
header .lnb .gnb .mn .ico_angle_down {
    width: 14px;
    height: 14px;
    margin-top: -5px;
    margin-left: 5px;
    right: 5px;
    display: inline-block;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_white_down1.svg") no-repeat 0 0
}

header .gnb .main_menu i,
header .gnb .lnb .mn i,
header .lnb .gnb .mn i {
    width: 14px;
    height: 14px;
    margin-left: 5px;
    right: 5px;
    font-size: 10px;
    vertical-align: middle
}

header .gnb .main_menu.on:before,
header .gnb .lnb .on.mn:before,
header .lnb .gnb .on.mn:before,
header .gnb .main_menu:hover:before,
header .gnb .lnb .mn:hover:before,
header .lnb .gnb .mn:hover:before {
    width: 100%;
    margin-left: -50%;
    visibility: visible;
    -webkit-transition: all 300ms;
    transition: all 300ms
}

header .gnb .main_menu.on+.menu,
header .gnb .lnb .on.mn+.menu,
header .lnb .gnb .on.mn+.menu,
header .gnb .main_menu:hover+.menu,
header .gnb .lnb .mn:hover+.menu,
header .lnb .gnb .mn:hover+.menu {
    z-index: 3
}

header .gnb .sm .main_menu,
header .gnb .sm .lnb .mn,
header .lnb .gnb .sm .mn {
    font-size: 14px;
    margin-right: 0
}

header .gnb .sm.dot:before {
    content: "";
    width: 7px;
    height: 7px;
    display: inline-block;
    position: relative;
    background: #ffffff;
    border-radius: 50%;
    margin: 0 19px 0 15px;
    vertical-align: middle
}

header .gnb .m_lnb {
    position: absolute;
    top: 137px;
    right: 59px;
    width: 29px;
    height: 29px;
    z-index: 4;
    display: none
}

header .gnb .m_lnb .mn {
    position: relative;
    height: 100%;
    line-height: 60px;
    color: #999999;
    padding: 0 14px;
    display: none
}

header .gnb .m_lnb .mn:before {
    content: "";
    width: 1px;
    height: 14px;
    display: block;
    position: absolute;
    background: #e5e5e5;
    top: 50%;
    left: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

header .gnb .m_lnb .mn:first-child {
    padding-left: 6.25%;
    font-weight: bold
}

header .gnb .m_lnb .mn:first-child:before {
    display: none
}

header .gnb .m_lnb .mn.txt_point {
    color: #4285F4;
    font-weight: 600
}

header .gnb .btn_gnb_close {
    display: none;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

header .gnb .m_gnb_bnr {
    display: none
}

header .gnb .pc_hide {
    display: none
}

@media (min-width: 1279px) {
    header .gnb .temp_covid.show_pc {
        margin: 24px 0 0 25px;
        background: #4285F4;
        border-radius: 50px
    }

    header .gnb .temp_covid.show_pc .main_menu,
    header .gnb .temp_covid.show_pc .lnb .mn,
    header .lnb .gnb .temp_covid.show_pc .mn {
        height: auto;
        line-height: 1;
        padding: 13px 25px;
        font-size: 16px;
        color: #ffffff !important
    }

    header .gnb .temp_covid.show_pc .main_menu.on:before,
    header .gnb .temp_covid.show_pc .lnb .on.mn:before,
    header .lnb .gnb .temp_covid.show_pc .on.mn:before,
    header .gnb .temp_covid.show_pc .main_menu:hover:before,
    header .gnb .temp_covid.show_pc .lnb .mn:hover:before,
    header .lnb .gnb .temp_covid.show_pc .mn:hover:before {
        content: '';
        display: none
    }

    header .gnb .temp_covid.show_tm {
        display: none
    }
}

@media (max-width: 1279px) {
    header .gnb .temp_covid.show_pc {
        display: none
    }

    header .gnb .temp_covid.show_tm {
        display: block
    }
}

@media (max-width: 1279px) {
    header .gnb a {
        color: var(--heading-color);
    }

    header .gnb li {
        min-width: 280px;
        float: none;
        margin: 0 20px;
        border-bottom: 1px solid #f2f2f2
    }

    header .gnb .m_lnb {
        display: block;
        width: 100%;
        height: 60px;
        margin: 0px 0px 20px 0px;
        border-bottom: none;
        position: relative;
        top: auto;
        right: auto
    }

    header .gnb .m_gnb_bnr {
        display: block;
        border: none;
        max-width: 400px;
        margin-top: 20px
    }

    header .gnb .m_gnb_bnr a {
        text-align: center;
        width: 100%;
        height: 100%;
        display: block
    }

    header .gnb .m_gnb_bnr a img {
        width: 100%
    }

    header .gnb .sm.dot:before {
        display: none
    }

    header .gnb .main_menu,
    header .gnb .lnb .mn,
    header .lnb .gnb .mn {
        display: block;
        position: relative;
        padding: 0px;
        line-height: 60px;
        height: 60px;
        color: #222222;
        margin-right: 0px
    }

    header .gnb .main_menu:hover:before,
    header .gnb .lnb .mn:hover:before,
    header .lnb .gnb .mn:hover:before,
    header .gnb .main_menu.on:before,
    header .gnb .lnb .on.mn:before,
    header .lnb .gnb .on.mn:before {
        display: none
    }

    header .gnb .main_menu .ico_angle_down,
    header .gnb .lnb .mn .ico_angle_down,
    header .lnb .gnb .mn .ico_angle_down {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mobile_down.svg") no-repeat 0 0;
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin: -2px 0 0 0;
        left: initial
    }

    header .gnb .main_menu.on .ico_angle_down,
    header .gnb .lnb .on.mn .ico_angle_down,
    header .lnb .gnb .on.mn .ico_angle_down {
        -webkit-transform: rotate(180edg);
        -ms-transform: rotate(180edg);
        transform: rotate(180edg)
    }

    header .gnb .main_menu.on .ico_angle_down:before,
    header .gnb .lnb .on.mn .ico_angle_down:before,
    header .lnb .gnb .on.mn .ico_angle_down:before {
        border-bottom: none;
        border-right: none
    }

    header .gnb .main_menu.open_menu,
    header .gnb .lnb .open_menu.mn,
    header .lnb .gnb .open_menu.mn {
        margin-right: 0
    }

    header .gnb .main_menu.pc_hide,
    header .gnb .lnb .pc_hide.mn,
    header .lnb .gnb .pc_hide.mn {
        display: block
    }

    header .gnb .main_menu span.pc_hide,
    header .gnb .lnb .mn span.pc_hide,
    header .lnb .gnb .mn span.pc_hide {
        display: inline-block
    }

    header .gnb .btn_gnb_close {
        top: 50%;
        right: 6.25%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        position: absolute;
        display: block;
        width: 16px;
        height: 16px;
        border: none;
        -webkit-transition: all 2s;
        transition: all 2s;
        opacity: 0
    }

    header .gnb .btn_gnb_close:before,
    header .gnb .btn_gnb_close:after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 20px;
        height: 3px;
        background-color: var(--heading-color);
    }

    header .gnb .btn_gnb_close:before {
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg)
    }

    header .gnb .btn_gnb_close:after {
        -webkit-transform: translate(-50%, -50%) rotate(135deg);
        -ms-transform: translate(-50%, -50%) rotate(135deg);
        transform: translate(-50%, -50%) rotate(135deg)
    }
}

@media (max-width: 767px) {
    header .gnb li {
        margin: 0 6.25%;
        min-width: auto;
        border: none
    }

    header .gnb .main_menu,
    header .gnb .lnb .mn,
    header .lnb .gnb .mn {
        font-size: 15px;
        line-height: 50px;
        height: 50px
    }

    header .gnb .m_gnb_bnr a {
        text-align: left
    }

    header .gnb .m_lnb {
        height: 44px;
        margin: 0px
    }

    header .gnb .m_lnb .mn {
        font-size: 12px;
        line-height: 44px
    }
}

@media (max-width: 1279px) {
    header .gnb>li {
        -webkit-transition: opacity 100ms;
        transition: opacity 100ms;
        opacity: 0
    }

    header.over .gnb>li {
        opacity: 1
    }

    header.over .gnb .btn_gnb_close {
        -webkit-transition: all 2s;
        transition: all 2s;
        opacity: 1
    }
}

header .menu {
    width: 100%;
    height: 457px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: none;
    position: absolute;
    display: none;
    top: 90px;
    left: 0px;
    overflow: hidden;
    background: var(--menu-bg-color);
    color:var(--heading-color);
    box-sizing: border-box
}

@media (max-width: 1279px) {
    header .menu {
        background: none;
        height: auto;
        top: 0px;
        position: relative
    }
}

@media (max-width: 767px) {
    header .menu {
        margin-bottom: 15px
    }
}

header .wrap_menu {
    width: 1115px;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0px auto;
    padding: 38px 0px 50px;
    overflow: hidden;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_gnb_pc1.png") repeat top center
}

header .wrap_menu:after {
    display: block;
    clear: both;
    content: ""
}

@media (max-width: 1279px) {
    header .wrap_menu {
        width: 100%;
        height: auto;
        background: none;
        padding: 0px
    }
}

header .area_tit {
    vertical-align: top;
    position: relative;
    float: left;
    width: 262px;
    height: 100%
}

header .area_tit h1 {
    font-size: 24px;
    line-height: 31px;
    margin-top: 0px;
    margin-bottom: 0;
    text-align: left
}

header .area_tit h1 a {
    display: block;
    font-size: 16px;
    font-weight: 100;
    line-height: 40px
}

header .area_tit h1 a strong {
    width: 230px;
    display: block;
    position: relative
}

header .area_tit h1 a strong:after {
    content: '';
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    width: 5px;
    height: 5px;
    -webkit-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid #222222;
    border-right: 2px solid #222222;
    margin: 0px 0px 0px 14px;
    top: 50%;
    right: 20px
}

header .area_tit h2 {
    font-size: 24px;
    line-height: 31px;
    font-weight: 600;
    margin-top: 0px;
    margin-bottom: 0;
    text-align: left
}

header .area_tit h2 a {
    display: block;
    font-size: 16px;
    font-weight: 100;
    line-height: 40px
}

header .area_tit h2 a strong {
    width: 230px;
    display: block;
    position: relative
}

header .area_tit h2 a strong:after {
    content: '';
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    width: 5px;
    height: 5px;
    -webkit-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid var(--heading-color);
    border-right: 2px solid var(--heading-color);
    margin: 0px 0px 0px 14px;
    top: 50%;
    right: 20px
}

header .area_tit .area_event {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    font-size: 12px;
    line-height: 21px;
    font-weight: 600;
    z-index: 0
}

header .area_tit .area_event a {
    width: 100%;
    height: 100%;
    display: block
}

@media (max-width: 1279px) {
    header .area_tit {
        display: none
    }
}

header .area_dep {
    position: relative;
    float: left;
    height: 100%;
    width: 815px
}

header .area_dep li {
    width: 100%;
    font-size: 16px;
    line-height: 38px
}

header .area_dep .dep2_menu {
    width: 239px;
    display: block;
    float: left;
    font-weight: 100;
    position: relative
}

header .area_dep .dep2_menu.on:after {
    content: '';
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    width: 5px;
    height: 5px;
    -webkit-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid #222222;
    border-right: 2px solid #222222;
    margin: 0px 0px 0px 14px;
    top: 50%;
    right: 20px
}

header .area_dep .dep2_menu.on+.area_dep3 {
    display: block
}

header .area_dep .dep2_menu.on+.area_dep3 h3+.dep3_goods {
    display: block
}

header .area_dep .area_dep3 {
    position: absolute;
    display: none;
    top: 3px;
    left: 239px;
    width: 634px;
    height: 100%
}

header .area_dep .area_dep3 h3 {
    width: 205px;
    font-size: 24px;
    line-height: 34px;
    padding: 0px 45px 38px 30px
}

header .area_dep .area_dep3 .dep3_menu {
    padding: 0px 45px 0 30px;
    width: 200px;
    display: block
}

header .area_dep .area_dep3 .dep3_menu:hover {
    font-weight: 600
}

header .area_dep .area_dep3 .dep3_menu.on+.dep3_goods,
header .area_dep .area_dep3 .dep3_menu:hover+.dep3_goods {
    display: block
}

@media (max-width: 1279px) {
    header .area_dep .area_dep3 {
        display: none
    }
}

header .area_dep .on {
    font-weight: 600
}

header .area_dep .dep3_goods {
    position: absolute;
    display: none;
    top: 0px;
    left: 280px;
    width: 334px;
    height: 100%
}

header .area_dep .dep3_goods .ico_beta {
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    content: "";
    width: 34px;
    height: 18px;
    display: inline-block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_beta_r.svg") no-repeat 0 0;
    vertical-align: middle;
    margin: -7px 0 0 6px
}

header .area_dep .dep3_goods .ico_beta.c_b {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_beta_b.svg") no-repeat 0 0
}

header .area_dep .dep3_goods .txt_box {
    padding: 0px 0px 14px 40px
}

header .area_dep .dep3_goods .tit {
    font-size: 30px;
    display: block;
    margin-bottom: 15px;
    letter-spacing: -0.08rem
}

header .area_dep .dep3_goods .desc {
    font-size: 15px;
    line-height: 28px;
    display: block;
    height: 113px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

header .area_dep .dep3_goods .img_box {
    margin-left: 30px;
    position: absolute;
    bottom: -47px
}

@media (max-width: 1279px) {
    header .area_dep {
        float: none;
        width: 100%;
        padding-bottom: 20px
    }

    header .area_dep li {
        font-size: 18px;
        line-height: 42px;
        border-bottom: none;
        margin: 0
    }

    header .area_dep .dep2_menu {
        width: 100%;
        float: none;
        display: none
    }

    header .area_dep .area_dep3 {
        position: relative;
        display: block;
        top: 0px;
        left: 0px;
        width: 100%
    }

    header .area_dep .area_dep3 h3,
    header .area_dep .area_dep3 .dep3_goods {
        display: none
    }

    header .area_dep .area_dep3 .dep3_menu {
        padding: 0px;
        width: 100%;
        display: block
    }

    header .area_dep .area_dep3 .dep3_menu:hover {
        font-weight: 100
    }

    header .area_dep .area_dep3 .dep3_menu.on+.dep3_goods,
    header .area_dep .area_dep3 .dep3_menu:hover+.dep3_goods {
        display: none
    }
}

@media (max-width: 767px) {
    header .area_dep .area_dep3 li {
        font-size: 13px;
        line-height: 36px;
        float: left;
        width: 50%
    }
}

header .lnb {
    position: absolute;
    top: 0;
    right: 20px
}

@media (max-width: 1279px) {
    header .lnb {
        display: none
    }
}

header .lnb .mn {
    font-weight: 600;
    line-height: 102px;
    height: 87px;
    display: inline-block;
    font-size: 12px;
    padding: 0px 10px;
    opacity: 0.6;
    color: #ffffff;
    float: left;
    position: relative
}

header .lnb .mn:before {
    /*background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_line.png") no-repeat left center;*/
    content: "";
    width: 1px;
    height: 8px;
    display: block;
    position: absolute;
    margin-top: 0;
    background: var(--heading-color);
    top: 60%;
    left: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

header .lnb .mn:hover {
    opacity: 1
}

header .lnb .mn.on {
    opacity: 1
}

header .lnb .mn.non:before {
    display: none
}

header .lnb .mn.name {
    color: #4285F4 !important;
    opacity: 1
}

header .lnb .mn span {
    display: inline-block
}

header .lnb .box_lang {
    float: left;
    position: relative
}

header .lnb .box_lang .slct_box {
    display: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    z-index: 5;
    width: 85px;
    top: 69px;
    right: 5px
}

header .lnb .box_lang .slct_box.col2,
header .lnb .box_lang .sub .slct_box.goods_info,
.sub header .lnb .box_lang .slct_box.goods_info {
    top: 87px;
    right: -12px;
    width: 360px;
    height: 182px;
    background: #ffffff;
    border-radius: 20px;
    border-top-right-radius: 0;
    border: 1px solid #222222;
    padding: 30px 30px 30px 40px
}

header .lnb .box_lang .slct_box.col2 strong,
header .lnb .box_lang .sub .slct_box.goods_info strong,
.sub header .lnb .box_lang .slct_box.goods_info strong {
    font-size: 16px
}

header .lnb .box_lang .slct_box.col2 ul,
header .lnb .box_lang .sub .slct_box.goods_info ul,
.sub header .lnb .box_lang .slct_box.goods_info ul {
    width: 290px;
    height: 90px;
    margin-top: 5px;
    overflow: hidden
}

header .lnb .box_lang .slct_box.col2 li,
header .lnb .box_lang .sub .slct_box.goods_info li,
.sub header .lnb .box_lang .slct_box.goods_info li {
    float: left !important;
    width: 70px;
    height: auto
}

header .lnb .box_lang .slct_box.col2 li a,
header .lnb .box_lang .sub .slct_box.goods_info li a,
.sub header .lnb .box_lang .slct_box.goods_info li a {
    text-align: left;
    background: none;
    font-size: 15px;
    height: 40px
}

header .lnb .box_lang .slct_box.col2 li+li,
header .lnb .box_lang .sub .slct_box.goods_info li+li,
.sub header .lnb .box_lang .slct_box.goods_info li+li {
    margin-left: 40px
}

header .lnb .box_lang .slct_box.col2 li:nth-child(3n+1),
header .lnb .box_lang .sub .slct_box.goods_info li:nth-child(3n+1),
.sub header .lnb .box_lang .slct_box.goods_info li:nth-child(3n+1) {
    margin-left: 0
}

header .lnb .box_lang .slct_box.col2 .btn_gnb_close,
header .lnb .box_lang .sub .slct_box.goods_info .btn_gnb_close,
.sub header .lnb .box_lang .slct_box.goods_info .btn_gnb_close {
    position: absolute;
    display: block;
    width: 28px;
    height: 28px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    border: 1px solid #222222;
    right: -1px;
    top: -1px
}

header .lnb .box_lang .slct_box.col2 .btn_gnb_close:before,
header .lnb .box_lang .sub .slct_box.goods_info .btn_gnb_close:before,
.sub header .lnb .box_lang .slct_box.goods_info .btn_gnb_close:before,
header .lnb .box_lang .slct_box.col2 .btn_gnb_close:after,
header .lnb .box_lang .sub .slct_box.goods_info .btn_gnb_close:after,
.sub header .lnb .box_lang .slct_box.goods_info .btn_gnb_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 15px;
    height: 2px;
    background-color: #222222
}

header .lnb .box_lang .slct_box.col2 .btn_gnb_close:before,
header .lnb .box_lang .sub .slct_box.goods_info .btn_gnb_close:before,
.sub header .lnb .box_lang .slct_box.goods_info .btn_gnb_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

header .lnb .box_lang .slct_box.col2 .btn_gnb_close:after,
header .lnb .box_lang .sub .slct_box.goods_info .btn_gnb_close:after,
.sub header .lnb .box_lang .slct_box.goods_info .btn_gnb_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

header .lnb .ico_down {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 5px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    vertical-align: middle;
    margin-left: 10px
}

header .lnb .ico_down:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 3px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-top: -1px;
    border-right: 2px solid rgba(255, 255, 255, 0.6);
    border-bottom: 2px solid rgba(255, 255, 255, 0.6)
}

header.over,
header.fix,
header.h_white {
    background: var(--bg-color);
    border-bottom: var(--header-bottom_bar) solid 1px;
}

header.over .logo,
header.fix .logo,
header.h_white .logo {
    width: 200px;
    height: 50px;
    margin: 35px 20px 0px 30px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/logo_on.svg") no-repeat 0 0;
    background-size: 100%
}

header.over .ico_site_map,
header.fix .ico_site_map,
header.h_white .ico_site_map {
    background-color: var(--heading-color);
}

header.over .ico_site_map:before,
header.over .ico_site_map:after,
header.fix .ico_site_map:before,
header.fix .ico_site_map:after,
header.h_white .ico_site_map:before,
header.h_white .ico_site_map:after {
    background-color: var(--heading-color);
}

header.over .ico_menu span,
header.fix .ico_menu span,
header.h_white .ico_menu span {
    background-color: var(--heading-color);
}

header.over .ico_menu span:before,
header.over .ico_menu span:after,
header.fix .ico_menu span:before,
header.fix .ico_menu span:after,
header.h_white .ico_menu span:before,
header.h_white .ico_menu span:after {
    background-color: var(--heading-color);
}

header.over .ico_down:before,
header.fix .ico_down:before,
header.h_white .ico_down:before {
    border-color: rgba(0, 0, 0, 0.6)
}

header.over .main_menu,
header.over .lnb .mn,
header.fix .main_menu,
header.fix .lnb .mn,
header.h_white .main_menu,
header.h_white .lnb .mn {
    color: var(--heading-color);
}

header.over .main_menu:hover:before,
header.over .lnb .mn:hover:before,
header.over .main_menu.on:before,
header.over .lnb .on.mn:before,
header.fix .main_menu:hover:before,
header.fix .lnb .mn:hover:before,
header.fix .main_menu.on:before,
header.fix .lnb .on.mn:before,
header.h_white .main_menu:hover:before,
header.h_white .lnb .mn:hover:before,
header.h_white .main_menu.on:before,
header.h_white .lnb .on.mn:before {
    background: var(--sign-bottom);
}

header.over .main_menu .ico_angle_down,
header.over .lnb .mn .ico_angle_down,
header.fix .main_menu .ico_angle_down,
header.fix .lnb .mn .ico_angle_down,
header.h_white .main_menu .ico_angle_down,
header.h_white .lnb .mn .ico_angle_down {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_black_down1.svg") no-repeat 0 0;
}   

header.over .lnb .mn:before,
header.fix .lnb .mn:before,
header.h_white .lnb .mn:before {
    /*background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_line_black.png") no-repeat left center;*/
}

header.over .lnb .mn:hover:before,
header.over .lnb .mn.on:before,
header.fix .lnb .mn:hover:before,
header.fix .lnb .mn.on:before,
header.h_white .lnb .mn:hover:before,
header.h_white .lnb .mn.on:before {
    background-color: var(--sign-border);
}

header.over .sm.dot:before,
header.fix .sm.dot:before,
header.h_white .sm.dot:before {
    background: var(--sign-bottom);
}

@media (max-width: 1279px) {

    header.over .logo,
    header.fix .logo,
    header.h_white .logo {
        margin: 10px 0px 0px 2.6%;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/logo_on.svg") no-repeat 0 0;
        background-size: 100%
    }

    header.over .gnb li,
    header.fix .gnb li,
    header.h_white .gnb li {
        border-bottom: none
    }

    header.over .gnb .main_menu,
    header.over .gnb .lnb .mn,
    header.over .lnb .gnb .mn,
    header.fix .gnb .main_menu,
    header.fix .gnb .lnb .mn,
    header.fix .lnb .gnb .mn,
    header.h_white .gnb .main_menu,
    header.h_white .gnb .lnb .mn,
    header.h_white .lnb .gnb .mn {
        color: var(--heading-color);
        font-size: 22px
    }
}

@media (max-width: 767px) {

    header.over .logo,
    header.fix .logo,
    header.h_white .logo {
        width: 130px;
        height: 24px;
        margin: 10px 4px 8px 6.25%
    }

    header.over .gnb .main_menu,
    header.over .gnb .lnb .mn,
    header.over .lnb .gnb .mn,
    header.fix .gnb .main_menu,
    header.fix .gnb .lnb .mn,
    header.fix .lnb .gnb .mn,
    header.h_white .gnb .main_menu,
    header.h_white .gnb .lnb .mn,
    header.h_white .lnb .gnb .mn {
        font-size: 22px
    }
}

header.fix {
    -webkit-transition: background 200ms;
    transition: background 200ms;
    position: fixed;
    top: 0px;
    background: var(--bg-color);
    color: var(--heading-color);
    opacity: 1;
}

header.over {
    height: 548px
}

header.over.new_header {
    height: auto
}

@media (max-width: 1279px) {
    header.over {
        position: fixed;
        top: 0px;
        height: 60px;
        background: none;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    header.over .logo {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/logo.svg") no-repeat 0 0;
        background-size: 100%
    }

    header.over:before {
        z-index: 1;
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        position: fixed;
        background: rgba(0, 0, 0, 0.6)
    }
}

@media (max-width: 767px) {
    header.over {
        height: 44px
    }
}

header.over .show {
    display: block
}

header.over .show .wrap_menu {
    z-index: 2
}

header.over .menu {
    border-top: var(--header-bottom_bar) solid 1px
}

header.over .gnb .m_lnb {
    display: block
}

@media (max-width: 1279px) {
    header.over .menu {
        border-top: none
    }

    header.over .m_lnb .mn {
        display: inline-block;
        vertical-align: top
    }

    header.over .m_lnb .mn.txt_point {
        max-width: 160px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    header.over.h_white,
    header.over.fix {
        background: #ffffff;
        border-bottom: #e5e5e5 solid 1px
    }
}

header .gnb.new_gnb {
    float: none;
    text-align: center;
    padding-left: 173px;
    padding-right: 173px
}

header .gnb.new_gnb>li {
    text-align: left;
    display: inline-block;
    float: none
}

header .gnb.new_gnb .wrap_menu {
    width: auto;
    max-width: 1162px;
    background: none;
    padding: 32px 0 17px
}

header .gnb.new_gnb .menu {
    height: auto;
    top: 87px;
    border-bottom: var(--header-bottom_bar) solid 1px
    
}

header .gnb.new_gnb .main_menu,
header .gnb.new_gnb .lnb .mn,
header .lnb .gnb.new_gnb .mn {
    font-size: 16px;
    font-weight: bold;
    line-height: 96px;
    height: 87px
}

header .gnb.new_gnb .intranet .main_menu {
    color: var(--intranet-color);
}

header .gnb.new_gnb .intranet .menu .wrap_menu .area_dep a {
    color: var(--intranet-color);
}

@media (width: 1280px) {

    header .gnb.new_gnb .main_menu,
    header .gnb.new_gnb .lnb .mn,
    header .lnb .gnb.new_gnb .mn {
        padding: 0 10px
    }
}

header .gnb.new_gnb .area_dep {
    width: 100%;
    text-align: center
}

header .gnb.new_gnb .area_dep li {
    float: none;
    /*max-width: 280px;*/
    max-width: 220px;
    display: inline-block;
    margin-bottom: 36px;
    text-align: left
}

header .gnb.new_gnb .area_dep .expected  {
    color: var(--para-color);
}

header .gnb.new_gnb .area_dep li.mobile {
    display: none
}

header .gnb.new_gnb .area_dep li+li {
    margin-left: 10px
}

header .gnb.new_gnb .area_dep li:nth-child(5) {
    /*margin-left: 0*/
}

header .gnb.new_gnb .area_dep li:nth-child(6) {
    /*margin-left: 0*/
}

header .gnb.new_gnb .area_dep li:last-child {
    margin-left: 0
}

header .gnb.new_gnb .pc_soft .area_dep {
    text-align: left
}

header .gnb.new_gnb .custom {
    padding: 28px 0 23px 0
}

header .gnb.new_gnb .custom ul {
    min-width: 282px;
    margin: 0 auto 27px;
    font-weight: bold;
    line-height: 24px
}

header .gnb.new_gnb .custom ul li {
    margin-right: 0;
    display: inline
}

header .gnb.new_gnb .custom ul li+li {
    margin: 0 0 0 56px
}

header .gnb.new_gnb .custom ul li:last-child {
    margin-left: 56px
}

header .gnb.new_gnb .icon {
    width: 46px;
    height: 46px;
    margin-top: 8px;
    margin-right: 11px;
    border-radius: 15px
}

header .gnb.new_gnb .bx_item {
    width: auto;
    display: inline-block;
    line-height: 0;
    padding-top: 7px
}

header .gnb.new_gnb .bx_item strong {
    font-size: 16px;
    letter-spacing: -0.32px;
    color:var(--heading-color);
    line-height: 24px;
    display: block;
    margin-bottom: 4px
}

header .gnb.new_gnb .bx_item.disabled strong,
header .gnb.new_gnb .bx_item.disabled p {
    color:var(--disable);
}


header .gnb.new_gnb .bx_item .ico_new {
    padding: 0;
    margin-left: 10px;
    display: inline-block;
    width: 24px;
    height: 17px;
    background-position: 0 center;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_new02.svg") no-repeat right center
}

header .gnb.new_gnb .bx_item .ico_update {
    padding: 0;
    margin-left: 10px;
    display: inline-block;
    width: 38px;
    height: 17px;
    background-position: 0 center;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_update.svg") no-repeat right center
}

header .gnb.new_gnb .bx_item .txt_detail {
    width: 218px;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: 20px;
    margin-bottom: 17px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

header .gnb.new_gnb .bx_item .kinds a {
    display: inline-block;
    height: 22px;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: 14px
}

header .gnb.new_gnb .bx_item .kinds a+a {
    margin-left: 18px
}

header .gnb.new_gnb .bx_item .kinds a span {
    border-bottom: 1px solid #c8c8c8;
    padding: 0 1px
}

header .gnb.new_gnb .bx_item .kinds a:hover span,
header .gnb.new_gnb .bx_item .kinds a:focus span {
    border-bottom: 1px solid #222222
}

@media (max-width: 1279px) {
    header .gnb.new_gnb {
        padding: 0;
        text-align: left;
        max-width: 375px
    }

    header .gnb.new_gnb .m_lnb {
        padding: 0;
        margin-bottom: 9px;
        font-size: 16px;
    }

    header .gnb.new_gnb>li {
        text-align: left;
        display: block;
        float: none;
        padding: 0 11px;
        margin: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    header .gnb.new_gnb .wrap_menu {
        padding: 0
    }

    header .gnb.new_gnb .menu {
        top: initial;
        border-bottom: none
    }

    header .gnb.new_gnb .main_menu,
    header .gnb.new_gnb .lnb .mn,
    header .lnb .gnb.new_gnb .mn {
        line-height: 52px;
        height: 52px;
        padding: 0 13px;
        margin-bottom: 9px;
        font-size: 22px;
        letter-spacing: -0.44px
    }

    header .gnb.new_gnb .main_menu .ico_angle_down,
    header .gnb.new_gnb .lnb .mn .ico_angle_down,
    header .lnb .gnb.new_gnb .mn .ico_angle_down {
        width: 24px;
        height: 24px;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mobile_down.svg") no-repeat 0 0;
        display: inline-block;
        position: absolute;
        top: 25%;
        right: 0;
        left: initial
    }

    header .gnb.new_gnb .main_menu.on,
    header .gnb.new_gnb .lnb .on.mn,
    header .lnb .gnb.new_gnb .on.mn {
        margin-bottom: 0
    }

    header .gnb.new_gnb .main_menu.on .ico_angle_down,
    header .gnb.new_gnb .lnb .on.mn .ico_angle_down,
    header .lnb .gnb.new_gnb .on.mn .ico_angle_down {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    header .gnb.new_gnb .area_dep {
        float: left;
        padding-bottom: 0;
        margin: 3px 0 -11px 0
    }

    header .gnb.new_gnb .area_dep li {
        position: relative;
        float: left;
        min-width: 100px;
        width: 100px;
        margin: 6px 5px 21px;
        text-align: center;
        max-height: 202px;
        min-height: 134px;
        vertical-align: top
    }

    header .gnb.new_gnb .area_dep li.mobile {
        display: block
    }

    header .gnb.new_gnb .area_dep li+li {
        margin-left: 5px
    }

    header .gnb.new_gnb .area_dep li:nth-child(5) {
        margin-left: 0px
    }

    header .gnb.new_gnb .icon {
        margin: 0
    }

    header .gnb.new_gnb .bx_item {
        position: static;
        display: block
    }

    header .gnb.new_gnb .bx_item .ico_new,
    header .gnb.new_gnb .bx_item .ico_update {
        position: absolute;
        top: 1%;
        left: calc(50% + 20px)
    }

    header .gnb.new_gnb .bx_item strong {
        display: block;
        line-height: 22px;
        height: 46px;
        margin: 8px 0 10px;
        overflow: hidden
    }

    header .gnb.new_gnb .bx_item .txt_detail {
        display: none
    }

    header .gnb.new_gnb .bx_item .kinds a {
        display: block;
        height: 22px;
        font-size: 15px;
        letter-spacing: -0.28px;
        line-height: 15px
    }

    header .gnb.new_gnb .bx_item .kinds a.mobile {
        visibility: hidden
    }

    header .gnb.new_gnb .bx_item .kinds a+a {
        margin-left: 0;
        margin-top: 11px
    }

    header .gnb.new_gnb .bx_item .kinds a span {
        border-bottom: 1px solid #c8c8c8
    }

    header .gnb.new_gnb .bx_item .kinds a:hover span,
    header .gnb.new_gnb .bx_item .kinds a:focus span {
        border-bottom: 1px solid #222222
    }

    header .gnb.new_gnb .custom ul {
        margin: 20px 0 0 0;
        padding-bottom: 0
    }

    header .gnb.new_gnb .custom ul li {
        padding-left: 24px;
        display: block;
        float: none;
        width: 100%;
        margin: 0;
        min-height: 47px;
        text-align: left;
        font-weight: bold;
        font-size: 18px;
        line-height: 20px
    }

    header .gnb.new_gnb .custom ul li+li {
        margin: 0
    }

    header .gnb.new_gnb .custom ul li:last-child {
        margin: 0
    }
}

@media (max-width: 767px) {
    header .gnb.new_gnb {
        max-width: 100%;
        height: 100%
    }

    header .gnb.new_gnb>li {
        padding: 0 3.5%
    }

    header .gnb.new_gnb .main_menu,
    header .gnb.new_gnb .lnb .mn,
    header .lnb .gnb.new_gnb .mn {
        padding: 0 3%
    }

    header .gnb.new_gnb .main_menu .ico_angle_down,
    header .gnb.new_gnb .lnb .mn .ico_angle_down,
    header .lnb .gnb.new_gnb .mn .ico_angle_down {
        right: 2%
    }

    header .gnb.new_gnb .area_dep li {
        min-width: auto;
        width: 29.5%
    }
}

.lang_js header .dep3_good br {
    display: none !important
}

footer {
    font-weight: 600;
    font-size: 13px;
    padding-bottom: 50px;
    background: var(--footer-bg);    
}

@media (max-width: 1279px) {
    footer {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    footer {
        margin-bottom: 50px;
        font-size: 11px
    }
}

footer li {
    float: left
}

footer .wrap {
    max-width: 1230px;
    position: relative
}

footer .logo_footer {
    margin: 34px 0px 20px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/logo_footer.svg") no-repeat 0 0;
    background-size: 100%;
    content: "";
    width: 180px;
    height: 34px;
    display: inline-block;
    position: relative;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

footer .biz span {
    font-size: 14px;
    color: #bbbbbb
}

footer .biz span:after {
    content: "";
    width: 1px;
    height: 10px;
    display: inline-block;
    position: relative;
    background: #dddddd;
    vertical-align: middle;
    margin: 0px 10px
}

footer .biz span:last-child:after {
    display: none
}

footer .biz:after {
    display: block;
    clear: both;
    content: ""
}

footer .cus {
    display: inline-block;
    margin-top: 22px;
    font-size: 14px
}

footer .cus span {
    display: inline-block;
    margin-left: 5px;
    color: #4285F4 !important
}

footer .qna {
    margin: 2px 0 18px;
    padding-left: 12px;
    text-indent: -12px;
    color: #bbb
}

footer .qna::before {
    content: '※';
    margin-right: 3px
}

footer .qna br {
    display: none
}

footer .qna>.link {
    color: #222222
}

footer .copy {
    font-size: 13px;
    color: #bbbbbb
}

footer .seals {
    display: flex;
    padding: 3em 0 2em 0;
}

footer .seals span {
    padding-right: 10px;
}

footer .seals .seal .seal_ico{
    height: 50px;
    border-radius: 10px;
}

@media (max-width: 1279px) {
    footer .wrap {
        position: relative;
        padding: 0px 30px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        max-width: none
    }

    footer .wrap:after {
        display: block;
        clear: both;
        content: ""
    }

    footer .top .wrap {
        padding: 0px
    }

    footer .biz span {
        font-size: 12px
    }

    footer .biz span:after {
        margin: 0px 10px 0px 12px
    }

    footer .biz span:nth-child(4n):after {
        margin: 0px;
        height: 0px;
        background: #ffffff;
        display: block;
        clear: both;
        content: ""
    }

    footer .qna {
        margin-bottom: 20px;
        font-size: 12px
    }
}

@media (max-width: 767px) {
    footer .wrap {
        padding: 0 6.25%
    }

    footer .top {
        border-bottom: none
    }

    footer .logo_footer {
        margin: 33px 0px 18px;
        width: 111px;
        height: 20px;
        text-indent: -2000em;
        font-size: 1px;
        overflow: hidden
    }

    footer .biz span {
        font-size: 10px;
        line-height: 1.7;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: relative
    }

    footer .biz span:after {
        margin: 0 12px 0 14px
    }

    footer .biz span:nth-child(2n):after {
        margin: 0px;
        height: 0px;
        background: #ffffff;
        display: block;
        clear: both;
        content: ""
    }

    footer .cus {
        font-size: 11px
    }

    footer .qna {
        margin: 18px 0 29px;
        font-size: 11px
    }

    footer .qna br {
        display: inline-block
    }

    footer .copy {
        font-size: 11px;
        margin-top: 15px;
        display: block;
        clear: both;
        content: ""
    }

    footer .seals {
        display: flex;
        padding: 1em 0 2em 0;
        justify-content: center;
    }
    
    footer .seals span {
        padding-right: 5px;
    }
    
    footer .seals .seal .seal_ico{
        height: 20px;
    }    
}

footer .top {
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    line-height: 58px;
    width: 100%;
    height: 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 1279px) {
    footer .top {
        line-height: 56px;
        height: auto;
        border-bottom: none
    }
}

@media (max-width: 767px) {
    footer .top {
        line-height: 25px
    }
}

footer .top ul {
    float: left
}

footer .top li {
    margin-right: 30px
}

footer .top a {
    color: #888888
}

footer .top a:hover,
footer .top a.on {
    color: #222222
}

footer .top .f_right {
    float: right;
    display: block
}

@media (max-width: 1279px) {
    footer .top .f_right {
        display: block;
        clear: both;
        content: "";
        height: 56px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        float: none;
        border-bottom: 1px solid #e5e5e5;
        padding: 0 30px
    }
}

@media (max-width: 767px) {
    footer .top .f_right {
        padding: 0 6.25%;
        height: 40px
    }
}

footer .top .lang {
    display: none;
    float: left;
    position: relative;
    width: 80px;
    margin-right: 50px;
    line-height: 58px
}

footer .top .lang:after {
    content: "";
    width: 1px;
    height: 10px;
    display: block;
    position: absolute;
    background: #dddddd;
    top: 50%;
    right: -25px;
    margin-top: -5px
}

@media (max-width: 1279px) {
    footer .top .lang {
        display: block;
        width: 102px;
        float: left;
        margin-right: 44px;
        line-height: 56px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    footer .top .lang:after {
        right: -20px
    }
}

@media (max-width: 767px) {
    footer .top .lang {
        width: 50%;
        margin: 0;
        padding: 0 6.25% 0 0;
        border-right: 1px solid #e5e5e5;
        line-height: 40px
    }

    footer .top .lang:after {
        display: none
    }
}

footer .top .lang .slct_trg {
    width: 100%;
    display: block
}

footer .top .lang .slct_trg span {
    display: inline-block;
    width: calc(100% - 13px)
}

@media (max-width: 767px) {
    footer .top .lang .slct_trg span {
        width: calc(100% - 10px)
    }
}

footer .top .lang .slct_box {
    z-index: 11;
    position: absolute;
    display: none;
    width: 206px;
    bottom: 58px;
    left: 0px;
    background: #ffffff
}

footer .top .lang .slct_box li {
    margin: 0px;
    width: 50%;
    float: left !important
}

footer .top .lang .slct_box li a {
    padding-left: 18px;
    text-align: left
}

@media (max-width: 1279px) {
    footer .top .lang .slct_box {
        bottom: 56px;
        left: 0px
    }
}

@media (max-width: 767px) {
    footer .top .lang .slct_box {
        width: 200%;
        bottom: 40px;
        left: 0
    }

    footer .top .lang .slct_box li a {
        padding-left: 20px
    }
}

footer .top .lang .ico_angle_down {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 6px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    vertical-align: middle
}

footer .top .lang .ico_angle_down:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 3px;
    -webkit-transform: translate(-50%, -50%) scale(1, 1.2) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1, 1.2) rotate(45deg);
    transform: translate(-50%, -50%) scale(1, 1.2) rotate(45deg);
    margin-top: -1px;
    border-right: 2px solid #aaaaaa;
    border-bottom: 2px solid #aaaaaa
}

footer .top .lang a:hover .ico_angle_down:before {
    border-color: #222222
}

footer .top .s_map {
    opacity: 1;
    display: block;
    float: left;
    margin-right: 50px;
    position: relative;
    width: 95px
}

footer .top .s_map span {
    width: calc(100% - 16px);
    display: inline-block
}

footer .top .s_map:after {
    content: "";
    width: 1px;
    height: 10px;
    display: block;
    position: absolute;
    background: #dddddd;
    top: 50%;
    right: -25px;
    margin-top: -5px
}

footer .top .s_map.r_cont {
    margin-right: 0;
    text-align: right
}

footer .top .s_map.r_cont span {
    width: auto;
    margin-left: 10px
}

footer .top .s_map.r_cont:after {
    display: none
}

footer .top .s_map:hover .ico_plus:before,
footer .top .s_map:hover .ico_plus:after {
    background-color: #222222
}

@media (max-width: 1279px) {
    footer .top .s_map {
        display: none
    }
}

footer .top .ico_plus {
    width: 12px;
    height: 12px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-top: -3px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

footer .top .ico_plus:before {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0px;
    content: "";
    width: 100%;
    height: 2px;
    display: block;
    position: absolute;
    background: #aaaaaa
}

footer .top .ico_plus:after {
    top: 0px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    content: "";
    width: 2px;
    height: 100%;
    display: block;
    position: absolute;
    background: #aaaaaa
}

@media (max-width: 1279px) {
    footer .top .footmenu {
        float: none;
        width: 100%;
        padding: 7px 30px 8px 15px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border-bottom: 1px solid #e5e5e5;
        line-height: 40px
    }

    footer .top .footmenu:after {
        display: block;
        clear: both;
        content: ""
    }

    footer .top .footmenu li {
        margin: 0 15px
    }

    footer .top .footmenu li a {
        display: inline-block
    }
}

@media (max-width: 767px) {
    footer .top .footmenu {
        float: none;
        width: calc(100% + 10px);
        margin-left: -12px;
        padding: 7px 6.25%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border-bottom: 1px solid #e5e5e5;
        line-height: 1
    }

    footer .top .footmenu:after {
        display: block;
        clear: both;
        content: ""
    }

    footer .top .footmenu li {
        margin: 0 11px
    }

    footer .top .footmenu li a {
        padding: 7px 0px;
        display: inline-block
    }
}

footer .family {
    float: left;
    width: 140px;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

footer .family .slct_box {
    z-index: 5;
    position: absolute;
    width: 100%;
    bottom: 58px;
    display: none
}

footer .family .slct_box li {
    margin: 0px;
    width: 100%
}

footer .family a {
    display: block;
    width: 100%;
    height: 100%
}

footer .family a:hover .ico_plus:before,
footer .family a:hover .ico_plus:after {
    background-color: #222222
}

footer .family span {
    display: inline-block;
    width: calc(100% - 16px)
}

footer .family.replace {
    position: absolute;
    top: 106px;
    right: 0;
    width: 165px;
    height: 47px;
    line-height: 47px;
    z-index: 5;
    background-color: #ffffff
}

footer .family.replace .slct_trg {
    position: relative;
    padding: 0 20px;
    border: 1px solid #e5e5e5;
    border-radius: 23px;
    color: #888;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

footer .family.replace .slct_trg .ico_down {
    position: absolute;
    display: block;
    width: 10px;
    height: 5px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    top: 50%;
    right: 20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

footer .family.replace .slct_trg .ico_down:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 3px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-top: 1px;
    border-top: 2px solid rgba(170, 170, 170, 0);
    border-left: 2px solid rgba(170, 170, 170, 0)
}

footer .family.replace .slct_trg .ico_down:before {
    border-color: rgba(0, 0, 0, 0.6)
}

footer .family.replace .slct_box {
    bottom: 49px;
    border: 1px solid #e5e5e5;
    border-radius: 23px;
    overflow: hidden;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

footer .family.replace .slct_box a {
    padding: 0 20px;
    height: 40px;
    line-height: 40px;
    text-align: left;
    color: #888
}

footer .family.replace .slct_box a:hover {
    background: none;
    text-decoration: underline;
    color: #222222
}

@media (max-width: 1279px) {
    footer .family {
        line-height: 56px
    }

    footer .family .slct_box {
        width: 100%;
        bottom: 56px;
        left: 0
    }

    footer .family.replace {
        position: relative;
        top: auto;
        right: auto;
        width: 140px;
        height: auto;
        line-height: 56px;
        background: none
    }

    footer .family.replace .slct_trg {
        padding: 0;
        border: 0
    }

    footer .family.replace .slct_trg .ico_down {
        width: 12px;
        height: 12px;
        display: inline-block;
        position: relative;
        vertical-align: middle;
        margin-top: -3px;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }

    footer .family.replace .slct_trg .ico_down:before {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0px;
        border: 0;
        content: "";
        width: 100%;
        height: 2px;
        display: block;
        position: absolute;
        background: #aaaaaa;
        margin-top: 0
    }

    footer .family.replace .slct_trg .ico_down:after {
        top: 0px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        content: "";
        width: 2px;
        height: 100%;
        display: block;
        position: absolute;
        background: #aaaaaa
    }

    footer .family.replace .slct_trg:hover {
        color: #222222
    }

    footer .family.replace .slct_trg:hover .ico_down:before,
    footer .family.replace .slct_trg:hover .ico_down:after {
        background-color: #222222
    }

    footer .family.replace .slct_box {
        bottom: 56px;
        border: 1px solid #222222;
        border-top: 2px solid #222222;
        border-radius: 0
    }

    footer .family.replace .slct_box a {
        padding: 0;
        height: 50px;
        line-height: 3.9;
        text-align: center
    }

    footer .family.replace .slct_box a:hover {
        background: #f7f7f7;
        text-decoration: none
    }
}

@media (max-width: 767px) {
    footer .family {
        width: 50%;
        padding: 0 0 0 6.25%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        line-height: 40px
    }

    footer .family .slct_box {
        width: 88%;
        bottom: 40px;
        left: 12.5%
    }

    footer .family span {
        width: calc(100% - 15px);
        margin-right: 0
    }

    footer .family.replace {
        width: 50%;
        padding: 0 0 0 6.25%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        line-height: 40px
    }

    footer .family.replace .slct_box {
        width: 88%;
        bottom: 40px;
        left: 12.5%
    }

    footer .family.replace span {
        width: calc(100% - 15px);
        margin-right: 0
    }
}

footer .lst_social {
    position: absolute;
    overflow: hidden;
    top: 40px;
    right: 0px
}

footer .lst_social li {
    width: 47px;
    height: 47px;
    margin-left: 10px
}

footer .lst_social a {
    width: 100%;
    height: 100%;
    display: block;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

footer .lst_social.type2 {
    top: 46px;
    right: 185px
}

@media (max-width: 1279px) {
    footer .lst_social.type2 {
        top: 22px;
        right: 30px
    }
}

@media (max-width: 767px) {
    footer .lst_social.type2 {
        right: 6.25%
    }
}

@media (max-width: 1279px) {
    footer .lst_social {
        top: 22px;
        right: 30px
    }

    footer .lst_social li {
        width: 42px;
        height: 42px
    }
}

@media (max-width: 767px) {
    footer .lst_social {
        right: 6.25%
    }

    footer .lst_social li {
        width: 31px;
        height: 31px;
        margin-left: 6px
    }
}

footer .lst_social .ico_face {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_face.svg") no-repeat 0 0;
    background-size: 100%
}

footer .lst_social .ico_twit {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_twit.svg") no-repeat 0 0;
    background-size: 100%
}

footer .lst_social .ico_blog {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_blog.svg") no-repeat 0 0;
    background-size: 100%
}

footer .lst_social .ico_insta {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_instagram.png") no-repeat 0 0;
    background-size: 100%
}

footer .lst_social .ico_yout {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_youtube.png") no-repeat 0 0;
    background-size: 100%
}

footer .lst_social .ico_kakao {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_foot_kakao.png") no-repeat 0 0;
    background-size: 100%
}
.lang_ko footer .qna {
    margin: 0
}

.lang_ko footer .copy {
    margin-top: 18px;
    font-size: 12px
}

.lang_ko footer .lst_social.type2 {
    top: 141px
}

.lang_ko footer .family.replace {
    top: 199px
}

@media (max-width: 1279px) {
    .lang_ko footer .qna {
        margin-bottom: 0
    }

    .lang_ko footer .lst_social.type2 {
        top: 22px
    }

    .lang_ko footer .family.replace {
        top: auto
    }
}

@media (max-width: 767px) {
    .lang_ko footer .qna {
        margin: 0;
        font-size: 10px
    }

    .lang_ko footer .copy {
        font-size: 11px;
    }
}

.col2:after,
.sub .goods_info:after {
    display: block;
    clear: both;
    content: ""
}

.col2 .left,
.sub .goods_info .left {
    float: left;
    display: block
}

.col2 .right,
.sub .goods_info .right {
    float: right;
    display: block
}

.floating_menu {
    position: absolute;
    top: 952px;
    right: 0px;
    z-index: 3;
    width: 0px;
    height: 570px;
    background: #ffffff;
    border: 1px solid #e3e3e3;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 28px 0px 10px 10px
}

@media (max-width: 1279px) {
    .floating_menu {
        display: none
    }
}

.floating_menu .btn_float {
    content: "";
    width: 13px;
    height: 109px;
    display: block;
    position: absolute;
    background: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #e3e3e3;
    border-right: none;
    border-radius: 25px 0px 0px 25px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    top: 50%;
    left: -13px
}

.floating_menu .btn_float:before {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: 2px;
    border-left: 2px solid #222222;
    border-bottom: 2px solid #222222;
    top: 50%;
    left: 50%
}

.floating_menu ul {
    width: 70px;
    margin-left: 1px
}

.floating_menu li {
    text-align: center;
    font-size: 11px;
    line-height: 20px
}

.floating_menu li:after {
    content: "";
    width: 56px;
    height: 1px;
    display: block;
    position: relative;
    background: #e3e3e3;
    margin: 18px auto
}

.floating_menu li:last-child:after {
    display: none
}

.floating_menu li a,
.floating_menu li button {
    display: block;
    margin: 0 auto
}

.floating_menu li a:before,
.floating_menu li button:before {
    margin: 0 auto 10px
}

.floating_menu li span {
    display: block;
    font-weight: 600;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.floating_menu li .ad_box {
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px
}

.floating_menu li .ad_box img {
    width: 100%
}

.floating_menu li .btn_FDown {
    line-height: 11px
}

.floating_menu li .btn_FDown:before {
    content: "";
    width: 32px;
    height: 28px;
    display: block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_float_down.png") no-repeat 0 0
}

.floating_menu li .btn_FCust {
    line-height: 11px
}

.floating_menu li .btn_FCust:before {
    content: "";
    width: 42px;
    height: 28px;
    display: block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_float_cust.png") no-repeat 0 0
}

.floating_menu li .FLike_box {
    margin-bottom: 4px
}

.floating_menu li .FLike_box span {
    width: 100%;
    border-radius: 3px 3px 0px 0px;
    border: 1px solid #90949c;
    border-bottom: none;
    display: block
}

.floating_menu li .FLike_box span.ico_face {
    border-radius: 0px 0px 3px 3px;
    background: #4267b2;
    border: 1px solid #4267b2;
    border-top: none;
    color: #ffffff
}

.floating_menu li .FLike_box span.ico_face:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_float_facebook.gif") no-repeat 0 0;
    content: "";
    width: 12px;
    height: 14px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: -2px 6px 0px 0px
}

.floating_menu li .btn_FLike {
    background: #4267b2;
    color: #ffffff;
    border-radius: 3px;
    margin-bottom: 12px
}

.floating_menu li .btn_FGoogle {
    width: 50px;
    height: 20px;
    margin: 0px auto;
    border: 1px solid #e3e3e3;
    border-radius: 3px
}

.floating_menu li .btn_FGoogle span {
    display: inline-block
}

.floating_menu li .btn_FGoogle span:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_float_google.gif") no-repeat 0 0;
    content: "";
    width: 12px;
    height: 14px;
    display: inline-block;
    position: relative;
    margin: -1px 6px 0px 0px;
    vertical-align: middle
}

.floating_menu li .btn_FTop {
    font-size: 14px;
    line-height: 14px;
    margin-top: -8px
}

.floating_menu li .btn_FTop span:after {
    content: '';
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-top: 1px;
    border-top: 2px solid #222222;
    border-left: 2px solid #222222;
    border-right: none;
    border-bottom: none;
    margin: 6px 0px 0px 10px
}

.floating_menu.open {
    width: 92px;
    padding: 28px 10px 10px
}

.floating_menu.open ul {
    margin-left: 0px
}

.floating_menu.open .btn_float:before {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid #222222;
    border-right: 2px solid #222222;
    margin-left: 0px;
    border-bottom: none;
    border-left: none
}

.floating_menu.fix {
    position: fixed;
    top: 50%;
    margin-top: -275px
}

.btn_top_fix,
.btn_qna_fix {
    display: block;
    z-index: 10;
    position: fixed;
    width: 70px;
    height: 70px;
    background: var(--btn-top-bg);
    border: 1px #222222 solid;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: 600
}

@media (max-width: 767px) {

    .btn_top_fix,
    .btn_qna_fix {
        width: 47px;
        height: 47px;
        font-size: 11px
    }
}

.btn_top_fix {
    bottom: 40px;
    right: 40px
}

.btn_top_fix:before {
    content: '';
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 8px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-top: 3px;
    border-top: 4px solid var(--btn-top-color);
    border-left: 4px solid var(--btn-top-color);
    border-right: none;
    border-bottom: none;
    -webkit-transform: translate(0) scale(1, 1.07692) rotate(45deg);
    -ms-transform: translate(0) scale(1, 1.07692) rotate(45deg);
    transform: translate(0) scale(1, 1.07692) rotate(45deg);
    margin-top: 16px
}

.btn_top_fix span {
    display: block
}

@media (max-width: 1279px) {
    .btn_top_fix {
        bottom: 30px;
        right: 30px
    }

    .darkmode {
        bottom: 30px;
        right: 124px;
    }
}

@media (max-width: 767px) {
    .btn_top_fix {
        bottom: 20px;
        right: 20px
    }

    .darkmode {
        bottom: 20px;
        right: 84px;
    }

    .btn_top_fix:before {
        content: '';
        position: relative;
        display: inline-block;
        vertical-align: middle;
        width: 6px;
        height: 6px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: 2px;
        border-top: 3px solid var(--btn-top-color);
        border-left: 3px solid var(--btn-top-color);
        border-right: none;
        border-bottom: none;
        -webkit-transform: translate(0) rotate(45deg);
        -ms-transform: translate(0) rotate(45deg);
        transform: translate(0) rotate(45deg);
        margin-top: 13px
    }
}

.btn_qna_fix {
    right: 40px;
    bottom: 130px
}

.btn_qna_fix:before {
    display: block;
    content: '';
    width: 35px;
    height: 25px;
    margin: 10px auto 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_qna.svg") no-repeat 50% 0
}

@media (max-width: 1279px) {
    .btn_qna_fix {
        bottom: 110px;
        right: 30px
    }
}

@media (max-width: 767px) {
    .btn_qna_fix {
        bottom: 77px;
        right: 20px;
        font-size: 10px
    }

    .btn_qna_fix:before {
        width: 22px;
        height: 16px;
        background-size: 22px 16px
    }
}

.btn_evbnr_fix {
    display: block;
    z-index: 10;
    position: fixed;
    right: 40px;
    bottom: 220px;
    width: 160px;
    height: 140px
}

.btn_evbnr_fix img {
    display: block;
    width: 100%
}

@media (max-width: 1279px) {
    .btn_evbnr_fix {
        bottom: 190px;
        right: 30px
    }
}

@media (max-width: 767px) {
    .btn_evbnr_fix {
        bottom: 134px;
        right: 20px;
        width: 80px;
        height: 70px
    }
}

.ie8 {
    width: 1899px
}

.ie8 .wrap {
    width: 1279px
}

.ie8 .wrap.wide {
    width: 100%
}

.ie8 header,
.ie8 .sub_menu {
    min-width: 1899px;
    position: absolute !important
}

.ie8 header .wrap_menu,
.ie8 header .dep2_menum,
.ie8 header .area_dep3,
.ie8 header .dep3_goods,
.ie8 .sub_menu .wrap_menu,
.ie8 .sub_menu .dep2_menum,
.ie8 .sub_menu .area_dep3,
.ie8 .sub_menu .dep3_goods {
    background: #ffffff
}

.ie8 header .wrap,
.ie8 .sub_menu .wrap {
    width: 100%
}

.ie8 .sub .sub_menu,
.ie8 .sub .sub_menu.fix {
    position: relative !important;
    top: auto
}

.ie8 .floating_menu {
    display: none
}

.ie8 .main_slider .wrap {
    width: 100%
}

.ie8 .main_slider .btn_box li a span {
    padding-top: 60px
}

.ie8 .main_slider .btn_box.global br {
    display: block
}

.ie8 section,
.ie8 header,
.ie8 footer,
.ie8 article,
.ie8 nav,
.ie8 header,
.ie8 footer {
    display: block
}

.ie8 .site_map {
    display: none;
    background: #3b3b3b
}

.ie8 .site_map .wrap {
    width: 1040px;
    margin: -321px auto -520px
}

@media (max-width: 767px) {
    body {
        min-width: 320px
    }
}

h1 {
    font-size: 46px;
    line-height: 1.26
}

h1.tit_c {
    text-align: center
}

h2 {
    font-size: 38px;
    font-weight: 100;
    line-height: 52px;
    line-height: 1.36
}

.sub .container .partner h2:after {
    position: absolute;
    content: "";
    width: 44px;
    height: 1px;
    background: var(--heading-color);
    margin-left: -22px;
    left: 50%;
    line-height: 44px;
    top: 82px;
}

h3 {
    font-size: 18px;
    line-height: 1.66
}

hr {
    margin-top: 30px
}

.tag {
    font-size: 13px;
    line-height: 1.53
}

.stit {
    font-size: 30px;
    line-height: 1.5
}

@media (max-width: 1279px) {
    .stit {
        font-size: 24px
    }
}

@media (max-width: 767px) {
    .stit {
        font-size: 22px
    }
}

.ly_new h1 {
    line-height: 1.47
}

.pc_show {
    display: block
}

@media (max-width: 1279px) {
    .pc_show {
        display: none
    }
}

.t_show {
    display: none
}

@media (max-width: 1279px) {
    .t_show {
        display: block
    }
}

.pc_only {
    overflow: hidden
}

.noti_pc_only {
    display: none;
    margin: 0px 0px 50px
}

.noti_pc_only .ico {
    width: 62px;
    margin: 0 28px 0 0
}

@media (max-width: 767px) {
    .noti_pc_only {
        margin: 0px 0px 40px
    }

    .noti_pc_only .ico {
        width: 57px;
        margin: 0px
    }
}

@media (max-width: 767px) {
    .mb_hidden {
        display: none
    }
}

.inline {
    display: inline-block
}

.tbl_tit,
.mypage .tbl_tit {
    margin-top: 80px;
    padding-bottom: 14px;
    font-size: 18px;
    font-weight: 600
}

.tbl_tit.center {
    padding-bottom: 25px;
    text-align: center
}

.tbl_tit .sub {
    margin-top: 21px
}

@media (max-width: 1279px) {
    .tbl_tit .sub {
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .tbl_tit.center {
        font-size: 13px
    }

    .tbl_tit .sub {
        margin-top: 10px;
        font-size: 14px
    }
}

h3+.tbl_tit,
.mypage h3+.tbl_tit,
.cnt_top+.tbl_tit,
.mypage .cnt_top+.tbl_tit {
    margin-top: 0
}

.tit_point,
.mypage .tit_point {
    margin-bottom: 50px;
    line-height: 1.4;
    font-size: 38px;
    font-weight: 100
}

.tbl_top {
    margin-top: 93px
}

.tbl_top:after {
    display: block;
    clear: both;
    content: ""
}

.tbl_top.srch {
    height: 50px;
    margin-bottom: 40px
}

.tbl_top .slct {
    float: left
}

.tbl_top .bx_srch {
    float: right;
    width: 402px
}

@media (max-width: 1279px) {
    .tbl_top {
        margin-top: 76px
    }

    .tbl_top.srch {
        height: 40px
    }

    .tbl_top .bx_srch {
        width: 324px
    }
}

@media (max-width: 767px) {
    .tbl_top {
        margin-top: 50px
    }

    .tbl_top.srch {
        height: auto;
        margin-bottom: 15px
    }

    .tbl_top .slct {
        float: none;
        width: 100% !important;
        margin: 40px 0 0
    }

    .tbl_top .bx_srch {
        float: none;
        width: 100%
    }
}

.bx_loading {
    position: fixed;
    width: 100%;
    top: 50%;
    left: 0;
    text-align: center;
    margin-top: -61px
}

.bx_loading p {
    margin-top: 10px
}

.page_loading {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -30px 0px 0px -30px;
    z-index: 10
}

.pc_lf {
    display: block
}

@media (max-width: 1279px) {
    .pc_lf {
        display: inline
    }

    .pc_lf.t_lf {
        display: block
    }
}

@media (max-width: 1279px) and (max-width: 767px) {
    .pc_lf.t_lf {
        display: inline
    }

    .pc_lf.t_lf.m_lf {
        display: block
    }
}

@media (max-width: 1279px) {
    .pc_only {
        display: none !important
    }

    .noti_pc_only {
        display: block !important
    }

    h1 {
        font-size: 42px
    }

    h2 {
        font-size: 32px
    }

    h3 {
        font-size: 18px
    }

    .tag {
        font-size: 14px
    }

    .tit_point,
    .mypage .tit_point {
        margin-bottom: 40px;
        font-size: 32px
    }

    .tbl_tit,
    .mypage .tbl_tit {
        margin-top: 70px
    }

    .t_lf {
        display: block
    }
}

@media (max-width: 1279px) and (max-width: 767px) {
    .t_lf {
        display: inline
    }

    .t_lf.m_lf {
        display: block
    }
}

@media (max-width: 767px) {
    h1 {
        font-size: 28px
    }

    h2 {
        font-size: 23px
    }

    h3 {
        font-size: 14px
    }

    .tag {
        font-size: 12px
    }

    .tbl_tit,
    .mypage .tbl_tit {
        margin-top: 50px;
        font-size: 14px
    }

    .tit_point,
    .mypage .tit_point {
        margin-bottom: 30px;
        font-size: 23px;
        font-weight: 100
    }

    .m_lf {
        display: block
    }
}

.txt_bg {
    display: inline-block;
    padding: 5px 10px;
    line-height: 1;
    color: #ffffff;
    border-radius: 3px;
    background: #222222;
    font-weight: 600;
    font-size: 13px
}

.txt_bg.white {
    background: #ffffff;
    color: #222222
}

.txt_bg.crcl {
    border-radius: 25px
}

.txt_point {
    color: #4285F4 !important
}

.txt_point.big {
    font-weight: 600
}

a.txt_point {
    color: #4285F4
}

.txt_gray {
    color: #999999
}

.txt_black {
    color: #222222
}

.btn_reinstall {
    display: block;
    width: 520px;
    height: 186px;
    border: 1px solid #F0F0F0;
    border-radius: 10px;
    margin: 30px auto 100px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: url("//dreamgreen.co.kr/assets/ui/img/sub/ico_reinstall.png") no-repeat 50% 50%;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

.btn_reinstall:hover,
.btn_reinstall:active {
    border: 1px solid #222
}

@media (max-width: 767px) {
    .btn_reinstall {
        width: 80%;
        height: 93px;
        margin: 15px auto 50px;
        background-size: 40px 40px
    }
}

.txt_neces {
    margin: 5px auto;
    text-align: right;
    font-weight: 600;
    font-size: 15px;
    color: #f52222
}

.txt_neces+form .tbl_file {
    margin-top: 10px
}

.txt_neces img {
    vertical-align: middle;
    margin-right: 2px
}

.txt_neces .bar {
    display: inline-block;
    width: 1px;
    height: 13px;
    background: #222222;
    margin: 0 26px
}

.txt_neces.left {
    float: right
}

.txt_neces.left::after {
    display: block;
    clear: both;
    content: ""
}

.txt_neces .btn_link {
    font-size: 18px;
    font-weight: 100;
    line-height: 36px
}

.txt_neces .btn_link img {
    height: 16px;
    vertical-align: -2px
}

.txt_neces .btn_link img[src*="ico_delete"] {
    vertical-align: -1px
}

@media (max-width: 767px) {
    .txt_neces .btn_link img[src*="ico_delete"] {
        vertical-align: -2px
    }
}

.txt_neces .btn_link.disable {
    color: #999
}

.txt_neces .btn_link.disable img {
    opacity: 0.5
}

.txt_neces .btn_link .ico_download {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 2px;
    background-color: #222222;
    margin-right: 5px
}

.txt_neces .btn_link .ico_download:before {
    content: '';
    position: absolute;
    bottom: 8px;
    border-top: 2px solid #222222;
    border-left: 2px solid #222222;
    left: 50%;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, 50%) rotate(-135deg);
    -ms-transform: translate(-50%, 50%) rotate(-135deg);
    transform: translate(-50%, 50%) rotate(-135deg)
}

.txt_neces .btn_link .ico_download:after {
    content: '';
    position: absolute;
    background-color: #222222;
    bottom: 4px;
    left: 50%;
    width: 2px;
    height: 9px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.txt_neces .link {
    font-size: 15px;
    margin-bottom: 15px;
    display: inline-block;
    font-weight: 100
}

.txt_neces .link.on {
    font-weight: 600
}

@media (max-width: 767px) {
    .txt_neces {
        text-align: left
    }

    .txt_neces .btn_link {
        font-size: 14px;
        line-height: 22px;
        text-align: right;
        display: block
    }

    .txt_neces .btn_link img {
        vertical-align: -3px
    }

    .txt_neces .btn_link.left {
        text-align: left
    }

    .txt_neces .bar {
        margin: 0 15px
    }
}

.txt_alert {
    color: #f52222;
    position: relative;
    font-weight: 600;
    margin-top: 4px;
    padding-left: 20px;
    font-size: 13px;
    line-height: 1.7;
    text-align: left
}

.txt_alert.icon {
    padding-left: 22px;
    font-weight: 100
}

.txt_alert.icon:before {
    display: block;
    position: absolute;
    content: "!";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #f52222;
    background: #fcdedd;
    border-radius: 25px;
    top: 3px;
    left: 0px;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    text-indent: -1px
}

.txt_alert.icon.gray {
    font-weight: 100;
    color: #999999
}

.txt_alert.icon.gray:before {
    display: block;
    position: absolute;
    content: "!";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #999999;
    background: #dddddd;
    border-radius: 25px
}

.txt_alert.icon.gray.down {
    margin-bottom: 26px
}

@media (max-width: 767px) {
    .txt_alert.icon.gray.down {
        margin-bottom: 16px
    }
}

.txt_alert.icon.err {
    /*margin: 12px 0 27px 0*/
}

@media (max-width: 767px) {
    .txt_alert.icon.err {
        margin: 12px 0 20px 0
    }
}

.txt_alert:before {
    display: block;
    position: absolute;
    content: "!";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #ffffff;
    background: #f52222;
    border-radius: 25px;
    top: 3px;
    left: 0px;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    text-indent: -1px
}

.txt_alert.gray {
    font-weight: 100;
    color: #999999
}

.txt_alert.gray:before {
    display: block;
    position: absolute;
    content: "!";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #ffffff;
    background: #999999;
    border-radius: 25px
}

.txt_alert.gray.up {
    margin-top: 12px !important
}

.txt_alert.gray.down {
    margin-bottom: 16px
}

@media (max-width: 1279px) {
    .txt_alert.gray.down {
        margin-bottom: 20px
    }
}

.txt_alert.black {
    color: #222222;
    font-weight: 100
}

.txt_alert.black:before {
    display: block;
    position: absolute;
    content: "!";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #ffffff;
    background: #999999;
    border-radius: 25px
}

.txt_alert.pass {
    color: #028cdc
}

.txt_alert.pass:before {
    display: block;
    position: absolute;
    content: "";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    color: #ffffff;
    background: #028cdc;
    border-radius: 25px
}

.txt_alert.pass:after {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-top: -1px;
    border-top: none;
    border-left: none;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    margin-top: -1px;
    top: 50%;
    left: 8px
}

@media (max-width: 1279px) {
    .txt_alert.multi:before {
        top: 3px
    }
}

@media (max-width: 767px) {
    .txt_alert.multi:before {
        top: 2px
    }
}

.txt_alert.up {
    margin-top: 10px;
    margin-bottom: 0
}

@media (max-width: 1279px) {

    .txt_alert,
    .txt_neces {
        font-size: 13px
    }

    .txt_alert:before,
    .txt_neces:before {
        top: 3px
    }
}

@media (max-width: 767px) {

    .txt_alert,
    .txt_neces {
        font-size: 12px !important;
        line-height: 1.6 !important
    }

    .txt_alert:before,
    .txt_neces:before {
        top: 2px
    }
}

.txt_noti {
    font-size: 13px;
    text-align: right;
    margin: 60px 0 15px
}

.txt_noti a {
    text-decoration: underline
}

@media (max-width: 1279px) {
    .txt_noti {
        margin: 60px 0 10px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .txt_noti {
        margin: 30px 0 10px;
        font-size: 13px;
        text-align: left
    }
}

.ico_chk_org1 {
    display: inline-block;
    width: 15px;
    height: 11px;
    margin-right: 10px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bu_check.png") no-repeat 0 0;
    background-size: 100%
}

.half_area::after {
    display: block;
    clear: both;
    content: ""
}

.half_area .left {
    float: left
}

.half_area .right {
    float: right
}

.half_area .tit_point {
    margin-bottom: 0
}

.half_area .tbl_tit {
    margin-top: 0
}

.half_area .txt_neces {
    margin-top: 8px
}

@media (max-width: 767px) {
    .half_area .left {
        float: none
    }

    .half_area .right {
        float: none
    }

    .half_area .txt_neces {
        margin-top: 27px;
        text-align: left
    }
}

.txt_side {
    font-weight: 600;
    font-size: 18px
}

@media (max-width: 767px) {
    .txt_side {
        font-size: 13px
    }
}

.location {
    width: 100%;
    max-width: 1080px;
    margin: 20px auto 35px;
    position: relative;
    display: block;
    clear: both;
    content: "";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    font-size: 13px;
    line-height: 1.3
}

@media (max-width: 1279px) {
    .location {
        margin: 20px auto 36px;
        padding: 0px 3.9% 0px
    }
}

@media (max-width: 767px) {
    .location {
        display: none
    }
}

.location .item {
    font-size: 13px;
    line-height: 1.3;
    color: #999999
}

.location .item:before {
    content: ">";
    font-size: 9px;
    margin: 0px 10px
}

.location .item:first-child:before {
    display: none
}

.container .cnt_top h1 {
    margin: 0
}

.container+.tbl_board {
    margin-top: 40px
}

.cnt_top {
    text-align: center
}

.cnt_top h1+.subtit {
    font-weight: 100
}

.cnt_top.complet .subtit {
    margin: 80px 0 90px 0
}

.cnt_top+.bx_info {
    margin-top: 50px
}

.cnt_top .subtit {
    font-weight: 600;
    margin: 15px 0 45px;
    line-height: 1.7
}

.cnt_top .subtit .bold_point {
    font-size: 24px;
    color: #4285F4
}

.cnt_top .bx_srch {
    overflow: hidden;
    width: 860px;
    margin: 0 auto;
    border: 2px solid #222222
}

.cnt_top .bx_srch .slct {
    float: left;
    width: 190px;
    height: 58px;
    border: 0;
    margin: 0
}

.cnt_top .bx_srch .bx_ipt {
    float: left;
    width: 595px;
    height: 58px
}

.cnt_top .bx_srch .bx_ipt input {
    height: 100%;
    border: 0
}

.cnt_top .bx_srch .bx_ipt .holder {
    line-height: 58px
}

@media (max-width: 1279px) {
    .cnt_top .bx_srch .bx_ipt .holder {
        line-height: 2.8
    }
}

.cnt_top .bx_srch .btn_srch {
    float: right;
    width: 60px;
    height: 58px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: #222 url("//dreamgreen.co.kr/assets/ui/img/common/btn_srch.svg") no-repeat center;
    background-size: 50%;
    cursor: pointer;
    font-size: 0;
    line-height: 0
}

.cnt_top .bx_srch .btns_swipe {
    overflow: hidden;
    position: relative;
    float: left;
    max-width: 185px;
    margin: 7px 5px 0 7px;
    border-radius: 6px;
    background: #222222;
    border: 2px solid #222222;
    font-size: 16px
}

.cnt_top .bx_srch .btns_swipe p {
    float: left;
    position: relative;
    z-index: 1;
    height: 41px;
    padding: 0 27px;
    min-width: 33px;
    cursor: pointer;
    line-height: 41px;
    color: #ffffff
}

.cnt_top .bx_srch .btns_swipe span {
    display: block;
    position: absolute;
    top: 0;
    height: 41px;
    width: 50%;
    border-radius: 3px;
    background: #4285F4
}

.cnt_top .bx_srch.no_selc .bx_ipt {
    width: calc(100% - 65px)
}

@media (max-width: 1279px) {
    .cnt_top .bx_srch.no_selc .bx_ipt {
        width: 536px;
        width: calc(100% - 55px)
    }
}

@media (max-width: 767px) {
    .cnt_top .bx_srch.no_selc .bx_ipt {
        width: 252px;
        width: calc(100% - 40px)
    }
}

.cnt_top form+.google_bnr,
.cnt_top form+.google_bnr_tp2,
.cnt_top form+.google_bnr_tp2 {
    margin: 60px auto 0
}

@media (max-width: 767px) {

    .cnt_top form+.google_bnr,
    .cnt_top form+.google_bnr_tp2,
    .cnt_top form+.google_bnr_tp2 {
        margin-top: 30px
    }
}

.cnt_top .bx_result {
    max-width: 860px;
    min-height: 20px;
    margin: 60px auto 0
}

.cnt_top .bx_result .txt {
    font-size: 20px;
    font-weight: 600;
    word-break: break-all
}

.cnt_top .bx_result .txt strong {
    color: #4285F4
}

@media (max-width: 767px) {
    .cnt_top .bx_result .txt {
        font-size: 14px
    }
}

.cnt_top .bx_result .bx_ico {
    margin: 30px auto 35px
}

.cnt_top .bx_result .bx_ico:last-child {
    margin-bottom: 0
}

@media (max-width: 767px) {
    .cnt_top .bx_result .bx_ico {
        margin: 20px auto 30px
    }
}

.cnt_top .bx_result .bx_ico img[src*="bu_keyword"] {
    width: 130px
}

@media (max-width: 1279px) {
    .cnt_top .bx_result {
        margin: 60px auto 40px
    }
}

@media (max-width: 767px) {
    .cnt_top .bx_result {
        margin: 30px auto
    }

    .cnt_top .bx_result .txt {
        font-size: 14px
    }
}

.cnt_top .bx_tab {
    margin: 60px 0;
    text-align: center
}

.cnt_top .bx_tab li {
    display: inline-block;
    margin: 0 25px
}

.cnt_top .bx_tab li.on a {
    position: relative;
    font-weight: 600
}

.cnt_top .bx_tab li.on a:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 1px;
    width: 100%;
    border-top: 2px solid var(--table-top-border);
}

.cnt_top .bx_tab a.emp{
    color: var(--emp);
}


@media (max-width: 1279px) {
    .cnt_top .subtit {
        margin: 15px 0 25px;
        font-size: 18px
    }

    .cnt_top .subtit .bold_point {
        font-size: 22px
    }

    .cnt_top .bx_srch {
        width: 584px
    }

    .cnt_top .bx_srch .slct {
        width: 150px;
        height: 46px
    }

    .cnt_top .bx_srch .bx_ipt {
        width: 386px;
        height: 46px
    }

    .cnt_top .bx_srch .bx_ipt .ipt {
        width: 100%
    }

    .cnt_top .bx_srch .btn_srch {
        width: 48px;
        height: 46px
    }

    .cnt_top .bx_srch .btns_swipe {
        margin: 4px 2px 0 4px
    }

    .cnt_top .bx_srch .btns_swipe p {
        height: 34px;
        padding: 0 18px;
        min-width: 34px;
        line-height: 34px;
        font-size: 14px
    }

    .cnt_top .bx_srch .btns_swipe span {
        height: 34px
    }

    .cnt_top .bx_tab {
        margin: 35px 0
    }

    .cnt_top .bx_tab li {
        margin: 0 16px;
        line-height: 2
    }

    .cnt_top .bx_tab li a {
        font-size: 18px
    }
}

@media (max-width: 767px) {
    .cnt_top .subtit {
        margin: 15px 0 25px;
        font-size: 14px
    }

    .cnt_top .subtit .bold_point {
        font-size: 16px
    }

    .cnt_top .bx_srch {
        width: 100%
    }

    .cnt_top .bx_srch .slct {
        width: 87px !important;
        height: 36px;
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt {
        width: calc(100% - 123px);
        height: 36px;
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt::-webkit-input-placeholder {
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt::-moz-placeholder {
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt:-ms-input-placeholder {
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt::-ms-input-placeholder {
        font-size: 13px
    }

    .cnt_top .bx_srch .bx_ipt::placeholder {
        font-size: 13px
    }

    .cnt_top .bx_srch .btn_srch {
        float: right;
        width: 36px;
        height: 36px
    }

    .cnt_top .bx_srch .btns_swipe {
        margin: 2px 1px 0 2px
    }

    .cnt_top .bx_srch .btns_swipe p {
        height: 28px;
        padding: 0 3px;
        min-width: 34px;
        line-height: 28px;
        font-size: 12px
    }

    .cnt_top .bx_srch .btns_swipe span {
        height: 28px
    }

    .cnt_top .bx_tab {
        margin: 22px 0
    }

    .cnt_top .bx_tab li {
        margin: 7px 10px
    }

    .cnt_top .bx_tab li:first-child {
        margin-left: 0
    }

    .cnt_top .bx_tab li:last-child {
        margin-right: 0
    }

    .cnt_top .bx_tab li a {
        font-size: 14px
    }
}

.btn, .btn_reserve {
    font-size: 16px;
    line-height: 1;
    padding: 13px 30px 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: var(--btn-color);
    background: var(--btn-bg-color);
    border-radius: 5px;
    display: inline-block;
    font-weight: 600;
    text-align: center
}

.buda .btn{
    font-size: 16px;
    line-height: 1;
    padding: 13px 30px 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: var(--btn-color);
    background: var(--btn-buda-bg-color);
    border-radius: 5px;
    display: inline-block;
    font-weight: 600;
    text-align: center
}

.btn.page_prev {
    position: relative;
    width: 40px;
    height: 40px;
    padding: 0;
    color: #222222;
    background: #ffffff;
    border-radius: 6px;
    border: 1px solid #222222;
    overflow: hidden;
    text-indent: -9999px
}

.btn.page_prev:after {
    content: '';
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 8px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-left: 3px;
    border-left: 3px solid #222222;
    border-bottom: 3px solid #222222;
    top: 50%;
    right: 7px
}

.btn.page_prev.disable {
    border: 1px solid #cccccc
}

.btn.page_prev.disable:after {
    border-color: #cccccc;
    border-left: 3px solid var(--disable);
    border-bottom: 3px solid var(--disable);
}

.btn.page_next {
    position: relative;
    width: 40px;
    height: 40px;
    padding: 0;
    color: #222222;
    background: #ffffff;
    border-radius: 6px;
    border: 1px solid #222222;
    overflow: hidden;
    text-indent: -9999px
}

.btn.page_next:after {
    content: '';
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 8px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-left: -3px;
    border-top: 3px solid #222222;
    border-right: 3px solid #222222;
    top: 50%;
    right: 9px
}

.btn.page_next.disable {
    color: #cccccc;
    border: 1px solid #cccccc
}

.btn.page_next.disable:after {
    border-color: #cccccc;
    border-top: 3px solid var(--disable);
    border-right: 3px solid var(--disable);
}

.btn.white {
    background: #ffffff;
    color: #222222
}

.btn.gray {
    background: #999999;
    color: #ffffff
}

.btn.org {
    background: #4285F4;
    color: #ffffff
}

.btn.blue{
    background: #275cab;
    color: #ffffff
}

.btn.black {
    background: #000;
    color: #ffffff
}

.btn.squ {
    padding: 11px 30px 13px;
    border-radius: 6px
}

.btn.buy {
    padding: 11px 30px 13px;
    border-radius: 10px;
    border: 1px solid #222222
}

.btn.ship_addr {
    margin-left: 20px;
    font-size: 12px;
    padding: 11px 24px 13px;
}

.btn.view {
    margin-left: 10px;
    font-size: 12px;
    padding: 11px 24px 13px;
}

.btn.squ.td {
    padding: 16px 30px 18px
}

.btn.squ2 {
    min-width: 134px;
    padding: 16px 25px 17px;
    border-radius: 4px;
    font-weight: 100;
    font-size: 15px
}

.btn.r_squ {
    color: #222222;
    background: #ffffff;
    padding: 10px 30px 12px;
    border-radius: 6px;
    border: 1px solid #222222
}

.btn.r_squ_dc {
    color: #222222;
    background: #ffffff;
    padding: 10px 10px 12px;
    border-radius: 6px;
    border: 1px solid #222222
}

.btn.r_squ.menubtn {
    background:  rgba( 255, 255, 255, 0.6 );
}

.btn.r_squ.disable {
    color: #cccccc;
    border: 1px solid #cccccc
}

.btn.big {
    font-size: 20px;
    padding: 19px 30px 21px;
    min-width: 162px
}

.btn.big.r_squ {
    padding: 18px 30px 20px
}

.btn.full {
    width: 100%
}

.btn.point {
    background: #4285F4
}

@media (max-width: 1279px) {
    .btn {
        font-size: 16px;
        padding: 12px 24px
    }

    .btn.half.big {
        padding: 20px 30px 22px;
        min-width: 162px
    }

    .btn.half.big.r_squ {
        padding: 19px 30px 21px
    }

    .btn.big {
        font-size: 18px;
        padding: 16px 24px;
        min-width: 156px
    }

    .btn.big.r_squ {
        padding: 15px 24px
    }

    .btn.squ.td {
        padding: 16px 30px 18px
    }

    .btn.squ2 {
        min-width: 118px;
        padding: 13px 20px;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .btn {
        font-size: 13px;
        padding: 14px 25px 14px
    }

    .btn_reserve {
        font-size: 10px;
        padding: 10px 10px 10px
    }

    .btn.page_prev {
        width: 34px;
        height: 34px
    }

    .btn.page_prev:after {
        right: 4px
    }

    .btn.page_next {
        width: 34px;
        height: 34px
    }

    .btn.page_next:after {
        right: 7px
    }

    .btn.squ {
        padding: 10px 25px 11px
    }

    .btn.squ.td {
        padding: 13px 25px 14px
    }

    .btn.squ2 {
        font-size: 15px
    }

    .btn.r_squ {
        padding: 09px 25px 10px
    }

    .btn.half.big {
        padding: 19px 30px 21px
    }

    .btn.half.big.r_squ {
        padding: 18px 30px 20px
    }

    .btn.big {
        font-size: 15px;
        padding: 20px 25px;
        min-width: 110px
    }

    .btn.big.r_squ {
        padding: 19px 30px
    }

    .btns.reserv {
        display: flex;
        flex-direction: column;       
    }
    .reserv .btn.big.r_squ {
        width: 100%;
        margin: 0 10px 10px 0px;
    }
}

.btn_num {
    position: relative;
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    width: 50px;
    height: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #dddddd;
    border-radius: 6px
}

.btn_num:after,
.btn_num:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #222222
}

.btn_num:before {
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    margin-top: -1px;
    height: 2px;
    width: 16px
}

.btn_num:after {
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    margin-left: -1px;
    height: 16px;
    width: 2px
}

.btn_num.minus:after {
    display: none
}

.btn_num+.btn_num {
    margin-left: 2px
}

@media (max-width: 767px) {
    .btn_num {
        width: 40px;
        height: 40px
    }
}

.link {
    font-size: 13px;
    color: #222222
}

.link span {
    text-decoration: underline;
    vertical-align: middle
}

.link span.none_line {
    text-decoration: none
}

.link.white {
    color: #ffffff
}

.link.black {
    color: #222222
}

.link em {
    font-size: 15px;
    margin-left: 5px;
    vertical-align: middle;
    line-height: 1
}

@media (max-width: 1279px) {
    .link {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .link {
        font-size: 12px
    }
}

.bx_hash {
    font-size: 0;
    line-height: 0
}

.link_hash {
    display: inline-block;
    overflow: hidden;
    margin-right: 14px;
    margin-bottom: 10px;
    padding: 17px 20px;
    background: #F7F7F7;
    border-radius: 6px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    font-size: 14px;
    line-height: 1
}

.link_hash:last-child {
    margin-right: 0
}

.link_hash:hover,
.link_hash:active {
    background: #E5E5E5
}

@media (max-width: 1279px) {
    .link_hash {
        padding: 13px 20px;
        margin-right: 10px
    }
}

@media (max-width: 767px) {
    .link_hash {
        padding: 11px 17px 12px;
        font-size: 13px
    }
}

.topmenu {
    min-height: 10px
}

.topmenu .inner {
    z-index: 4;
    position: relative;
    padding: 0 0 20px;
    background: var(--bg_color);
}

.topmenu.fix .inner {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    padding-bottom: 0
}

.topmenu.fix .tab_wrap {
    width: 1240px;
    margin: 0 auto
}

.topmenu.fix .bx_sort {
    width: 1240px;
    margin: 0 auto;
    padding-bottom: 20px;
    background: #ffffff
}

@media (max-width: 1279px) {
    .topmenu.fix .tab_wrap {
        width: auto;
        padding: 20px 30px
    }

    .topmenu.fix .bx_sort {
        width: 100%
    }

    .topmenu.fix .sort {
        margin-right: 30px
    }
}

@media (max-width: 767px) {
    .topmenu.fix .tab_wrap {
        padding: 20px 24px
    }

    .topmenu.fix .tab_wrap.on {
        padding-bottom: 20px
    }

    .topmenu.fix .bx_rd_tab {
        background: #fff
    }

    .topmenu.fix .bx_sort {
        width: auto;
        margin: 0 -24px 0;
        padding: 0 48px 30px
    }

    .topmenu.fix .sort {
        margin-right: 0
    }
}

@media (max-width: 1279px) {
    .topmenu {
        min-height: 140px
    }
}

@media (max-width: 767px) {
    .topmenu {
        min-height: 0
    }

    .topmenu .inner {
        padding-bottom: 30px
    }
}

.tab_wrap {
    overflow: hidden;
    width: 1240px;
    padding: 20px 0;
}

.tab_wrap.on .bx_rd_tab {
    height: inherit
}

.tab_wrap.on .btn_rdfold {
    right: 0;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.tab_wrap.on .btn_rdfold::before {
    right: -24px;
    background: -webkit-gradient(linear, left top, right top, from(white), to(rgba(255, 255, 255, 0.1)));
    background: linear-gradient(to right, white, rgba(255, 255, 255, 0.1))
}

.tab_wrap+.cont {
    margin-top: 60px
}

@media (max-width: 1279px) {
    .tab_wrap {
        width: 100%
    }

    .tab_wrap.on {
        padding: 25px 30px 20px;
        margin: 0 -30px;
        background: url("//dreamgreen.co.kr/assets/ui/img/sub/bg_shadow.png") repeat-x 0 100%
    }

    .tab_wrap.on+.bx_sort {
        margin-top: 10px
    }

    .tab_wrap+.cont {
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .tab_wrap {
        padding: 25px 24px 0;
        margin: 0 -24px 0
    }

    .tab_wrap+.cont {
        margin-top: 16px
    }
}

.bx_rd_tab {
    overflow: hidden;
    position: relative;
    height: 44px
}

@media (max-width: 1279px) {
    .bx_rd_tab {
        height: 40px
    }
}

@media (max-width: 767px) {
    .bx_rd_tab {
        height: 38px
    }
}

.btn_rdfold {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 24px;
    height: 44px
}

.btn_rdfold span {
    display: block;
    z-index: 2;
    position: relative;
    width: 24px;
    height: 24px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/arr_down.svg") no-repeat 0 0;
    background-size: 24px 24px;
    font-size: 0;
    line-height: 0
}

.btn_rdfold::before {
    display: block;
    content: '';
    background: -webkit-gradient(linear, right top, left top, from(white), to(rgba(255, 255, 255, 0.1)));
    background: linear-gradient(to left, white, rgba(255, 255, 255, 0.1));
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 44px
}

@media (max-width: 1279px) {
    .btn_rdfold {
        height: 40px
    }

    .btn_rdfold::before {
        height: 40px
    }
}

@media (max-width: 767px) {
    .btn_rdfold {
        height: 38px
    }

    .btn_rdfold::before {
        height: 38px
    }
}

.rd_tab {
    overflow: hidden;
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.rd_tab li {
    float: left;
    padding-right: 14px;
    padding-bottom: 10px
}

.rd_tab li:last-child {
    padding-right: 0
}

.rd_tab a {
    display: inline-block;
    min-width: 102px;
    padding: 10px 30px;
    background: var(--btn-sub_bg-color);
    border-radius: 30px;
    font-weight: 600;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    font-weight: 100
}

.rd_tab a.on,
.rd_tab a:hover {
    background: var(--btn-bg-color);
    color: var(--btn-color);
}

@media (max-width: 1279px) {
    .rd_tab li {
        padding-right: 10px
    }

    .rd_tab a {
        min-width: auto;
        padding: 10px 20px;
        font-size: 14px;
        line-height: 20px
    }
}

@media (max-width: 767px) {
    .rd_tab a {
        padding: 9px 20px
    }
}

.tab_area .inner {
    position: relative;
    max-width: 1280px;
    width: calc(100% + 40px);
    margin: 0 -20px;
    background: var(--bg-color);
}

@media (max-width: 1279px) {
    .tab_area .inner {
        width: calc(100% + 60px);
        margin: 0 -30px;
        max-width: none
    }

    .tab_area .inner.on {
        padding-bottom: 30px
    }

    .tab_area .inner.on::before {
        display: block;
        content: '';
        position: absolute;
        left: 0;
        bottom: 30px;
        width: 100%;
        height: 10px;
        background: url("//dreamgreen.co.kr/assets/ui/img/sub/bg_shadow.png") repeat-x 0 100%
    }

    .tab_area .inner.on .btn_rdfold span {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    .tab_area .inner .tab_line {
        margin: 0 30px
    }

    .tab_area .inner .tab_slider {
        margin: 0 30px
    }
}

@media (max-width: 767px) {
    .tab_area .inner {
        width: calc(100% + 48px);
        margin: 0 -24px
    }

    .tab_area .inner.on {
        padding-bottom: 24px
    }

    .tab_area .inner .tab_line {
        margin: 0 24px
    }

    .tab_area .inner .tab_slider {
        margin: 0 24px
    }
}

.tab_area.fix .inner {
    z-index: 4;
    position: fixed;
    left: 50%;
    right: 0;
    top: 0;
    margin: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media (max-width: 1279px) {
    .tab_area.fix .inner.on {
        padding-bottom: 0
    }

    .tab_area.fix .inner.on::before {
        bottom: 0
    }

    .tab_area.fix .inner .tab_line {
        margin: 0 60px
    }

    .tab_area.fix .inner .tab_slider {
        margin: 0 60px
    }
}

@media (max-width: 767px) {
    .tab_area.fix .inner .tab_line {
        margin: 0 48px
    }

    .tab_area.fix .inner .tab_slider {
        margin: 0 48px
    }
}

.tab_slider {
    overflow: hidden;
    padding: 30px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tab_slider .bx_tab {
    position: relative;
    text-align: center
}

.tab_slider .tabs {
    margin: 0 auto;
    font-size: 0
}

.tab_slider .tabs>li {
    display: inline-block
}

.tab_slider .tabs>li.on button {
    opacity: 1
}

.tab_slider .tabs button {
    display: inline-block;
    height: 28px;
    padding: 0 14px;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 600;
    line-height: 27px;
    color: #222;
    opacity: 0.5
}

.tab_slider .btn_rdfold {
    height: 28px
}

.tab_slider .btn_rdfold::before {
    height: 28px
}

@media (max-width: 1279px) {
    .tab_slider .tabs::after {
        display: block;
        clear: both;
        content: ""
    }

    .tab_slider .tabs>li {
        float: left
    }

    .tab_slider .tabs button {
        padding: 0 30px 0 0;
        font-size: 18px
    }

    .tab_slider .btn_rdfold {
        height: 28px
    }
}

@media (max-width: 767px) {
    .tab_slider {
        padding: 21px 0
    }

    .tab_slider .tabs button {
        height: 22px;
        font-size: 15px;
        line-height: 22px
    }

    .tab_slider .btn_rdfold {
        height: 28px
    }
}

.tab_line {
    font-size: 20px;
    line-height: 29px;
    font-weight: bold;
    text-align: center
}

.tab_line::after {
    display: block;
    clear: both;
    content: ""
}

.tab_line>a {
    display: block;
    float: left;
    width: 50%;
    padding: 20px 0;
    border-bottom: 2px solid #E5E5E5;
    color: #666
}

.tab_line>a.on {
    border-bottom: 2px solid #4285F4;
    color: #4285F4
}

@media (max-width: 767px) {
    .tab_line {
        font-size: 18px;
        line-height: 27px
    }
}

.slct_mem {
    height: 30px;
    line-height: 30px;
    padding: 0 20px;
    border: 0px;
    font-size: 15px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct_mem.png?v=202010061") no-repeat 100% 50%
}

.slct_mem:focus {
    outline: none
}

@media (max-width: 1279px) {
    .slct_mem {
        line-height: 34px
    }
}

@media (max-width: 767px) {
    .slct_mem.slct_mem {
        font-size: 14px;
        padding: 0px 17px 0px 5px
    }
}

.ipt,
.slct {
    width: 100%;
    height: 50px;
    border: 1px solid #dddddd;
    background: var(--input-bg);
    border-radius: 4px;
    padding: 0px 20px;
    font-size: 15px;
    line-height: 2.6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.ipt:focus,
.slct:focus {
    outline: none;
    border-color: #222222
}

.ipt:disabled,
.slct:disabled {
    background-color: #f0f0f0;
    color: #c4c4c4
}

.ipt:disabled[value],
.slct:disabled[value] {
    color: #c4c4c4
}

.ipt.readonly {
    background: var(--input-readonly-bg);
}

@media (max-width: 1279px) {

    .ipt,
    .slct {
        line-height: 20px
    }

    .ipt::-webkit-input-placeholder,
    .slct::-webkit-input-placeholder {
        font-size: 16px
    }

    .ipt::-moz-placeholder,
    .slct::-moz-placeholder {
        font-size: 16px
    }

    .ipt:-ms-input-placeholder,
    .slct:-ms-input-placeholder {
        font-size: 16px
    }

    .ipt::-ms-input-placeholder,
    .slct::-ms-input-placeholder {
        font-size: 16px
    }

    .ipt::placeholder,
    .slct::placeholder {
        font-size: 16px
    }
}

@media (max-width: 767px) {

    .ipt,
    .slct {
        height: 40px;
        line-height: 40px;
        border-radius: 6px;
        font-size: 13px;
        padding: 0px 15px 0 20px
    }

    .ipt::-webkit-input-placeholder,
    .slct::-webkit-input-placeholder {
        font-size: 13px
    }

    .ipt::-moz-placeholder,
    .slct::-moz-placeholder {
        font-size: 13px
    }

    .ipt:-ms-input-placeholder,
    .slct:-ms-input-placeholder {
        font-size: 13px
    }

    .ipt::-ms-input-placeholder,
    .slct::-ms-input-placeholder {
        font-size: 13px
    }

    .ipt::placeholder,
    .slct::placeholder {
        font-size: 13px
    }
}

.bx_srch {
    position: relative;
    width: 100%;
    border-bottom: 4px solid #ffffff
}

.bx_srch.no_bor {
    height: 60px
}

.bx_srch.no_bor .bx_ipt {
    height: auto;
    margin-right: 82px
}

.bx_srch.no_bor .bx_ipt .holder {
    padding: 0;
    font-size: 38px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.7)
}

.bx_srch.no_bor .ipt {
    height: 58px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    font-weight: 100;
    line-height: 1.5;
    color: #ffffff;
    font-size: 38px
}

.bx_srch.no_bor .ipt::-webkit-input-placeholder {
    font-size: 38px;
    color: #fff;
    opacity: 0.7
}

.bx_srch.no_bor .ipt::-moz-placeholder {
    font-size: 38px;
    color: #fff;
    opacity: 0.7
}

.bx_srch.no_bor .ipt:-ms-input-placeholder {
    font-size: 38px;
    color: #fff;
    opacity: 0.7
}

.bx_srch.no_bor .ipt::-ms-input-placeholder {
    font-size: 38px;
    color: #fff;
    opacity: 0.7
}

.bx_srch.no_bor .ipt::placeholder {
    font-size: 38px;
    color: #fff;
    opacity: 0.7
}

.bx_srch.no_bor .btn_srch {
    top: 5px;
    cursor: pointer;
    margin-right: 10px
}

@media (max-width: 1279px) {
    .bx_srch.no_bor {
        height: 50px;
        padding-bottom: 3px;
        border-bottom: 3px solid #ffffff
    }

    .bx_srch.no_bor .bx_ipt {
        margin-right: 53px
    }

    .bx_srch.no_bor .bx_ipt .holder {
        font-size: 32px
    }

    .bx_srch.no_bor .ipt {
        height: auto;
        font-size: 32px
    }

    .bx_srch.no_bor .ipt::-webkit-input-placeholder {
        font-size: 32px
    }

    .bx_srch.no_bor .ipt::-moz-placeholder {
        font-size: 32px
    }

    .bx_srch.no_bor .ipt:-ms-input-placeholder {
        font-size: 32px
    }

    .bx_srch.no_bor .ipt::-ms-input-placeholder {
        font-size: 32px
    }

    .bx_srch.no_bor .ipt::placeholder {
        font-size: 32px
    }

    .bx_srch.no_bor .btn_srch {
        top: 10px;
        width: 33px;
        height: 33px
    }
}

@media (max-width: 767px) {
    .bx_srch.no_bor {
        height: 32px;
        border-bottom: 2px solid #ffffff
    }

    .bx_srch.no_bor .bx_ipt {
        margin-right: 36px
    }

    .bx_srch.no_bor .bx_ipt .holder {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt::-webkit-input-placeholder {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt::-moz-placeholder {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt:-ms-input-placeholder {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt::-ms-input-placeholder {
        font-size: 19px
    }

    .bx_srch.no_bor .ipt::placeholder {
        font-size: 19px
    }

    .bx_srch.no_bor .btn_srch {
        top: 8px;
        margin-right: 5px;
        width: 21px;
        height: 21px
    }
}

.bx_srch.small {
    height: 48px
}

.bx_srch.small .bx_ipt {
    margin-right: 50px
}

.bx_srch.small .ipt {
    height: 35px;
    font-size: 26px
}

.bx_srch.small .ipt::-webkit-input-placeholder {
    font-size: 26px
}

.bx_srch.small .ipt::-moz-placeholder {
    font-size: 26px
}

.bx_srch.small .ipt:-ms-input-placeholder {
    font-size: 26px
}

.bx_srch.small .ipt::-ms-input-placeholder {
    font-size: 26px
}

.bx_srch.small .ipt::placeholder {
    font-size: 26px
}

.bx_srch.small .btn_srch {
    top: 5px;
    width: 29px;
    height: 29px
}

@media (max-width: 1279px) {
    .bx_srch.small {
        height: 40px
    }

    .bx_srch.small .ipt {
        font-size: 22px
    }

    .bx_srch.small .ipt::-webkit-input-placeholder {
        font-size: 22px
    }

    .bx_srch.small .ipt::-moz-placeholder {
        font-size: 22px
    }

    .bx_srch.small .ipt:-ms-input-placeholder {
        font-size: 22px
    }

    .bx_srch.small .ipt::-ms-input-placeholder {
        font-size: 22px
    }

    .bx_srch.small .ipt::placeholder {
        font-size: 22px
    }

    .bx_srch.small .btn_srch {
        width: 29px;
        height: 29px
    }
}

@media (max-width: 767px) {
    .bx_srch.small {
        height: 30px;
        padding: 0 0 10px
    }

    .bx_srch.small .ipt {
        font-size: 16px
    }

    .bx_srch.small .ipt::-webkit-input-placeholder {
        font-size: 16px
    }

    .bx_srch.small .ipt::-moz-placeholder {
        font-size: 16px
    }

    .bx_srch.small .ipt:-ms-input-placeholder {
        font-size: 16px
    }

    .bx_srch.small .ipt::-ms-input-placeholder {
        font-size: 16px
    }

    .bx_srch.small .ipt::placeholder {
        font-size: 16px
    }

    .bx_srch.small .bx_ipt {
        margin-right: 35px
    }

    .bx_srch.small .btn_srch {
        width: 21px;
        height: 21px
    }
}

.bx_srch.blk {
    border-bottom-color: #482f8e
}

.bx_srch.blk .ipt {
    color: var(--heading-color)
}

.bx_srch.blk .ipt::-webkit-input-placeholder {
    color: #d3d3d3
}

.bx_srch.blk .ipt::-moz-placeholder {
    color: #d3d3d3
}

.bx_srch.blk .ipt:-ms-input-placeholder {
    color: #d3d3d3
}

.bx_srch.blk .ipt::-ms-input-placeholder {
    color: #d3d3d3
}

.bx_srch.blk .ipt::placeholder {
    color: #d3d3d3
}

.bx_srch.blk .ipt:-ms-input-placeholder {
    color: #d3d3d3 !important
}

.bx_srch.blk .bx_ipt .holder {
    color: rgba(34, 34, 34, 0.2)
}

.bx_srch.blk .btn_srch {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/btn_srch_b.svg") no-repeat center;
}

.bx_srch .btn_srch {
    position: absolute;
    top: 0;
    right: 0;
    width: 42px;
    height: 42px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/btn_srch_w.svg") no-repeat center;
    font-size: 0;
    line-height: 0
}

textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

input[type="number"].ipt {
    padding: 0 10px;
    text-align: center
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type="file"].ipt {
    padding: 12px 13px 5px;
    line-height: initial;
    vertical-align: middle
}

@media (max-width: 1279px) {
    input[type="file"].ipt {
        padding: 5px 13px
    }
}

@media (max-width: 767px) {
    input[type="file"].ipt {
        padding: 7px 13px
    }
}

.slct {
    padding: 0px 40px 0px 20px;
    color: var(--heading-color);
    background: var(--input-bg) url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct.png") no-repeat 97% 50%;
}

.slct:disabled {
    background: var(--input-bg) url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct.png") no-repeat 97% 50%;
}

@media (max-width: 767px) {
    .slct {
        padding: 0px 33px 0px 20px;
        background: var(--input-bg) url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct.png") no-repeat 98.5% 50%;
        
    }

    .slct:disabled {
        background: var(--input-bg) url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct_dis.png") no-repeat 98.5% 50%; 
    }
}

.bx_sort {
    position: relative;
    height: 40px
}

@media (max-width: 767px) {
    .bx_sort {
        margin-top: 14px
    }
}

.sort {
    display: block;
    z-index: 2;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct.png") no-repeat 99% 20%;
    background-size: #ffffff;
    font-size: 16px
}

.sort .sort_trg {
    display: block;
    padding-bottom: 15px;
    border: 1px solid #222;
    border-width: 0 0 1px 0;
    line-height: 24px;
    font-weight: 600
}

.sort .sort_li {
    display: none;
    position: absolute;
    left: 0;
    top: 40px;
    width: 100%;
    background: #fff;
    border: 1px solid #222;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sort .sort_li a {
    display: block;
    padding: 0 19px;
    line-height: 50px;
    font-size: 14px
}

.sort .sort_li a:hover,
.sort .sort_li a.on {
    background: #F7F7F7;
    font-weight: 600
}

.sort.on .sort_li {
    display: block
}

@media (max-width: 1279px) {
    .sort .sort_trg {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .sort {
        width: 100% !important
    }
}

select::-ms-expand {
    display: none
}

label {
    display: inline-block;
    font-size: 15px;
    line-height: 18px;
}

label .ico_kakaopay {
    margin-left: 2px
}

@media (max-width: 1279px) {
    label {
        font-size: 16px
    }
}

@media (max-width: 767px) {
    label {
        font-size: 13px
    }
}

.chk {
    display: none
}

.chk.white+label {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_check_w.svg") no-repeat 0px 3px;
    color: #fff
}

.chk+label {
    padding-left: 30px;
    margin-bottom: 10px;
    min-height: 20px;
    cursor: pointer;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox.svg") no-repeat 0px 0px;
    line-height: 1.4;
    color: var(--dark);
}

.chk+label:last-child {
    margin-right: 0px
}

.chk:checked+label {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox_on.svg") no-repeat 0px 0px
}

@media (max-width: 1279px) {
    .chk+label {
        min-height: 19px;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox.svg") no-repeat 0px 0px
    }

    .chk:checked+label {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox_on.svg") no-repeat 0px 0px
    }
}

@media (max-width: 767px) {
    .chk+label {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox.svg") no-repeat 0px 0px
    }

    .chk:checked+label {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_checkbox_on.svg") no-repeat 0px 0px
    }
}

.radio {
    display: none
}

.radio+label {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 24px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_radio.svg") no-repeat 0px 0px;
    background-size: 18px;
}

.radio:checked+label,
.radio.checked+label {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_radio_on.svg") no-repeat 0px 0px;
    background-size: 18px;
}

.radio:disabled+label {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_radio_dis.svg") no-repeat 0px 0px;
    color: #c4c4c4
}

.radio:disabled:checked+label,
.radio:disabled.checked+label {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_radio_on_dis.svg") no-repeat 0px 0px
}

.radio+.label {
    margin: 10px 40px 10px 0px
}

.radio+.label+.tool_set {
    margin-left: -43px;
    margin-right: 48px
}

@media (max-width: 1279px) {
    .radio+.label {
        margin-right: 33px
    }

    .radio+.label+.tool_set {
        margin-left: -29px;
        margin-right: 33px
    }
}

@media (max-width: 767px) {
    .radio+.label {
        padding-left: 24px
    }

    .radio+.label+.tool_set {
        margin-left: 10px;
        margin-right: 0
    }

    .radio+label,
    .radio:checked+label,
    .radio.checked+label {
        background-position: 0px 0px
    }

    .radio:disabled+label,
    .radio:disabled:checked+label,
    .radio:disabled.checked+label {
        background-position: 0px 0px
    }
}

.rd_box {
    display: inline-block
}

@media (max-width: 767px) {
    .rd_box {
        width: 50%;
        margin: 0 -4px 0 0
    }

    .rd_box.box_slc {
        width: 100%
    }

    .rd_box .radio+.label {
        margin-right: 0
    }
}

.tool_set {
    position: relative
}

.box_slc {
    display: inline-block
}

.box_slc * {
    vertical-align: middle
}

.box_slc .radio+.label {
    margin-right: 20px
}

@media (max-width: 1279px) {
    .box_slc {
        display: block
    }

    .box_slc .radio+.label {
        margin-right: 10px
    }
}

@media (max-width: 767px) {
    .box_slc .radio+.label {
        margin-right: 0
    }
}

.ico_sns {
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: 36px;
    height: 36px;
    background: #E5E5E5;
    border-radius: 50%;
    font-size: 0;
    line-height: 0
}

.ico_sns:focus-visible {
    outline: auto
}

.ico_sns+.ico_sns {
    margin-left: 10px
}

.ico_sns:hover {
    background-color: #343434
}

.ico_sns::before {
    display: block;
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 24px;
    height: 24px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ico_sns.ico_sns1::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns1.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns2::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns2.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns3::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns3.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns4::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns4.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns5::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns5.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns1:hover::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns1_on.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns2:hover::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns2_on.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns3:hover::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns3_on.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns4:hover::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns4_on.svg") no-repeat 100% 100%
}

.ico_sns.ico_sns5:hover::before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_sns5_on.svg") no-repeat 100% 100%
}

.txt_check {
    font-size: 14px;
    color: #ffffff;
    line-height: 20px
}

.txt_check::before {
    display: inline-block;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 6px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_check_w.svg") no-repeat 100% 100%;
    vertical-align: text-top
}

.txt_check+.txt_check {
    margin-top: 10px
}

.tbl_wrap::-webkit-scrollbar {
    -webkit-appearance: none
}

.tbl_wrap::-webkit-scrollbar:vertical {
    width: 12px
}

.tbl_wrap::-webkit-scrollbar:horizontal {
    height: 12px
}

.tbl_wrap::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    border: 2px solid #d2d2d2
}

.tbl_wrap::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d2d2d2
}

.tbl_wrap .tbl {
    min-width: 1080px
}

.tbl_wrap+.btns {
    padding: 30px 0;
    margin: 0;
    border-bottom: 1px solid #222222
}

@media (max-width: 767px) {
    .tbl_wrap+.btns {
        padding: 20px 0
    }
}

@media (max-width: 1279px) {
    .tbl_wrap {
        overflow-x: auto;
        margin-right: -4.2%
    }
}

@media (max-width: 767px) {
    .tbl_wrap {
        margin-right: -6.25%
    }
}

.tbl_mem {
    width: 100%;
    border-top: 1px #222222 solid;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    font-size: 15px
}

.tbl_mem th {
    vertical-align: middle;
    word-break: break-all;
    padding: 12px 30px;
    border-bottom: 1px #f0f0f0 solid
}

.tbl_mem th span {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.tbl_mem th .slct_arrows {
    position: absolute;
    top: 50%;
    right: -20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: inline-block;
    width: 11px;
    height: 17px;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/select_arrows.png") no-repeat center center
}

.tbl_mem td {
    vertical-align: middle;
    word-break: break-all;
    padding: 55px 30px;
    border-bottom: 1px #f0f0f0 solid
}

.tbl_mem td.type2 {
    padding: 22px 30px
}

.tbl_mem td .txt_alert br {
    display: none
}

.tbl_mem .red {
    color: #f52222
}

.tbl_mem .t_view,
.tbl_mem .top_product {
    display: none
}

.tbl_mem .bx_top {
    margin-top: 55px
}

.tbl_mem .btn_edit {
    display: inline-block;
    width: 14px;
    height: 17px;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19.72' height='19' viewBox='0 0 19.72 19'%3E%3Cpath d='M19.7 12.71l-5.7 5.7V19h-4v-4h.59l5.7-5.71.21.21.2-.21 3 3-.2.21zm-3.2-.8l-4.5 4.5V17h.59l4.5-4.5zM5 4h6v2H5V4zm6 6H5V8h6v2zm3-7a1 1 0 00-1-1H3a1 1 0 00-1 1v11a1 1 0 001 1h5v2H2a2 2 0 01-2-2V2a2 2 0 012-2h12a2 2 0 012 2v6h-2V3z' fill='%23222' fill-rule='evenodd'/%3E%3C/svg%3E") 0 0 no-repeat
}

.tbl_mem .tr_con.tp2 {
    display: block;
    float: left;
    width: 100%;
    padding: 0;
    font-size: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #f0f0f0
}

.tbl_mem .tr_con.tp2 tr {
    display: block;
    width: 100%;
    line-height: 37px;
    padding: 0;
    text-align: left;
    border-bottom: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl_mem .tr_con.tp2 tr.bx_tr {
    padding: 18px 0
}

.tbl_mem .tr_con.tp2 tr.bx_tr+.bx_tr {
    border-top: 1px solid #f0f0f0
}

.tbl_mem .tr_con.tp2 td {
    display: block;
    width: 100%;
    line-height: 25px;
    padding: 7px 0 7px 30px;
    border-bottom: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl_mem .tr_con.tp2 td .left {
    display: inline-block;
    width: 220px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: top
}

.tbl_mem .tr_con.tp2 td .right {
    display: inline-block;
    padding-left: 0;
    vertical-align: top
}

.tbl_mem .tr_con.tp2 .gray {
    color: #666
}

@media (max-width: 1279px) {
    .tbl_mem {
        table-layout: auto;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl_mem colgroup {
        display: none
    }

    .tbl_mem th.media,
    .tbl_mem td.media,
    .tbl_mem span.media {
        display: none !important
    }

    .tbl_mem .t_view {
        display: inline-block
    }

    .tbl_mem .bx_tit {
        display: none
    }

    .tbl_mem .tr_con.tp2 {
        border-bottom: none
    }

    .tbl_mem .tr_con,
    .tbl_mem .tr_con.tp2 {
        display: block;
        float: left;
        width: 100%;
        padding: 0;
        font-size: 15px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .tbl_mem .tr_con tr,
    .tbl_mem .tr_con.tp2 tr {
        display: block;
        width: 100%;
        line-height: 37px;
        padding: 0;
        text-align: left;
        border-bottom: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .tbl_mem .tr_con tr.top_product,
    .tbl_mem .tr_con.tp2 tr.top_product {
        display: block;
        background: #fcfcfc;
        border-top: 1px solid #222222;
        border-bottom: 1px solid #f0f0f0
    }

    .tbl_mem .tr_con tr.top_product:nth-child(1),
    .tbl_mem .tr_con.tp2 tr.top_product:nth-child(1) {
        border-top: none
    }

    .tbl_mem .tr_con tr.top_product td,
    .tbl_mem .tr_con.tp2 tr.top_product td {
        padding: 19px 0 19px 20px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-weight: 600
    }

    .tbl_mem .tr_con tr.bx_tr,
    .tbl_mem .tr_con.tp2 tr.bx_tr {
        padding: 18px 0
    }

    .tbl_mem .tr_con tr.bx_tr+.bx_tr,
    .tbl_mem .tr_con.tp2 tr.bx_tr+.bx_tr {
        border-top: 1px solid #f0f0f0
    }

    .tbl_mem .tr_con tr.pc_tr,
    .tbl_mem .tr_con.tp2 tr.pc_tr {
        display: none
    }

    .tbl_mem .tr_con td,
    .tbl_mem .tr_con.tp2 td {
        display: block;
        width: 100%;
        line-height: 25px;
        padding: 7px 0 7px 20px;
        border-bottom: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }
}

@media (max-width: 767px) {
    .tbl_mem .t_view {
        display: inline-block
    }

    .tbl_mem .tr_con tr.top_product td,
    .tbl_mem .tr_con.tp2 tr.top_product td {
        padding: 16px 0 16px 10px
    }

    .tbl_mem .tr_con tr.bx_tr,
    .tbl_mem .tr_con.tp2 tr.bx_tr {
        padding: 28px 0
    }

    .tbl_mem .tr_con td,
    .tbl_mem .tr_con.tp2 td {
        line-height: 22px;
        font-size: 13px;
        padding: 0 0 14px 10px
    }

    .tbl_mem .tr_con td .left,
    .tbl_mem .tr_con td .right,
    .tbl_mem .tr_con.tp2 td .left,
    .tbl_mem .tr_con.tp2 td .right {
        display: block;
        width: 100%;
        padding-left: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .tbl_mem .tr_con td:last-child,
    .tbl_mem .tr_con.tp2 td:last-child {
        padding-bottom: 0
    }

    .tbl_mem .tr_con td .txt_alert br,
    .tbl_mem .tr_con.tp2 td .txt_alert br {
        display: block
    }
}

.tbl_basic {
    width: 100%;
    border-top: 1px #222222 solid;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 24px auto 38px
}

.tbl_basic th,
.tbl_basic td {
    font-size: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px #f0f0f0 solid;
    vertical-align: middle;
    padding: 22px 40px;
    word-wrap: break-word
}

.tbl_basic th {
    text-align: left
}

.tbl_basic td {
    text-align: right
}

@media (max-width: 1279px) {

    .tbl_basic th,
    .tbl_basic td {
        font-size: 16px;
        padding: 18px 60px
    }
}

@media (max-width: 767px) {
    .tbl_basic {
        margin: 16px auto 30px
    }

    .tbl_basic th,
    .tbl_basic td {
        font-size: 13px;
        padding: 17px 3.6%
    }

    .tbl_basic th {
        width: 55%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }
}

.tbl {
    width: 100%;
    /*border-top: 1px #222222 solid;*/
    border-top: 1px var(--table-top-border) solid;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl+.tbl {
    margin-top: 80px
}

.tbl+.near {
    margin-top: 40px
}

@media (max-width: 767px) {
    .tbl.tbl_rd.tbl_file td {
        padding: 10px 1.8% !important
    }

    .tbl .btn {
        font-size: 12px;
        padding: 16px 8px 16px;
    }
}

.tbl .empty {
    font-size: 15px !important
}

.tbl caption {
    display: table-caption;
    width: 100%;
    text-align: left;
    font-weight: 600;
    padding-bottom: 14px
}

.tbl caption.txt_cnt {
    text-align: center
}

@media (max-width: 767px) {
    .tbl caption {
        padding-bottom: 12px;
        font-size: 14px
    }
}

.tbl th {
    padding: 22px 30px
}

.tbl td {
    padding: 14px 30px
}

@media (max-width: 1279px) {
    .tbl th {
        padding: 18px 2.6%
    }

    .tbl td {
        padding: 10px 2.6%
    }
}

@media (max-width: 767px) {
    .tbl th {
        padding: 17px 3.6%
    }

    .tbl td {
        padding: 9px 3.6%
    }
}

.tbl th,
.tbl td {
    font-size: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px var(--table-th-border) solid;
    vertical-align: middle;
    word-wrap: break-word
}

.contents-title {
    font-weight: 600;
}

@media (max-width: 1279px) {

    .tbl th,
    .tbl td {
        font-size: 16px
    }
}

@media (max-width: 767px) {

    .tbl th,
    .tbl td {
        font-size: 13px
    }
}

.tbl th.top,
.tbl td.top {
    vertical-align: top !important
}

.tbl th.left,
.tbl td.left {
    text-align: left
}

.tbl th.right,
.tbl td.right {
    text-align: right
}

.tbl th.center,
.tbl td.center {
    text-align: center !important
}

.tbl th.bg,
.tbl td.bg {
    background: var(--bg-color);
}

.tbl th.subject,
.tbl td.subject {
    font-weight: 600;
    
}

.tbl th.date,
.tbl td.date {
    width: 150px;
    text-align: right;
}

.tbl th.none_b,
.tbl td.none_b {
    border-bottom: none
}

.tbl th.arw,
.tbl td.arw {
    position: relative;
    padding-right: 60px
}

.tbl th.arw:after,
.tbl td.arw:after {
    top: 50%;
    right: 30px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    content: "";
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 9px;
    height: 9px;
    -webkit-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    margin-top: -3px;
    border-top: none;
    border-left: none;
    border-right: 3px solid #222222;
    border-bottom: 3px solid #222222
}

.tbl th.arw.on:after,
.tbl td.arw.on:after {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 9px;
    height: 9px;
    -webkit-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    margin-top: 3px;
    border-top: 3px solid #222222;
    border-left: 3px solid #222222;
    border-right: none;
    border-bottom: none
}

@media (max-width: 767px) {

    .tbl th.arw .arw,
    .tbl td.arw .arw {
        position: relative;
        padding-right: 40px
    }

    .tbl th.arw .arw:after,
    .tbl td.arw .arw:after {
        top: 0;
        right: 0px;
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 6px;
        height: 6px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: -2px;
        border-top: none;
        border-left: none;
        border-right: 1px solid #222222;
        border-bottom: 1px solid #222222
    }

    .tbl th.arw .arw.on:after,
    .tbl td.arw .arw.on:after {
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 6px;
        height: 6px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: 2px;
        border-top: 1px solid #222222;
        border-left: 1px solid #222222;
        border-right: none;
        border-bottom: none
    }
}

.tbl th.subject_header,
.tbl td.subject_header {
    border-top: 2px solid var(--table-top-border);
    border-bottom: 1px solid var(--table-top-border);
    background: var(--board-title-bg);
    padding: 22px 30px;
    font-size: 18px;
    font-weight: 600;
    position: relative;
    text-align: left
}

.tbl th.subject_header i,
.tbl td.subject_header i{
    padding-right: 2px;
}

.tbl td.subject_bottom {
    border: 0px;
}

.tbl td.subject_bottom i{
    padding-right: 2px;
}

.tbl .right .issuer i{
    padding-right: 2px;
}

.tbl th.subject_header .left,
.tbl td.subject_header .left {
    padding-right: 155px;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    word-break: break-all
}

.tbl th.subject_header .right,
.tbl td.subject_header .right {
    font-size: 15px;
    font-weight: 100;
    width: 150px;
    position: absolute;
    top: 50%;
    right: 22px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl th.subject_header .right a,
.tbl td.subject_header .right a {
    text-decoration: none
}

.tbl th.subject_header .right.txt_neces,
.tbl td.subject_header .right.txt_neces {
    display: inline-block;
    width: 175px;
    margin-top: 0
}

.tbl th.subject_header.type2 .left,
.tbl td.subject_header.type2 .left {
    padding-right: 330px
}

.tbl th.subject_header.type2 .txt_neces,
.tbl td.subject_header.type2 .txt_neces {
    width: 295px;
    right: 30px
}

@media (max-width: 1279px) {

    .tbl th.subject_header.type2,
    .tbl td.subject_header.type2 {
        padding: 17px 20px
    }

    .tbl th.subject_header.type2 .left,
    .tbl td.subject_header.type2 .left {
        padding-right: 0px
    }

    .tbl th.subject_header.type2 .txt_neces,
    .tbl td.subject_header.type2 .txt_neces {
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        width: auto;
        margin-top: 18px;
        margin-bottom: 0px
    }
}

@media (max-width: 767px) {

    .tbl th.subject_header,
    .tbl td.subject_header {
        padding: 10px;
        font-size: 13px
    }

    .tbl th.subject_header .left,
    .tbl td.subject_header .left {
        padding-right: 0px;
        line-height: 1.5
    }

    .tbl th.subject_header .right,
    .tbl td.subject_header .right {
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        padding-left: 0px
    }

    .tbl th.subject_header .right.txt_neces,
    .tbl td.subject_header .right.txt_neces {
        width: auto;
        margin-top: 5px
    }

    .tbl th.subject_header .right.txt_neces .btn_link,
    .tbl td.subject_header .right.txt_neces .btn_link {
        display: inline-block
    }
}

.tbl th.date_header,
.tbl td.date_header {
    border-top: 2px solid #222222;
    border-bottom: 1px solid #222222;
    padding: 22px
}

.tbl th .impt,
.tbl td .impt {
    position: relative;
    display: inline-block;
    padding-right: 10px
}

.tbl th .impt:after,
.tbl td .impt:after {
    display: inline-block;
    position: relative;
    top: 3px;
    content: "*";
    padding: 0 4px;
    color: #f52222
}

.tbl thead th {
    background: var(--table-thead-th-bg);
}

.tbl tbody th {
    text-align: left;
    font-weight: 600;
    vertical-align: top;
    background: var(--table-th-bg);
}

.tbl tbody th.bg {
    font-weight: 600
}

.tbl.tbl_board thead th {
    padding: 15px 20px;
    line-height: 1.4;
    text-align: center
}

.tbl.tbl_board th,
.tbl.tbl_board td {
    padding: 25px 5px;
    line-height: 1.4
}

.tbl.tbl_board th:first-child,
.tbl.tbl_board td:first-child {
    padding-left: 20px
}

.tbl.tbl_board th span+.r_squ,
.tbl.tbl_board td span+.r_squ {
    margin-top: 12px
}
.keyword{
    font-size: 18px;
    /*font-style: oblique;*/
    color: var(--indigo);
}

@media (max-width: 767px) {

    .tbl.tbl_board th,
    .tbl.tbl_board td {
        padding: 19px 5px
    }
}

@media (max-width: 1279px) {
    .tbl.tbl_board thead th {
        padding: 10px;
        line-height: 1.4
    }

    .tbl.tbl_board th,
    .tbl.tbl_board td {
        padding: 21px 5px;
        line-height: 1.4
    }

    .tbl.tbl_board th:first-child,
    .tbl.tbl_board td:first-child {
        padding-left: 0px
    }

    .tbl.tbl_board.transform {
        table-layout: inherit;
        display: block;
        border: none
    }

    .tbl.tbl_board.transform:after {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_board.transform thead {
        display: none
    }

    .tbl.tbl_board.transform caption,
    .tbl.tbl_board.transform thead,
    .tbl.tbl_board.transform tbody,
    .tbl.tbl_board.transform tr,
    .tbl.tbl_board.transform th,
    .tbl.tbl_board.transform td {
        width: 100% !important;
        float: left !important;
        border: none;
        text-align: left !important
    }

    .tbl.tbl_board.transform caption {
        display: block !important
    }

    .tbl.tbl_board.transform tbody {
        border-top: 1px #222222 solid;
        display: block !important
    }

    .tbl.tbl_board.transform tr {
        display: block !important;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_board.transform th {
        display: block !important;
        padding: 17px 3.6% 0px !important;
        font-weight: 600
    }

    .tbl.tbl_board.transform th br {
        display: none
    }

    .tbl.tbl_board.transform th.subject_header {
        border-top: 3px solid #222222;
        padding: 10px 3.6% !important
    }

    .tbl.tbl_board.transform th+td {
        padding: 6px 3.6% 17px !important
    }

    .tbl.tbl_board.transform td {
        display: block !important;
        padding: 10px 3.6% !important;
        line-height: 1.7;
        width: auto
    }

    .tbl.tbl_board.transform td.multi .ipt,
    .tbl.tbl_board.transform td.multi .slct {
        width: calc(100% - 90px) !important;
        float: left;
        margin: 0 0 10px 0
    }

    .tbl.tbl_board.transform td.multi .btn.squ {
        float: right;
        padding: 10px 15px 11px;
        margin: 0 0 10px 0;
        width: 80px
    }

    .tbl.tbl_board.transform td.multi .txt_alert {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_board.transform td.full .btn.squ {
        width: 100%
    }

    .tbl.tbl_board.transform .bg {
        padding: 10px 3.6% !important;
        border-bottom: none !important
    }

    .tbl.tbl_board.transform .bg+td {
        padding: 20px 3.6% !important
    }

    .tbl.tbl_board.transform .rowspan {
        border-bottom: none
    }

    .tbl.tbl_board.transform .rowspan td {
        padding: 0px 3.6% 0px !important
    }

    .tbl.tbl_board.transform .rowspan.fr td {
        padding: 6px 3.6% 0px !important
    }

    .tbl.tbl_board.transform .rowspan.ls {
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_board.transform .rowspan.ls td {
        padding: 0px 3.6% 17px !important
    }

    .tbl.tbl_board.transform .empty td,
    .tbl.tbl_board.transform .empty th {
        width: 100%;
        text-align: center !important;
        padding: 13px 3.6% !important
    }

    .tbl.tbl_board.transform .hide {
        display: none !important
    }

    .tbl.tbl_board.transform tr {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 15px 30px !important
    }

    .tbl.tbl_board.transform th,
    .tbl.tbl_board.transform td {
        padding: 0 !important
    }

    .tbl.tbl_board.transform th:first-child,
    .tbl.tbl_board.transform td:first-child {
        margin-bottom: 6px
    }

    .tbl.tbl_board.transform .empty th,
    .tbl.tbl_board.transform .empty td {
        padding: 0 !important
    }

    .tbl.tbl_board.transform .empty th:first-child,
    .tbl.tbl_board.transform .empty td:first-child {
        margin-bottom: 0px
    }

    .tbl.tbl_board th.media,
    .tbl.tbl_board td.media,
    .tbl.tbl_board col.media {
        display: none !important
    }
}

@media (max-width: 767px) {
    .tbl.tbl_board thead th {
        padding: 8px 10px
    }

    .tbl.tbl_board th,
    .tbl.tbl_board td {
        padding: 19px 10px
    }

    .tbl.tbl_board.transform tr {
        padding: 15px 3.6% !important
    }
}

.tbl.tbl_fold thead th {
    text-align: center;
    font-weight: 600
}

.tbl.tbl_fold th {
    text-align: left;
    font-weight: 100
}

.tbl.tbl_fold td {
    padding: 22px 30px
}

.tbl.tbl_fold .tr_tit {
    cursor: pointer
}

.tbl.tbl_fold .tr_con {
    display: none
}

.tbl.tbl_fold .tr_con .info {
    margin-top: 15px;
    color: #999999;
    font-weight: 600;
    font-size: 13px
}

.tbl.tbl_fold .tr_con .info span:after {
    display: inline-block;
    content: "|";
    margin: 0 7px;
    font-weight: 100
}

.tbl.tbl_fold .tr_con .info span:last-child:after {
    margin: 0;
    content: ""
}

.tbl.tbl_fold .tr_con .reply {
    padding-left: 65px;
    position: relative
}

.tbl.tbl_fold .tr_con .reply:before {
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    left: 30px;
    width: 16px;
    height: 16px;
    margin-right: 15px;
    border-left: 2px dotted #999999;
    border-bottom: 2px dotted #999999
}

@media (max-width: 1279px) {
    .tbl.tbl_fold {
        table-layout: inherit
    }

    .tbl.tbl_fold thead,
    .tbl.tbl_fold col.media {
        display: none
    }

    .tbl.tbl_fold tbody,
    .tbl.tbl_fold tr,
    .tbl.tbl_fold th,
    .tbl.tbl_fold td {
        display: block;
        float: left;
        width: 100%
    }

    .tbl.tbl_fold .arw:after {
        top: 0;
        margin-top: -5px;
        right: -19px
    }

    .tbl.tbl_fold .tr_tit,
    .tbl.tbl_fold .tr_con {
        position: relative;
        overflow: hidden;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding: 15px 46px 15px 30px;
        border-bottom: 1px solid #f0f0f0
    }

    .tbl.tbl_fold .tr_tit th,
    .tbl.tbl_fold .tr_tit td,
    .tbl.tbl_fold .tr_con th,
    .tbl.tbl_fold .tr_con td {
        display: block;
        float: left;
        width: 100%;
        border-bottom: none;
        padding: 0
    }

    .tbl.tbl_fold .tr_tit th:first-child,
    .tbl.tbl_fold .tr_tit td:first-child,
    .tbl.tbl_fold .tr_con th:first-child,
    .tbl.tbl_fold .tr_con td:first-child {
        margin-bottom: 6px
    }

    .tbl.tbl_fold .tr_tit.media_sbj,
    .tbl.tbl_fold .tr_con.media_sbj {
        margin-bottom: 8px
    }

    .tbl.tbl_fold .tr_tit td.media,
    .tbl.tbl_fold .tr_con td.media {
        width: auto;
        margin-top: 6px;
        display: inline-block;
        font-size: 14px
    }

    .tbl.tbl_fold .tr_tit td.media:after,
    .tbl.tbl_fold .tr_con td.media:after {
        display: inline-block;
        content: "|";
        margin: 0 7px;
        font-weight: 100;
        color: #999999
    }

    .tbl.tbl_fold .tr_tit td.media:last-child:after,
    .tbl.tbl_fold .tr_con td.media:last-child:after {
        margin: 0;
        content: ""
    }
}

@media (max-width: 1279px) and (max-width: 767px) {

    .tbl.tbl_fold .tr_tit td.media,
    .tbl.tbl_fold .tr_con td.media {
        font-size: 12px
    }
}

@media (max-width: 1279px) {

    .tbl.tbl_fold .tr_tit .empty th:first-child,
    .tbl.tbl_fold .tr_tit .empty td:first-child,
    .tbl.tbl_fold .tr_con .empty th:first-child,
    .tbl.tbl_fold .tr_con .empty td:first-child {
        margin-bottom: 0px
    }

    .tbl.tbl_fold .tr_con {
        background-color: #fcfcfc
    }

    .tbl.tbl_fold .tr_con .info {
        font-size: 14px
    }

    .tbl.tbl_fold .tr_con .reply {
        padding-left: 55px
    }

    .tbl.tbl_fold .tr_con .reply:before {
        top: 0px;
        left: 15px
    }

    .tbl.tbl_fold .tr_con .reply+.txt_gray {
        margin-left: 55px
    }

    .tbl.tbl_fold .tr_con .txt_gray span:after {
        display: inline-block;
        content: "|";
        margin: 0 7px;
        font-weight: 100
    }

    .tbl.tbl_fold .tr_con .txt_gray span:last-child:after {
        margin: 0;
        content: ""
    }

    .tbl.tbl_fold .empty td {
        padding: 15px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_fold .arw:after {
        right: -10px
    }

    .tbl.tbl_fold .tr_tit,
    .tbl.tbl_fold .tr_con {
        padding: 15px 3.6%
    }

    .tbl.tbl_fold .tr_tit td.media,
    .tbl.tbl_fold .tr_con td.media {
        font-size: 12px
    }

    .tbl.tbl_fold .tr_con .reply+.txt_gray {
        margin-left: 35px
    }

    .tbl.tbl_fold .tr_con .reply {
        padding-left: 35px
    }

    .tbl.tbl_fold .tr_con .reply:before {
        left: 5px
    }

    .tbl.tbl_fold .tr_con .info {
        font-size: 11px
    }
}

.tbl.tbl_file th a.txt_point,
.tbl.tbl_file td a.txt_point {
    text-decoration: underline
}

.tbl.tbl_file th .left,
.tbl.tbl_file td .left {
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px
}

.tbl.tbl_file th .left+.txt_alert.gray,
.tbl.tbl_file td .left+.txt_alert.gray {
    display: inline-block;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    left: 0px;
    margin: 7px 0px
}

.tbl.tbl_file th.txt_big,
.tbl.tbl_file td.txt_big {
    font-size: 18px
}

.tbl.tbl_file ul.subtit_preview {
    color: #999999
}

.tbl.tbl_file ul.subtit_preview li {
    margin: 5px 0
}

.tbl.tbl_file ul.subtit_preview .time {
    margin-right: 20px
}

@media (max-width: 1279px) {
    .tbl.tbl_file .left+.txt_alert.gray {
        width: 100%
    }

    .tbl.tbl_file td .left {
        width: 100%;
        float: none
    }

    .tbl.tbl_file th.subject_header .left {
        float: none;
        padding-right: 0
    }

    .tbl.tbl_file th.subject_header .right {
        display: block;
        float: none;
        width: auto;
        position: static;
        text-align: left;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

@media (max-width: 767px) {
    .tbl.tbl_file {
        display: block;
        border: none
    }

    .tbl.tbl_file:after {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_file thead {
        display: none
    }

    .tbl.tbl_file caption,
    .tbl.tbl_file thead,
    .tbl.tbl_file tbody,
    .tbl.tbl_file tr,
    .tbl.tbl_file th,
    .tbl.tbl_file td {
        width: 100% !important;
        float: left !important;
        border: none;
        text-align: left !important
    }

    .tbl.tbl_file caption {
        display: block !important;
        padding: 8px;
    }

    .tbl.tbl_file tbody {
        border-top: 1px solid var(--item-deco_border);
        display: block !important
    }

    .tbl.tbl_file tr {
        display: block !important;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_file th {
        display: block !important;
        padding: 12px 3.6% 12px 12px !important;
        font-weight: 600
    }

    .tbl.tbl_file th br {
        display: none
    }

    .tbl.tbl_file th.subject_header {
        border-top: 3px solid #222222;
        padding: 10px 3.6% !important
    }

    .tbl.tbl_file th+td {
        padding: 6px 3.6% 17px 12px !important
    }

    .tbl.tbl_file td {
        display: block !important;
        padding: 10px 3.6% !important;
        line-height: 1.7;
        width: auto
    }

    .tbl.tbl_file td.multi .ipt,
    .tbl.tbl_file td.multi .slct {
        width: calc(100% - 90px) !important;
        float: left;
        margin: 0 0 10px 0
    }

    .tbl.tbl_file td.multi .btn.squ {
        float: right;
        padding: 10px 15px 11px;
        margin: 0 0 10px 0;
        width: 80px
    }

    .tbl.tbl_file td.multi .txt_alert {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_file td.full .btn.squ {
        width: 100%
    }

    .tbl.tbl_file .bg {
        padding: 10px 3.6% !important;
        border-bottom: none !important
    }

    .tbl.tbl_file .bg+td {
        padding: 20px 3.6% !important
    }

    .tbl.tbl_file .rowspan {
        border-bottom: none
    }

    .tbl.tbl_file .rowspan td {
        padding: 0px 3.6% 0px !important
    }

    .tbl.tbl_file .rowspan.fr td {
        padding: 6px 3.6% 0px !important
    }

    .tbl.tbl_file .rowspan.ls {
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_file .rowspan.ls td {
        padding: 0px 3.6% 17px !important
    }

    .tbl.tbl_file .empty td,
    .tbl.tbl_file .empty th {
        width: 100%;
        text-align: center !important;
        padding: 13px 3.6% !important
    }

    .tbl.tbl_file .hide {
        display: none !important
    }

    .tbl.tbl_file th.txt_big,
    .tbl.tbl_file td.txt_big {
        font-size: 14px
    }
}

.tbl.tbl_detail td {
    padding: 40px 30px 0px
}

.tbl.tbl_detail td.desc {
    padding: 40px 50px;
    vertical-align: top;
    height: 300px
}

.tbl.tbl_detail td img {
    max-width: 100%;
    border-radius: 20px;
    margin: 10px 0 10px 0;
}

.tbl.tbl_detail dl dt {
    font-weight: 600
}

.tbl.tbl_detail dl dd {
    margin-bottom: 44px
}

.tbl.tbl_detail dl li {
    font-size: 13px;
    color: #666666
}

@media (max-width: 767px) {
    .tbl.tbl_detail dl li {
        font-size: 12px
    }
}

.tbl.tbl_detail .subject_header .right {
    text-align: right
}

@media (max-width: 767px) {
    .tbl.tbl_detail .subject_header .right {
        /*text-align: left;*/
        font-size: 12px
    }
}

@media (max-width: 1279px) {
    .tbl.tbl_detail td.desc {
        height: auto
    }

    .tbl.tbl_detail dl li {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_detail td {
        padding: 20px 10px
    }

    .tbl.tbl_detail td.desc {
        padding: 20px 10px
    }

    .tbl.tbl_detail p {
        margin-bottom: 30px
    }

    .tbl.tbl_detail dl dd {
        margin-bottom: 30px
    }

    .tbl.tbl_detail dl li {
        font-size: 12px
    }
}

.tbl.tbl_ticket caption {
    font-size: 38px;
    line-height: 1.4;
    font-weight: 100;
    padding-bottom: 40px
}

.tbl.tbl_ticket caption br {
    display: none
}

@media (max-width: 1279px) {
    .tbl.tbl_ticket caption {
        font-size: 32px;
        padding-bottom: 26px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_ticket caption {
        font-size: 23px;
        padding-bottom: 17px
    }

    .tbl.tbl_ticket caption br {
        display: block
    }
}

.tbl.tbl_ticket td {
    display: table;
    width: 100%
}

.tbl.tbl_ticket td.dis_coup {
    border-bottom: none
}

.tbl.tbl_ticket td.dis_coup .bx_multi {
    padding-bottom: 50px
}

.tbl.tbl_ticket td.dis_coup .bx_total {
    padding: 20px 30px 10px
}

.tbl.tbl_ticket td.dis_coup .bx_total .total {
    float: right;
    width: 372px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl.tbl_ticket del,
.tbl.tbl_ticket strike {
    font-size: 24px
}

.tbl.tbl_ticket .bx_multi {
    display: table-cell;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
    width: 60%;
    padding: 60px 0 60px 60px
}

.tbl.tbl_ticket .bx_multi .un_price {
    display: inline-block;
    vertical-align: middle;
    font-size: 18px
}

.tbl.tbl_ticket .bx_multi .un_price span {
    margin-right: 15px;
    color: #999999
}

.tbl.tbl_ticket .bx_multi .multi {
    vertical-align: middle;
    font-size: 0;
    padding: 0 10%;
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px
}

.tbl.tbl_ticket .bx_multi .multi:before,
.tbl.tbl_ticket .bx_multi .multi:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 19px;
    height: 2px;
    background-color: #222222
}

.tbl.tbl_ticket .bx_multi .multi:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.tbl.tbl_ticket .bx_multi .multi:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.tbl.tbl_ticket .bx_multi .bx_ipt {
    display: inline-block;
    vertical-align: middle;
    font-size: 18px
}

.tbl.tbl_ticket .bx_multi .bx_ipt label {
    margin-right: 20px;
    color: #999999;
    font-size: 18px;
    vertical-align: middle
}

.tbl.tbl_ticket .bx_multi .bx_ipt span,
.tbl.tbl_ticket .bx_multi .bx_ipt .ipt,
.tbl.tbl_ticket .bx_multi .bx_ipt .btn_num {
    vertical-align: middle
}

.tbl.tbl_ticket .bx_multi .bx_ipt .btns_num {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px
}

.tbl.tbl_ticket .bx_total {
    display: table-cell;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
    width: 40%;
    padding: 60px 60px 60px 0
}

.tbl.tbl_ticket .discount {
    position: relative;
    padding: 0 0 60px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl.tbl_ticket .discount .dis_txt {
    font-size: 18px;
    color: #999999;
    margin-right: 17px;
    line-height: 49px;
    vertical-align: top
}

.tbl.tbl_ticket .discount .bx_ipt {
    display: inline-block;
    vertical-align: top
}

.tbl.tbl_ticket .discount .ipt {
    width: 305px;
    margin-right: 12px
}

.tbl.tbl_ticket .discount .btn {
    width: 90px;
    height: 50px;
    padding: 10px 10px 12px;
    vertical-align: top
}

.tbl.tbl_ticket .discount .txt_alert {
    margin-bottom: 0
}

.tbl.tbl_ticket .discount .dis_amount {
    display: inline-block;
    font-size: 18px;
    color: #4285F4;
    margin-left: 17px;
    vertical-align: top;
    line-height: 49px
}

.tbl.tbl_ticket+h3 {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .tbl.tbl_ticket td.dis_coup .bx_multi {
        padding-bottom: 30px
    }

    .tbl.tbl_ticket td.dis_coup .bx_total {
        padding: 30px 0 10px
    }

    .tbl.tbl_ticket td.dis_coup .bx_total .total {
        float: none;
        width: auto
    }

    .tbl.tbl_ticket .bx_multi {
        display: block;
        width: 100%;
        padding: 40px 40px 0 40px;
        text-align: center
    }

    .tbl.tbl_ticket .bx_multi .multi {
        padding: 0 35px
    }

    .tbl.tbl_ticket .discount {
        text-align: center;
        padding: 0 20px 70px
    }

    .tbl.tbl_ticket .discount .ipt {
        width: 242px
    }

    .tbl.tbl_ticket .discount .dis_amount {
        position: absolute;
        bottom: 25px;
        left: 50%;
        margin-left: 0;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .tbl.tbl_ticket .bx_total {
        display: block;
        width: 40%;
        margin: 0 auto;
        padding: 30px 0 40px 0
    }

    .tbl.tbl_ticket+h3 {
        margin-top: 60px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_ticket td.dis_coup .bx_multi {
        padding-bottom: 20px
    }

    .tbl.tbl_ticket td.dis_coup .bx_total {
        width: 90%;
        padding: 20px 0 0
    }

    .tbl.tbl_ticket td.dis_coup .bx_total .total {
        padding: 13px 20px 13px
    }

    .tbl.tbl_ticket .bx_multi {
        padding: 30px 10px 0 10px
    }

    .tbl.tbl_ticket .bx_multi .un_price {
        display: block;
        font-size: 14px
    }

    .tbl.tbl_ticket .bx_multi .multi {
        display: block;
        margin: 25px auto
    }

    .tbl.tbl_ticket .bx_multi .bx_ipt {
        font-size: 14px;
        height: auto;
        border-radius: 0;
        vertical-align: top
    }

    .tbl.tbl_ticket .bx_multi .bx_ipt label {
        font-size: 14px
    }

    .tbl.tbl_ticket .discount {
        padding: 0 10px 60px
    }

    .tbl.tbl_ticket .discount .bx_ipt {
        width: 100%;
        height: auto
    }

    .tbl.tbl_ticket .discount .ipt {
        width: calc(100% - 90px);
        margin-right: 7px
    }

    .tbl.tbl_ticket .discount .dis_txt {
        display: none
    }

    .tbl.tbl_ticket .discount .dis_amount {
        font-size: 15px;
        line-height: 20px
    }

    .tbl.tbl_ticket .discount .btn {
        width: 75px;
        height: 40px;
        padding: 10px 5px 12px
    }

    .tbl.tbl_ticket .bx_total {
        display: block;
        width: 80%;
        padding: 30px 0
    }

    .tbl.tbl_ticket+h3 {
        margin-top: 30px
    }
}

.tbl.tbl_pass+h3 {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .tbl.tbl_pass+h3 {
        margin-top: 60px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass+h3 {
        margin-top: 30px
    }
}

.tbl.tbl_pass caption {
    font-size: 38px;
    line-height: 1.4;
    font-weight: 100;
    padding-bottom: 50px
}

@media (max-width: 1279px) {
    .tbl.tbl_pass caption {
        font-size: 32px;
        padding-bottom: 26px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass caption {
        font-size: 23px;
        padding-bottom: 17px
    }
}

.tbl.tbl_pass tr {
    border-bottom: #f0f0f0 solid 1px
}

.tbl.tbl_pass td {
    padding: 40px 0;
    border: none
}

.tbl.tbl_pass .tkt_ico {
    width: 213px;
    text-align: center;
    position: relative
}

.tbl.tbl_pass .tkt_ico .ico_lab {
    position: absolute;
    top: -2px;
    left: 0
}

.tbl.tbl_pass .tkt_ico .month_txt {
    position: absolute;
    top: 30px;
    left: 13px;
    font-size: 20px;
    letter-spacing: -0.8px
}

.tbl.tbl_pass .tkt_ico .ico {
    vertical-align: middle;
    width: 93px
}

.tbl.tbl_pass .tkt_ico .ico_hot {
    display: block;
    position: absolute;
    left: 10px;
    top: 30px;
    width: 86px;
    height: 57px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_bubble.png") no-repeat 0 0;
    font-size: 18px;
    text-align: center;
    line-height: 48px;
    color: #F52222;
    -webkit-animation: ani 0.5s linear 0s infinite alternate;
    animation: ani 0.5s linear 0s infinite alternate
}

@-webkit-keyframes ani {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    100% {
        -webkit-transform: translate(0, -10px);
        transform: translate(0, -10px)
    }
}

@keyframes ani {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    100% {
        -webkit-transform: translate(0, -10px);
        transform: translate(0, -10px)
    }
}

@media (max-width: 1279px) {
    .tbl.tbl_pass .tkt_ico {
        width: 123px
    }

    .tbl.tbl_pass .tkt_ico .ico {
        width: 63px
    }

    .tbl.tbl_pass .tkt_ico .ico_hot {
        top: 42px;
        left: 0;
        width: 70px;
        height: 46px;
        font-size: 14px;
        line-height: 40px;
        background-size: 100% 100%
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass .tkt_ico {
        text-align: center !important;
        padding: 30px 0 20px !important
    }

    .tbl.tbl_pass .tkt_ico .ico_lab {
        width: 100px
    }

    .tbl.tbl_pass .tkt_ico .ico {
        width: 20%;
        max-width: 64px
    }

    .tbl.tbl_pass .tkt_ico .month_txt {
        position: absolute;
        top: 31px;
        font-size: 20px
    }

    .tbl.tbl_pass .tkt_ico .ico_hot {
        top: 14px;
        left: 50%;
        margin-left: -92px
    }
}

.tbl.tbl_pass .tkt_txt .wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    padding: 0px 60px;
    border-left: 1px dotted #222222
}

.tbl.tbl_pass .tkt_txt h4 {
    font-size: 18px;
    display: inline-block
}

.tbl.tbl_pass .tkt_txt .info_txt {
    color: #4285F4;
    display: inline-block;
    margin-left: 20px;
    letter-spacing: -0.64px;
    font-size: 16px
}

.tbl.tbl_pass .tkt_txt .info {
    color: #999999
}

.tbl.tbl_pass .tkt_txt .info br {
    display: none
}

@media (max-width: 1279px) {
    .tbl.tbl_pass .tkt_txt .wrap {
        padding: 0px 20px 0 30px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass .tkt_txt {
        padding: 0 !important
    }

    .tbl.tbl_pass .tkt_txt .wrap {
        border: none;
        padding: 0px;
        text-align: center
    }

    .tbl.tbl_pass .tkt_txt h4 {
        display: block
    }

    .tbl.tbl_pass .tkt_txt .info_txt {
        display: block;
        font-size: 18px;
        margin-left: 0;
        margin-bottom: 4px
    }

    .tbl.tbl_pass .tkt_txt .info {
        padding: 0px 6.6%
    }

    .tbl.tbl_pass .tkt_txt .info br {
        display: block
    }
}

.tbl.tbl_pass .grp_price {
    margin: 18px 0 0px
}

@media (max-width: 1279px) {
    .tbl.tbl_pass .grp_price {
        margin: 20px 0 0px
    }
}

.tbl.tbl_pass .tkt_btn {
    width: 174px
}

.tbl.tbl_pass .tkt_btn .btn {
    min-width: 115px
}

@media (max-width: 1279px) {
    .tbl.tbl_pass .tkt_btn {
        width: 130px
    }

    .tbl.tbl_pass .tkt_btn .btn {
        min-width: 100px;
        padding: 12px 18px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass .tkt_btn {
        text-align: center !important;
        padding: 25px 0 30px !important
    }

    .tbl.tbl_pass .tkt_btn .btn {
        min-width: 200px;
        padding: 12px 18px;
        font-size: 18px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_pass {
        display: block;
        border: none
    }

    .tbl.tbl_pass:after {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_pass thead {
        display: none
    }

    .tbl.tbl_pass caption,
    .tbl.tbl_pass thead,
    .tbl.tbl_pass tbody,
    .tbl.tbl_pass tr,
    .tbl.tbl_pass th,
    .tbl.tbl_pass td {
        width: 100% !important;
        float: left !important;
        border: none;
        text-align: left !important
    }

    .tbl.tbl_pass caption {
        display: block !important
    }

    .tbl.tbl_pass tbody {
        border-top: 1px #222222 solid;
        display: block !important
    }

    .tbl.tbl_pass tr {
        display: block !important;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_pass th {
        display: block !important;
        padding: 17px 3.6% 0px !important;
        font-weight: 600
    }

    .tbl.tbl_pass th br {
        display: none
    }

    .tbl.tbl_pass th.subject_header {
        border-top: 3px solid #222222;
        padding: 10px 3.6% !important
    }

    .tbl.tbl_pass th+td {
        padding: 6px 3.6% 17px !important
    }

    .tbl.tbl_pass td {
        display: block !important;
        padding: 10px 3.6% !important;
        line-height: 1.7;
        width: auto
    }

    .tbl.tbl_pass td.multi .ipt,
    .tbl.tbl_pass td.multi .slct {
        width: calc(100% - 90px) !important;
        float: left;
        margin: 0 0 10px 0
    }

    .tbl.tbl_pass td.multi .btn.squ {
        float: right;
        padding: 10px 15px 11px;
        margin: 0 0 10px 0;
        width: 80px
    }

    .tbl.tbl_pass td.multi .txt_alert {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_pass td.full .btn.squ {
        width: 100%
    }

    .tbl.tbl_pass .bg {
        padding: 10px 3.6% !important;
        border-bottom: none !important
    }

    .tbl.tbl_pass .bg+td {
        padding: 20px 3.6% !important
    }

    .tbl.tbl_pass .rowspan {
        border-bottom: none
    }

    .tbl.tbl_pass .rowspan td {
        padding: 0px 3.6% 0px !important
    }

    .tbl.tbl_pass .rowspan.fr td {
        padding: 6px 3.6% 0px !important
    }

    .tbl.tbl_pass .rowspan.ls {
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_pass .rowspan.ls td {
        padding: 0px 3.6% 17px !important
    }

    .tbl.tbl_pass .empty td,
    .tbl.tbl_pass .empty th {
        width: 100%;
        text-align: center !important;
        padding: 13px 3.6% !important
    }

    .tbl.tbl_pass .hide {
        display: none !important
    }
}

.tbl.tbl_veiw th {
    width: 190px
}

.tbl.tbl_veiw th,
.tbl.tbl_veiw td {
    word-break: keep-all
}

@media (max-width: 1279px) {
    .tbl.tbl_veiw th {
        width: 23%
    }

    .tbl.tbl_veiw.mda {
        display: block;
        overflow: hidden
    }

    .tbl.tbl_veiw.mda thead {
        display: block;
        float: left;
        width: 100%
    }

    .tbl.tbl_veiw.mda thead tr,
    .tbl.tbl_veiw.mda thead th {
        display: block;
        width: auto;
        float: left;
        width: 100%
    }

    .tbl.tbl_veiw.mda tbody {
        display: table
    }

    .tbl.tbl_veiw.mda tbody tr {
        display: block;
        width: 100%;
        float: left;
        background: #fcfcfc;
        border-bottom: 1px solid #f0f0f0
    }

    .tbl.tbl_veiw.mda tbody tr th {
        display: block;
        float: left;
        width: 170px
    }

    .tbl.tbl_veiw.mda tbody tr td {
        display: block;
        float: left;
        background: #fff;
        width: calc(100% - 170px);
        padding: 18px 2.6%;
        min-height: 60px
    }

    .tbl.tbl_veiw.mda tbody tr th,
    .tbl.tbl_veiw.mda tbody tr td {
        border: 0
    }

    .tbl.tbl_veiw.mda tbody tr.tr_media {
        border-bottom: none
    }

    .tbl.tbl_veiw.mda tbody tr.tr_media th,
    .tbl.tbl_veiw.mda tbody tr.tr_media td {
        border-bottom: 1px solid #f0f0f0
    }
}

@media (max-width: 767px) {
    .tbl.tbl_veiw {
        display: block;
        border: none
    }

    .tbl.tbl_veiw:after {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_veiw thead {
        display: none
    }

    .tbl.tbl_veiw caption,
    .tbl.tbl_veiw thead,
    .tbl.tbl_veiw tbody,
    .tbl.tbl_veiw tr,
    .tbl.tbl_veiw th,
    .tbl.tbl_veiw td {
        width: 100% !important;
        float: left !important;
        border: none;
        text-align: left !important
    }

    .tbl.tbl_veiw caption {
        display: block !important
    }

    .tbl.tbl_veiw tbody {
        border-top: 1px #222222 solid;
        display: block !important
    }

    .tbl.tbl_veiw tr {
        display: block !important;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_veiw th {
        display: block !important;
        padding: 17px 3.6% 0px !important;
        font-weight: 600
    }

    .tbl.tbl_veiw th br {
        display: none
    }

    .tbl.tbl_veiw th.subject_header {
        border-top: 3px solid #222222;
        padding: 10px 3.6% !important
    }

    .tbl.tbl_veiw th+td {
        padding: 6px 3.6% 17px !important
    }

    .tbl.tbl_veiw td {
        display: block !important;
        padding: 10px 3.6% !important;
        line-height: 1.7;
        width: auto
    }

    .tbl.tbl_veiw td.multi .ipt,
    .tbl.tbl_veiw td.multi .slct {
        width: calc(100% - 90px) !important;
        float: left;
        margin: 0 0 10px 0
    }

    .tbl.tbl_veiw td.multi .btn.squ {
        float: right;
        padding: 10px 15px 11px;
        margin: 0 0 10px 0;
        width: 80px
    }

    .tbl.tbl_veiw td.multi .txt_alert {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_veiw td.full .btn.squ {
        width: 100%
    }

    .tbl.tbl_veiw .bg {
        padding: 10px 3.6% !important;
        border-bottom: none !important
    }

    .tbl.tbl_veiw .bg+td {
        padding: 20px 3.6% !important
    }

    .tbl.tbl_veiw .rowspan {
        border-bottom: none
    }

    .tbl.tbl_veiw .rowspan td {
        padding: 0px 3.6% 0px !important
    }

    .tbl.tbl_veiw .rowspan.fr td {
        padding: 6px 3.6% 0px !important
    }

    .tbl.tbl_veiw .rowspan.ls {
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_veiw .rowspan.ls td {
        padding: 0px 3.6% 17px !important
    }

    .tbl.tbl_veiw .empty td,
    .tbl.tbl_veiw .empty th {
        width: 100%;
        text-align: center !important;
        padding: 13px 3.6% !important
    }

    .tbl.tbl_veiw .hide {
        display: none !important
    }
}

.google_bnr+.tbl.tbl_veiw,
.google_bnr_tp2+.tbl.tbl_veiw,
.google_bnr_tp2+.tbl.tbl_veiw {
    margin-top: 40px
}

@media (max-width: 767px) {

    .google_bnr+.tbl.tbl_veiw,
    .google_bnr_tp2+.tbl.tbl_veiw,
    .google_bnr_tp2+.tbl.tbl_veiw {
        margin-top: 30px
    }
}

.tbl.tbl_lst th {
    text-align: left;
    font-weight: 600
}

.tbl .emp{
    font-weight: 600;
    color: var(--emp);
}

.tbl .summary{
    font-weight: 200;
    color: var(--item-sub_txt);
}

.tbl .end{
    color: var(--secondary);
}

.tbl.tbl_lst th,
.tbl.tbl_lst td {
    padding: 34px 30px
}

.tbl.tbl_lst td {
    width: 140px;
    vertical-align: top;
    text-align: center
}

.tbl.tbl_lst .td_updt {
    font-weight: 100;
    width: auto;
    text-align: left;
    line-height: 1.7
}

.tbl.tbl_lst .td_updt a {
    color: #4285F4
}

.tbl.tbl_detail .answer {
    padding-top: 80px;
}

.tbl.tbl_detail .answer i {
    float: left;
    font-size: 32px;
}

.tbl.tbl_detail .answerbox {
    margin-left: 80px;
}

.tbl.tbl_detail .answertxt {
    font-size: 18px;
}

.tbl.tbl_detail .answerdate {
    margin-top: 40px;
    font-size: 15px;
}

.tbl.tbl_detail .bg.desc {
    border-bottom: 0px;
}


@media (max-width: 1279px) {

    .tbl.tbl_lst th,
    .tbl.tbl_lst td {
        padding: 28px 20px 29px
    }

    .tbl.tbl_lst th a,
    .tbl.tbl_lst td a {
        font-weight: 600
    }

    .tbl.tbl_lst td {
        width: 20%
    }
}

@media (max-width: 767px) {
    .tbl.tbl_lst {
        display: block;
        border: none
    }

    .tbl.tbl_lst:after {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_lst thead {
        display: none
    }

    .tbl.tbl_lst caption,
    .tbl.tbl_lst thead,
    .tbl.tbl_lst tbody,
    .tbl.tbl_lst tr,
    .tbl.tbl_lst th,
    .tbl.tbl_lst td {
        width: 100% !important;
        float: left !important;
        border: none;
        text-align: left !important
    }

    .tbl.tbl_lst caption {
        display: block !important
    }

    .tbl.tbl_lst tbody {
        border-top: 1px #222222 solid;
        display: block !important
    }

    .tbl.tbl_lst tr {
        display: block !important;
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_lst th {
        display: block !important;
        padding: 17px 3.6% 0px !important;
        font-weight: 600
    }

    .tbl.tbl_lst th br {
        display: none
    }

    .tbl.tbl_lst th.subject_header {
        border-top: 3px solid #222222;
        padding: 10px 3.6% !important
    }

    .tbl.tbl_lst th+td {
        padding: 6px 3.6% 17px !important
    }

    .tbl.tbl_lst td {
        display: block !important;
        padding: 10px 3.6% !important;
        line-height: 1.7;
        width: auto
    }

    .tbl.tbl_lst td.multi .ipt,
    .tbl.tbl_lst td.multi .slct {
        width: calc(100% - 90px) !important;
        float: left;
        margin: 0 0 10px 0
    }

    .tbl.tbl_lst td.multi .btn.squ {
        float: right;
        padding: 10px 15px 11px;
        margin: 0 0 10px 0;
        width: 80px
    }

    .tbl.tbl_lst td.multi .txt_alert {
        display: block;
        clear: both;
        content: ""
    }

    .tbl.tbl_lst td.full .btn.squ {
        width: 100%
    }

    .tbl.tbl_lst .bg {
        padding: 10px 3.6% !important;
        border-bottom: none !important
    }

    .tbl.tbl_lst .bg+td {
        padding: 20px 3.6% !important
    }

    .tbl.tbl_lst .rowspan {
        border-bottom: none
    }

    .tbl.tbl_lst .rowspan td {
        padding: 0px 3.6% 0px !important
    }

    .tbl.tbl_lst .rowspan.fr td {
        padding: 6px 3.6% 0px !important
    }

    .tbl.tbl_lst .rowspan.ls {
        border-bottom: 1px #f0f0f0 solid
    }

    .tbl.tbl_lst .rowspan.ls td {
        padding: 0px 3.6% 17px !important
    }

    .tbl.tbl_lst .empty td,
    .tbl.tbl_lst .empty th {
        width: 100%;
        text-align: center !important;
        padding: 13px 3.6% !important
    }

    .tbl.tbl_lst .hide {
        display: none !important
    }

    .tbl.tbl_lst td:not(.td_updt) {
        width: auto !important;
        padding: 0px 3.6% 15px !important;
        display: inline-block !important;
        font-size: 12px
    }

    .tbl.tbl_lst .td_updt {
        padding: 17px 3.6% 8px !important
    }
}

.tbl.tbl_my {
    border-top: none
}

@media (max-width: 1279px) {
    .tbl.tbl_my {
        table-layout: auto
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my {
        display: block
    }

    .tbl.tbl_my tbody,
    .tbl.tbl_my tr,
    .tbl.tbl_my th,
    .tbl.tbl_my td {
        display: block
    }
}

.tbl.tbl_my tbody {
    border-bottom: 1px solid #f0f0f0
}

.tbl.tbl_my tbody tr {
    border-top: 1px solid #f0f0f0
}

.tbl.tbl_my tbody tr.on {
    border-color: #222
}

.tbl.tbl_my tbody tr:first-child {
    border-color: #222
}

@media (max-width: 767px) {
    .tbl.tbl_my tbody tr:after {
        display: block;
        clear: both;
        content: ""
    }
}

.tbl.tbl_my tbody .empty th {
    text-align: center
}

.tbl.tbl_my tbody .empty td {
    display: block;
    padding: 28px 20px;
    text-align: center
}

@media (max-width: 767px) {
    .tbl.tbl_my tbody .empty td {
        padding: 23px 3.6%
    }
}

.tbl.tbl_my th,
.tbl.tbl_my td {
    border-bottom: none
}

@media (max-width: 1279px) {

    .tbl.tbl_my th,
    .tbl.tbl_my td {
        padding: 20px 30px
    }

    .tbl.tbl_my th.arw,
    .tbl.tbl_my td.arw {
        padding-right: 55px
    }
}

@media (max-width: 767px) {

    .tbl.tbl_my th,
    .tbl.tbl_my td {
        width: 100%;
        padding: 16px 3.6%;
        float: left !important
    }

    .tbl.tbl_my th.arw,
    .tbl.tbl_my td.arw {
        padding-right: 3.6%
    }
}

.tbl.tbl_my th .btns,
.tbl.tbl_my td .btns {
    margin: 0;
    padding: 30px 0 60px;
    border-top: 1px #f0f0f0 solid
}

.tbl.tbl_my th .btns.alert,
.tbl.tbl_my td .btns.alert {
    padding-top: 10px
}

.tbl.tbl_my th .btns.alert .bx_notice,
.tbl.tbl_my td .btns.alert .bx_notice {
    padding-bottom: 40px
}

.tbl.tbl_my th .btns .bx_notice,
.tbl.tbl_my td .btns .bx_notice {
    padding-top: 0
}

@media (max-width: 767px) {

    .tbl.tbl_my th .btns,
    .tbl.tbl_my td .btns {
        padding: 30px 0 40px
    }
}

.tbl.tbl_my tr:last-child .btns {
    border-bottom: 1px solid #222
}

.tbl.tbl_my .tr_tit {
    text-align: left
}

.tbl.tbl_my .tr_tit.on+.tr_con+.tr_tit {
    border-top: 1px solid #222
}

.tbl.tbl_my .tr_tit.on+.tr_con {
    display: table-row
}

@media (max-width: 767px) {
    .tbl.tbl_my .tr_tit.on th {
        border-top: none
    }

    .tbl.tbl_my .tr_tit.on+.tr_con {
        display: block
    }
}

.tbl.tbl_my .tr_tit.on .arw:after {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 9px;
    height: 9px;
    -webkit-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    transform: translate(-50%, -50%) scale(1, 0.90909) rotate(45deg);
    margin-top: 3px;
    border-top: 3px solid #222222;
    border-left: 3px solid #222222;
    border-right: none;
    border-bottom: none
}

@media (max-width: 767px) {
    .tbl.tbl_my .tr_tit.on .arw:after {
        margin-top: -15px
    }
}

.tbl.tbl_my .tr_tit .arw {
    cursor: pointer
}

@media (max-width: 767px) {
    .tbl.tbl_my .tr_tit .arw:after {
        margin-top: -20px;
        right: 3.6%
    }
}

.tbl.tbl_my .tr_tit .date {
    width: 160px;
    font-weight: 100
}

@media (max-width: 1279px) {
    .tbl.tbl_my .tr_tit .date {
        width: 21% !important
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my .tr_tit .date {
        width: 100% !important;
        padding-bottom: 0px
    }

    .tbl.tbl_my .tr_tit .date+.subject {
        padding-top: 3px
    }
}

.tbl.tbl_my .tr_tit+.tr_con {
    display: none
}

.tbl.tbl_my .tr_tit.disable {
    color: #999
}

.tbl.tbl_my .tr_tit.disable+.tr_con dt,
.tbl.tbl_my .tr_tit.disable+.tr_con dd {
    color: #999
}

.tbl.tbl_my.type2 .tr_tit .date {
    width: 216px
}

.tbl.tbl_my.type2 .info dt {
    width: 20%
}

.tbl.tbl_my.type2 .info dd {
    width: 80%
}

.tbl.tbl_my.type2 .info dd.txt_dis {
    width: 100%;
    padding-left: 20%
}

@media (max-width: 1279px) {
    .tbl.tbl_my.type2 .tr_tit .date {
        width: 30% !important
    }

    .tbl.tbl_my.type2 .info dt {
        width: 30%
    }

    .tbl.tbl_my.type2 .info dd {
        width: 70%
    }

    .tbl.tbl_my.type2 .info dd.txt_dis {
        padding-left: 30%
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my.type2 .tr_tit .date {
        width: 100% !important
    }

    .tbl.tbl_my.type2 .info dt {
        width: 100%
    }

    .tbl.tbl_my.type2 .info dd {
        width: 100%
    }

    .tbl.tbl_my.type2 .info dd.txt_dis {
        padding-left: 0
    }

    .tbl.tbl_my.type2 .info dd.txt_dis p {
        margin-left: 0
    }
}

.tbl.tbl_my .tr_con {
    width: 100%
}

.tbl.tbl_my .tr_con td {
    padding: 0;
    width: 100%
}

@media (max-width: 767px) {
    .tbl.tbl_my .tr_con {
        display: block
    }
}

.tbl.tbl_my.bg .tr_tit {
    background: #fcfcfc
}

.tbl.tbl_my.bg .tr_tit th {
    border-top: 1px solid #222;
    font-weight: 600
}

.tbl.tbl_my.bg .tr_tit+.tr_con {
    display: table-row
}

.tbl.tbl_my .no_border th,
.tbl.tbl_my .no_border td {
    border-bottom: none
}

.tbl.tbl_my .info {
    padding: 28px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 767px) {
    .tbl.tbl_my .info {
        padding: 23px 3.6%;
        line-height: 22px
    }
}

.tbl.tbl_my .info:after {
    display: block;
    clear: both;
    content: ""
}

.tbl.tbl_my .info+.info {
    border-top: 1px solid #f0f0f0
}

.tbl.tbl_my .info.row1 {
    padding: 17px 0 18px
}

@media (max-width: 1279px) {
    .tbl.tbl_my .info.row1 {
        padding: 12px 0 13px
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my .info.row1 {
        padding: 24px 3.6%
    }
}

.tbl.tbl_my .info dt,
.tbl.tbl_my .info dd {
    display: block
}

.tbl.tbl_my .info dt {
    width: 15%;
    padding: 8px 0 7px 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left
}

@media (max-width: 1279px) {
    .tbl.tbl_my .info dt {
        width: 21%
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my .info dt {
        width: 100%;
        float: none;
        padding: 14px 0 0 0
    }

    .tbl.tbl_my .info dt:first-child {
        padding: 0
    }
}

.tbl.tbl_my .info dd {
    width: 85%;
    padding: 8px 30px 7px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    color: #666666
}

.tbl.tbl_my .info dd.txt_dis {
    width: 100%;
    padding-left: 15%
}

.tbl.tbl_my .info dd.txt_dis p {
    margin-left: 30px;
    padding-left: 16px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_d_line.svg") no-repeat top left;
    color: #666;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl.tbl_my .info dd.dd_btn {
    padding: 0 30px
}

@media (max-width: 767px) {
    .tbl.tbl_my .info dd.dd_btn {
        padding: 8px 0 10px
    }
}

.tbl.tbl_my .info dd .btn {
    margin-bottom: 11px
}

@media (max-width: 1279px) {
    .tbl.tbl_my .info dd {
        width: 79%
    }

    .tbl.tbl_my .info dd.txt_dis {
        padding-left: 21%
    }
}

@media (max-width: 767px) {
    .tbl.tbl_my .info dd {
        width: 100%;
        float: none;
        padding: 0
    }

    .tbl.tbl_my .info dd.txt_dis {
        padding-left: 0
    }

    .tbl.tbl_my .info dd.txt_dis p {
        margin-left: 0
    }
}

.tbl.tbl_my+.btns {
    margin: 30px 0 60px
}

@media (max-width: 767px) {
    .tbl.tbl_my+.btns {
        margin: 30px 0 40px
    }
}

.tbl.tbl_my+.tbl_my,
.tbl.tbl_my+.half_area {
    margin-top: 60px
}

@media (max-width: 767px) {

    .tbl.tbl_my+.tbl_my,
    .tbl.tbl_my+.half_area {
        margin-top: 40px
    }
}

.tbl.tbl_my.tp_col4 .col4_1 {
    width: 15%
}

.tbl.tbl_my.tp_col4 .col4_2 {
    width: 150px
}

.tbl.tbl_my.tp_col4 .col4_3 {
    width: 150px
}

@media (max-width: 1279px) {
    .tbl+.tbl {
        margin-top: 70px
    }

    .tbl+.near {
        margin-top: 30px
    }

    .tbl.tbl_my.tp_col4 .col4_1 {
        width: 21%
    }

    .tbl.tbl_my.tp_col4 .col4_2 {
        width: 100px
    }

    .tbl.tbl_my.tp_col4 .col4_3 {
        width: 100px
    }

    .tbl.tbl_my.tp_col4 th {
        padding-left: 10px;
        padding-right: 10px
    }

    .tbl.tbl_my.tp_col4 th:first-child {
        padding-left: 30px
    }

    .tbl.tbl_my.tp_col4 th:last-child {
        padding-right: 30px
    }

    .tbl.tbl_my.tp_col4 th.arw {
        padding-right: 55px
    }
}

@media (max-width: 767px) {
    .tbl+.tbl {
        margin-top: 30px
    }

    .tbl+.near {
        margin-top: 15px
    }

    .tbl.tbl_my.tp_col4 .col4_1 {
        width: 100%
    }

    .tbl.tbl_my.tp_col4 .col4_2 {
        width: 100%
    }

    .tbl.tbl_my.tp_col4 .col4_3 {
        width: 100%
    }

    .tbl.tbl_my.tp_col4 col {
        width: 100%
    }

    .tbl.tbl_my.tp_col4 th {
        padding-top: 3px;
        padding-bottom: 3px;
        padding-right: 3.6%;
        padding-left: 3.6%
    }

    .tbl.tbl_my.tp_col4 th:first-child {
        padding-top: 16px;
        padding-left: 3.6%
    }

    .tbl.tbl_my.tp_col4 th:last-child {
        padding-bottom: 16px;
        padding-right: 3.6%
    }

    .tbl.tbl_my.tp_col4 th.arw {
        padding-right: 3.6%
    }
}

.package img {
    vertical-align: middle
}

.package .top {
    display: table;
    width: 100%
}

.package .top h2 {
    font-size: 38px;
    padding-bottom: 50px;
    padding: 20px 0px 50px 0px;
    line-height: 1.4;
    font-weight: 100;
    text-align: left;
    display: table-cell;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.package .top h2.gmxm_tit {
    padding: 0 0 60px
}

.package .top .pack {
    display: table-cell;
    vertical-align: middle;
    width: 395px;
    padding: 20px 60px 50px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: right
}

.package .top .item {
    display: inline-block;
    text-align: center
}

.package .top .item:first-child:before {
    display: none
}

.package .top .item+.item {
    padding-left: 44px;
    position: relative
}

.package .top .item+.item:before {
    content: "";
    width: 15px;
    height: 15px;
    display: inline-block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bu_plus.png") no-repeat 50% 0;
    position: absolute;
    top: 50%;
    left: 12px;
    margin-top: -7px
}

@media (max-width: 1279px) {
    .package .top h2 {
        width: auto;
        font-size: 32px;
        padding: 0px 0px 50px 0px
    }

    .package .top h2.gmxm_tit {
        padding: 0 0 50px
    }

    .package .top .pack {
        width: 272px;
        padding: 0px 0px 50px 30px
    }

    .package .top .item .ico {
        width: 95px
    }
}

@media (max-width: 767px) {
    .package .top {
        margin-top: 30px
    }

    .package .top h2 {
        width: auto;
        font-size: 22px;
        padding-bottom: 20px
    }

    .package .top .pack {
        display: none
    }
}

.bx_pack {
    display: table;
    width: 100%
}

.bx_pack+.bx_pack {
    margin-top: 40px
}

@media (max-width: 1279px) {
    .bx_pack+.bx_pack {
        margin-top: 20px
    }
}

.bx_pack .pack_ico {
    background: #fcfcfc;
    width: 213px;
    padding: 43px 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: table-cell;
    vertical-align: middle;
    border-radius: 10px 0px 0px 10px;
    border: 1px solid #f0f0f0;
    text-align: center
}

.bx_pack .pack_ico .ico[src*="pack1"] {
    width: 93px;
    height: 94px
}

.bx_pack .pack_ico .ico[src*="pack2"] {
    width: 115px;
    height: 104px
}

.bx_pack .pack_ico .ico[src*="pack3"] {
    width: 132px;
    height: 135px
}

.bx_pack .pack_ico .ico[src*="pack4"],
.bx_pack .pack_ico .ico[src*="pack5"],
.bx_pack .pack_ico .ico[src*="pack6"] {
    width: 104px;
    height: 143px
}

@media (max-width: 1279px) {
    .bx_pack .pack_ico {
        display: none;
        width: 123px;
        padding: 43px 0px
    }

    .bx_pack .pack_ico .ico[src*="pack1"],
    .bx_pack .pack_ico .ico[src*="pack4"],
    .bx_pack .pack_ico .ico[src*="pack5"],
    .bx_pack .pack_ico .ico[src*="pack6"] {
        width: 67px;
        height: 68px
    }

    .bx_pack .pack_ico .ico[src*="pack2"] {
        width: 81px;
        height: 73px
    }

    .bx_pack .pack_ico .ico[src*="pack3"] {
        width: 93px;
        height: 95px
    }
}

@media (max-width: 767px) {
    .bx_pack .pack_ico {
        display: none
    }
}

.bx_pack .pack_con {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: table-cell;
    border-radius: 0px 10px 10px 0px;
    border: 1px solid #f0f0f0;
    border-left: none
}

@media (max-width: 1279px) {
    .bx_pack .pack_con {
        border: 1px solid #f0f0f0;
        border-radius: 10px
    }
}

@media (max-width: 767px) {
    .bx_pack .pack_con {
        border: 1px solid #f0f0f0;
        border-radius: 10px;
        overflow: hidden
    }
}

.bx_pack .pack {
    width: 100%;
    padding: 23px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #f0f0f0;
    font-size: 15px
}

@media (max-width: 1279px) {
    .bx_pack .pack {
        padding: 23px 30px
    }
}

@media (max-width: 767px) {
    .bx_pack .pack {
        background: #fcfcfc;
        text-align: center;
        padding: 23px 0px
    }
}

.bx_pack .pack .item {
    padding: 20px 0px 14px;
    display: inline-block;
    text-align: center;
    width: 120px
}

.bx_pack .pack .item img {
    width: 61px;
    margin-bottom: 9px
}

.bx_pack .pack .item span {
    color: #666666;
    display: block;
    line-height: 1.4
}

.bx_pack .pack .item span+span {
    margin-top: 3px
}

.bx_pack .pack .item+.item {
    padding-left: 44px;
    position: relative
}

.bx_pack .pack .item+.item:before {
    content: "";
    width: 15px;
    height: 15px;
    display: inline-block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bu_plus.png") no-repeat 50% 0;
    position: absolute;
    top: 50%;
    left: 12px;
    margin-top: -22px
}

.bx_pack .pack .item:first-child:before {
    display: none
}

@media (max-width: 1279px) {
    .bx_pack .pack .item {
        width: 110px;
        font-size: 14px;
        line-height: 18px;
        vertical-align: top
    }

    .bx_pack .pack .item .ico {
        width: 52px
    }

    .bx_pack .pack .item+.item {
        padding-left: 27px
    }

    .bx_pack .pack .item+.item:before {
        left: 6px;
        margin-top: -25px
    }
}

@media (max-width: 767px) {
    .bx_pack .pack .item {
        width: 95px;
        font-size: 14px;
        line-height: 18px;
        vertical-align: top;
        padding: 12px 0 10px
    }

    .bx_pack .pack .item .ico {
        width: 46px
    }

    .bx_pack .pack .item span {
        font-size: 12px;
        line-height: 16px
    }

    .bx_pack .pack .item span+span {
        margin-top: 1px
    }

    .bx_pack .pack .item+.item {
        padding-left: 21px
    }

    .bx_pack .pack .item+.item:before {
        left: 4px;
        margin-top: -23px;
        width: 11px;
        height: 11px;
        background-size: 100%
    }
}

.bx_pack .pack .item_tit {
    display: inline-block;
    vertical-align: top;
    padding-top: 12px;
    padding-left: 36px;
    color: #222222;
    line-height: 2
}

@media (max-width: 767px) {
    .bx_pack .pack .item_tit {
        display: block;
        font-size: 14px;
        text-align: center;
        padding-top: 4px;
        padding-left: 0
    }
}

.bx_pack .row {
    width: 100%;
    padding: 40px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_pack .row:after {
    display: block;
    clear: both;
    content: ""
}

.bx_pack .row .grp_price {
    float: left
}

.bx_pack .row .pack_btn {
    float: right
}

@media (max-width: 1279px) {
    .bx_pack .row {
        padding: 40px 30px
    }
}

@media (max-width: 767px) {
    .bx_pack .row {
        padding: 30px 0px;
        text-align: center
    }

    .bx_pack .row .grp_price {
        float: none
    }

    .bx_pack .row .pack_btn {
        float: none;
        margin-top: 25px
    }

    .bx_pack .row .pack_btn .btn {
        min-width: 200px;
        padding: 12px 18px;
        font-size: 18px
    }
}

.grp_price del,
.grp_price strike {
    font-size: 24px;
    display: inline-block
}

.grp_price del {
    width: 160px;
    text-decoration: none
}

.grp_price del span {
    text-decoration: line-through
}

.grp_price del+.t_price {
    margin-left: 10px
}

.grp_price del .unit {
    text-decoration: none
}

.grp_price.price_bx del {
    width: 130px;
    text-decoration: none
}

.grp_price strong {
    font-size: 34px;
    line-height: 1;
    color: #4285F4
}

.grp_price strong .unit {
    font-size: 15px
}

.grp_price .unit {
    font-size: 14px
}

@media (max-width: 1279px) {
    .grp_price strong {
        font-size: 25px;
        line-height: 1.3
    }

    .grp_price del,
    .grp_price strike {
        font-size: 20px
    }

    .grp_price del {
        width: 100px
    }

    .grp_price del+.t_price {
        margin: 10px 0 0 0
    }
}

@media (max-width: 767px) {
    .grp_price strong {
        font-size: 23px;
        display: block
    }

    .grp_price strong .unit {
        font-size: 14px
    }

    .grp_price del,
    .grp_price strike {
        font-size: 14px;
        display: block;
        width: 100%
    }

    .grp_price .discount {
        display: block;
        margin-top: 10px
    }

    .grp_price .unit {
        font-size: 12px
    }
}

.grp_price .paypal {
    margin-bottom: 4px;
    font-size: 14px;
    color: #4285F4
}

.grp_price .t_price {
    display: inline-block;
    vertical-align: middle
}

.grp_price .t_price .paypal {
    display: block
}

@media (max-width: 767px) {
    .grp_price .t_price {
        display: block
    }

    .grp_price .t_price .paypal {
        margin-top: 5px
    }
}

.grp_price .discount {
    font-size: 24px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: -23px 16px 0;
    padding: 6px 9px 0;
    color: #ffffff;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    background-color: #4285F4
}

@media (max-width: 1279px) {
    .grp_price .discount {
        margin: -23px 20px 0 26px;
        padding: 7px 9px 0
    }
}

@media (max-width: 767px) {
    .grp_price .discount {
        margin: 10px 0 24px
    }
}

.grp_price .discount:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: -14px;
    margin-left: -38px;
    border-top: 15px solid #4285F4;
    border-left: 38px solid transparent;
    border-right: 38px solid transparent
}

.paging {
    text-align: center;
    margin-top: 60px;
    font-size: 16px
}

.paging a {
    margin: 0px 15px;
    font-size: 16px;
    font-weight: 600;
    vertical-align: middle;
    line-height: 24px;
    cursor: pointer;
}

.paging a.on,
.paging a:hover {
    color: #4285F4;
    text-decoration: underline
}

.paging a.on:before,
.paging a.on:after,
.paging a:hover:before,
.paging a:hover:after {
    border-color: #4285F4
}

.paging .btn_prev,
.paging .btn_prev_end,
.paging .btn_next,
.paging .btn_next_end {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    height: 24px;
    width: 10px
}

.paging .btn_prev:before,
.paging .btn_prev:after,
.paging .btn_prev_end:before,
.paging .btn_prev_end:after,
.paging .btn_next:before,
.paging .btn_next:after,
.paging .btn_next_end:before,
.paging .btn_next_end:after {
    top: 50%;
    left: 50%;
    margin-top: 1px
}

.paging .btn_prev {
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    margin: 0px 3px 0px 5px
}

.paging .btn_prev:before {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: 2px;
    border-left: 2px solid #222222;
    border-bottom: 2px solid #222222
}

.paging .btn_prev_end {
    width: 20px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    margin: 0 6px 0 0
}

.paging .btn_prev_end:before,
.paging .btn_prev_end:after {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: 2px;
    border-left: 2px solid #222222;
    border-bottom: 2px solid #222222;
    margin-left: 0px
}

.paging .btn_prev_end:after {
    margin-left: 7px
}

.paging .btn_next {
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    margin: 0px 5px 0px 13px
}

.paging .btn_next:before {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid #222222;
    border-right: 2px solid #222222;
    margin-left: 0px
}

.paging .btn_next_end {
    width: 20px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    margin: 0 0 0 6px
}

.paging .btn_next_end:before,
.paging .btn_next_end:after {
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(1.16667, 1) rotate(45deg);
    margin-left: -2px;
    border-top: 2px solid #222222;
    border-right: 2px solid #222222;
    margin-left: 0px
}

.paging .btn_next_end:after {
    margin-left: -7px
}

.paging+.google_bnr,
.paging+.google_bnr_tp2,
.paging+.google_bnr_tp2 {
    margin: 80px auto 0
}

@media (max-width: 1279px) {
    .paging {
        margin-top: 30px
    }
}

@media (max-width: 767px) {
    .paging {
        font-size: 14px
    }

    .paging a {
        margin: 0px 12px;
        font-size: 14px;
        line-height: 1
    }

    .paging .btn_prev,
    .paging .btn_prev_end,
    .paging .btn_next,
    .paging .btn_next_end {
        height: 20px
    }

    .paging+.google_bnr,
    .paging+.google_bnr_tp2,
    .paging+.google_bnr_tp2 {
        margin: 50px auto 0
    }
}

.tbl_user {
    width: 100%;
    margin: 30px 0
}

.tbl_user th,
.tbl_user td {
    border: 0;
    padding: 7px 0;
    font-weight: 100;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tbl_user th {
    width: 130px;
    padding-right: 10px;
    text-align: left
}

.tbl_user td {
    word-break: break-all;
    color: var(--heading-color);
}

@media (max-width: 1279px) {
    .tbl_user {
        margin: 20px 0
    }
}

@media (max-width: 767px) {
    .tbl_user {
        margin: 0
    }

    .tbl_user th,
    .tbl_user td {
        font-size: 13px;
        padding: 15px 0;
        border-bottom: 1px solid #f0f0f0
    }

    .tbl_user th {
        padding-right: 3.6%
    }
}

.btns {
    text-align: center;
    margin-top: 60px
}

.btns_buy {
    text-align: center;
    margin-top: 26px
}

.btns .btn {
    margin: 0 8px
}

@media (max-width: 767px) {
    .btns {
        margin-top: 30px
    }

    .btns .btn {
        margin: 0 3px
    }

    .btns .btn.mb_hidden {
        display: none
    }
}

.btn_box {
    text-align: center
}

.btns_half {
    width: 100%;
    min-width: 162px;
    margin: 60px auto 0;
    overflow: hidden;
    text-align: center
}

.btns_half .btn {
    margin: 0 8px
}

@media (max-width: 1279px) {
    .btns_half .btn {
        margin: 0 10px
    }
}

@media (max-width: 767px) {
    .btns_half {
        min-width: unset;
        margin-top: 30px
    }

    .btns_half .btn {
        float: left;
        width: calc(50% - 5px);
        margin: 0
    }

    .btns_half .btn:last-child {
        float: right
    }

    .btns_half.m_line2 .btn {
        float: none;
        width: 100%
    }

    .btns_half.m_line2 .btn+.btn {
        margin-top: 10px
    }
}

.google_bnr,
.google_bnr_tp2 {
    display: block;
    width: 728px;
    height: 90px;
    overflow: hidden;
    margin: 0 auto
}

.google_bnr a,
.google_bnr_tp2 a {
    display: block;
    width: 100%;
    height: 100%
}

.google_bnr+.bx_notice.gray,
.google_bnr_tp2+.bx_notice.gray {
    margin-top: 0
}

@media (max-width: 1279px) {

    .google_bnr+.bx_notice.gray,
    .google_bnr_tp2+.bx_notice.gray {
        margin-top: 30px
    }
}

@media (max-width: 767px) {

    .google_bnr,
    .google_bnr_tp2 {
        width: 100%;
        overflow: hidden
    }

    .google_bnr+.bx_notice.gray,
    .google_bnr_tp2+.bx_notice.gray {
        margin-top: 0
    }
}

.float_banner {
    display: none
}

.wing_bnr {
    position: absolute;
    top: 993px;
    left: 50%;
    margin-left: 660px;
    z-index: 2;
    width: 160px
}

.wing_bnr .bnr_side {
    margin-bottom: 30px;
    display: block
}

.wing_bnr .google_bnr,
.wing_bnr .google_bnr_tp2,
.wing_bnr .google_bnr_tp2 {
    width: 100%;
    height: 600px
}

@media (max-width: 1279px) {
    .wing_bnr {
        display: none !important
    }
}

.wing_bnr_tp2 {
    position: absolute;
    top: 333px;
    left: 50%;
    margin-left: 670px;
    z-index: 2;
    width: 160px
}

.wing_bnr_tp2 .bnr_side {
    margin-bottom: 30px;
    display: block
}

.wing_bnr_tp2 .google_bnr,
.wing_bnr_tp2 .google_bnr_tp2,
.wing_bnr_tp2 .google_bnr_tp2 {
    width: 100%;
    height: 600px
}

@media (max-width: 1279px) {
    .wing_bnr_tp2 {
        display: none
    }
}

.popup_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 30
}

.popup_bg .cont {
    position: absolute;
    top: 50%;
    left: 50%;
    background: #ffffff;
    border: 3px solid #222222;
    width: 94%;
    max-width: 500px;
    max-height: 90%;
    padding: 30px 20px;
    overflow: hidden;
    overflow-y: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3)
}

.popup_bg .cont strong {
    display: block;
    font-size: 20px;
    margin-bottom: 15px
}

.popup_bg .cont p {
    font-size: 15px;
    margin-bottom: 40px
}

.popup_bg .cont .btn.squ {
    float: right
}

.popup_img {
    border-radius: 20px 20px 20px 20px;
}

@media (max-width: 767px) {
    .popup_bg .cont {
        padding: 30px 15px
    }

    .popup_bg .cont strong {
        display: block;
        font-size: 16px;
        margin-bottom: 10px
    }

    .popup_bg .cont p {
        font-size: 13px;
        margin-bottom: 20px
    }
}

.popup_bg .btn_pop_close {
    position: absolute;
    display: block;
    width: 27px;
    height: 27px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    top: -1px;
    right: -1px;
    border: 1px solid #222222
}

.popup_bg .btn_pop_close:before,
.popup_bg .btn_pop_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    background-color: #222222
}

.popup_bg .btn_pop_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.popup_bg .btn_pop_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.pop_dimmed {
    position: fixed;
    z-index: 10;
    display: none;
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.popup,
.pop_browser {
    position: fixed;
    top: 50%;
    left: 50%;
    background: #ffffff;
    /*border: 3px solid #222222;*/
    border-radius: 30px;
    color: var(--heading-color);
    width: 94%;
    max-width: 670px;
    max-height: 90%;
    overflow: hidden;
    overflow-y: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 64px;
    z-index: 6;
    display: none;
    -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.popup.dkmode .btns,
.dkmode.pop_browser .btns {
    color: #FFF
}

.popup.dkmode .bx_btn,
.dkmode.pop_browser .bx_btn {
    border-top-color: #fff
}

.popup.dkmode .bx_btn .btn,
.dkmode.pop_browser .bx_btn .btn {
    background: #fff;
    color: #000
}

@media (max-width: 767px) {

    .popup,
    .pop_browser {
        border-width: 2px
    }
}

.popup h3,
.pop_browser h3 {
    font-size: 34px;
    margin-bottom: 30px;
    text-align: center
}

.popup p,
.pop_browser p {
    padding: 0px 10px
}

.popup .bx_img,
.pop_browser .bx_img {
    display: block;
    padding: 0px 10px
}

.popup.sm,
.sm.pop_browser {
    z-index: 20;
    max-width: 360px;
    padding: 40px 37px
}

@media (max-width: 767px) {

    .popup.sm,
    .sm.pop_browser {
        padding: 30px 18px
    }
}

.popup .cont,
.pop_browser .cont {
    margin: 0 0 20px;
    text-align: center
}

.popup .cont p,
.pop_browser .cont p {
    padding: 0;
    font-size: 18px;
    font-weight: 600
}

.popup .cont p+p,
.pop_browser .cont p+p {
    margin-top: 17px
}

@media (max-width: 767px) {

    .popup .cont p,
    .pop_browser .cont p {
        font-size: 14px
    }

    .popup .cont p+p,
    .pop_browser .cont p+p {
        margin-top: 7px
    }
}

.popup .noti_box,
.pop_browser .noti_box {
    background: #222222;
    color: #ffffff;
    margin-bottom: 20px
}

.popup .noti_box.center,
.pop_browser .noti_box.center {
    text-align: center
}

.popup .noti_box p,
.pop_browser .noti_box p {
    border-bottom: 1px dotted #ffffff;
    padding: 20px 45px;
    margin: 0px
}

.popup .noti_box p:last-child,
.pop_browser .noti_box p:last-child {
    border-bottom: none
}

@media (max-width: 1279px) {

    .popup .noti_box p,
    .pop_browser .noti_box p {
        padding: 20px 30px
    }
}

@media (max-width: 767px) {

    .popup .noti_box p,
    .pop_browser .noti_box p {
        padding: 20px 10px
    }
}

.popup .noti_box em,
.pop_browser .noti_box em {
    margin-right: 8px
}

.popup .noti_box em.txt_point,
.pop_browser .noti_box em.txt_point {
    margin-right: 0
}

.popup .noti_box strong,
.pop_browser .noti_box strong {
    display: block;
    font-size: 18px;
    text-align: center
}

.popup .noti_box span,
.pop_browser .noti_box span {
    display: block
}

.popup .noti_box span.txt_point,
.pop_browser .noti_box span.txt_point {
    padding-left: 25px;
    text-indent: -25px
}

.popup .sub_txt,
.pop_browser .sub_txt {
    color: #666666;
    font-size: 12px;
    line-height: 24px;
    margin-left: 64px;
    font-weight: 600
}

.popup .ico_check,
.pop_browser .ico_check {
    min-width: 20px;
    color: #4285F4;
    vertical-align: middle;
    padding-left: 24px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_check.svg") no-repeat center left
}

.popup .col,
.pop_browser .col {
    margin: 40px 0;
    text-align: center
}

.popup .chk_box,
.pop_browser .chk_box {
    margin: 24px 0px 14px
}

.popup .btns,
.pop_browser .btns {
    padding-top: 20px;
    margin-top: 0px;
    border-top: 1px solid #222222
}

.popup .btns .bold,
.pop_browser .btns .bold {
    margin-top: 5px;
    font-weight: 600
}

.popup .btn_pop_close,
.pop_browser .btn_pop_close {
    position: absolute;
    display: block;
    width: 27px;
    height: 27px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    top: -1px;
    right: -1px;
    border: 1px solid #222222
}

.popup .btn_pop_close:before,
.pop_browser .btn_pop_close:before,
.popup .btn_pop_close:after,
.pop_browser .btn_pop_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    background-color: #222222
}

.popup .btn_pop_close:before,
.pop_browser .btn_pop_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.popup .btn_pop_close:after,
.pop_browser .btn_pop_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.popup .ico_close,
.pop_browser .ico_close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 29px;
    height: 29px;
    /*border: 1px solid #222222;*/
    border: 0;
    font-size: 0;
    line-height: 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close_new.svg") no-repeat 0 0
}

@media (max-width: 767px) {

    .popup,
    .pop_browser {
        padding: 15px
    }
}

.popup.mid,
.mid.pop_browser {
    max-width: 616px;
    padding: 40px;
    text-align: center
}

.popup.mid h3,
.mid.pop_browser h3 {
    line-height: 50px;
    font-weight: 600;
    margin-bottom: 13px
}

.popup.mid .bx_msg,
.mid.pop_browser .bx_msg {
    padding: 30px;
    background: #FFF1E6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center
}

.popup.mid .bx_msg2,
.mid.pop_browser .bx_msg2 {
    background-color: #F7F7F7
}

.popup.mid .bx_msg2 .info,
.mid.pop_browser .bx_msg2 .info {
    margin-top: 0;
    padding: 20px 30px;
    border-top: 0;
    font-weight: 600
}

.popup.mid .bx_imgtxt,
.mid.pop_browser .bx_imgtxt {
    display: table
}

.popup.mid .bx_imgtxt img,
.mid.pop_browser .bx_imgtxt img,
.popup.mid .bx_imgtxt p,
.mid.pop_browser .bx_imgtxt p {
    display: table-cell;
    vertical-align: middle;
    text-align: left
}

.popup.mid .bx_imgtxt p,
.mid.pop_browser .bx_imgtxt p {
    padding: 0 0 0 15px;
    font-weight: 600;
    font-size: 18px;
    color: #222222
}

.popup.mid .bx_msg2 .txt,
.mid.pop_browser .bx_msg2 .txt {
    text-align: left;
    font-size: 14px;
    line-height: 24px
}

.popup.mid .bx_msg2 .txt+.txt,
.mid.pop_browser .bx_msg2 .txt+.txt {
    margin-top: 6px
}

.popup.mid .bx_msg2 .ico_check,
.mid.pop_browser .bx_msg2 .ico_check,
.popup.mid .bx_msg2 span,
.mid.pop_browser .bx_msg2 span {
    line-height: 20px;
    vertical-align: middle
}

.popup.mid .bx_msg2 .ico_check,
.mid.pop_browser .bx_msg2 .ico_check {
    margin-right: 4px
}

.popup.mid .bx_msg2 .ico_check.no_txt,
.mid.pop_browser .bx_msg2 .ico_check.no_txt {
    margin-right: 0
}

.popup.mid .msg_tit,
.mid.pop_browser .msg_tit {
    font-size: 16px;
    font-weight: bold;
    padding: 0
}

.popup.mid .info,
.mid.pop_browser .info {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px dashed #222;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 400
}

.popup.mid .info .fo,
.mid.pop_browser .info .fo {
    text-align: left;
    font-size: 15px
}

.popup.mid .info .fo+.fo,
.mid.pop_browser .info .fo+.fo {
    margin-top: 2px
}

.popup.mid .info p,
.mid.pop_browser .info p {
    display: inline-block;
    padding: 0;
    vertical-align: middle
}

.popup.mid .info .red,
.mid.pop_browser .info .red {
    color: #E12537;
    font-weight: bold
}

.popup.mid .btns,
.mid.pop_browser .btns {
    margin-top: 20px
}

.popup.mid .btns .btn,
.mid.pop_browser .btns .btn {
    margin: 0;
    min-width: 147px
}

.popup.mid .btns .btn+.btn,
.mid.pop_browser .btns .btn+.btn {
    margin-left: 9px
}

.popup.mid .link,
.mid.pop_browser .link {
    display: inline-block;
    font-size: 15px;
    margin-top: 20px;
    font-weight: bold
}

@media (max-width: 767px) {

    .popup.mid,
    .mid.pop_browser {
        padding: 30px 20px
    }

    .popup.mid h3,
    .mid.pop_browser h3 {
        font-size: 20px;
        margin-bottom: 20px;
        line-height: 26px
    }

    .popup.mid .bx_msg,
    .mid.pop_browser .bx_msg {
        padding: 15px
    }

    .popup.mid .msg_tit,
    .mid.pop_browser .msg_tit {
        font-size: 14px
    }

    .popup.mid .bx_imgtxt,
    .mid.pop_browser .bx_imgtxt {
        display: block
    }

    .popup.mid .bx_imgtxt img,
    .mid.pop_browser .bx_imgtxt img {
        display: none
    }

    .popup.mid .bx_imgtxt p,
    .mid.pop_browser .bx_imgtxt p {
        display: block;
        padding: 0 0 15px 0;
        font-size: 15px;
        text-align: center
    }

    .popup.mid .bx_msg2 .info,
    .mid.pop_browser .bx_msg2 .info {
        padding: 15px
    }

    .popup.mid .bx_msg2 .txt,
    .mid.pop_browser .bx_msg2 .txt {
        text-align: left;
        line-height: 18px
    }

    .popup.mid .bx_msg2 .txt+.txt,
    .mid.pop_browser .bx_msg2 .txt+.txt {
        margin-top: 10px
    }

    .popup.mid .bx_msg2 .ico_check,
    .mid.pop_browser .bx_msg2 .ico_check,
    .popup.mid .bx_msg2 span,
    .mid.pop_browser .bx_msg2 span {
        line-height: 20px;
        vertical-align: middle
    }

    .popup.mid .info,
    .mid.pop_browser .info {
        margin-top: 10px
    }

    .popup.mid .info .fo+.fo,
    .mid.pop_browser .info .fo+.fo {
        margin-top: 10px
    }

    .popup.mid .info .ico_check,
    .mid.pop_browser .info .ico_check {
        font-size: 14px
    }

    .popup.mid .info p,
    .mid.pop_browser .info p {
        margin-left: 0;
        font-size: 13px;
        text-align: left
    }

    .popup.mid .btns,
    .mid.pop_browser .btns {
        margin-top: 10px;
        padding-top: 15px
    }

    .popup.mid .btns .btn,
    .mid.pop_browser .btns .btn {
        min-width: initial;
        width: calc(50% - 5px);
        padding: 14px 22px 14px
    }

    .popup.mid .btns .btn+.btn,
    .mid.pop_browser .btns .btn+.btn {
        margin-left: 6px
    }

    .popup.mid .link,
    .mid.pop_browser .link {
        font-size: 13px;
        margin-top: 15px
    }
}

.pop_ship{
    text-align: center;
    max-width: 700px
}

.pop_msg {
    text-align: center;
    max-width: 500px
}

.pop_msg .msg {
    padding: 30px 0;
    text-align: center;
    font-size: 16px
}

.cart_msg {
    text-align: center;
    max-width: 500px
}

.cart_msg .msg {
    padding: 30px 0;
    text-align: center;
    font-size: 16px
}

.cart_msg .notice_ico {    
    text-align: center;
    font-size: 40px;
    color: #343434;
}

.cart_msg .cart_btn button {    
    margin : 0 5px 0 5px;
}

.cart_msg .ico_close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 29px;
    height: 29px;
    /*border: 1px solid #222222;*/
    border: 0;
    font-size: 0;
    line-height: 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close_new.svg") no-repeat 0 0
}

.pop_msg .bx_icons .ico {
    display: inline-block;
    width: 48px;
    height: 48px
}

.pop_msg .bx_icons .ico img {
    width: 100%
}

.pop_msg .bx_icons .ico+.ico {
    margin-left: 18px
}

.pop_msg .btns {
    border-top: none
}

.pop_alert,
.pop_countdown {
    z-index: 100;
    max-width: 650px;
    padding: 10px 0 20px;
    text-align: center;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.pop_alert .pc_block,
.pop_countdown .pc_block {
    display: block
}

.pop_alert .tit,
.pop_countdown .tit {
    font-size: 24px;
    line-height: 1.4
}

.pop_alert .tit .txt_msg,
.pop_countdown .tit .txt_msg {
    font-size: 18px;
    color: red
}

.pop_alert .msg,
.pop_countdown .msg {
    background: #fff8f3;
    padding: 30px 60px 40px;
    margin: 30px 0 18px;
    font-size: 15px;
    font-weight: bold
}

.pop_alert .msg em,
.pop_countdown .msg em {
    color: #f74051
}

.pop_alert .msg em:last-of-type,
.pop_countdown .msg em:last-of-type {
    color: #34a5fd
}

.pop_alert .msg .f_bold,
.pop_countdown .msg .f_bold {
    display: inline-block;
    margin: 15px 0 22px;
    font-size: 18px;
    font-weight: normal
}

.pop_alert .info,
.pop_countdown .info {
    font-size: 15px;
    text-align: left;
    padding: 0 85px
}

.pop_alert .info>span,
.pop_countdown .info>span {
    margin-bottom: 10px
}

.pop_alert .info>span,
.pop_alert .info>strong,
.pop_countdown .info>span,
.pop_countdown .info>strong {
    position: relative;
    display: block
}

.pop_alert .info>span:before,
.pop_alert .info>strong:before,
.pop_countdown .info>span:before,
.pop_countdown .info>strong:before {
    content: '※';
    position: absolute;
    left: -17px
}

.pop_alert .btn.big,
.pop_countdown .btn.big {
    height: 70px;
    padding: 25px 24px;
    border-radius: 15px;
    font-size: 20px;
    background: #4285F4
}

.pop_alert .btn.big span,
.pop_countdown .btn.big span {
    font-weight: bold
}

.pop_alert .bx_btn,
.pop_countdown .bx_btn {
    margin: 15px 60px;
    padding-top: 20px;
    border-top: 1px solid #222222
}

.pop_alert .bx_btn .btn,
.pop_countdown .bx_btn .btn {
    margin-right: 20px
}

.pop_alert .bx_btn .btn:last-child,
.pop_countdown .bx_btn .btn:last-child {
    margin-right: 0
}

.pop_alert .half_area,
.pop_countdown .half_area {
    border: none;
    margin-left: 60px;
    padding-top: 0
}

.pop_alert .ico_close,
.pop_countdown .ico_close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 29px;
    height: 29px;
    /*border: 1px solid #222222;*/
    border: 0;
    font-size: 0;
    line-height: 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close_new.svg") no-repeat 0 0
}

.pop_alert .bx_img,
.pop_countdown .bx_img {
    display: block;
    position: relative;
    padding: 0px 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.pop_alert .bx_img img,
.pop_countdown .bx_img img {
    max-width: 100%
}

.pop_alert .bx_img .bx_ev_times,
.pop_countdown .bx_img .bx_ev_times {
    display: block;
    position: absolute;
    left: 112px;
    top: 156px;
    font-size: 0
}

.pop_alert .bx_img .bx_ev_times.ty2,
.pop_countdown .bx_img .bx_ev_times.ty2 {
    top: 116px
}

@media (max-width: 767px) {

    .pop_alert .bx_img .bx_ev_times.ty2,
    .pop_countdown .bx_img .bx_ev_times.ty2 {
        top: 22.5%
    }
}

.pop_alert .bx_img .bx_ev_times.bnr_add,
.pop_countdown .bx_img .bx_ev_times.bnr_add {
    top: 140px
}

@media (max-width: 767px) {

    .pop_alert .bx_img .bx_ev_times.bnr_add,
    .pop_countdown .bx_img .bx_ev_times.bnr_add {
        top: 26%
    }
}

.pop_alert .bx_img .bx_ev_times .ev_t,
.pop_countdown .bx_img .bx_ev_times .ev_t {
    display: inline-block;
    width: 84px;
    height: 48px;
    margin-left: 28px;
    font-weight: 600;
    font-size: 20px;
    line-height: 46px;
    color: #fff;
    text-align: center
}

.pop_alert .bx_img .bx_ev_times .ev_t:first-child,
.pop_countdown .bx_img .bx_ev_times .ev_t:first-child {
    margin-left: 0
}

@media (max-width: 1279px) {

    .pop_alert .bx_img .bx_ev_times,
    .pop_countdown .bx_img .bx_ev_times {
        left: 17%;
        width: 66%
    }

    .pop_alert .bx_img .bx_ev_times .ev_t,
    .pop_countdown .bx_img .bx_ev_times .ev_t {
        width: 20%;
        height: auto;
        font-size: 17px;
        margin-left: 6.5%
    }
}

@media (max-width: 767px) {

    .pop_alert .bx_img .bx_ev_times,
    .pop_countdown .bx_img .bx_ev_times {
        top: 30%;
        left: 15%;
        width: 70%
    }
}

@media (max-width: 640px) {

    .pop_alert .bx_img .bx_ev_times,
    .pop_countdown .bx_img .bx_ev_times {
        left: 13%;
        width: 74%
    }
}

@media (max-width: 540px) {

    .pop_alert .bx_img .bx_ev_times,
    .pop_countdown .bx_img .bx_ev_times {
        left: 12%;
        width: 76%
    }

    .pop_alert .bx_img .bx_ev_times .ev_t,
    .pop_countdown .bx_img .bx_ev_times .ev_t {
        font-size: 13px;
        margin-left: 6.5%;
        line-height: 38px
    }
}

@media (max-width: 440px) {

    .pop_alert .bx_img .bx_ev_times .ev_t,
    .pop_countdown .bx_img .bx_ev_times .ev_t {
        font-size: 12px;
        line-height: 28px
    }
}

@media (max-width: 360px) {

    .pop_alert .bx_img .bx_ev_times .ev_t,
    .pop_countdown .bx_img .bx_ev_times .ev_t {
        line-height: 26px
    }
}

/*
.pop_alert.event_gmxm,
.pop_countdown.event_gmxm {
    background-color: #009cff
}

.pop_alert.event_gmxm.global,
.pop_countdown.event_gmxm.global {
    background-color: #fca414
}

.pop_alert::-webkit-scrollbar,
.pop_countdown::-webkit-scrollbar {
    display: none
}
*/

@media (max-width: 1279px) {

    .pop_alert .m_block,
    .pop_countdown .m_block {
        display: inline
    }

    .pop_alert pc_block,
    .pop_countdown pc_block {
        display: block
    }
}

@media (max-width: 767px) {

    .pop_alert,
    .pop_countdown {
        padding: 20px 0 10px
    }

    .pop_alert .m_block,
    .pop_countdown .m_block {
        display: block
    }

    .pop_alert .pc_block,
    .pop_countdown .pc_block {
        display: inline
    }

    .pop_alert .tit,
    .pop_countdown .tit {
        font-size: 12px
    }

    .pop_alert .tit strong,
    .pop_countdown .tit strong {
        font-size: 16px
    }

    .pop_alert .tit .txt_msg,
    .pop_countdown .tit .txt_msg {
        font-size: 12px
    }

    .pop_alert .msg,
    .pop_countdown .msg {
        padding: 10px;
        margin: 10px 0;
        font-size: 11px
    }

    .pop_alert .msg .f_bold,
    .pop_countdown .msg .f_bold {
        margin: 8px 0 13px;
        font-size: 12px
    }

    .pop_alert .info,
    .pop_countdown .info {
        padding: 0 33px;
        font-size: 11px
    }

    .pop_alert .btn.big,
    .pop_countdown .btn.big {
        height: 40px;
        padding: 10px 0;
        font-size: 12px;
        line-height: 1.5
    }

    .pop_alert .bx_btn,
    .pop_countdown .bx_btn {
        margin: 5px 20px 0;
        padding-top: 10px
    }

    .pop_alert .bx_btn .btn,
    .pop_countdown .bx_btn .btn {
        width: 100%;
        margin: 0 0 5px;
        padding: 10px 25px;
        font-size: 12px
    }

    .pop_alert .half_area,
    .pop_countdown .half_area {
        text-align: left;
        margin: 0 10px;
        padding-top: 5px
    }
}

.pop_vidio {
    display: none
}

.pop_vidio:before {
    display: block;
    z-index: 19;
    content: '';
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6)
}

.pop_vidio .cont {
    z-index: 20;
    position: fixed;
    left: 50%;
    top: 50%;
    width: 90%;
    height: 100%;
    max-width: 900px;
    max-height: 506px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.pop_vidio .vidio {
    width: 100%;
    height: 506px
}

.pop_vidio .btn_close {
    position: absolute;
    display: #b3b3b3;
    width: 23px;
    height: 23px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    position: absolute;
    top: -38px;
    right: 0
}

.pop_vidio .btn_close:before,
.pop_vidio .btn_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 31px;
    height: 2px;
    background-color: #b3b3b3
}

.pop_vidio .btn_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.pop_vidio .btn_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

@media (max-width: 1279px) {
    .pop_vidio .cont {
        max-width: 500px;
        max-height: 281px
    }

    .pop_vidio .vidio {
        height: 281px
    }

    .pop_vidio .btn_close {
        top: -45px
    }
}

@media (max-width: 767px) {
    .pop_vidio {
        display: none !important
    }
}

html:lang(ja) .pop_noti {
    word-break: break-all
}

.pop_noti .inner {
    position: absolute;
    left: 50%;
    top: 50%;
    max-width: 610px;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    background: #fff
}

.pop_noti .content {
    overflow: hidden;
    position: relative;
    padding: 170px 40px 40px
}

.pop_noti .content::after {
    display: block;
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    width: 610px;
    height: 130px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_popnoti.png") no-repeat 0 0;
    background-size: auto 130px;
    background-position: 50% 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.pop_noti.system .content::before {
    display: block;
    z-index: 1;
    content: '';
    position: absolute;
    left: 50%;
    top: 70px;
    width: 110px;
    height: 90px;
    margin-left: -55px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_construction.png") no-repeat 0 0
}

.pop_noti .tit {
    margin-bottom: 20px;
    font-size: 34px;
    line-height: 50px;
    font-weight: 600;
    color: #4285F4
}

.pop_noti .msg {
    font-size: 18px;
    line-height: 26px;
    font-weight: 600
}

.pop_noti .bx_info {
    margin-top: 22px;
    padding: 20px 30px 29px;
    background: #F1F1F1
}

.pop_noti .bx_info .point {
    display: block;
    padding-bottom: 13px;
    font-size: 20px;
    line-height: 30px;
    color: #4285F4
}

.pop_noti .bx_info p {
    font-size: 14px;
    line-height: 20px
}

.pop_noti .ico_close {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    border-color: #fff;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close_grey.png") no-repeat 50% 50%;
    background-color: #fff;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

@media (max-width: 767px) {
    .pop_noti .inner {
        width: calc(100% - 40px)
    }

    .pop_noti .content {
        padding: 173px 24px 24px
    }

    .pop_noti.system .content::before {
        top: 65px
    }

    .pop_noti .tit {
        margin-bottom: 29px;
        font-size: 28px;
        line-height: 35px
    }

    .pop_noti .msg {
        font-size: 17px;
        line-height: 24px
    }

    .pop_noti .bx_info {
        padding: 20px 20px 23px;
        margin-top: 25px
    }

    .pop_noti .bx_info .point {
        padding-bottom: 15px;
        font-size: 17px;
        line-height: 24px
    }

    .pop_noti .bx_info p {
        font-size: 13px;
        line-height: 19px
    }
}

.pop {
    display: none
}

.pop_browser {
    display: none
}

.pop_tuto {
    display: none
}

.pop_tuto:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: fixed;
    background: rgba(0, 0, 0, 0.6);
    top: 0;
    left: 0;
    z-index: 19
}

.pop_tuto .cont {
    z-index: 20;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 900px !important;
    height: 100%;
    max-height: 506px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.pop_tuto .vidio {
    width: 100%;
    height: 100%;
    background: #000
}

.pop_tuto .btn_close {
    position: absolute;
    display: #b3b3b3;
    width: 23px;
    height: 23px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    position: absolute;
    top: -38px;
    right: 0
}

.pop_tuto .btn_close:before,
.pop_tuto .btn_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 31px;
    height: 2px;
    background-color: #b3b3b3
}

.pop_tuto .btn_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.pop_tuto .btn_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.tool_set {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0px 0px 4px
}

.ico_tooltip {
    overflow: visible;
    z-index: 1;
    display: block;
    position: relative;
    content: "?";
    width: 16px;
    height: 16px;
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-align: center;
    /*color: #ffffff;
    background: #222222;*/
    color: var(--btn-color);
    background: var(--cart-level-on-bg);
    border-radius: 25px;
    text-indent: -2px;
    cursor: pointer
}

.ico_tooltip+.tooltip {
    display: none;
    position: absolute;
    top: 25px;
    left: 0px;
    width: 290px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px;
    background: #f0f0f0;
    color: #666666;
    font-size: 13px;
    text-indent: 0px;
    text-align: left;
    font-weight: 100;
    z-index: 2
}

.lnb_tooltip {
    display: none;
    cursor: initial;
    position: absolute;
    top: -92px;
    right: 26px;
    width: auto;
    height: 90px
}

.lnb_tooltip.on {
    display: block
}

@media (max-width: 1279px) {
    .lnb_tooltip {
        right: 61px
    }
}

@media (max-width: 767px) {
    .lnb_tooltip.on {
        display: none
    }
}

.lnb_tooltip p {
    float: left;
    display: inline-block;
    width: auto;
    min-width: 134px;
    height: 90px;
    padding-top: 11px;
    line-height: 1.6;
    font-weight: 100;
    font-size: 13px;
    color: #666;
    white-space: nowrap;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tooltip.png") repeat-x 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.lnb_tooltip p strong {
    display: block;
    color: #ff7747;
    font-weight: bold
}

.lnb_tooltip p strong.key {
    display: inline-block
}

.lnb_tooltip:before {
    content: "";
    width: 37px;
    height: 90px;
    display: block;
    position: absolute;
    background: black;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tooltip_bf.png") no-repeat 0 0;
    top: 0;
    left: -37px
}

.lnb_tooltip:after {
    content: "";
    width: 51px;
    height: 90px;
    display: block;
    position: absolute;
    background: black;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tooltip_af.png") no-repeat 0 0;
    top: 0;
    right: -51px
}

.lnb_tooltip .btn_tipc {
    content: "";
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    background: black;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tooltip_btn.png") no-repeat 0 0;
    top: 34px;
    right: -25px;
    z-index: 3
}

.lnb_tooltip.ty2 p {
    padding-top: 24px;
    font-weight: 600;
    font-size: 20px;
    color: #222
}

.lnb_tooltip.ty2 p strong {
    display: inline;
    color: #000000 !important
}

.bx_notice {
    padding: 20px 0;
    font-size: 13px;
    line-height: 1.7
}

.bx_notice.gray {
    margin-top: 40px;
    padding: 30px;
    background: var(--box-bg);
    font-size: 15px
}

.bx_notice.gray .txt_point {
    text-decoration: underline
}

.bx_notice.gray dt {
    padding-bottom: 10px;
    font-weight: 600;
    font-size: 18px
}

.bx_notice.gray dd {
    position: relative;
    padding-left: 20px;
    line-height: 1.7;
    color: #999999
}

.bx_notice.gray dd:before {
    content: "˙";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    font-family: NotoSansCJK
}

.bx_notice.gray dd+dt {
    margin-top: 15px
}

.bx_notice.gray p+p {
    margin-top: 5px
}

.bx_notice h3 {
    margin-bottom: 9px
}

.bx_notice .lsty_sign a {
    text-decoration: underline
}

.bx_notice .lsty_sign li {
    padding-left: 7px;
    text-indent: -7px;
    margin-bottom: 6px
}

.bx_notice .ico_channel {
    width: 30px;
    vertical-align: middle;
}

.bx_notice .accent {
    font-weight: 600;
}

@media (max-width: 1279px) {
    .bx_notice {
        font-size: 14px;
        line-height: 1.5
    }

    .bx_notice h3 {
        font-size: 16px
    }

    .bx_notice.gray {
        margin-top: 30px;
        padding: 34px 40px;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .bx_notice {
        font-size: 12px;
        line-height: 1.5
    }

    .bx_notice.gray {
        margin-top: 40px;
        padding: 19px 20px
    }

    .bx_notice.gray dt {
        padding-bottom: 5px;
        font-size: 13px
    }

    .bx_notice.gray dd {
        margin-bottom: 6px;
        padding-left: 10px;
        font-size: 12px
    }
}

.slct_box {
    border: 1px solid #222222;
    border-top: 2px solid #222222;
    clear: both;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.slct_box li {
    float: none !important
}

.slct_box a {
    display: block;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 3.9;
    background: #ffffff;
    height: 50px;
    overflow: hidden
}

.slct_box a:hover {
    background: #f7f7f7
}

.slct_box a.on {
    color: #4285F4 !important;
    font-weight: 600
}

.bx_ico {
    padding: 26px;
    background-color: var(--bg-color);
    text-align: center;
    line-height: 1.7;
    font-size: 15px
}

.bx_ico.ty2 {
    margin-bottom: 70px
}

.bx_ico .ico {
    display: inline-block;
    vertical-align: middle;
    padding-right: 33px
}

.bx_ico .ico.ico_mail {
    width: 84px;
    height: 53px
}

.bx_ico .ico.ico_key {
    width: 69px;
    height: 52px
}

.bx_ico .ico[src*='ico_mailx.svg'] {
    width: 80px;
    height: 60px
}

.bx_ico .ico[src*='ico_mailo.svg'] {
    width: 102px;
    height: 68px
}

.bx_ico .ico[src*='ico_mail.svg'] {
    width: 77px
}

.bx_ico .ico[src*='bu_pw.svg'] {
    width: 66px
}

.bx_ico .ico[src*='ico_exclamation.svg'] {
    width: 73px;
    height: 73px
}

.bx_ico .info {
    max-width: 835px;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.7;
    text-align: left;
    font-weight: 100;
    padding-left: 20px;
    position: relative;
    border-left: 1px #d1d1d1 dotted
}

.bx_ico .info strong {
    /*color: #222222*/
    font-size: 600;
}

.bx_ico .info .red {
    color: #F52222
}

.bx_ico a {
    text-decoration: underline;
    color: #4285F4
}

@media (max-width: 1279px) {
    .bx_ico {
        font-size: 16px
    }

    .bx_ico.ty2 {
        margin-bottom: 60px
    }

    .bx_ico .ico {
        padding-right: 25px
    }

    .bx_ico .info {
        max-width: 500px;
        border-left: none;
        padding-left: 0
    }

    .bx_ico .b_close {
        display: block;
        margin: 15px auto 0
    }
}

@media (max-width: 767px) {
    .bx_ico {
        padding: 30px 15px;
        line-height: 1.3;
        font-size: 14px
    }

    .bx_ico.ty2 {
        margin-bottom: 53px
    }

    .bx_ico .ico {
        padding: 0 0 10px;
        margin: 0;
        background: none
    }

    .bx_ico .info {
        display: block;
        max-width: 100%;
        text-align: center;
        font-size: 13px;
        border-left: none
    }
}

.bx_cont,
.bx_qna {
    padding: 25px;
    background: var(--bg-color);
    border-top: 1px solid var(--table-top-border); 

}

.bx_cont.bx_ico,
.bx_ico.bx_qna {
    background: var(--bg-color);
    overflow: hidden;
    margin-bottom: 60px;
    text-align: left;
    padding: 40px
}

.bx_cont.bx_ico span,
.bx_ico.bx_qna span,
.bx_cont.bx_ico strong,
.bx_ico.bx_qna strong {
    display: block;
    float: left;
}

.bx_cont.bx_ico .ico,
.bx_ico.bx_qna .ico {
    padding-right: 40px;
    width: 80px
}

.bx_cont.bx_ico .info,
.bx_ico.bx_qna .info {
    padding-left: 40px
}

@media (max-width: 1279px) {

    .bx_cont.bx_ico,
    .bx_ico.bx_qna {
        padding: 38px 30px
    }

    .bx_cont.bx_ico .ico,
    .bx_ico.bx_qna .ico {
        padding-right: 30px
    }

    .bx_cont.bx_ico .info,
    .bx_ico.bx_qna .info {
        padding-left: 30px;
        width: calc(100% - 150px);
        max-width: 100%
    }
}

@media (max-width: 767px) {

    .bx_cont.bx_ico,
    .bx_ico.bx_qna {
        padding: 14px 3.57% 25px;
        margin-bottom: 40px;
        text-align: left
    }

    .bx_cont.bx_ico .ico,
    .bx_ico.bx_qna .ico {
        width: 42px
    }

    .bx_cont.bx_ico .info,
    .bx_ico.bx_qna .info {
        width: 100%;
        padding-left: 0px;
        text-align: left;
        font-size: 13px
    }
}

.bx_half,
.bx_step,
.bx_compare {
    width: 100%;
    position: relative;
    display: table
}

.bx_half:after,
.bx_step:after,
.bx_compare:after {
    content: "";
    display: block;
    clear: both
}

.bx_half .speci,
.bx_step .speci,
.bx_compare .speci {
    float: left;
    width: 20%;
    padding: 19px 30px 0;
    background-color: rgba(200, 200, 200, 0.3);
    margin-top: 100px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_half .speci li,
.bx_step .speci li,
.bx_compare .speci li {
    font-size: 18px;
    line-height: 62px;
    letter-spacing: -0.9px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.bx_half .bx_lst,
.bx_step .bx_lst,
.bx_compare .bx_lst {
    float: left;
    width: 39%;
    border-radius: 10px;
    margin-left: 1%
}

.bx_half .bx_lst:last-child .tit,
.bx_step .bx_lst:last-child .tit,
.bx_compare .bx_lst:last-child .tit {
    background-color: #F23656
}

.bx_half .bx_lst:last-child ul,
.bx_step .bx_lst:last-child ul,
.bx_compare .bx_lst:last-child ul {
    border: 2px solid #F23656;
    color: #F23656
}

.bx_half .bx_lst:last-child ul li:last-child,
.bx_step .bx_lst:last-child ul li:last-child,
.bx_compare .bx_lst:last-child ul li:last-child {
    border-bottom: 0
}

.bx_half .bx_lst .tit,
.bx_step .bx_lst .tit,
.bx_compare .bx_lst .tit {
    display: block;
    border-radius: 10px 10px 0 0;
    color: #ffffff;
    overflow: hidden;
    background-color: #c8c8c8;
    font-size: 38px;
    line-height: 56px;
    text-align: center;
    padding: 22px 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_half .bx_lst ul,
.bx_step .bx_lst ul,
.bx_compare .bx_lst ul {
    padding: 19px 43px 0;
    border-radius: 0 0 10px 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_half .bx_lst ul li,
.bx_step .bx_lst ul li,
.bx_compare .bx_lst ul li {
    line-height: 61px;
    text-align: center;
    border-bottom: 1px solid #C8C8C8;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.bx_half .bx,
.bx_step .bx,
.bx_compare .bx {
    position: relative;
    display: table-cell;
    width: 49%;
    border-radius: 10px
}

.bx_half .tit,
.bx_step .tit,
.bx_compare .tit {
    display: block;
    border-radius: 10px 10px 0 0;
    color: #ffffff;
    overflow: hidden
}

.bx_half .bx_temp,
.bx_step .bx_temp,
.bx_compare .bx_temp {
    display: table-cell;
    width: 2%
}

.bx_half .bx_arrow,
.bx_step .bx_arrow,
.bx_compare .bx_arrow {
    display: table-cell;
    position: relative;
    width: 2%
}

.bx_half .bx_arrow em,
.bx_step .bx_arrow em,
.bx_compare .bx_arrow em {
    position: absolute;
    display: block;
    width: 78px;
    height: 78px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin-top: 68px;
    z-index: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid #ff7747;
    border-radius: 50%;
    -webkit-box-shadow: 1px 1px 10px 3px #d1d1d1;
    box-shadow: 1px 1px 10px 3px #d1d1d1
}

.bx_half .bx_arrow em:after,
.bx_step .bx_arrow em:after,
.bx_compare .bx_arrow em:after {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 12px;
    height: 12px;
    -webkit-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    transform: translate(-50%, -50%) scale(0.85714, 1) rotate(45deg);
    margin-left: -4px;
    border-top: 6px solid #4285F4;
    border-right: 6px solid #4285F4;
    margin-left: -3px
}

@media (max-width: 1279px) {

    .bx_half .bx_arrow em,
    .bx_step .bx_arrow em,
    .bx_compare .bx_arrow em {
        width: 70px;
        height: 70px;
        margin-top: 20px
    }
}

.bx_half .bx_arrow.gray em,
.bx_step .bx_arrow.gray em,
.bx_compare .bx_arrow.gray em,
.bx_half .bx_arrow.gray em:after,
.bx_step .bx_arrow.gray em:after,
.bx_compare .bx_arrow.gray em:after {
    border-color: #c8c8c8 !important;
    -webkit-box-shadow: none;
    box-shadow: none
}

@media (max-width: 1279px) {

    .bx_half .speci,
    .bx_step .speci,
    .bx_compare .speci {
        padding: 12px 20px 0;
        margin-top: 80px
    }

    .bx_half .speci li,
    .bx_step .speci li,
    .bx_compare .speci li {
        font-size: 13px;
        line-height: 42px;
        letter-spacing: -0.65px
    }

    .bx_half .bx_lst .tit,
    .bx_step .bx_lst .tit,
    .bx_compare .bx_lst .tit {
        font-size: 24px;
        line-height: 36px;
        padding: 22px 10px
    }

    .bx_half .bx_lst ul,
    .bx_step .bx_lst ul,
    .bx_compare .bx_lst ul {
        padding: 12px 27px 0
    }

    .bx_half .bx_lst ul li,
    .bx_step .bx_lst ul li,
    .bx_compare .bx_lst ul li {
        line-height: 41px;
        font-size: 14px
    }
}

@media (max-width: 767px) {

    .bx_half .bx_temp,
    .bx_step .bx_temp,
    .bx_compare .bx_temp {
        display: none
    }
}

.bx_step .bx {
    border: 1px solid #f0f0f0
}

.bx_step .bx:first-child .tit {
    background-position: 170% 50%
}

.bx_step .bx .tit {
    width: calc(100% + 2px);
    height: 168px;
    padding: 25px 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: -1px 0px 0px -1px;
    background: #4285F4 url("//dreamgreen.co.kr/assets/ui/img/common/bg_arrow.png") no-repeat -65% 50%;
    line-height: 1.5;
    font-size: 15px
}

.bx_step .bx .tit strong {
    display: block;
    font-size: 38px
}

.bx_step .bx .cont_step {
    padding: 50px
}

.bx_step .bx h4 {
    margin-bottom: 30px
}

.bx_step .bx ol li {
    margin-bottom: 30px;
    font-size: 15px;
    padding-left: 14px;
    text-indent: -14px
}

.bx_step .bx ol li:last-child {
    margin-bottom: 0px
}

.bx_step .bx ol .link {
    margin-top: 12px;
    display: block;
    text-indent: 0px
}

.bx_step .bx dl {
    position: relative
}

.bx_step .bx dl dt {
    font-weight: 600
}

.bx_step .bx dl dd .down {
    overflow: hidden;
    padding: 50px 0;
    min-height: 150px;
    height: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 21px;
    border-top: 1px solid #222222
}

.bx_step .bx dl dd .down:first-child {
    border-top: 0
}

.bx_step .bx dl dd .down .ico_win {
    display: inline-block;
    width: 250px
}

.bx_step .bx dl dd .down .ico_win .ico {
    max-width: 41px;
    margin: 0 20px;
    vertical-align: middle
}

.bx_step .bx dl dd .down .btn {
    float: right;
    vertical-align: middle;
    display: inline-block
}

.bx_step .bx dl dd .manual {
    padding: 35px 0;
    min-height: 150px;
    height: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 18px;
    border-top: 1px solid #222222;
    position: relative
}

.bx_step .bx dl dd .manual:before {
    display: block;
    position: absolute;
    top: -11px;
    left: 50%;
    -webkit-transform: translate(-11px, 0);
    -ms-transform: translate(-11px, 0);
    transform: translate(-11px, 0);
    background: #222222;
    width: 22px;
    height: 22px;
    border-radius: 11px;
    content: ""
}

.bx_step .bx dl dd .manual:after {
    top: 0px;
    left: 50%;
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
    -ms-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
    transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
    margin-top: -1px;
    border-top: none;
    border-left: none;
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff
}

.bx_step .bx dl dd .manual:first-child {
    border-top: 0
}

.bx_step .bx dl dd .manual:first-child:after,
.bx_step .bx dl dd .manual:first-child:before {
    display: none
}

.bx_step .bx dl dd .manual .ico_mul {
    display: inline-block;
    vertical-align: middle;
    width: 110px;
    margin: 0 30px 0 20px
}

.bx_step .bx dl dd .manual .ico_mul .ico {
    width: 100%;
    max-height: 85px
}

.bx_step .bx dl dd .manual .ico_mul .ico[src*="bu_step2"],
.bx_step .bx dl dd .manual .ico_mul .ico[src*="bu_step4"] {
    margin-left: 7px
}

.bx_step .bx dl dd .manual .txt {
    vertical-align: middle;
    display: inline-block;
    width: calc(100% - 170px)
}

.bx_step .bx dl dd+dt {
    margin-top: 10px
}

.bx_step .bx .info {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 50px 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_step .bx .info .link {
    color: #4285F4
}

@media (max-width: 1279px) {
    .bx_step .bx .tit {
        height: 160px;
        padding: 15px 20px;
        font-size: 14px
    }

    .bx_step .bx .tit strong {
        font-size: 30px
    }

    .bx_step .bx .cont_step {
        padding: 35px 17px
    }

    .bx_step .bx .info {
        padding: 0 20px 50px
    }

    .bx_step .bx dl dd .down {
        padding: 40px 0;
        min-height: 120px;
        font-size: 16px
    }

    .bx_step .bx dl dd .down .ico_win {
        width: calc(100% - 110px)
    }

    .bx_step .bx dl dd .down .ico_win .ico {
        max-width: 33px;
        margin: 0 4%
    }

    .bx_step .bx dl dd .manual {
        padding: 30px 0;
        min-height: 120px;
        font-size: 16px
    }

    .bx_step .bx dl dd .manual .ico_mul {
        width: 80px;
        margin: 0 45px 0 0
    }

    .bx_step .bx dl dd .manual .txt {
        width: calc(100% - 130px)
    }
}

@media (max-width: 767px) {
    .bx_step .bx {
        display: block;
        width: 100%
    }

    .bx_step .bx .tit {
        min-height: 80px;
        height: auto;
        padding: 15px;
        line-height: 1.3;
        background-image: none
    }

    .bx_step .bx .tit strong {
        font-size: 18px;
        margin-bottom: 10px
    }

    .bx_step .bx .cont_step {
        padding: 25px 6.25%
    }

    .bx_step .bx .cont_step ol br {
        display: none
    }

    .bx_step .bx .info {
        position: relative;
        width: 100%;
        padding: 20px 25px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        line-height: 1;
        min-height: 75px
    }

    .bx_step .bx dl {
        min-height: unset
    }

    .bx_step .bx dl dd .down {
        padding: 20px 0;
        min-height: 75px;
        font-size: 14px
    }

    .bx_step .bx dl dd .down .ico_win .ico {
        max-width: 25px
    }

    .bx_step .bx dl dd .manual {
        padding: 20px 0;
        min-height: 75px;
        line-height: 1.3;
        font-size: 14px
    }

    .bx_step .bx dl dd .manual .ico_mul {
        width: 60px;
        margin: 0 40px 0 0
    }

    .bx_step .bx dl dd .manual .txt {
        width: calc(100% - 110px)
    }

    .bx_step .bx:first-child {
        position: relative;
        margin-bottom: 32px
    }

    .bx_step .bx:first-child:after {
        top: 100%;
        left: 50%;
        background: none;
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 13px;
        height: 13px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: -5px;
        border-top: none;
        border-left: none;
        border-right: 4px solid #4285F4;
        border-bottom: 4px solid #4285F4;
        -webkit-transform: translate(-50%, 8px) rotate(45deg);
        -ms-transform: translate(-50%, 8px) rotate(45deg);
        transform: translate(-50%, 8px) rotate(45deg)
    }
}

.bx_compare {
    margin: 80px 0
}

.bx_compare .tit {
    font-size: 36px;
    padding: 36px 40px;
    line-height: 1.3
}

.bx_compare .bx {
    background-color: #ffffff;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #f3f3f3
}

.bx_compare .bx .tit {
    background: none;
    background-color: #c8c8c8;
    -webkit-box-shadow: none;
    box-shadow: none
}

.bx_compare .bx ul {
    padding: 30px 20px;
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 0 0 10px 10px
}

.bx_compare .bx ul li {
    padding: 8px 0;
    color: #666666
}

.bx_compare .bx ul del,
.bx_compare .bx ul strike {
    font-size: 15px;
    color: #999999
}

.bx_compare .bx ul strong {
    font-size: 15px;
    font-weight: 100;
    color: #222222;
    text-indent: -21px
}

.bx_compare .bx ul strong:before {
    display: none;
    margin-right: 0
}

.bx_compare .bx:last-child {
    background: #ffffff;
    -webkit-box-shadow: 1px 1px 15px #d1d1d1;
    box-shadow: 1px 1px 15px #d1d1d1
}

.bx_compare .bx:last-child ul strong {
    color: #4285F4;
    font-weight: 600
}

.bx_compare .bx:last-child ul strong:before {
    content: "✓";
    display: inline-block;
    margin-right: 5px
}

.bx_compare .bx:last-child li {
    color: #222222
}

@media (max-width: 1279px) {
    .bx_compare {
        margin: 70px 0
    }

    .bx_compare .tit {
        padding: 24px 25px;
        text-align: center;
        font-size: 24px;
        background-size: 200px !important
    }

    .bx_compare .bx ul {
        font-size: 13px;
        padding: 22px 10px
    }

    .bx_compare .bx ul del,
    .bx_compare .bx ul strike,
    .bx_compare .bx ul strong {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .bx_compare {
        display: none
    }

    .bx_compare+.tbl {
        margin-top: 30px
    }
}

.bx_compare.col3 .bx {
    width: 32%
}

@media (max-width: 1279px) {
    .bx_compare.col3 .bx {
        width: 31.6%
    }

    .bx_compare.col3 .bx_arrow {
        width: 2.6%
    }
}

.bx_ipt {
    position: relative;
    height: auto;
    border-radius: 6px
}

.bx_ipt .holder {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    padding: 0px 20px;
    line-height: 2.8;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left
}

.bx_ipt.err {
    position: relative
}

.bx_ipt.err .ipt {
    border: 1px solid #f52222;
    -webkit-box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    color: #f52222;
    caret-color: #f52222;
    padding-right: 37px;
    background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_error.png") no-repeat 95% 50%;
    background-size: 18px
}

.pay.err {
    position: relative
}

.pay.err .market_quantity {
    border: 1px solid #f52222;
    -webkit-box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    color: #f52222;
    caret-color: #f52222;
    padding-right: 37px;
    background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_error.png") no-repeat 95% 50%;
    background-size: 18px
}

@media (max-width: 1279px) {
    .bx_ipt {
        font-size: 16px
    }

    .bx_ipt .holder {
        font-size: 15px
    }
}

@media (max-width: 767px) {
    .bx_ipt {
        height: 40px;
        font-size: 13px
    }

    .bx_ipt .holder {
        font-size: 13px;
        line-height: 2.6;
        padding: 0px 10px
    }

    .bx_ipt.err .ipt {
        padding-right: 32px;
        background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_error.png") no-repeat 95.5% 50%;
        background-size: 18px
    }
}

.c_fill {
    position: relative
}

.c_fill .txt_alert {
    text-align: left
}

.c_fill .ipt+span {
    display: none
}

.c_fill .ipt:disabled {
    border: 1px solid #dddddd !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.c_fill .ipt:hover {
    border: 1px solid #222222
}

.c_fill .ipt:active,
.c_fill .ipt:focus {
    border: 1px solid #4285F4;
    caret-color: #4285F4;
    -webkit-box-shadow: 0px 0px 5px rgba(248, 121, 16, 0.2);
    box-shadow: 0px 0px 5px rgba(248, 121, 16, 0.2)
}

.c_fill .ipt.on {
    display: block;
    position: relative;
    border: 1px solid #4285F4;
    -webkit-box-shadow: 0px 0px 5px rgba(248, 121, 16, 0.2);
    box-shadow: 0px 0px 5px rgba(248, 121, 16, 0.2);
    caret-color: #4285F4;
    padding-right: 37px;
    background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_join.png") no-repeat 95% 50%;
    background-size: 18px
}

@media (max-width: 767px) {
    .c_fill .ipt.on {
        padding-right: 32px;
        background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_join.png") no-repeat 95.5% 50%;
        background-size: 18px
    }
}

.c_fill .ipt.fill {
    background-color: var(--input-bg) !important
}

.bx_textarea {
    position: relative
}

.bx_textarea textarea {
    border: 1px solid #dddddd;
    background: var(--input-bg);
    color: var(--heading-color);
    resize: none;
    border-radius: 5px;
    width: 100%;
    height: 292px;
    padding: 13px 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    line-height: 1.7
}

.bx_textarea textarea::-webkit-input-placeholder {
    color: #999999
}

.bx_textarea textarea::-moz-placeholder {
    color: #999999
}

.bx_textarea textarea:-ms-input-placeholder {
    color: #999999
}

.bx_textarea textarea::-ms-input-placeholder {
    color: #999999
}

.bx_textarea textarea::placeholder {
    color: #999999
}

.bx_textarea textarea:focus {
    outline: none;
    border-color: #222222
}

.bx_textarea .holder {
    padding: 6px 20px;
    color: #999999;
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    line-height: 1.7
}

@media (max-width: 1279px) {

    .bx_textarea textarea,
    .bx_textarea .holder {
        font-size: 16px;
        padding: 6px 12px
    }

    .bx_textarea textarea {
        height: 220px
    }
}

@media (max-width: 767px) {

    .bx_textarea textarea,
    .bx_textarea .holder {
        font-size: 13px;
        padding: 4px 12px
    }

    .bx_textarea textarea {
        height: 163px;
        color: var(--heading-color);
    }
}

.bx_unit {
    width: 200px;
    min-height: 153px;
    padding: 25px 0px 0px;
    display: inline-block;
    position: relative;
    background: #fcfcfc;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    overflow: hidden
}

.bx_unit .ico_pro {
    height: 60px
}

.bx_unit .ico_pro+strong {
    margin-bottom: 25px
}

.bx_unit .ico_web {
    content: "";
    width: 24px;
    height: 12px;
    display: inline-block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_web.svg") no-repeat 0 0;
    margin: 0 0 0 4px;
    font-size: 0;
    line-height: 20px;
    vertical-align: top
}

.bx_unit .desc {
    width: 100%;
    height: 157px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #ffffff;
    margin-top: 25px;
    padding: 0 20px;
    border-radius: 0px 0px 10px 10px
}

.bx_unit .desc strong {
    margin: 24px 0px 10px
}

.bx_unit .desc span {
    font-size: 13px
}

@media (max-width: 1279px) {
    .bx_unit .desc strong {
        font-size: 18px
    }

    .bx_unit .desc span {
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical
    }
}

.bx_unit span {
    display: block
}

.bx_unit strong {
    display: block;
    margin-top: 25px;
    line-height: 1.2
}

.bx_unit .link span {
    display: inline-block;
    vertical-align: middle
}

.bx_unit .more {
    content: "";
    width: 48px;
    height: 48px;
    display: block;
    position: absolute;
    background: none;
    font-size: 13px;
    right: 0px;
    bottom: 0px
}

.bx_unit .more em {
    position: absolute;
    width: auto;
    right: 10px;
    bottom: 3px;
    z-index: 2;
    font-size: 15px
}

.bx_unit .more:before {
    content: "";
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    background: none;
    bottom: 0px;
    right: 0px;
    border-bottom: 48px solid #ffffff;
    border-left: 48px solid transparent
}

.wrap_cardunit {
    width: 1269px;
    margin: 0 -15px
}

.wrap_cardunit::after {
    display: block;
    clear: both;
    content: ""
}

@media (max-width: 1279px) {
    .wrap_cardunit {
        width: auto;
        margin: 0 -10px
    }
}

@media (max-width: 767px) {
    .wrap_cardunit {
        margin: 0
    }

}

.bx_cardunit {
    float: left;
    position: relative;
    width: 393px;
    height: 388px;
    padding: 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 10px;
    border: 1px solid #E5E5E5;
    margin: 0 15px 30px;
    margin-bottom: 30px;
    font-size: 0
}

.bx_cardunit.dis_none {
    display: none !important
}

.bx_cardunit .package {
    height: 50px
}

.bx_cardunit .package .icon {
    overflow: hidden;
    width: 38px;
    height: 38px;
    border-radius: 10px
}

.bx_cardunit.free .slct_wrap .slct_trg2 {
    color: #666;
    cursor: default
}

.bx_cardunit.free .slct_wrap .slct_trg2::after {
    display: none
}

.bx_cardunit.free .bt .txt_lg {
    font-size: 22px
}

.bx_cardunit .icon {
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 15px
}

.bx_cardunit .icon+.icon {
    margin-left: 8px
}

.bx_info .card {
    display: inline-block;
    width: 80px;
}

.bx_info .card+.card {
    margin-left: 8px
}

.bx_cardunit .card {
    display: inline-block;
    width: 50px;
}

.bx_cardunit .card+.card {
    margin-left: 8px
}

.bx_cardunit .lab {
    display: block;
    margin-top: 20px;
    font-weight: 600;
    font-size: 22px;
    line-height: 33px
}

.bx_cardunit .txt {
    display: block;
    margin-top: 12px;
    font-size: 15px;
    line-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.bx_cardunit .links {
    margin-top: 8px;
    font-size: 0
}

.bx_cardunit .links .cd_link {
    line-height: 20px;
    font-size: 14px;
    color: #4285F4;
    font-weight: 600
}

.bx_cardunit .links .cd_link::before {
    display: inline-block;
    content: '';
    width: 1px;
    height: 12px;
    margin: 0 10px;
    background: #C8C8C8;
    vertical-align: middle
}

.bx_cardunit .links .cd_link:first-child::before {
    display: none
}

.bx_cardunit .slct_wrap {
    z-index: 2;
    position: relative;
    margin-top: 30px;
    border: 1px solid #C8C8C8;
    border-radius: 5px
}

.bx_cardunit .slct_wrap .slct_trg2 {
    display: block;
    position: relative;
    height: 38px;
    padding: 0 30px 0 20px;
    font-size: 15px;
    line-height: 38px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.bx_cardunit .slct_wrap .slct_trg2::after {
    display: inline-block;
    content: '';
    position: absolute;
    right: 15px;
    top: 6px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/arr_down.svg") no-repeat 0 0;
    width: 24px;
    height: 24px
}

.bx_cardunit .slct_wrap .slct_box2 {
    display: none;
    overflow: hidden;
    position: absolute;
    left: -1px;
    top: 39px;
    width: 100%;
    padding: 10px 0;
    background: var(--input-bg);
    border: 1px solid #C8C8C8;
    border-width: 0 1px 1px 1px;
    border-radius: 0 0 20px 20px
}

.bx_cardunit .slct_wrap .slct_box2 a {
    display: block;
    padding: 7px 19px;
    text-align: left;
    font-weight: 100;
    font-size: 15px
}

.bx_cardunit .slct_wrap .slct_box2 a:hover {
    background: #F7F7F7;
    font-weight: 600
}

.bx_cardunit .slct_wrap .slct_box2 a.on {
    color: inherit;
    background: #F7F7F7;
    font-weight: 600
}

.bx_cardunit .slct_wrap.on {
    border-bottom-width: 0;
    border-radius: 20px 20px 0 0
}

.bx_cardunit .slct_wrap.on .slct_trg2 {
    height: 39px
}

.bx_cardunit .slct_wrap.single .slct_trg2 {
    cursor: default
}

.bx_cardunit .slct_wrap.single .slct_trg2::after {
    display: none
}

.bx_cardunit .slct_wrap.single.on .slct_box2 {
    display: none !important
}

.bx_cardunit .bt {
    overflow: hidden;
    margin-top: 30px;
    height: 44px;
    vertical-align: middle
}

.bx_cardunit .bt .txt_lg {
    display: block;
    float: left;
    font-size: 26px;
    font-weight: 600;
    line-height: 44px
}

.bx_cardunit .bt .txt_sm {
    display: block;
    float: left;
    margin-left: 10px;
    font-size: 14px;
    font-weight: 600;
    line-height: 44px;
    color: #F52222
}

.bx_cardunit .bt .btn {
    float: right;
    font-size: 17px;
    padding: 13px 30px 14px
}

.bx_cardunit .bx_os {
    position: absolute;
    top: 26px;
    right: 26px;
    font-size: 0
}

.bx_cardunit .bx_os .w_grp {
    display: inline-block
}

.bx_cardunit .bx_os .w_grp:first-child .btns_os {
    margin-left: 0
}

.bx_cardunit .btn_os {
    display: inline-block;
    position: relative;
    width: 22px;
    height: 22px;
    margin-left: 30px;
    font-size: 0;
    line-height: 0;
    vertical-align: top
}

.bx_cardunit .btn_os:hover::before {
    display: inline-block;
    content: '';
    position: absolute;
    bottom: -13px;
    left: 50%;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 8px solid #343434;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.bx_cardunit .btn_os:hover .tooltip {
    display: block;
    position: absolute;
    left: 50%;
    bottom: -43px;
    padding: 6px 10px;
    background: #343434;
    border-radius: 4px;
    font-size: 12px;
    line-height: 18px;
    color: #fff;
    white-space: nowrap;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.bx_cardunit .btn_os .tooltip {
    display: none
}

.bx_cardunit .btn_pc {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_down_pc2.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_pc:hover {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_down_pc2_on.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_win {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win2.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_win:hover {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win2_on.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_play {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_googleplay2.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_play:hover {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_googleplay2_on.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_app {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_iApp2.svg") no-repeat 50% 50%
}

.bx_cardunit .btn_app:hover {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_iApp2_on.svg") no-repeat 50% 50%
}

.bx_cardunit.third .popup,
.bx_cardunit.third .pop_browser {
    left: auto;
    right: 0
}

.bx_cardunit .popup,
.bx_cardunit .pop_browser {
    position: absolute;
    width: 450px;
    padding: 40px;
    max-height: none;
    z-index: 5;
    top: 40px;
    left: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    text-align: center;
    font-size: 18px;
    color: #222222
}

.bx_cardunit .popup .bx_dw,
.bx_cardunit .pop_browser .bx_dw {
    display: inline-block;
    width: 160px;
    margin-left: 24px;
    text-align: center
}

.bx_cardunit .popup .bx_dw:first-child,
.bx_cardunit .pop_browser .bx_dw:first-child {
    margin-left: 0
}

.bx_cardunit .popup .bx_dw img,
.bx_cardunit .pop_browser .bx_dw img {
    width: 61px
}

.bx_cardunit .popup .bx_dw span,
.bx_cardunit .pop_browser .bx_dw span {
    display: block;
    margin: 14px auto 24px;
    font-size: 13px
}

.bx_cardunit .popup .link,
.bx_cardunit .pop_browser .link {
    display: block;
    clear: both;
    content: "";
    text-align: left;
    display: block;
    border-top: 1px solid #222222;
    margin-top: 20px;
    padding-top: 14px
}

.bx_cardunit .popup .link span,
.bx_cardunit .pop_browser .link span {
    display: inline;
    margin-right: 5px
}

.bx_cardunit .popup .txt_noti,
.bx_cardunit .pop_browser .txt_noti {
    display: block;
    border-top: 1px solid #222222;
    margin-top: 20px;
    padding: 14px 0 0;
    text-align: left
}

@media (max-width: 1279px) {
    .bx_cardunit {
        width: calc(50% - 20px);
        height: auto;
        margin: 0 10px 30px
    }

    .bx_cardunit .txt {
        font-size: 14px;
        line-height: 20px
    }

    .bx_cardunit .bt {
        height: auto;
        margin-top: 20px
    }

    .bx_cardunit .bt .txt_lg,
    .bx_cardunit .bt .txt_sm {
        display: inline-block;
        float: none;
        vertical-align: top;
        line-height: 38px
    }

    .bx_cardunit .bt .btn {
        display: block;
        float: none;
        margin-top: 20px;
        padding: 14px 24px 15px;
        font-size: 16px;
        border-radius: 30px
    }

    .bx_cardunit .btn_os:hover::before {
        display: none
    }

    .bx_cardunit .btn_os:hover .tooltip {
        display: none
    }

    .bx_cardunit.third .popup,
    .bx_cardunit.third .pop_browser,
    .bx_cardunit .popup,
    .bx_cardunit .pop_browser {
        width: 90% !important;
        max-height: 80%;
        position: fixed;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        margin-top: 22px;
        padding: 40px;
        text-align: center
    }

    .bx_cardunit.third .popup .bx_dw,
    .bx_cardunit.third .pop_browser .bx_dw,
    .bx_cardunit .popup .bx_dw,
    .bx_cardunit .pop_browser .bx_dw {
        width: 30%;
        margin: 0 1%
    }

    .bx_cardunit .popup .link,
    .bx_cardunit .pop_browser .link {
        margin-top: 30px;
        padding-top: 20px
    }

    .bx_cardunit .popup .link span,
    .bx_cardunit .pop_browser .link span {
        display: inline
    }

    .bx_cardunit .popup .bx_dw span,
    .bx_cardunit .pop_browser .bx_dw span {
        margin: 20px auto 28px
    }

    .bx_info .card {
        width: 56px;
    }
}

@media (max-width: 767px) {
    .bx_cardunit {
        float: none;
        width: 100%;
        margin: 0 0 24px
    }

    .bx_cardunit .txt {
        overflow: initial;
        text-overflow: initial;
        white-space: initial
    }

    .bx_cardunit .bt .btn {
        padding: 16px 24px;
        font-size: 18px;
        border-radius: 30px
    }

    .bx_cardunit.third .popup,
    .bx_cardunit.third .pop_browser,
    .bx_cardunit .popup,
    .bx_cardunit .pop_browser {
        width: 87.5% !important;
        max-width: inherit;
        padding: 30px 20px
    }

    .bx_cardunit.third .popup .bx_dw,
    .bx_cardunit.third .pop_browser .bx_dw,
    .bx_cardunit .popup .bx_dw,
    .bx_cardunit .pop_browser .bx_dw {
        display: block;
        width: auto;
        margin: 0
    }

    .bx_cardunit.third .popup .bx_dw span,
    .bx_cardunit.third .pop_browser .bx_dw span,
    .bx_cardunit .popup .bx_dw span,
    .bx_cardunit .pop_browser .bx_dw span {
        margin: 0 auto;
        font-size: 14px
    }

    .bx_cardunit.third .popup .bx_dw .btn,
    .bx_cardunit.third .pop_browser .bx_dw .btn,
    .bx_cardunit .popup .bx_dw .btn,
    .bx_cardunit .pop_browser .bx_dw .btn {
        margin: 20px auto 30px
    }

    .bx_cardunit.third .popup .bx_dw:last-child .btn,
    .bx_cardunit.third .pop_browser .bx_dw:last-child .btn,
    .bx_cardunit .popup .bx_dw:last-child .btn,
    .bx_cardunit .pop_browser .bx_dw:last-child .btn {
        margin-bottom: 0
    }

    .bx_cardunit.third .popup img,
    .bx_cardunit.third .pop_browser img,
    .bx_cardunit .popup img,
    .bx_cardunit .pop_browser img {
        display: none
    }

    .bx_cardunit.third .popup .link,
    .bx_cardunit.third .pop_browser .link,
    .bx_cardunit .popup .link,
    .bx_cardunit .pop_browser .link {
        margin-top: 0
    }

    .bx_info .card {
        width: 90px;
    }
}

.has_thumbu {
    margin: 0 -20px
}

.thumb_ubox {
    overflow: hidden;
    margin-bottom: -30px;
    padding: 0 20px;
    font-size: 0
}

.thumb_ubox li {
    float: left;
    width: 396px;
    height: 407px;
    margin-left: 26px;
    margin-bottom: 30px
}

.thumb_ubox li:first-child,
.thumb_ubox li:nth-child(3n+1) {
    margin-left: 0
}

.thumb_ubox .thumb_unit {
    display: block;
    overflow: hidden;
    border-radius: 12px
}

.thumb_ubox .thumb_unit:hover,
.thumb_ubox .thumb_unit:active {
    -webkit-box-shadow: 1px 18px 18px rgba(0, 0, 0, 0.14);
    box-shadow: 1px 18px 18px rgba(0, 0, 0, 0.14)
}

.thumb_ubox .thumb_unit .top {
    overflow: hidden;
    position: relative;
    height: 223px;
    background: #E4E4E4;
    text-align: center;
    border-radius: 12px 12px 0 0
}

.thumb_ubox .thumb_unit img {
    display: block;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.thumb_ubox .thumb_unit .desc {
    overflow: hidden;
    height: 184px;
    padding: 0 24px;
    background: var(--item-box-bg);
    border: 1px solid var(--item-box-border);
    border-radius: 0 0 12px 12px;
    border-top: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.thumb_ubox .thumb_unit .desc strong {
    display: block;
    margin-top: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 24px;
    line-height: 32px;
    max-height: 64px;
    min-height: 40px
}

.thumb_ubox .thumb_unit .desc span {
    display: block;
    /*margin-top: 12px;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 14px;
    line-height: 22px;
    max-height: 44px;
    min-height: 32px;
    color: #999
}

.thumb_ubox .thumb_unit .desc .sale {
    display: inline-block;
    margin-right: 2px;
    margin-left: 1px;
    font-size: 23px;
    color: #e63740;
    vertical-align: top;
}

.thumb_ubox .desc .prices {
    padding: 0.5em 0 0.5em 0;
}

.thumb_ubox .desc .prices .dc_per {
    float: left;
}

.thumb_ubox .desc .tags .tag {
    float: left;
    padding-right: 2px;
}

.thumb_ubox .desc .tags .tag .tag_per,
.thumb_ubox .desc .tags .tag .tag_buy {
    font-size: 14px;
}

.thumb_ubox .desc .prices .dc_per {
    font-size: 14px;
    color: #e53c3a;
    padding-right: 2em;
}

.thumb_ubox .desc .prices .sale_price {
    float: left;
    padding-right: 0.5em;
    font-size: 20px;
    font-weight: 600;
    color: #000;
}

.thumb_ubox .desc .prices .ori_price {
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
}

.thumb_ubox .desc .tags .ico_bar {
    float: left;
    display: inline-block;
    position: relative;
    top: -1px;
    width: 1px;
    height: 12px;
    margin: 8px 10px 0 10px;
    background: #ebebeb;
    vertical-align: middle;
}

@media (max-width: 1279px) {
    .thumb_ubox {
        margin-bottom: -24px
    }

    .thumb_ubox li {
        width: 50%;
        height: auto;
        margin-left: 0;
        margin-bottom: 24px
    }

    .thumb_ubox li:first-child .thumb_unit,
    .thumb_ubox li:nth-child(2n+1) .thumb_unit {
        margin-left: 0
    }

    .thumb_ubox li .thumb_unit {
        margin-left: 24px
    }

    .thumb_ubox li .thumb_unit:hover,
    .thumb_ubox li .thumb_unit:active {
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .thumb_ubox li .thumb_unit .top {
        height: 200px
    }

    .thumb_ubox li .thumb_unit .desc span {
        /*margin-top: 11px*/
    }
}

@media (max-width: 767px) {
    .thumb_ubox {
        margin-bottom: -20px
    }

    .thumb_ubox li {
        float: none;
        width: 100%;
        height: auto;
        margin-left: 0;
        margin-bottom: 20px
    }

    .thumb_ubox li:first-child,
    .thumb_ubox li:nth-child(3n+1) {
        margin-left: 0
    }

    .thumb_ubox li .thumb_unit {
        margin-left: 0
    }

    .thumb_ubox li .thumb_unit .top {
        height: auto
    }

    .thumb_ubox li .thumb_unit .top img {
        position: static;
        top: 0;
        left: 0;
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    .thumb_ubox li .thumb_unit .desc span {
        /*margin-top: 12px*/
        margin-top: 2px
    }

    .thumb_ubox .thumb_unit .desc span {
        min-height: 10px;
    }
}

.bx_robot {
    margin-top: 20px
}

.thumlist {
    padding: 25px 0;
    margin-bottom: 40px;
    border-top: 1px solid #222222;
    border-bottom: 1px solid #f0f0f0
}

.thumlist dl {
    display: table
}

.thumlist dt,
.thumlist dd {
    display: table-cell;
    word-break: break-all;
    vertical-align: middle
}

@media (max-width: 767px) {

    .thumlist dt,
    .thumlist dd {
        font-size: 16px
    }
}

@media (max-width: 767px) {

    .thumlist dt,
    .thumlist dd {
        font-size: 13px
    }
}

.thumlist dt {
    width: 125px
}

@media (max-width: 767px) {
    .thumlist dt {
        width: 35%
    }
}

.thumlist dd {
    padding-left: 20px;
    color: #666
}

@media (max-width: 767px) {
    .thumlist {
        margin-bottom: 30px
    }
}

/*마켓리스트 시작*/

.has_market_thumbu {
    margin: 0 -20px
}

.market_thumb_ubox {
    overflow: hidden;
    margin-bottom: -30px;
    padding: 0 20px;
    font-size: 0
}

.market_thumb_ubox li {
    float: left;
    width: 396px;
    height: 407px;
    margin-left: 26px;
    margin-bottom: 30px
}

.market_thumb_ubox li:first-child,
.market_thumb_ubox li:nth-child(3n+1) {
    margin-left: 0
}

.market_thumb_ubox .thumb_unit {
    display: block;
    overflow: hidden;
    border-radius: 12px
}

.market_thumb_ubox .thumb_unit:hover,
.market_thumb_ubox .thumb_unit:active {
    -webkit-box-shadow: 1px 18px 18px rgba(0, 0, 0, 0.14);
    box-shadow: 1px 18px 18px rgba(0, 0, 0, 0.14)
}

.market_thumb_ubox .thumb_unit .top {
    overflow: hidden;
    position: relative;
    height: 223px;    
    text-align: center;
    border-radius: 12px 12px 0 0;
    background: var(--item-box-bg);
    border: 1px solid var(--item-box-border);
}

.market_thumb_ubox .thumb_unit img {
    display: block;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.market_thumb_ubox .thumb_unit .desc {
    overflow: hidden;
    height: 184px;
    padding: 0 24px;
    border-radius: 0 0 12px 12px;
    border-top: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: var(--item-sub-box-bg);
    border: 1px solid var(--item-box-border);
}

.market_thumb_ubox .thumb_unit .desc strong {
    display: block;
    margin-top: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 24px;
    line-height: 32px;
    max-height: 64px;
    min-height: 40px
}

.market_thumb_ubox .thumb_unit .desc span {
    display: block;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    font-size: 14px;
    line-height: 22px;
    max-height: 44px;
    min-height: 32px;
    color: var(--item-sub_txt);
}

.market_thumb_ubox .thumb_unit .desc .sale {
    display: inline-block;
    margin-right: 2px;
    margin-left: 1px;
    font-size: 23px;
    color: #e63740;
    vertical-align: top;
}

.market_thumb_ubox .desc .prices {
    padding: 2px 0 0 0;
}

.market_thumb_ubox .desc .prices .dc_per {
    float: left;
}

.market_thumb_ubox .desc .tags .tag {
    float: left;
    padding-right: 2px;
}

.market_thumb_ubox .desc .tags .tag .tag_per,
.market_thumb_ubox .desc .tags .tag .tag_buy,
.market_thumb_ubox .desc .tags .tag .tag_ship {
    font-size: 14px;
}

.market_thumb_ubox .desc .prices .dc_per {
    font-size: 14px;
    color: #e53c3a;
    padding-right: 2em;
}

.market_thumb_ubox .desc .prices .sale_price {
    float: left;
    padding-right: 0.5em;
    font-size: 20px;
    font-weight: 600;
    color: var(--item-price);
}

.market_thumb_ubox .desc .prices .ori_price {
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
}

.market_thumb_ubox .desc .tags .ico_bar {
    float: left;
    display: inline-block;
    position: relative;
    top: -1px;
    width: 1px;
    height: 12px;
    margin: 8px 10px 0 10px;
    background: #ebebeb;
    vertical-align: middle;
}

.market .bx_sort .sort i{
    color:var(--emp)
}

.bx_ico .ad_info_ico {
    font-size: 30px;
    color: var(--intranet-color);
    display: inline-block;
    vertical-align: middle;
    padding-right: 50px;
    float: left;
}

.bx_ico .notice_ico {
    font-size: 60px;
    display: inline-block;
    vertical-align: middle;
    padding-right: 50px;
}

.bx_ico .ci_ico {
    display: inline-block;
    vertical-align: middle;
    padding-right: 20px;
    float: left;
}

.bx_ico .ci_titlehny {
    font-size: 16px;
    font-weight: 600;
    color: var(--item-sub_txt);
}

.bx_ico .ci_title {
    font-size: 18px;
    font-weight: 600;
}

.bx_ico .ci_info {
    padding-left: 40px;
    line-height: 2;
}

.bx_ico .ci_img {
    width: 90%;
    border: 1px solid var(--box-border);
}

.bx_ico .ci_down {
    vertical-align: middle;
    padding: 10px 0 0 0;
}

.bx_ico .ci_down li i {
    padding: 0 8px 0 8px;
}

.bx_ico .ci_down a {
    text-decoration: none;
    color: var(--heading-color);
    font-weight: 600;
}

.sub_f .ci_info_box {
    color: var(--heading-color);
    margin: -70px 50px 0 40px;
}

.sub_f .ci_info_txt {
    line-height: 2;
    font-size: 15px;
}

.sub_f .ci_info_box .ci_info_txt .brand-r {
    vertical-align: top;
    font-size: 10px;
    margin: -2px 4px 0 1px;
}

.bx_qna .notice_ico {
    font-size: 30px;
    display: inline-block;
    vertical-align: middle;
    padding-right: 50px;
}

.bx_maket_pay .pay .market_select {
    width: 220px;
    height: 40px;
    margin-right: 0;
    color: var(--heading-color);
}

#user_zip {
    width: 30%;
    float: left;
    margin-bottom: 1%;
}
#user_addr1 {
    width: 67.5%;
    margin-bottom: 1%;
}
#user_addr2 {
    width: 98.9%;
    margin-bottom: 1%;
}
#user_addr3 {
    width: 98.9%;
}

.tbl #user_zip {
    width: 260px;
    float: left;
    margin-bottom: 1%;
}
.tbl #user_addr1 {
    width: 100%;
    margin-bottom: 1%;
}
.tbl #user_addr2 {
    width: 100%;
    margin-bottom: 1%;
}
.tbl #user_addr3 {
    width: 100%;
}

.tbl .total_price {
    font-size: 24px;
    text-align: center;
    margin: 20px 0 30px 0px;
}

.tbl .total_price span {
    padding-right: 20px;
}

.tbl .customer_price {
    font-size: 18px;
    text-align: center;
    margin: 20px 0 30px 0px;
}

.tbl .customer_price span {
    padding-right: 20px;
}

.tbl .option_price {
    font-size: 18px;
    text-align: center;
    margin: 20px 0 30px 0px;
}

.tbl .option_price span {
    padding-right: 20px;
}

#cartBtn {
    width: 49%;
    margin-right: 1%;
}
#orderBtn {
    width: 49%;
}

@media (max-width: 1279px) {
    .market_thumb_ubox {
        margin-bottom: -24px
    }

    .market_thumb_ubox li {
        width: 50%;
        height: auto;
        margin-left: 0;
        margin-bottom: 24px
    }

    .market_thumb_ubox li:first-child .thumb_unit,
    .market_thumb_ubox li:nth-child(2n+1) .thumb_unit {
        margin-left: 0
    }

    .market_thumb_ubox li .thumb_unit {
        margin-left: 24px
    }

    .market_thumb_ubox li .thumb_unit:hover,
    .market_thumb_ubox li .thumb_unit:active {
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .market_thumb_ubox li .thumb_unit .top {
        height: 320px
    }

    .market_thumb_ubox li .thumb_unit .desc span {
        /*margin-top: 11px*/
    }

    .bx_ico .notice_ico {
        font-size: 60px;
        display: inline-block;
        vertical-align: middle;
        padding: 0 20px 0 0;
    }

    .bx_ico .info {
        max-width: 750px;
        border-left: none;
        padding: 0;
    }
}

@media (max-width: 767px) {
    .market_thumb_ubox {
        margin-bottom: -20px
    }

    .market_thumb_ubox li {
        float: none;
        width: 100%;
        height: auto;
        margin-left: 0;
        margin-bottom: 20px
    }

    .market_thumb_ubox li:first-child,
    .market_thumb_ubox li:nth-child(3n+1) {
        margin-left: 0
    }

    .market_thumb_ubox li .thumb_unit {
        margin-left: 0
    }

    .market_thumb_ubox li .thumb_unit .top {
        height: auto
    }

    .market_thumb_ubox li .thumb_unit .top img {
        position: static;
        top: 0;
        left: 0;
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0)
    }

    .market_thumb_ubox li .thumb_unit .desc span {
        margin-top: 2px
    }

    .thumb_ubox .thumb_unit .desc span {
        min-height: 10px;
    }

    .bx_ico .notice_ico {
        font-size: 50px;
        display: inline-block;
        vertical-align: middle;
        padding: 0 0 10px;
    }

    #cartBtn {
        width: 100%;
        margin-bottom: 2%;
    }

    #orderBtn {
        width: 100%;
    }

}

/* 상품설명 tab*/
.sub_f .space {
    padding-top: 50px;
}

.sub_f .tab_menu {
    width: 100%;
    height: 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid var(--header-bottom_bar);
    background: var(--bg-color);
}

.sub_f .tab_menu .wrap {
    height: 100%;
    max-width: 1080px
}

.sub_f .tab_menu .wrap:after {
    display: block;
    clear: both;
    content: ""
}

.sub_f .tab_menu a {
    font-size: 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 60px;
    padding: 0 20px;
    display: block;
    position: relative
}

/* review */
.b_product_review_rate {
    padding: 25px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.b_product_review_rate > dl {
    display: table;
    width: 100%;
    margin: 0 auto;
}

.b_product_review_rate > dl > dt {
    display: table-cell;
    width: 33.333%;
    padding: 15px 23px;
    border-right: 1px solid #eee;
    text-align: center;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.c_product_review_rate1 .guide {
    display: block;
    color: #333;
    font-weight: bold;
    font-size: 17px;
}

.c_seller_grade {
    position: relative;
    display: inline-block;
    overflow: hidden;
    line-height: 200px;
    vertical-align: middle;
}

.c_seller_grade.c_product_grade_size5 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -191px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size4 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -225px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size3 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -263px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size2 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -298px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size1 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -335px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size0 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star2.png);
    background-position: -369px 0px;
    width: 178px;
    height: 32px;
    background-size: 369px 32px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_seller_grade.c_product_grade_size5 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.c_product_grade_size4 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.c_product_grade_size3 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.c_product_grade_size2 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.c_product_grade_size1 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.c_product_grade_size0 {
    position: relative;
    height: 32px;
    margin-left: -1px;
    padding-top: 61px;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_0 > span:after {
    width: 0%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_10 > span:after {
    width: 10%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_20 > span:after {
    width: 20%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_30 > span:after {
    width: 30%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_40 > span:after {
    width: 40%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_50 > span:after {
    width: 50%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_60 > span:after {
    width: 60%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_70 > span:after {
    width: 70%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_80 > span:after {
    width: 80%;
}
.c_seller_grade.grade_90:after, .c_seller_grade.grade_90 > span:after {
    width: 90%;
}
.c_seller_grade.grade_100:after, .c_seller_grade.grade_100 > span:after {
    width: 100%;
}

.c_seller_grade.c_product_grade_size5 > em,
.c_seller_grade.c_product_grade_size4 > em,
.c_seller_grade.c_product_grade_size3 > em,
.c_seller_grade.c_product_grade_size2 > em,
.c_seller_grade.c_product_grade_size1 > em,
.c_seller_grade.c_product_grade_size0 > em {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    text-align: center;
    color: #111;
    font-weight: bold;
    font-size: 44px;
    line-height: 1.2;
    font-family: "Lato", "Helvetica Neue", "Apple SD Gothic Neo", "맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif;
}

.c_product_review_rate1 .review {
    display: block;
    margin-top: 17px;
    color: #666;
    font-size: 15px;
}

.b_product_review_rate > dl > dd {
    display: table-cell;
    width: 33.333%;
    padding: 19px 23px;
    text-align: center;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.skip, .hide, .sr-only {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    margin: -1px;
    width: 1px;
    height: 1px;
}

.c_product_rate {
    height: 18px;
    padding-right: 30px;
    font-size: 13px;
    line-height: 0;
    margin: 0 0 12px 0;
}

.c_product_rate dt {
    display: inline-block;
    vertical-align: middle;
    color: #999;
}

.c_product_rate dd {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 150px;
    height: 100%;
    margin: 0 10px 0 8px;
    background-color: #f4f4f4;
    border-radius: 9px;
}

.c_product_rate .num {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    min-width: 18px;
    background-color: rgba(11, 131, 230, 0.75);
    border-radius: 9px;
    content: "";
}

.c_product_rate .num > span {
    position: absolute;
    top: -17px;
    right: -6px;
    z-index: 2;
    margin-left: -20px;
    padding: 0 5px;
    background-color: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0 1px 2px 1px rgb(0 0 0 / 20%), 0 0 1px 0 rgb(0 0 0 / 15%);
    box-shadow: 0 1px 2px 1px rgb(0 0 0 / 20%), 0 0 1px 0 rgb(0 0 0 / 15%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.c_product_rate .num > span:before, .c_product_rate .num > span:after {
    position: absolute;
    bottom: -9px;
    right: 11px;
    width: 9px;
    height: 9px;
    background: url(//dreamgreen.co.kr/assets/ui/img/common/tooltip.png) no-repeat 0 0;
    background-size: 100%;
    content: "";
}

.c_product_rate .num .text {
    position: relative;
    background-color: #fff;
    color: #000;
    font-size: 13px;
    line-height: 20px;
    white-space: nowrap;
}

.c_product_rate .num .text > i {
    position: relative;
    font-family: "Lato", "Helvetica Neue", "Apple SD Gothic Neo", "맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif;
}

.c_product_rate .num .text i {
    font-style: normal;
}

.c_product_rate .rate {
    position: absolute;
    top: 50%;
    right: -36px;
    color: #0b83e6;
    font-family: "Lato", "Helvetica Neue", "Apple SD Gothic Neo", "맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif;
}


.c_product_review_rate3 > div {
    position: relative;
    padding-right: 50px;
    text-align: left;
    font-size: 15px;
    margin: 0 0 10px 0;
}

.c_product_review_rate3 > div > dt {
    display: inline-block;
    margin-right: 6px;
    color: #0b83e6;
}

.c_product_review_rate3 > div > dd {
    display: inline-block;
    color: #111;
}

.c_product_review_rate3 > div > dd:last-of-type {
    position: absolute;
    right: 0;
    color: #999;
}

.c_product_rate.c_product_rate_size0 .num {
    width: 0%;
}
.c_product_rate.c_product_rate_size1 .num {
    width: 1%;
}
.c_product_rate.c_product_rate_size2 .num {
    width: 2%;
}
.c_product_rate.c_product_rate_size3 .num {
    width: 3%;
}
.c_product_rate.c_product_rate_size4 .num {
    width: 4%;
}
.c_product_rate.c_product_rate_size5 .num {
    width: 5%;
}
.c_product_rate.c_product_rate_size6 .num {
    width: 6%;
}
.c_product_rate.c_product_rate_size7 .num {
    width: 7%;
}
.c_product_rate.c_product_rate_size8 .num {
    width: 8%;
}
.c_product_rate.c_product_rate_size9 .num {
    width: 9%;
}
.c_product_rate.c_product_rate_size10 .num {
    width: 10%;
}
.c_product_rate.c_product_rate_size11 .num {
    width: 11%;
}
.c_product_rate.c_product_rate_size12 .num {
    width: 12%;
}
.c_product_rate.c_product_rate_size13 .num {
    width: 13%;
}
.c_product_rate.c_product_rate_size14 .num {
    width: 14%;
}
.c_product_rate.c_product_rate_size15 .num {
    width: 15%;
}
.c_product_rate.c_product_rate_size16 .num {
    width: 16%;
}
.c_product_rate.c_product_rate_size17 .num {
    width: 17%;
}
.c_product_rate.c_product_rate_size18 .num {
    width: 18%;
}
.c_product_rate.c_product_rate_size19 .num {
    width: 19%;
}
.c_product_rate.c_product_rate_size20 .num {
    width: 20%;
}
.c_product_rate.c_product_rate_size21 .num {
    width: 21%;
}
.c_product_rate.c_product_rate_size22 .num {
    width: 22%;
}
.c_product_rate.c_product_rate_size23 .num {
    width: 23%;
}
.c_product_rate.c_product_rate_size24 .num {
    width: 24%;
}
.c_product_rate.c_product_rate_size25 .num {
    width: 25%;
}
.c_product_rate.c_product_rate_size26 .num {
    width: 26%;
}
.c_product_rate.c_product_rate_size27 .num {
    width: 27%;
}
.c_product_rate.c_product_rate_size28 .num {
    width: 28%;
}
.c_product_rate.c_product_rate_size29 .num {
    width: 29%;
}
.c_product_rate.c_product_rate_size30 .num {
    width: 30%;
}
.c_product_rate.c_product_rate_size31 .num {
    width: 31%;
}
.c_product_rate.c_product_rate_size32 .num {
    width: 32%;
}
.c_product_rate.c_product_rate_size3 .num {
    width: 33%;
}
.c_product_rate.c_product_rate_size34 .num {
    width: 34%;
}
.c_product_rate.c_product_rate_size35 .num {
    width: 35%;
}
.c_product_rate.c_product_rate_size36 .num {
    width: 36%;
}
.c_product_rate.c_product_rate_size37 .num {
    width: 37%;
}
.c_product_rate.c_product_rate_size38 .num {
    width: 38%;
}
.c_product_rate.c_product_rate_size39 .num {
    width: 39%;
}
.c_product_rate.c_product_rate_size40 .num {
    width: 40%;
}
.c_product_rate.c_product_rate_size41 .num {
    width: 41%;
}
.c_product_rate.c_product_rate_size42 .num {
    width: 42%;
}
.c_product_rate.c_product_rate_size43 .num {
    width: 43%;
}
.c_product_rate.c_product_rate_size44 .num {
    width: 44%;
}
.c_product_rate.c_product_rate_size45 .num {
    width: 45%;
}
.c_product_rate.c_product_rate_size46 .num {
    width: 46%;
}
.c_product_rate.c_product_rate_size47 .num {
    width: 47%;
}
.c_product_rate.c_product_rate_size48 .num {
    width: 48%;
}
.c_product_rate.c_product_rate_size49 .num {
    width: 49%;
}
.c_product_rate.c_product_rate_size50 .num {
    width: 50%;
}
.c_product_rate.c_product_rate_size51 .num {
    width: 51%;
}
.c_product_rate.c_product_rate_size52 .num {
    width: 52%;
}
.c_product_rate.c_product_rate_size53 .num {
    width: 53%;
}
.c_product_rate.c_product_rate_size54 .num {
    width: 54%;
}
.c_product_rate.c_product_rate_size55 .num {
    width: 55%;
}
.c_product_rate.c_product_rate_size56 .num {
    width: 56%;
}
.c_product_rate.c_product_rate_size57 .num {
    width: 57%;
}
.c_product_rate.c_product_rate_size58 .num {
    width: 58%;
}
.c_product_rate.c_product_rate_size59 .num {
    width: 59%;
}
.c_product_rate.c_product_rate_size60 .num {
    width: 60%;
}
.c_product_rate.c_product_rate_size61 .num {
    width: 61%;
}
.c_product_rate.c_product_rate_size62 .num {
    width: 62%;
}
.c_product_rate.c_product_rate_size63 .num {
    width: 63%;
}
.c_product_rate.c_product_rate_size64 .num {
    width: 64%;
}
.c_product_rate.c_product_rate_size65 .num {
    width: 65%;
}
.c_product_rate.c_product_rate_size66 .num {
    width: 66%;
}
.c_product_rate.c_product_rate_size67 .num {
    width: 67%;
}
.c_product_rate.c_product_rate_size68 .num {
    width: 68%;
}
.c_product_rate.c_product_rate_size69 .num {
    width: 69%;
}
.c_product_rate.c_product_rate_size70 .num {
    width: 70%;
}
.c_product_rate.c_product_rate_size71 .num {
    width: 71%;
}
.c_product_rate.c_product_rate_size72 .num {
    width: 72%;
}
.c_product_rate.c_product_rate_size73 .num {
    width: 73%;
}
.c_product_rate.c_product_rate_size74 .num {
    width: 74%;
}
.c_product_rate.c_product_rate_size75 .num {
    width: 75%;
}
.c_product_rate.c_product_rate_size76 .num {
    width: 76%;
}
.c_product_rate.c_product_rate_size77 .num {
    width: 77%;
}
.c_product_rate.c_product_rate_size78 .num {
    width: 78%;
}
.c_product_rate.c_product_rate_size79 .num {
    width: 79%;
}
.c_product_rate.c_product_rate_size80 .num {
    width: 80%;
}
.c_product_rate.c_product_rate_size81 .num {
    width: 81%;
}
.c_product_rate.c_product_rate_size82 .num {
    width: 82%;
}
.c_product_rate.c_product_rate_size83 .num {
    width: 83%;
}
.c_product_rate.c_product_rate_size84 .num {
    width: 84%;
}
.c_product_rate.c_product_rate_size85 .num {
    width: 85%;
}
.c_product_rate.c_product_rate_size86 .num {
    width: 86%;
}
.c_product_rate.c_product_rate_size87 .num {
    width: 87%;
}
.c_product_rate.c_product_rate_size88 .num {
    width: 88%;
}
.c_product_rate.c_product_rate_size89 .num {
    width: 89%;
}
.c_product_rate.c_product_rate_size90 .num {
    width: 90%;
}
.c_product_rate.c_product_rate_size91 .num {
    width: 91%;
}
.c_product_rate.c_product_rate_size92 .num {
    width: 92%;
}
.c_product_rate.c_product_rate_size93 .num {
    width: 93%;
}
.c_product_rate.c_product_rate_size94 .num {
    width: 94%;
}
.c_product_rate.c_product_rate_size95 .num {
    width: 95%;
}
.c_product_rate.c_product_rate_size96 .num {
    width: 96%;
}
.c_product_rate.c_product_rate_size97 .num {
    width: 97%;
}
.c_product_rate.c_product_rate_size98 .num {
    width: 98%;
}
.c_product_rate.c_product_rate_size99 .num {
    width: 99%;
}
.c_product_rate.c_product_rate_size100 .num {
    width: 100%;
}
/* // review */

/* 리뷰리스트*/

.review_area {
 margin: 80px;
}

.c_product_review_list .area_list > li {
    position: relative;
    padding: 25px 0 25px 72px;
    border-bottom: 1px solid #eee;
}

.c_product_reviewer {
    position: relative;
    margin-bottom: 4px;
    padding: 13px 120px 13px 0;
}

.c_product_reviewer dt.name {
    display: inline-block;
    vertical-align: middle;
    color: #111;
    font-weight: bold;
    font-size: 17px;
}

.c_product_reviewer dd.img {
    position: relative;
    display: block;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: -72px;
    width: 52px;
    height: 52px;
    background-position: center;
    background-size: cover;
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 50%;
    vertical-align: middle;
}
.reviewtxt {
 margin-top: 20px;
}

.c_product_review_cont .side {    
    top: 43px;
    right: 0;
    line-height: 0;
    float: right;
}

.c_product_review_cont .side .date {
    vertical-align: middle;
    color: #999;
}

.c_product_reviewer dd.flag {
    margin-left: 6px;
}

.c_product_reviewer dd {
    display: inline-block;
}

.c_product_review_cont {
    word-wrap: break-word;
    word-break: break-all;
}

.c_product_review_cont .option_set .option {
    position: relative;
    margin-bottom: 0;
    padding-left: 87px;
    zoom: 1;
}

.c_product_review_cont .option {
    margin-bottom: 5px;
    color: #666;
    font-size: 15px;
    line-height: 22px;
}

.c_product_review_cont .option_set .option dt {
    position: absolute;
    top: 0;
    left: 0;
    float: left;
}

.c_product_review_cont .option_set .option dd {
    float: left;
}

.c_product_review_cont .option_set .option:after {
    display: block;
    content: "";
    clear: both;
}

.c_product_review_cont .option_set + .grade {
    margin-top: 10px;
}

.c_product_review_cont .grade {
    margin-bottom: 10px;
    line-height: 0;
}

.c_review_grade.c_product_grade_size5 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}
.c_review_grade.c_product_grade_size4 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}
.c_review_grade.c_product_grade_size3 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}
.c_review_grade.c_product_grade_size2 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}
.c_review_grade.c_product_grade_size1 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}
.c_review_grade.c_product_grade_size0 {
    position: relative;
    height: 18px;
    color: #333;
    font-size: 17px;
    line-height: 18px;
}

.c_review_grade {
    position: relative;
    display: inline-block;
    overflow: hidden;
    vertical-align: middle;
}

.c_review_grade.c_product_grade_size0 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -100px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}
.c_review_grade.c_product_grade_size1 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -80px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_review_grade.c_product_grade_size2 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -60px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_review_grade.c_product_grade_size3 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -40px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_review_grade.c_product_grade_size4 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -20px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_review_grade.c_product_grade_size5 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: 0px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.star {
    margin-bottom: 20px;
}

.star_size0 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -100px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}
.star_size1 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -80px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.star_size2 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -60px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.star_size3 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -40px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.star_size4 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: -20px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.star_size5 > span {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_star3.png);
    background-position: 0px 0px;
    width: 100px;
    height: 18px;
    background-size: 200px 18px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: transparent;
    line-height: 200px;
    font-size: 1px;
    content: "";
}

.c_review_grade.c_product_grade_size5 > em {
    margin-left: 2px;
}
.c_review_grade.c_product_grade_size4 > em {
    margin-left: 2px;
}
.c_review_grade.c_product_grade_size3 > em {
    margin-left: 2px;
}
.c_review_grade.c_product_grade_size2 > em {
    margin-left: 2px;
}
.c_review_grade.c_product_grade_size1 > em {
    margin-left: 2px;
}
.c_review_grade.c_product_grade_size0 > em {
    margin-left: 2px;
}

.c_product_review_cont .grade + .cont {
    margin-bottom: 7px;
}

.c_product_review_cont .cont .value {
    margin: 4px 0 20px;
}

.c_product_review_cont .cont .value dl {
    margin-top: 5px;
}

.c_product_review_cont .cont .value dt {
    display: inline-block;
    margin-right: 4px;
    color: #0b83e6;
    font-size: 15px;
}

.c_product_review_cont .cont .value dd {
    position: relative;
    display: inline-block;
    margin-right: 17px;
    color: #333;
    font-size: 15px;
}

.c_product_review_cont .cont .cont_text_wrap .cont_review_hide {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    white-space: initial;
    color: #111;
    max-height: 132px;
    overflow: hidden;
}

.c_product_review_thumbnail2 {
    overflow: hidden;
    position: relative;
    margin: 20px -4px 0 0;
}

.c_product_review_thumbnail2 li {
    overflow: hidden;
    position: relative;
    display: block;
    float: left;
    width: 199px;
    height: 199px;
    margin-right: 4px;
    vertical-align: top;
}

.c_product_review_cont .btn_detail {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    color: transparent;
    font-size: 1px;
    line-height: 200px;
}

.c_product_review_cont .btn_detail:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
    content: "";
}

.c_product_review_thumbnail2 li.item_video .btn_detail:after {
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_play.png);
    background-position: 0px 0px;
    width: 30px;
    height: 40px;
    background-size: 30px 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -20px;
    content: "";
}

.c_product_review_btn {
    margin-top: 15px;
    padding: 5px 0;
    font-size: 18px;
}

.c_product_btn_favor {
    min-width: 0;
    padding: 0 14px;
    white-space: nowrap;
}

.c_product_btn_style3, .c_product_btn_favor, .c_product_btn_flagship, .c_product_btn_download, .c_product_btn_pick2 {
    padding: 0 16px;
    border-radius: 28px;
}

.c_product_btn_style1, .c_product_btn_preview, .c_product_btn_view, .c_product_btn_style2, .c_product_btn_style3, .c_product_btn_favor, .c_product_btn_flagship, .c_product_btn_download, .c_product_btn_pick2 {
    min-width: 56px;
    height: 40px;
    padding: 0 13px;
    background-color: #fff !important;
    border: 1px solid #ccc;
    color: #111;
    font-size: 15px;
    line-height: 38px;
}

.c_product_btn_style1, .c_product_btn_preview, .c_product_btn_view, .c_product_btn_style2, .c_product_btn_style3, .c_product_btn_favor, .c_product_btn_flagship, .c_product_btn_download, .c_product_btn_pick2, .c_product_btn_style4, .c_product_btn_view3, .c_product_btn_download2, .c_product_btn_style5, .c_product_btn_style6, .c_product_btn_sm, .c_product_btn_sm2, .c_product_btn_sm6, .c_product_btn_sm3, .c_product_btn_caster, .c_product_btn_chat1, .c_product_btn_chat2 {
    position: relative;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

button, .c_product_btn {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
}

.c_product_btn_style1:before, .c_product_btn_preview:before, .c_product_btn_view:before, .c_product_btn_style2:before, .c_product_btn_style3:before, .c_product_btn_favor:before, .c_product_btn_flagship:before, .c_product_btn_download:before, .c_product_btn_pick2:before, .c_product_btn_style1:after, .c_product_btn_preview:after, .c_product_btn_view:after, .c_product_btn_style2:after, .c_product_btn_style3:after, .c_product_btn_favor:after, .c_product_btn_flagship:after, .c_product_btn_download:after, .c_product_btn_pick2:after {
    display: inline-block;
    margin: -2px 2px 0 0;
    vertical-align: middle;
    content: "";
}

.c_product_btn_favor > span {
    overflow: hidden;
    display: inline-block;
    width: 52px;
    height: 24px;
    margin-left: -3px;
    vertical-align: -5px;
    color: transparent;
    font-size: 1px;
    line-height: 200px;
}

.c_product_btn_favor > span:before, .c_product_btn_favor > span:after {
    float: left;
    background-image: url(//dreamgreen.co.kr/assets/ui/img/common/ico_kook_off.png);
    background-position: 0px 0px;
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
    vertical-align: top;
    content: "";
}

.c_product_btn_favor > span:after {
    background-image: url(/img/product/sprites/sp_icon_2x_2022930_94634.png);
    background-position: -437px -317px;
    width: 18px;
    height: 24px;
    background-size: 482px 457px;
}

.c_product_btn_favor > i {
    margin-left: -10px;
    vertical-align: 2px;
    color: #333;
    font-size: 13px;
}

.c_product_btn_favor:after {
    margin: -2px 0 0 2px;
}

.c_product_review_btn .text_sub {
    margin-left: 6px;
    color: #333;
}

.text_em2 {
    color: #0b83e6;
}

.c_product_review_btn .text_sub b {
    font-weight: 600;
}


/*// 리뷰리스트 */

@media (max-width: 1279px) {
    .sub_f .tab_menu {
        padding: 0 30px
    }

    .sub_f .tab_menu a {
        padding: 0 10px;
        margin-right: 10px
    }

    .sub_f .tab_menu a:last-child {
        margin-right: 0px
    }
}

@media (max-width: 767px) {
    .sub_f .tab_menu {
        height: 45px;
        padding: 0px 4.68%
    }

    .sub_f .tab_menu a {
        line-height: 45px;
        padding: 0 10px
    }

    .sub_f .tab_menu a:last-child {
        margin-right: auto
    }

    .b_product_review_rate > dl > dt {
        display: table-cell;
        width: 100%;
        padding: 10px 0 30px 0;
        border-right: 0px;
        border-bottom: 1px solid var(--header-bottom_bar);
        display: block;
    }

    .b_product_review_rate > dl > dd {
        display: table-cell;
        width: 100%;
        padding: 30px 0 30px 0;
        border-bottom: 1px solid var(--header-bottom_bar);
        display: block;
    }

    .c_product_review_rate3 {
        width: 86%;
        padding: 0 22px 0;
    }

    .b_product_review_rate {
        border-bottom: 0px;
    }

    .review_area {
        margin: 20px 0px 0px 72px;
    }

    .c_product_review_thumbnail2 .row {
        margin-left: 0px;
        margin-right: 0px;
        padding: 0;
    }

    .c_product_review_thumbnail2 .protfolio-item {
        padding: 0 6px;
    }

    .c_product_review_thumbnail2 .col-md-4 {
        flex: 0 0 45.5%;
        max-width: 100%;
    }
}

.sub_f .tab_menu .scroll {
    position: relative;
    z-index: 1;
    width: calc(100% - 450px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 60px;
    overflow: hidden;
    -ms-touch-action: none;
    float: left
}

.sub_f .tab_menu .scroll a.on {
    font-weight: 600
}

.sub_f .tab_menu .scroll a.on:before {
    content: "";
    width: 100%;
    height: 2px;
    display: block;
    position: absolute;
    background: var(--nav-color);
    bottom: 1px;
    left: 0px
}

.sub_f .tab_menu .scroll ul {
    width: 100%;
    padding: 0;
    margin: 0
}

.sub_f .tab_menu .scroll ul:after {
    display: block;
    clear: both;
    content: ""
}

.sub_f .tab_menu .scroll li {
    float: left
}

@media (max-width: 1279px) {
    .sub_f .tab_menu .scroll {
        width: calc(100% - 400px)
    }

    .sub_f .tab_menu .scroll li {
        margin-right: 20px
    }

    .sub_f .tab_menu .scroll li:last-child {
        margin: 0px
    }
}

@media (max-width: 767px) {
    .sub_f .tab_menu .scroll {
        width: 100%;
        height: 45px
    }

    .sub_f .tab_menu .scroll li {
        margin-right: 10px
    }

    .sub_f .tab_menu .scroll a {
        font-size: 13px;
        padding: 0 5px
    }
}

/* // 상품설명 tab*/

.bx_robot {
    margin-top: 20px
}

.thumlist {
    padding: 25px 0;
    margin-bottom: 40px;
    border-top: 1px solid #222222;
    border-bottom: 1px solid #f0f0f0
}

.thumlist dl {
    display: table
}

.thumlist dt,
.thumlist dd {
    display: table-cell;
    word-break: break-all;
    vertical-align: middle
}

@media (max-width: 767px) {

    .thumlist dt,
    .thumlist dd {
        font-size: 16px
    }
}

@media (max-width: 767px) {

    .thumlist dt,
    .thumlist dd {
        font-size: 13px
    }
}

.thumlist dt {
    width: 125px
}

@media (max-width: 767px) {
    .thumlist dt {
        width: 35%
    }
}

.thumlist dd {
    padding-left: 20px;
    color: #666
}

@media (max-width: 767px) {
    .thumlist {
        margin-bottom: 30px
    }
}

/*마켓리스트 끝*/

.bx_qna {
    padding: 30px 60px;
    overflow: hidden;
    background: var(--bg-color);
    position: relative
}

.bx_qna img {
    width: 80px;
    display: inline-block;
    vertical-align: middle
}

.bx_qna i {
    font-size: 42px;
    vertical-align: middle
}

.bx_qna img.ico_linked {
    width: 71px
}

@media (max-width: 767px) {
    .bx_qna img.ico_linked {
        width: 42px
    }
}

.bx_qna .bx_txt {
    display: inline-block;
    vertical-align: middle;
    margin: 0px 30px;
    width: 685px;
    font-size: 15px
}

.bx_qna .bx_txt>span,
.bx_qna .bx_txt>strong {
    display: block;
    font-weight: 600
}

.bx_qna .bx_txt br {
    display: none
}

.bx_qna .bx_txt .desc {
    font-size: 13px;
    font-weight: 100;
    margin-top: 16px
}

.bx_qna .bx_txt .desc a {
    color: #4285F4;
    text-decoration: underline
}

@media (max-width: 767px) {
    .bx_qna .bx_txt .desc {
        font-size: 11px
    }
}

.bx_qna .bx_btn {
    position: absolute;
    top: 50%;
    right: 60px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width: 1279px) {
    .bx_qna {
        padding: 20px 30px
    }

    .bx_qna .bx_txt {
        margin: 0px 14px;
        width: calc(100% - 260px);
        font-size: 15px
    }

    .bx_qna .bx_txt br {
        display: block
    }

    .bx_qna .bx_btn {
        right: 30px
    }
}

@media (max-width: 767px) {
    .bx_qna {
        text-align: center
    }

    .bx_qna img {
        width: 47px;
        margin: 0 auto
    }

    .bx_qna .bx_btn {
        display: block;
        margin: 0 auto 10px;
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }

    .bx_qna .bx_txt {
        display: block;
        margin: 10px 0 16px;
        width: 100%;
        font-size: 13px
    }
}

.site_map {
    width: 100%;
    height: 100%;
    background: #3b3b3b;
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 11;
    overflow: hidden;
    overflow-y: auto
}

@media (max-width: 1279px) {
    .site_map {
        display: none !important
    }
}

.site_map .s_map {
    position: absolute;
    top: 37px;
    right: 50px;
    color: #ffffff;
    font-size: 16px;
    z-index: 10
}

.site_map .s_map em {
    position: relative;
    display: inline-block;
    width: 19px;
    height: 19px;
    margin: -4px 4px 0px 0px;
    vertical-align: middle
}

.site_map .s_map em:before,
.site_map .s_map em:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 25px;
    height: 2px;
    background-color: #ffffff
}

.site_map .s_map em:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.site_map .s_map em:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.site_map h2 {
    position: relative;
    font-size: 30px;
    font-weight: 100;
    color: #4285F4;
    margin-bottom: 67px !important;
    white-space: nowrap
}

.site_map h2:after {
    content: "";
    width: 44px;
    height: 1px;
    display: block;
    position: absolute;
    background: #4285F4;
    bottom: -38px;
    left: 0px
}

.site_map h2.etc {
    margin-top: 65px
}

.site_map h3 {
    font-size: 15px;
    line-height: 42px;
    color: #4285F4
}

.site_map .wrap {
    width: auto;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    margin: 0px;
    display: block;
    opacity: 0
}

.site_map ul {
    overflow: hidden
}

.site_map .dep1 {
    float: left;
    padding: 145px 45px;
    position: relative;
    min-width: 260px;
    min-height: 860px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.site_map .dep1:after {
    display: block;
    clear: both;
    content: ""
}

.site_map .dep1:nth-child(3n) h2 {
    min-width: 190px
}

.site_map a {
    font-size: 15px;
    line-height: 42px;
    display: inline-block;
    color: #ffffff;
    font-weight: 600
}

.site_map .bx_col {
    float: left
}

.site_map .bx_col+.bx_col {
    margin-left: 65px
}

.site_map .bx_row {
    position: absolute;
    top: 590px;
    left: 50px
}

.site_map .blank {
    width: 176px;
    height: 80px
}

.ico_hour {
    display: inline-block;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_hour.svg") no-repeat 0 0;
    width: 73px;
    height: 73px
}

.ico_kakaopay {
    display: inline-block;
    width: 60px;
    height: 30px;
    margin-top: -5px;
    margin-left: 2px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_kakaopay.svg") no-repeat 50% 50%;
    background-size: 60px 30px;
    vertical-align: middle
}

.ico_tosspayments {
    display: inline-block;
    width: 120px;
    height: 21px;
    margin-top: -2px;
    margin-left: 6px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_tosspayments.svg") no-repeat 50% 50%;
    background-size: 120px 21px;
    vertical-align: middle
}

.ico_tosspay {
    display: inline-block;
    width: 90px;
    height: 21px;
    margin-top: -2px;
    margin-left: 6px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_tosspay_reserv.svg") no-repeat 50% 50%;
    background-size: 90px 21px;
    vertical-align: middle
}

.ico_card {
    display: inline-block;
    width: 52px;
    height: 83px;
    margin-top: -2px;
    margin-left: 10px;
    vertical-align: middle
}

.card_01 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership01_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

.card_02 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership02_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

.card_03 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership03_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

.card_04 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership04_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

.card_05 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership05_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

.card_06 {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_membership06_100.png") no-repeat 50% 50%;
    background-size: 52px 83px;
}

@media (max-width: 767px) {
    .ico_kakaopay {
        width: 45px;
        height: 18px;
        background-size: 45px 18px
    }
}

.ico_naverpay {
    display: inline-block;
    width: 52px;
    height: 21px;
    margin-top: -2px;
    margin-left: 4px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_naverpay.png") no-repeat 50% 50%;
    background-size: 52px 21px;
    vertical-align: middle
}

@media (max-width: 767px) {
    .ico_naverpay {
        width: 45px;
        height: 18px;
        background-size: 45px 18px
    }
}

.sub_f.com_msg .container {
    text-align: center;
    width: 100%;
    max-width: 400px;
    font-size: 18px
}

@media (max-width: 1279px) {
    .sub_f.com_msg .container {
        margin: 0px auto 80px;
        padding: 0px
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .container {
        margin: 50px auto 40px;
        padding: 0px 20px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }
}

.sub_f.com_msg .container h1 {
    margin: 0px 0px 38px -200px;
    width: 800px
}

.sub_f.com_msg .container h1.p_size {
    font-size: 38px
}

.sub_f.com_msg .container p+p {
    margin-top: 3px
}

.sub_f.com_msg .container p.big {
    font-weight: 600
}

.sub_f.com_msg .container p.txt_bottom {
    margin-bottom: 23px
}

.sub_f.com_msg .container p.p_mid {
    font-size: 15px;
    margin: 34px auto 25px
}

.sub_f.com_msg .container p.p_bottom {
    margin-bottom: 65px
}

.sub_f.com_msg .container .btn_margin {
    margin-top: 25px
}

.sub_f.com_msg .container .btn.full {
    margin-top: 30px
}

.sub_f.com_msg .container .txt_rst {
    margin: 93px 0px
}

.sub_f.com_msg .container .txt_rst+.btn {
    margin-top: 0px
}

.sub_f.com_msg .container .txt_point {
    text-decoration: underline
}

.sub_f.com_msg .container .txt_point.none {
    text-decoration: none
}

.sub_f.com_msg .container .bx_ico {
    margin: 20px auto 0px
}

.sub_f.com_msg .container .bx_ico+form {
    margin-top: 40px
}

.sub_f.com_msg .container .bx_ico.left {
    padding: 30px 35px;
    text-align: left
}

.sub_f.com_msg .container .bx_ico .ico.n_right {
    padding-right: 0
}

.sub_f.com_msg .container .bx_ico .info {
    max-width: 205px
}

.sub_f.com_msg .container .bx_ico .info.center {
    display: block;
    padding-left: 0;
    padding-top: 10px;
    border: 0;
    text-align: center;
    margin: 0 auto
}

.sub_f.com_msg .container .bx_ico.center {
    display: block;
    padding: 0;
    margin: 0 auto
}

.sub_f.com_msg .container .bx_ico.top {
    margin: 30px auto 0
}

.sub_f.com_msg .container .txt_refor {
    margin: 18px auto 24px;
    font-size: 18px
}

.sub_f.com_msg .container .txt_refor.p_mid {
    font-size: 15px;
    margin: 34px auto 25px
}

.sub_f.com_msg .container .txt_refor a {
    display: inline-block;
    margin-top: 10px;
    font-weight: 600;
    text-decoration: underline
}

.sub_f.com_msg .container .txt_refor a.confirm {
    margin-top: 0
}

@media (max-width: 1279px) {
    .sub_f.com_msg .container h1 {
        font-size: 42px;
        margin: 0px 0px 47px -50px;
        width: 500px
    }

    .sub_f.com_msg .container p {
        font-size: 15px
    }

    .sub_f.com_msg .container p+p {
        margin: 15px 0
    }

    .sub_f.com_msg .container p.bottom {
        font-size: 15px;
        margin-bottom: 40px
    }

    .sub_f.com_msg .container p.p_bottom {
        font-size: 18px
    }

    .sub_f.com_msg .container p.type2 {
        font-size: 18px
    }

    .sub_f.com_msg .container .bx_ico {
        line-height: 1.3;
        font-size: 14px;
        margin: 20px auto 0px
    }

    .sub_f.com_msg .container .bx_ico.left {
        margin: -30px auto 0px
    }

    .sub_f.com_msg .container .bx_ico.left .ico {
        padding-right: 29px
    }

    .sub_f.com_msg .container .bx_ico.left .info {
        display: inline-block;
        max-width: 200px;
        text-align: left;
        font-size: 15px;
        padding-left: 20px;
        word-break: break-all;
        white-space: normal;
        border-left: 1px #d1d1d1 dotted
    }

    .sub_f.com_msg .container .bx_ico .ico {
        padding: 0 0 10px;
        margin: 0;
        background: none
    }

    .sub_f.com_msg .container .bx_ico .center {
        padding: 0;
        margin: 0 auto
    }

    .sub_f.com_msg .container .bx_ico .info {
        display: block;
        max-width: 100%;
        text-align: center;
        font-size: 15px
    }

    .sub_f.com_msg .container .bx_ico.top {
        margin: 30px auto 0
    }

    .sub_f.com_msg .container .txt_refor {
        font-size: 18px
    }

    .sub_f.com_msg .container .txt_refor.p_mid {
        font-size: 15px;
        margin: 37px auto 40px
    }

    .sub_f.com_msg .container .txt_rst {
        margin: 53px 0px
    }

    .sub_f.com_msg .container .btn.r_squ.big {
        padding: 19px 24px
    }

    .sub_f.com_msg .container .btn.full {
        margin-top: 20px;
        padding: 21px 24px
    }

    .sub_f.com_msg .container .btn.squ.big {
        padding: 20px 24px
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .container h1 {
        width: 100%;
        font-size: 28px;
        margin: 0px 0px 26px 0
    }

    .sub_f.com_msg .container h1.p_size {
        font-size: 28px
    }

    .sub_f.com_msg .container .bx_ico {
        padding: 15px 30px
    }

    .sub_f.com_msg .container .bx_ico.left {
        margin: 0px;
        padding: 15px 30px;
        text-align: center
    }

    .sub_f.com_msg .container .bx_ico.left .ico {
        padding: 0 0 10px;
        margin: 0;
        background: none;
        width: 50px
    }

    .sub_f.com_msg .container .bx_ico.left .info {
        display: block;
        max-width: 100%;
        text-align: center;
        font-size: 13px;
        padding-left: 0;
        border-left: none
    }

    .sub_f.com_msg .container .bx_ico .info {
        font-size: 13px;
        max-width: 100%
    }

    .sub_f.com_msg .container .bx_ico .ico {
        padding: 0
    }

    .sub_f.com_msg .container .txt_refor {
        font-size: 14px;
        margin: 12px 0 16px
    }

    .sub_f.com_msg .container .txt_refor a {
        margin-top: 8px
    }

    .sub_f.com_msg .container .txt_refor.p_mid {
        font-size: 13px;
        margin: 25px auto 8px
    }

    .sub_f.com_msg .container p {
        font-size: 14px
    }

    .sub_f.com_msg .container p+p {
        margin: 15px 0
    }

    .sub_f.com_msg .container p.bottom {
        font-size: 14px;
        margin-bottom: 10px
    }

    .sub_f.com_msg .container p.p_bottom {
        font-size: 14px;
        margin-bottom: 35px
    }

    .sub_f.com_msg .container p.type2 {
        font-size: 14px
    }
}

.sub_f.com_msg .l_header {
    margin: 0px auto 45px
}

.sub_f.com_msg .l_header p {
    font-size: 18px;
    line-height: 28px
}

.sub_f.com_msg .l_header .txt_chk {
    margin-top: 20px
}

@media (max-width: 1279px) {
    .sub_f.com_msg .l_header {
        margin: 0px auto 60px
    }

    .sub_f.com_msg .l_header p {
        font-size: 15px
    }

    .sub_f.com_msg .l_header .txt_chk {
        margin-top: 15px
    }

    .sub_f.com_msg .l_header.non_mem {
        margin: 0
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .l_header {
        margin-bottom: 30px
    }

    .sub_f.com_msg .l_header p {
        font-size: 14px;
        line-height: 1.5
    }

    .sub_f.com_msg .l_header .txt_chk {
        margin-top: 17px
    }
}

.sub_f.com_msg .bx_ipt+.bx_ipt {
    margin-top: 10px
}

.sub_f.com_msg .bx_notice {
    margin-top: 20px;
    text-align: left
}

.sub_f.com_msg .bx_notice p {
    margin-top: 10px
}

.sub_f.com_msg .bx_notice p:first-child {
    margin-top: 0
}

.sub_f.com_msg .bx_notice p label {
    margin-right: 0;
    line-height: 1.3
}

@media (max-width: 1279px) {
    .sub_f.com_msg .bx_notice {
        margin-top: 16px
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .bx_notice .radio+.label {
        padding-left: 25px
    }
}

.sub_f.com_msg .bx_ico {
    margin-top: 20px
}

.sub_f.com_msg .bx_ico+form {
    margin-top: 40px
}

.sub_f.com_msg .tbl {
    margin: 60px 0 30px;
    text-align: center
}

.sub_f.com_msg .tbl td {
    padding: 34px 0
}

.sub_f.com_msg .tbl strong {
    display: block;
    margin-bottom: 10px
}

@media (max-width: 1279px) {
    .sub_f.com_msg .tbl {
        margin: 60px 0 40px
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .tbl {
        margin: 30px 0 10px
    }

    .sub_f.com_msg .tbl td {
        padding: 26px 0
    }

    .sub_f.com_msg .tbl strong {
        margin-bottom: 3px
    }
}

hr {
    border-top: 1px solid var(--hr-bar);
    margin-top: 0
}

.bx_col2 {
    width: 100%;
    margin-top: 100px;
    background: var(--box-bg);
    border-radius: 10px;
    border: 1px solid var(--box-border);
    padding: 50px 0;
    display: table
}

.bx_col2.bx_col {
    width: 100%;
    background: #f7f7f7;
    border-radius: 10px;
    border: 1px solid #f0f0f0;
    padding: 60px 150px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_col2.bx_col .unit:first-child {
    border: none
}

.bx_col2.bx_col .unit .bx_icon {
    float: left
}

.bx_col2.bx_col .unit .btn {
    float: right;
    margin-top: 7px
}

@media (max-width: 1279px) {
    .bx_col2.bx_col {
        padding: 40px 70px
    }

    .bx_col2.bx_col .unit .bx_icon p {
        width: auto;
        margin: 0 0 0 16px;
        text-align: left
    }

    .bx_col2.bx_col .unit .btn {
        margin-top: 0
    }
}

@media (max-width: 767px) {
    .bx_col2.bx_col {
        padding: 0 10%
    }

    .bx_col2.bx_col .unit .bx_icon {
        float: none;
        margin-top: 0
    }

    .bx_col2.bx_col .unit .bx_icon p {
        width: 100%;
        margin: 10px 0 0 0;
        text-align: center
    }

    .bx_col2.bx_col .unit .btn {
        float: none;
        margin-top: 30px
    }
}

.bx_col2 .unit {
    display: table-cell;
    width: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    padding: 10px 0
}

.bx_col2 .unit:first-child {
    /*border-right: 2px dotted #d1d1d1*/
}

.bx_col2 .unit .btn {
    margin-top: 30px
}

.bx_col2 .unit .bx_icon img {
    height: 48px;
    vertical-align: middle
}

.bx_col2 .unit .bx_icon p {
    vertical-align: middle;
    display: inline-block;
    margin-left: 20px;
    text-align: left
}

@media (max-width: 1279px) {
    .bx_col2 {
        padding: 40px 0;
        margin-top: 80px
    }

    .bx_col2 .unit {
        padding: 0
    }

    .bx_col2 .unit .bx_icon img {
        height: 41px
    }

    .bx_col2 .unit .bx_icon p {
        width: 100%;
        margin: 20px 0 0;
        text-align: center
    }

    .bx_col2 .unit .btn {
        line-height: 1.5
    }
}

@media (max-width: 767px) {
    .bx_col2 {
        margin-top: 60px;
        padding: 0 10%;
        display: block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .bx_col2 .unit {
        padding: 50px 0;
        display: block;
        width: 100%;
        font-size: 13px
    }

    .bx_col2 .unit:first-child {
        border-right: none;
        /*border-bottom: 2px dotted #d1d1d1*/
    }

    .bx_col2 .unit .bx_icon img {
        height: 34px
    }

    .bx_col2 .unit .bx_icon p {
        width: 100%;
        margin: 10px 0 0;
        text-align: center
    }
}

.bx_col3 {
    width: 100%;
    margin-top: 40px;
    background: var(--box-bg);
}

.bx_col3.type2 {
    height: 460px;
    padding: 35px 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_col3.type2 .ico_pro {
    display: block;
    height: 30px;
    margin-left: 45px
}

.bx_col3.type2 .ico_pro+.ico_pro {
    margin-top: 12px;
    margin-left: 45px
}

.bx_col3.type2 br {
    display: none
}

.bx_col3.type2 span {
    height: 50px
}

.bx_col3 .cont_mem {
    padding: 34px 136px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_col3 .top_unit {
    text-align: center;
    vertical-align: middle;
    margin-bottom: 24px
}

.bx_col3 .top_unit strong {
    display: block;
    width: 100%;
    font-size: 18px;
    margin-bottom: 24px
}

.bx_col3 .bottom_unit {
    margin-top: 24px;
    padding-top: 30px;
    border-top: 2px dotted #d0d0d0;
    text-align: center;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.bx_col3 .ico_pro {
    display: inline-block;
    height: 30px
}

.bx_col3 .ico_pro+.ico_pro {
    margin-left: 39px
}

.bx_col3 span {
    display: block;
    font-size: 15px;
    color: #999;
    margin-top: 14px
}

@media (max-width: 1279px) {
    .bx_col3 .cont_mem {
        padding: 34px 30px
    }

    .bx_col3 .top_unit strong {
        font-size: 15px
    }

    .bx_col3.type2 {
        height: 433px;
        padding: 25px 30px
    }

    .bx_col3.type2 .ico_pro {
        display: block;
        height: 26px;
        margin-left: 6px
    }

    .bx_col3.type2 .ico_pro+.ico_pro {
        margin-top: 15px;
        margin-left: 6px
    }

    .bx_col3.type2 br {
        display: block
    }

    .bx_col3.type2 span {
        height: auto
    }
}

@media (max-width: 767px) {
    .bx_col3 {
        margin-top: 30px;
        margin-bottom: 10px;
        text-align: center
    }

    .bx_col3.type2 {
        height: auto;
        padding: 35px 25px
    }

    .bx_col3.type2 .ico_pro {
        display: inline-block;
        margin-left: 6px
    }

    .bx_col3.type2 .ico_pro+.ico_pro {
        margin-top: 15px;
        margin-left: 6px
    }

    .bx_col3.type2 br {
        display: block
    }

    .bx_col3 .cont_mem {
        padding: 27px 27px
    }

    .bx_col3 .top_unit {
        margin-bottom: 20px
    }

    .bx_col3 .top_unit strong {
        font-size: 13px;
        margin-bottom: 22px
    }

    .bx_col3 .bottom_unit {
        margin-top: 19px;
        padding-top: 25px
    }

    .bx_col3 .wrap_img {
        display: inline-block;
        text-align: left;
        width: 170px
    }

    .bx_col3 .ico_pro {
        height: 25px
    }

    .bx_col3 .ico_pro.m_left {
        margin-left: -27px
    }

    .bx_col3 .ico_pro+.ico_pro {
        margin-top: 15px;
        margin-left: 0
    }

    .bx_col3 span {
        font-size: 13px;
        margin-top: 10px
    }
}

.tuto_vidio {
    padding: 100px 0 120px;
    text-align: center;
    margin: 0 auto;
    max-width: 1080px
}

.tuto_vidio .sub_tit {
    margin-top: 26px
}

.tuto_vidio h2 {
    margin-bottom: 0 !important
}

.tuto_vidio h2.has_pd {
    margin-bottom: 55px !important
}

.tuto_vidio h2 br,
.tuto_vidio .sub_tit br {
    display: none
}

.tuto_vidio .bx_col2 {
    margin: 120px 0 40px
}

.tuto_vidio .bx_qna {
    text-align: left;
    margin-top: 80px
}

@media (max-width: 1279px) {
    .tuto_vidio {
        padding: 80px 0
    }

    .tuto_vidio h2.has_pd {
        margin-bottom: 40px !important
    }

    .tuto_vidio .sub_tit {
        margin-top: 10px
    }

    .tuto_vidio .cont {
        width: 100%;
        padding: 0 30px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .tuto_vidio .bx_col2 {
        margin: 80px 0 20px
    }
}

@media (max-width: 767px) {
    .tuto_vidio {
        padding: 60px 0
    }

    .tuto_vidio h2.has_pd {
        margin-bottom: 25px !important
    }

    .tuto_vidio h2 br,
    .tuto_vidio .sub_tit br {
        display: block
    }

    .tuto_vidio .sub_tit {
        margin-top: 14px
    }

    .tuto_vidio .cont {
        padding: 0 6.25%
    }

    .tuto_vidio .bx_col2 {
        margin: 60px 0 0
    }

    .tuto_vidio .bx_qna {
        text-align: center
    }
}

.tuto_vidio .list_vidio:after {
    display: block;
    clear: both;
    content: ""
}

.tuto_vidio .list_vidio li {
    display: inline-block;
    vertical-align: top;
    max-width: 341px;
    margin: 60px 2% 0 0
}

.tuto_vidio .list_vidio li:nth-child(3n) {
    margin-right: 0
}

@media (max-width: 1279px) {
    .tuto_vidio .list_vidio li {
        width: 31%;
        margin: 50px 2.7% 0 0
    }
}

@media (max-width: 767px) {
    .tuto_vidio .list_vidio li {
        width: 100%;
        max-width: 100%;
        border-bottom: 1px #f0f0f0 solid;
        padding: 25px 3.6%;
        margin: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: center
    }

    .tuto_vidio .list_vidio li:after {
        display: block;
        clear: both;
        content: ""
    }

    .tuto_vidio .list_vidio li:first-child {
        margin-top: 40px;
        border-top: 1px #222 solid
    }
}

.tuto_vidio .list_vidio .thum {
    width: 100%;
    position: relative;
    display: block;
    border-radius: 15px;
    overflow: hidden
}

.tuto_vidio .list_vidio .thum img {
    width: 100%
}

@media (max-width: 767px) {
    .tuto_vidio .list_vidio .thum {
        display: inline-block;
        width: 120px;
        border-radius: 6px;
        vertical-align: middle
    }
}

.tuto_vidio .list_vidio .ico_player {
    background: url("//dreamgreen.co.kr/assets/ui/img/sub/ico_player.svg") no-repeat 0 0;
    background-size: 100%;
    content: "";
    width: 44px;
    height: 44px;
    display: inline-block;
    position: relative;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    z-index: 3;
    position: absolute;
    bottom: 16px;
    right: 16px
}

@media (max-width: 1279px) {
    .tuto_vidio .list_vidio .ico_player {
        width: 28px;
        height: 28px;
        bottom: 10px;
        right: 10px
    }
}

@media (max-width: 767px) {
    .tuto_vidio .list_vidio .ico_player {
        width: 15px;
        height: 15px;
        bottom: 5px;
        right: 5px
    }
}

.tuto_vidio .list_vidio .desc {
    margin-top: 24px
}

.tuto_vidio .list_vidio .desc strong,
.tuto_vidio .list_vidio .desc span {
    display: block
}

.tuto_vidio .list_vidio .desc strong {
    margin-bottom: 6px
}

@media (max-width: 767px) {
    .tuto_vidio .list_vidio .desc {
        display: inline-block;
        width: calc((100% - 3.6%) - 120px);
        padding-left: 3.6%;
        margin-top: 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: left;
        vertical-align: middle
    }

    .tuto_vidio .list_vidio .desc br {
        display: none
    }
}

.ico_new {
    padding-right: 36px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_new.png") no-repeat right center
}

.mt40 {
    margin-top: 40px
}

.mt80 {
    margin-top: 80px
}

.ie8 .slct,
.ie9 .slct {
    padding: 0px 0px 0px 20px;
    background: #ffffff
}

@media (max-width: 767px) {

    .ie8 .slct,
    .ie9 .slct {
        padding: 0px 0px 0px 10px
    }
}

.ie8 .bx_ipt .holder,
.ie9 .bx_ipt .holder {
    display: block
}

.ie8 .bx_textarea .holder,
.ie9 .bx_textarea .holder {
    display: block
}

.ie8 .slct {
    height: auto
}

.ie8 .cnt_top .bx_srch .bx_ipt {
    width: 600px
}

.ie8 .cnt_top .bx_srch .slct,
.ie8 .cnt_top .bx_srch .ipt {
    height: auto;
    margin-top: 18px;
    line-height: 1
}

.ie8 .chk+.checked {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_check_on.png") no-repeat 0px 50%
}

.ie8 .radio+.checked {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_radio_on.png") no-repeat 0px 50%
}

.ie8 .tbl th.subject_header .right {
    margin-top: -20px
}

.ie8 .popup,
.ie8 .pop_browser {
    top: 20px;
    left: 20px
}

.ie8 .pop_browser {
    display: block;
    position: fixed !important;
    width: 670px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -335px;
    font-size: 15px
}

.ie8 .pop_browser .txt_point {
    text-decoration: underline
}

.ie8 .pop_browser .ico_check {
    display: inline-block;
    width: 15px;
    height: 11px;
    margin-right: 10px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bu_check.png") no-repeat 0px 50%
}

.ie8 .pop_browser .ico_close {
    position: absolute;
    right: -1px;
    top: -1px;
    width: 29px;
    height: 29px;
    border: 1px solid #222222;
    font-size: 0;
    line-height: 0;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close_ie8.gif") no-repeat 0 0
}

.ie8 .pop_browser .btn_download {
    position: relative;
    padding: 20px 110px 25px 30px;
    border-color: #ccc;
    text-align: left;
    line-height: 1.3;
    font-weight: 100;
    color: #222;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/btn_download_ie8.gif") no-repeat 0 0
}

.ie8.ie_old .pop_browser {
    margin: -300px 0 0 -400px
}

.ie8.ie_old .ico_check {
    margin-top: 7px
}

.ie8.ie_old .ico_close,
.ie8.ie_old .btns {
    display: none
}

.ie8.ie_old .btn_download {
    padding: 20px 45px 25px 30px
}

.bottom_bnr .bnr {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden
}

.bottom_bnr .bnr img {
    width: 100%
}

@media (max-width: 767px) {
    .bottom_bnr .bnr {
        height: 76px
    }

    .bottom_bnr .bnr img {
        position: absolute;
        bottom: 0;
        width: auto;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        height: 76px
    }
}

.main_imgs {
    position: relative
}

.main_bnr {
    position: absolute;
    top: 588px;
    width: 100%;
    z-index: 2;
    overflow: visible
}

.main_bnr .bnr {
    display: block;
    height: 112px
}

.main_bnr .bnr img {
    position: absolute;
    bottom: 0;
    width: 1920px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 112px
}

@media (max-width: 1279px) {
    .main_bnr {
        top: 496px
    }

    .main_bnr .bnr {
        height: 100px
    }

    .main_bnr .bnr img {
        width: 1728px;
        height: 100px
    }
}

@media (max-width: 767px) {
    .main_bnr {
        top: 364px
    }

    .main_bnr .bnr {
        height: 56px
    }

    .main_bnr .bnr img {
        width: 960px;
        height: 56px
    }
}

.main_slider {
    display: block;
    clear: both;
    width: 100%;
    height: 680px;
    background-color: #1f1e26;
    position: relative
}

.main_slider .slick-list {
    max-width: 1920px;
    margin: 0 auto
}

.main_slider .wrap {
    max-width: 1920px;
    margin: 0 auto
}

.main_slider .slide {
    width: 100%;
    height: 680px;
    display: block
}

.main_slider .txt_box {
    /*
    margin: 164px 0px 0px 140px; 
    text-align: center;
    2026.02.04
    */
    margin: 264px 0px 0px 240px;
    text-align: left;
    width: 564px;
    color: #ffffff;
    font-size: 36px;
    line-height: 40px;
    text-shadow: 3px 4px 15px #000; /*2026.02.03 폰트가 잘안보여서 그림자 추가*/ 
}

.main_slider .txt_box span,
.main_slider .txt_box strong {
    display: block
}

.main_slider .txt_box .txt_big {
    font-weight: bold;
    font-size: 90px;
    line-height: 90px;
    margin-bottom: 14px;
}

@media (max-width: 1279px) {
    .main_slider {
        height: 578px
    }

    .main_slider .slide {
        height: 578px;
        background-size: 1632px !important
    }

    .main_slider .txt_box {
        margin: 223px 0px 0px 150px; /* margin: 123px 0px 0px 0px; 2026.02.03*/
        width: 100%;
        font-size: 30px;
        line-height: 1.16
    }

    .main_slider .txt_box .txt_big {
        margin-bottom: 17px;
        font-size: 80px;
        line-height: 1
    }
}

@media (max-width: 767px) {
    .main_slider {
        height: 420px
    }

    .main_slider .slide {
        height: 420px;
        background-size: auto 100% !important
    }

    .main_slider .wrap {
        padding: 50px 6.25% 0px; /* padding: 0px 6.25% 0px; 2026.02.03 */
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .main_slider .txt_box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 98px 0px 0px;
        font-size: 18px
    }

    .main_slider .txt_box .txt_big {
        font-size: 50px;
        margin-bottom: 17px
    }
}

.main_slider .btn_box {
    margin: 140px 0px 0px 140px;
    width: 564px;
    height: 141px;
    position: relative;
    text-align: center
}

.main_slider .btn_box ul {
    position: relative;
    float: right;
    left: -50%
}

.main_slider .btn_box li {
    float: left;
    position: relative;
    left: 50%;
    margin-left: -1px;
    /*border: 1px solid #ffffff;*/
    border: 1px solid var(--slider-box-bg);    
    border-radius: 15px;
    width: 141px;
    height: 141px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.main_slider .btn_box li a {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1.3;
    /*color: #ffffff;*/
    color: var(--slider-color);
    vertical-align: top;
    text-align: left
}

.main_slider .btn_box li a:first-child {
    margin-left: 0px
}

.main_slider .btn_box li a span {
    border-radius: 15px;
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 200ms;
    transition: 200ms;
    padding: 100px 0px 0px 16px
}

.main_slider .btn_box li a:before {
    content: "";
    width: 21px;
    height: 1px;
    background: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 25px;
    left: 15px
}

.main_slider .btn_box li a:after {
    content: "";
    width: 1px;
    height: 21px;
    background: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 15px;
    left: 25px;
    -webkit-transition: 200ms;
    transition: 200ms
}


.main_slider .btn_box li:hover {
    background: var(--dark);
}

/* 메인슬라이드 버튼박스 */
/* 01 */
.main_slider .btn_box li.main01-1:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main01-1.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main01-2:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main01-2.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main01-3:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main01-3.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main01-4:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main01-4.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

/* 02 */
.main_slider .btn_box li.main02-1:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main02-1.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main02-2:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main02-2.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main02-3:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main02-3.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main02-4:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main02-4.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}


/* 03 */
.main_slider .btn_box li.main03-1:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main03-1.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main03-2:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main03-2.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main03-3:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main03-3.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main03-4:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main03-4.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}


/* 04 */
.main_slider .btn_box li.main04-1:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main04-1.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main04-2:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main04-2.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main04-3:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_main04-3.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

.main_slider .btn_box li.main04-4:hover {
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/main/slider_btn_bg_cmain04-4.png) no-repeat 50% 50%;    
    background-size: 100%;
    color: var(--slider-color-hover)
}

/* 메인슬라이드 버튼박스 END */

.main_slider .btn_box li:hover a {
    color: var(--slider-color);
}

.main_slider .btn_box li:hover span {
    padding-top: 41px
}

.main_slider .btn_box li:hover a:before {
    background: var(--slider-color);
}

.main_slider .btn_box li:hover a:after {
    background: var(--slider-color);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.main_slider .btn_box.global br {
    display: none
}

@media (max-width: 1279px) {
    .main_slider .btn_box {
        margin: 103px 0px 0px 0px;
        width: 100%;
        height: 141px
    }

    .main_slider .btn_box li {
        border-radius: 10px
    }

    .main_slider .btn_box li a span {
        padding: 100px 0px 0px 16px
    }

    .main_slider .btn_box li a:before {
        width: 21px;
        top: 25px;
        left: 15px
    }

    .main_slider .btn_box li a:after {
        height: 21px;
        top: 15px;
        left: 25px
    }

    .main_slider .btn_box li a:hover span {
        padding-top: 41px
    }
}

@media (max-width: 767px) {
    .main_slider .btn_box {
        margin: 102px 0px 0px 0px;
        width: 100%;
        height: auto
    }

    .main_slider .btn_box li {
        width: 70px;
        height: 70px;
        border-radius: 5px
    }

    .main_slider .btn_box li a {
        font-size: 12px
    }

    .main_slider .btn_box li a span {
        padding: 40px 0px 0px 7px
    }

    .main_slider .btn_box li a:before {
        width: 9px;
        top: 14px;
        left: 10px
    }

    .main_slider .btn_box li a:after {
        height: 9px;
        top: 10px;
        left: 14px
    }

    .main_slider .btn_box li a:hover span {
        padding-top: 22px
    }

    .main_slider .btn_box li a:hover:before {
        opacity: 0
    }

    .main_slider .btn_box.global br {
        display: block
    }

    .main_slider .btn_box.global li a span {
        padding: 31px 0px 0px 10px
    }

    .main_slider .btn_box.global li a:hover span {
        padding-top: 22px
    }
}

.main_slider .slick-dots {
    position: absolute;
    top: 563px; /*top: 363px; 2026.02.03*/
    left: 75%; /*left: 50%; 2026.02.03*/
    width: 100%;
    max-width: 1920px;
    text-align: left;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.main_slider .slick-dots li {
    display: inline-block;
    margin-right: 26px
}

.main_slider .slick-dots li:first-child {
    margin-left: 378px
}

.main_slider .slick-dots li:last-child {
    margin-right: 0px
}

.main_slider .slick-dots li button {
    width: 8px;
    height: 8px;
    border-radius: 25px;
    background: #fff;
    opacity: 0.5;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    vertical-align: middle
}

.main_slider .slick-dots li.slick-active button {
    width: 14px;
    height: 14px;
    background: none;
    border: 3px solid #ffffff;
    opacity: 1
}

@media (max-width: 1279px) {
    .main_slider .slick-dots {
        top: 496px; /* top: 296px; 2026.02.03*/
        left: 0;
        width: 100%;
        line-height: 10px;
        text-align: center;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    .main_slider .slick-dots li:first-child {
        margin-left: 0
    }
}

@media (max-width: 767px) {
    /* 2026.02.03 PC에서 왼쪽정렬로 바꿈. 모바일에서 가운데 정렬로 추가*/
    .main_slider .txt_box {
        text-align: center;
    }
    
    .main_slider .slick-dots {
        top: 328px; /* top: 228px; 2026.02.03 */
    }

    .main_slider .slick-dots li button {
        width: 8px;
        height: 8px
    }

    .main_slider .slick-dots li.slick-active button {
        width: 14px;
        height: 14px;
        border: 3px solid #ffffff
    }
}

.main_slider .btn_arrow {
    position: absolute;
    z-index: 1;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100px;
    border-bottom: 1px solid #ffffff;
    color: #ffffff;
    font-size: 16px;
    line-height: 38px;
    opacity: 0.3;
    text-transform: uppercase
}

.main_slider .btn_arrow.btn_prev {
    left: 0px;
    text-align: right;
    padding-right: 10px
}

.main_slider .btn_arrow.btn_next {
    right: 0px;
    text-align: left;
    padding-left: 10px
}

.main_slider .btn_arrow.slick-disabled {
    opacity: 0.3
}

.main_slider .btn_arrow:hover {
    opacity: 1
}

@media (max-width: 1279px) {
    .main_slider .btn_arrow {
        width: 64px;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .main_slider .btn_arrow {
        display: none !important
    }
}

.main .container {
    position: relative;
    text-align: center;
    font-size: 18px;
}

.main .container h2 {
    position: relative;
    font-size: 50px;
    line-height: 1;
    margin-bottom: 94px;
    font-weight: 100
}

.main .container h2:after {
    position: absolute;
    content: "";
    width: 44px;
    height: 1px;
    background: var(--heading-color);
    margin-left: -22px;
    left: 50%;
    line-height: 44px;
    top: 82px
}

.main .container span,
.main .container strong {
    display: block
}

@media (max-width: 1279px) {
    .main .container {
        font-size: 16px
    }

    .main .container h2 {
        font-size: 44px;
        margin-bottom: 72px
    }

    .main .container h2:after {
        top: 62px
    }
}

@media (max-width: 767px) {
    .main .container {
        font-size: 11px;
        line-height: 1.6
    }

    .main .container h2 {
        font-size: 30px;
        margin-bottom: 63px
    }

    .main .container h2:after {
        top: 60px;
        width: 18px;
        margin-left: -9px
    }
}

.main .goods_slider {
    width: 100%;
    text-align: left
}

.main .goods_slider:before {
    display: inline-block;
    content: 'drag';
    z-index: 2;
    position: absolute;
    left: 50%;
    top: 15px;
    width: 160px;
    height: 160px;
    margin: 0 0 0 -80px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/main_ico_drag.svg") no-repeat 50% 20%;
    background-size: 100%;
    font-size: 0;
    -webkit-animation-name: dragIcon;
    animation-name: dragIcon;
    -webkit-animation-delay: 5s;
    animation-delay: 5s;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@media (max-width: 1279px) {
    .main .goods_slider:before {
        top: 0
    }
}

@media (max-width: 767px) {
    .main .goods_slider:before {
        width: 80px;
        height: 80px;
        margin: 0 0 0 -40px
    }
}

.main .goods_slider .card {
    overflow: hidden;
    position: relative;
    width: 332px;
    height: 180px;
    padding: 50px 98px 0;
    border-radius: 0px;
    /*
    -webkit-box-shadow: 0px 25px 40px #d8dcb2;
    box-shadow: 0px 25px 40px #d8dcb2
    */
}

.main .goods_slider .card .box {
    position: relative;
    width: 100%
}

.main .goods_slider .card img {
    -webkit-box-shadow: 0 0 20px 6px #e4545a;
    box-shadow: 0 0 20px 6px #e4545a;
    margin: 0 auto
}

.main .goods_slider .card .txt_box {
    overflow: hidden;
    position: relative;
    height: 100%;
    word-break: normal;
    text-align: center;
    color: #ffffff
}

.main .goods_slider .card .txt_box .tit {
    display: block;
    margin: 0 0px 20px;
    font-size: 38px;
    font-weight: 600;
    line-height: 40px
}

.main .goods_slider .card .txt_box .desc {
    display: block;
    overflow: hidden;
    height: 52px;
    margin-bottom: 24px;
    font-weight: 100;
    font-size: 16px;
    line-height: 26px
}

.main .goods_slider .card .btn {
    position: absolute;
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    right: 26px;
    bottom: 30px;
    width: 45px;
    height: 45px;
    padding: 0;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    -webkit-box-shadow: 0 10px 20px #dc4048;
    box-shadow: 0 10px 20px #dc4048
}

.main .goods_slider .card .btn:after,
.main .goods_slider .card .btn:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #ff7747
}

.main .goods_slider .card .btn:before {
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    margin-top: -1px;
    height: 2px;
    width: 12px
}

.main .goods_slider .card .btn:after {
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    margin-left: -1px;
    height: 12px;
    width: 2px
}

.main .goods_slider .card .flag {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    background: 0 0 no-repeat
}

.main .goods_slider .card .flag.new {
    background: url("//dreamgreen.co.kr/assets/ui/img/main/flag_new.png") no-repeat 0 0;
    background-size: 100% auto
}

.main .goods_slider .card.pool {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/pool/main_goods.jpg") no-repeat 50% 0;
    background-size: 100%;
    /*
    background-color: #7cc6f0;
    background: -webkit-gradient(linear, left top, left bottom, from(#7cc6f0), to(#3d8cd1));
    background: linear-gradient(to bottom, #7cc6f0, #3d8cd1);
    background: linear-gradient(to bottom, #7cc6f0, #3d8cd1);
    background: -o-linear-gradient(to bottom, #7cc6f0, #3d8cd1);    
    -webkit-box-shadow: 0px 25px 40px #c6d2dd;
    box-shadow: 0px 25px 40px #c6d2dd
    */
}

.main .goods_slider .card.pool img {
    -webkit-box-shadow: 0 0 20px 6px #347acb;
    box-shadow: 0 0 20px 6px #347acb
}

.main .goods_slider .card.pool .btn {
    -webkit-box-shadow: 0 10px 20px #377dcc;
    box-shadow: 0 10px 20px #377dcc
}

.main .goods_slider .card.pool .btn:before,
.main .goods_slider .card.pool .btn:after {
    background-color: #3d8cd1
}

.main .goods_slider .card {
    background-size: 100%;
}

.main .goods_slider .card.img01 {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg01.jpg") no-repeat 50% 50%;
    /*
    background-color: #ea878c;
    background: -webkit-gradient(linear, left top, left bottom, from(#ea878c), to(#e8636a));
    background: linear-gradient(to bottom, #ea878c, #e8636a);
    background: linear-gradient(to bottom, #ea878c, #e8636a);
    background: -o-linear-gradient(to bottom, #ea878c, #e8636a);    
    -webkit-box-shadow: 0px 25px 40px #dbc0c1;
    box-shadow: 0px 25px 40px #dbc0c1
    */
}

.main .goods_slider .card.img01  img {
    -webkit-box-shadow: 0 0 20px 6px #e34d52;
    box-shadow: 0 0 20px 6px #e34d52
}

.main .goods_slider .card.img01  .btn {
    -webkit-box-shadow: 0 10px 20px #ff633d;
    box-shadow: 0 10px 20px #ff633d
}

.main .goods_slider .card.img01  .btn:before,
.main .goods_slider .card.img01  .btn:after {
    background-color: #e8636a
}

.main .goods_slider .card.img02 {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg02.jpg") no-repeat 50% 60%;
}

.main .goods_slider .card.img02 img {
    -webkit-box-shadow: 0 0 20px 6px #1f890a;
    box-shadow: 0 0 20px 6px #1f890a
}

.main .goods_slider .card.img02 .btn {
    -webkit-box-shadow: 0 10px 20px #175202;
    box-shadow: 0 10px 20px #175202
}

.main .goods_slider .card.img02 .btn:before,
.main .goods_slider .card.img02 .btn:after {
    background-color: #58d12f
}

.main .goods_slider .card.img03 {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg03.jpg") no-repeat 50% 60%;
}

.main .goods_slider .card.img03 img {
    -webkit-box-shadow: 0 0 20px 6px #096192;
    box-shadow: 0 0 20px 6px #096192
}

.main .goods_slider .card.img03 .btn {
    -webkit-box-shadow: 0 10px 20px #1171ba;
    box-shadow: 0 10px 20px #1171ba
}

.main .goods_slider .card.img03 .btn:before,
.main .goods_slider .card.img03 .btn:after {
    background-color: #1399c6
}

.main .goods_slider .card.img04 {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg04.jpg") no-repeat 50% 60%;
}

.main .goods_slider .card.img04 img {
    -webkit-box-shadow: 0 0 20px 6px #a67c00;
    box-shadow: 0 0 20px 6px #a67c00
}

.main .goods_slider .card.img04 .btn {
    -webkit-box-shadow: 0 10px 20px #bf9b30;
    box-shadow: 0 10px 20px #bf9b30
}

.main .goods_slider .card.img04 .btn:before,
.main .goods_slider .card.img04 .btn:after {
    background-color: #ffbf00
}

.main .goods_slider .card.img05 {        
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg05.jpg") no-repeat 10% 0%;
}

.main .goods_slider .card.img05 img {
    -webkit-box-shadow: 0 0 20px 6px #e34d52;
    box-shadow: 0 0 20px 6px #e34d52
}

.main .goods_slider .card.img05 .btn {
    -webkit-box-shadow: 0 10px 20px #377dcc;
    box-shadow: 0 10px 20px #377dcc
}

.main .goods_slider .card.img05 .btn:before,
.main .goods_slider .card.img05 .btn:after {
    background-color: #3d8cd1
}

.main .goods_slider .card.img06 {
    background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/cardimg06.jpg") no-repeat 50% 100%;
}

.main .goods_slider .card.img06 img {
    -webkit-box-shadow: 0 0 20px 6px #ff603b;
    box-shadow: 0 0 20px 6px #ff603b
}

.main .goods_slider .card.img06 .btn {
    -webkit-box-shadow: 0 10px 20px #ff633d;
    box-shadow: 0 10px 20px #ff633d
}

.main .goods_slider .card.img06 .btn:before,
.main .goods_slider .card.img06 .btn:after {
    background-color: #ff7747
}

@media (max-width: 1279px) {
    .main .goods_slider .card {
        padding: 45px 60px 0
    }

    .main .goods_slider .card img {
        width: 264px
    }

    .main .goods_slider .card .txt_box .tit {
        margin: 0px 0px 16px;
        font-size: 36px;
        line-height: 1
    }

    .main .goods_slider .card .txt_box .desc {
        height: 48px;
        font-size: 16px;
        line-height: 24px
    }

    .main .goods_slider .card .btn {
        right: 26px;
        bottom: 26px;
        width: 45px;
        height: 45px
    }

    .main .goods_slider .card .flag {
        width: 120px;
        height: 120px
    }
}

@media (max-width: 767px) {
    .main .goods_slider .card {
        /*width: 250px;
        height: 136px;*/
        background-size: 130%;
        padding: 35px 15px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .main .goods_slider .card img {
        width: 166px
    }

    .main .goods_slider .card .flag {
        width: 75px;
        height: 75px
    }

    .main .goods_slider .card .txt_box .tit {
        margin: 0px 0px 17px;
        font-size: 27px;
        line-height: 1
    }

    .main .goods_slider .card .txt_box .desc {
        height: 38px;
        margin-bottom: 23px;
        font-size: 12px;
        line-height: 19px
    }

    .main .goods_slider .card .txt_box .btn {
        font-size: 11px;
        line-height: 25px;
        padding: 0 15px;
        bottom: 4px
    }

    .main .goods_slider .card .btn {
        width: 35px;
        height: 35px;
        right: 15px;
        bottom: 15px
    }
}

.main .goods_slider .slick-track {
    margin: 70px 0px 104px
}

.main .goods_slider .slick-slide {
    margin: 0px 15px
}

.main .goods_slider div:focus {
    outline: none
}

@media (max-width: 1279px) {
    .main .goods_slider .slick-track {
        margin: 50px 0px 86px
    }

    .main .goods_slider .slick-slide {
        margin: 0px 27px
    }
}

@media (max-width: 767px) {
    .main .goods_slider .slick-track {
        margin: 35px 0px 55px
    }

    .main .goods_slider .slick-slide {
        margin: 0px 15px
    }
}

/* good_point */
.main .goods_point {
    overflow: hidden;
    max-width: 1279px;
    width: 100%;
    margin: 0 auto 100px;
    display: block;
    clear: both;
    content: ""
}

.main .goods_point .box {
    width: 250px;
    margin: 0px 75px;
    display: inline-block;
    vertical-align: top
}

.main .goods_point .box img {
    width: 182px;
    text-align: center
}

.main .goods_point .box .txt_box {
    margin: 0px 20px
}

.main .goods_point .box .tit {
    font-size: 28px;
    margin: 52px auto 30px;
    font-weight: 600;
}

@media (max-width: 1279px) {
    .main .goods_point {
        margin-bottom: 66px
    }

    .main .goods_point .box {
        margin: 0px 2%;
        width: 210px
    }

    .main .goods_point .box img {
        width: 146px;
        height: 148px
    }

    .main .goods_point .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .goods_point .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .goods_point {
        margin-bottom: 0px;
        width: 100%
    }

    .main .goods_point .box {
        width: 100%;
        margin: 0px
    }

    .main .goods_point .box img {
        width: 130px;
        height: auto
    }

    .main .goods_point .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

    .main .goods_point .box .txt_box {
        width: 55%;
        margin: 30px auto 50px;
        font-size: 16px
    }
}

/* gallery*/
.main .goods_gallery {
    overflow: hidden;
    max-width: 1279px;
    width: 100%;
    margin: 0 auto 100px;
    display: block;
    clear: both;
    content: ""
}

.main .goods_gallery .box {
    width: 250px;
    margin: 0px 75px;
    display: inline-block;
    vertical-align: top
}

.main .goods_gallery .box img {
    width: 182px;
    text-align: center
}

.main .goods_gallery .box .txt_box {
    margin: 0px 20px
}

.main .goods_gallery .box .tit {
    font-size: 28px;
    margin: 52px auto 30px
}

@media (max-width: 1279px) {
    .main .goods_gallery {
        margin-bottom: 66px
    }

    .main .goods_gallery .box {
        margin: 0px 2%;
        width: 210px
    }

    .main .goods_gallery .box img {
        width: 146px;
        height: 148px
    }

    .main .goods_gallery .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .goods_gallery .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .goods_gallery {
        margin-bottom: 0px;
        width: 100%
    }

    .main .goods_gallery .box {
        width: 100%;
        margin: 0px
    }

    .main .goods_gallery .box img {
        width: 130px;
        height: auto
    }

    .main .goods_gallery .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

    .main .goods_gallery .box .txt_box {
        width: 55%;
        margin: 30px auto 50px;
        font-size: 16px
    }
}
/* //gallery*/

/* good_item */
.main .good_item {
    overflow: hidden;
    width: 100%;
    padding: 100px 0 0 0;
    display: block;
    clear: both;
    content: ""
}

.main .good_item.bg_gray {
    background: var(--bg-border);
}

.main .good_item.bg_dark {
    background: var(--dark);
}

.main .good_item .box {
    width: 340px;
    margin: 0px 15px;
    display: inline-block;
    vertical-align: top
}

.main .good_item .box img {
    width: 100%;
    text-align: center;
    border-radius: 10px;
}

.main .good_item .box .txt_box {
    margin: 0px 20px
}

.main .good_item .box .tit {
    font-size: 28px;
    margin: 52px auto 30px;
    font-weight: 600;
}

@media (max-width: 1279px) {
    .main .good_item {
        margin-bottom: 0px
    }

    .main .good_item .box {
        margin: 0px 2%;
        width: 210px
    }

    .main .good_item .box img {
        width: 100%;
    }

    .main .good_item .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .good_item .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .good_item {
        margin-bottom: 0px;
        width: 100%
    }

    .main .good_item .box {
        width: 100%;
        margin: 0px
    }

    .main .good_item .box img {
        width: 80%;
        height: auto
    }

    .main .good_item .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

    .main .good_item .box .txt_box {
        width: 80%;
        margin: 30px auto 50px;
        font-size: 16px
    }
}

/* good_bbs */
.main .good_bbs {
    overflow: hidden;
    width: 100%;
    padding: 100px 0 100px 0;
    display: block;
    clear: both;
    content: ""
}

.main .good_bbs.bg_gray {
    background: var(--bg-border);
}

.main .good_bbs.bg_dark {
    background: var(--dark);
}

.main .good_bbs .box .ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 360px; /* 넘칠 너비 지정 */
    text-align: left;
}

.main .good_bbs .box {
    width: 525px;
    margin: 0px 15px;
    display: inline-block;
    vertical-align: top
}

.main .good_bbs .box img {
    width: 100%;
    text-align: center;
    border-radius: 10px;
}

.main .good_bbs .box .txt_box {
    margin: 0px 20px
}

.main .good_bbs .box .tit {
    font-size: 28px;
    margin: 52px auto 30px;
    text-align: left;
    font-weight: 600;
}

@media (max-width: 1279px) {
    .main .good_bbs {
        padding: 50px 0 100px 0;
        margin-bottom: 0px
    }

    .main .good_bbs .box {
        margin: 0px 2%;
        width: 360px
    }

    .main .good_bbs .box img {
        width: 100%;
    }

    .main .good_bbs .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .good_bbs .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .good_bbs {
        padding: 50px 0 100px 0;
        margin-bottom: 0px;
        width: 100%
    }

    .main .good_bbs .box {
        width: 80%;
        margin: 0px
    }

    .main .good_bbs .box img {
        width: 80%;
        height: auto
    }

    .main .good_bbs .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

    .main .good_bbs .box .txt_box {
        width: 80%;
        margin: 30px auto 50px;
        font-size: 16px
    }
}


/* good_bigitem */
.main .good_bigitem {
    overflow: hidden;
    width: 100%;
    padding: 100px 0 100px 0;
    display: block;
    clear: both;
    content: ""
}

.main .good_bigitem.bg_gray {
    background: var(--bg-border);
}

.main .good_bigitem.bg_dark {
    background: var(--dark);
}

.main .good_bigitem .box {
    max-width: 1080px;
    margin: 0px 25px;
    display: inline-block;
    vertical-align: top
}

.main .good_bigitem .box img {
    width: 100%;
    text-align: center;
    border-radius: 10px;
}

.main .good_bigitem .box .txt_box {
    margin: 0px 20px
}

.main .good_bigitem .box .tit {
    font-size: 28px;
    margin: 52px auto 30px
}

@media (max-width: 1279px) {
    .main .good_bigitem {
        margin-bottom: 66px
    }

    .main .good_bigitem .box {
        margin: 0px 2%;
        max-width: 1080px;
    }

    .main .good_bigitem .box img {
        width: 100%;
        height: auto
    }

    .main .good_bigitem .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .good_bigitem .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .good_bigitem {
        margin-bottom: 0px;
        padding: 0 0 100px 0;
        width: 100%
    }

    .main .good_bigitem .box {
        width: 80%;
        margin: 0px
    }

    .main .good_bigitem .box img {
        width: 100%;
        height: auto;
        border-radius: 0px;
    }

    .main .good_bigitem .box .txt_box {
        font-size: 16px
    }

    .main .good_bigitem .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

}


/* good_oneitem */
.main .good_oneitem {
    overflow: hidden;
    width: 100%;
    padding: 50px 0 100px 0;
    display: block;
    clear: both;
    content: ""
}

.main .good_oneitem.bg_gray {
    background: var(--bg-border);
}

.main .good_oneitem.bg_dark {
    background: var(--dark);
}

.main .good_oneitem .box {
    max-width: 1080px;
    margin: 0px 25px;
    display: inline-block;
    vertical-align: top
}

.main .good_oneitem .box img {
    width: 100%;
    text-align: center;
    border-radius: 10px;
}

.main .good_oneitem .box .txt_box {
    margin: 0px 20px
}

.main .good_oneitem .box .tit {
    font-size: 28px;
    margin: 52px auto 30px
}

@media (max-width: 1279px) {
    .main .good_oneitem {
        margin-bottom: 66px
    }

    .main .good_oneitem .box {
        margin: 0px 2%;
        max-width: 1080px;
    }

    .main .good_oneitem .box img {
        width: 100%;
        height: auto
    }

    .main .good_oneitem .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .good_oneitem .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .good_oneitem {
        margin-bottom: 0px;
        padding: 0 0 100px 0;
        width: 100%
    }

    .main .good_oneitem .box {
        width: 80%;
        margin: 0px
    }

    .main .good_oneitem .box img {
        width: 100%;
        height: auto;
        border-radius: 0px;
    }

    .main .good_oneitem .box .txt_box {
        font-size: 16px
    }

    .main .good_oneitem .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

}


/* good_twoitem */
.main .good_twoitem {
    overflow: hidden;
    width: 100%;
    padding: 100px 0 100px 0;
    display: block;
    clear: both;
    content: ""
}

.main .good_twoitem.bg_gray {
    background: var(--bg-border);
}

.main .good_twoitem.bg_dark {
    background: var(--dark);
}

.main .good_twoitem .box {
    max-width: 525px;
    margin: 0px 15px;
    display: inline-block;
    vertical-align: top
}

.main .good_twoitem .box img {
    width: 100%;
    text-align: center;
    border-radius: 10px;
}

.main .good_twoitem .box .txt_box {
    margin: 0px 20px
}

.main .good_twoitem .box .tit {
    font-size: 28px;
    margin: 52px auto 30px
}

@media (max-width: 1279px) {
    .main .good_twoitem {
        margin-bottom: 66px
    }

    .main .good_twoitem .box {
        margin: 0px 2%;
        max-width: 1080px;
    }

    .main .good_twoitem .box img {
        width: 100%;
        height: auto
    }

    .main .good_twoitem .box .tit {
        font-size: 24px;
        margin: 34px auto 22px
    }

    .main .good_twoitem .box .txt_box {
        margin: 0px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .main .good_twoitem {
        margin-bottom: 0px;
        padding: 0 0 100px 0;
        width: 100%
    }

    .main .good_twoitem .box {
        width: 80%;
        margin: 0px
    }

    .main .good_twoitem .box img {
        width: 100%;
        height: auto;
        border-radius: 0px;
    }

    .main .good_twoitem .box .txt_box {
        font-size: 16px
    }

    .main .good_twoitem .box .tit {
        margin: 0px auto 9px;
        font-size: 26px
    }

}



.main .customer {
    /*background: #081119 url("//dreamgreen.co.kr/assets/ui/img/main/bg_center.jpg") no-repeat 50% 0;*/
    background: var(--bg-border);
    width: 100%;
    height: 300px;
    display: block
}

.main .customer .wrap {
    max-width: 1080px
}

.main .customer .box {
    /*float: right;
    width: 540px;*/
    margin: 60px 0 0;
    color: var(--heading-color);
    font-size: 30px
}

.main .customer .box .btn {
    font-size: 14px;
    padding: 13px 25px 16px;
    margin-right: 10px
}

.main .customer .box .btn:last-child {
    margin-right: 0
}

.main .customer .box .m_lf {
    display: inline
}

@media (max-width: 1279px) {
    .main .customer {
        height: 240px
    }

    .main .customer .box {
        width: auto;
        max-width: 500px;
        min-width: 435px;
        font-size: 22px;
        margin: 50px 60px 0 0
    }

    .main .customer .box .btn {
        padding: 12px 20px
    }
}

@media (max-width: 767px) {
    .main .customer {
        height: 223px;
        background-size: auto 100%
    }

    .main .customer .box {
        float: none;
        width: 100%;
        min-width: 0;
        max-width: 320px;
        margin: 0 auto;
        padding-top: 30px;
        font-size: 17px;
        text-align: center
    }

    .main .customer .box .btn {
        margin-right: 0;
        margin-bottom: 15px
    }

    .main .customer .box .btn+.btn {
        margin-left: 10px
    }

    .main .customer .box .m_lf {
        display: block
    }
}
/* // customer*/


.main .partner {
    overflow: hidden;
    /*max-width: 1279px;*/
    width: 100%;
    margin: 108px auto 75px;
}

.main .partner .unit {
    /*width: 134px;
    height: 134px*/
}

.main .partner .unit img {
    /*width: 100%;*/
    width: 216px;
}

.main .partner .partner_slider {
    width: 100%;
    /*height: 206px*/
}

.main .partner .slick-track {
    /*height: 134px;*/
    margin: 28px 0px 28px
}

.main .partner .slick-slide {
    margin: 0px 60px
}

.main .partner .slick-active {
    position: relative;
    /*top: -25px;
    width: 178px;
    height: 178px*/
}

.main .partner div:focus {
    outline: none
}

@media (max-width: 1279px) {
    .main .partner {
        margin: 64px auto 80px
    }

    .main .partner .slick-slide {
        margin: 0px 50px
    }
}

@media (max-width: 767px) {
    .main .partner {
        max-width: 560px;
        margin: 50px auto
    }

    .main .partner .unit {
        width: 125px;
        height: 125px
    }

    .main .partner .slick-track {
        height: 63px;
        margin: 10px 0px 0px
    }

    .main .partner .slick-slide {
        margin: 0px 7px
    }

    .main .partner .slick-active {
        /*top: -10px;
        width: 83px;
        height: 83px*/
    }

    .main .partner .partner_slider {
        width: 100%;
        height: 83px
    }
}

.ie9 .main .goods_slider:before {
    display: none
}

.ie8 .main .goods_slider:before {
    display: none
}

.ie8 .main_slider .btn_box a {
    margin-left: -5px
}

.ie8 .main .goods_slider .card .box {
    top: 50%;
    margin-top: -122px
}

.ie8 .main .goods_slider .card {
    height: 450px;
    padding-top: 10px
}

@-webkit-keyframes dragIcon {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes dragIcon {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.sub_imgs {
    position: relative
}

.sub_slider {
    display: block;
    clear: both;
    width: 100%;
    height: 300px;
    background-color: #1f1e26;
    position: relative
}

.sub_slider .slick-list {
    max-width: 1920px;
    margin: 0 auto
}

.sub_slider .wrap {
    max-width: 1920px;
    margin: 0 auto
}

.sub_slider .slide {
    width: 100%;
    height: 300px;
    display: block
}

.sub_slider .txt_box {
    margin: 80px 0px 0px 150px;
    width: 570px;
    text-align: center;
    color: #ffffff;
    font-size: 28px;
    line-height: 40px
}

.sub_slider .txt_box span,
.sub_slider .txt_box strong {
    display: block
}

.sub_slider .txt_box .txt_big {
    font-weight: bold;
    font-size: 50px;
    line-height: 90px;
    margin-bottom: 14px
}

@media (max-width: 1279px) {
    .sub_slider {
        height: 300px
    }

    .sub_slider .slide {
        height: 300px;
        /*background-size: 1632px !important*/
    }

    .sub_slider .txt_box {
        margin: 90px 0px 0px 0px;
        width: 100%;
        font-size: 30px;
        line-height: 1.16
    }

    .sub_slider .txt_box .txt_big {
        margin-bottom: 17px;
        font-size: 80px;
        line-height: 1
    }
}

@media (max-width: 767px) {
    .sub_slider {
        height: 200px
    }

    .sub_slider .slide {
        height: 200px;
        background-size: auto 100% !important
    }

    .sub_slider .wrap {
        padding: 0px 6.25% 0px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sub_slider .txt_box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 70px 0px 0px;
        font-size: 18px
    }

    .sub_slider .txt_box .txt_big {
        font-size: 30px;
        margin-bottom: 17px
    }
}

.sub_slider .btn_box {
    margin: 140px 0px 0px 140px;
    width: 564px;
    height: 141px;
    position: relative;
    text-align: center
}

.sub_slider .btn_box ul {
    position: relative;
    float: right;
    left: -50%
}

.sub_slider .btn_box li {
    float: left;
    position: relative;
    left: 50%;
    margin-left: -1px;
    border: 1px solid #ffffff;
    border-radius: 15px;
    width: 141px;
    height: 141px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_slider .btn_box li a {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1.3;
    color: #ffffff;
    vertical-align: top;
    text-align: left
}

.sub_slider .btn_box li a:first-child {
    margin-left: 0px
}

.sub_slider .btn_box li a span {
    border-radius: 15px;
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 200ms;
    transition: 200ms;
    padding: 100px 0px 0px 16px
}

.sub_slider .btn_box li a:before {
    content: "";
    width: 21px;
    height: 1px;
    background: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 25px;
    left: 15px
}

.sub_slider .btn_box li a:after {
    content: "";
    width: 1px;
    height: 21px;
    background: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 15px;
    left: 25px;
    -webkit-transition: 200ms;
    transition: 200ms
}

.sub_slider .btn_box li:hover {
    background: #ffffff
}

.sub_slider .btn_box li:hover a {
    color: #222222
}

.sub_slider .btn_box li:hover span {
    padding-top: 41px
}

.sub_slider .btn_box li:hover a:before {
    background: #222222
}

.sub_slider .btn_box li:hover a:after {
    background: #222222;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.sub_slider .btn_box.global br {
    display: none
}

@media (max-width: 1279px) {
    .sub_slider .btn_box {
        margin: 103px 0px 0px 0px;
        width: 100%;
        height: 141px
    }

    .sub_slider .btn_box li {
        border-radius: 10px
    }

    .sub_slider .btn_box li a span {
        padding: 100px 0px 0px 16px
    }

    .sub_slider .btn_box li a:before {
        width: 21px;
        top: 25px;
        left: 15px
    }

    .sub_slider .btn_box li a:after {
        height: 21px;
        top: 15px;
        left: 25px
    }

    .sub_slider .btn_box li a:hover span {
        padding-top: 41px
    }
}

@media (max-width: 767px) {
    .sub_slider .btn_box {
        margin: 102px 0px 0px 0px;
        width: 100%;
        height: auto
    }

    .sub_slider .btn_box li {
        width: 70px;
        height: 70px;
        border-radius: 5px
    }

    .sub_slider .btn_box li a {
        font-size: 12px
    }

    .sub_slider .btn_box li a span {
        padding: 40px 0px 0px 7px
    }

    .sub_slider .btn_box li a:before {
        width: 9px;
        top: 14px;
        left: 10px
    }

    .sub_slider .btn_box li a:after {
        height: 9px;
        top: 10px;
        left: 14px
    }

    .sub_slider .btn_box li a:hover span {
        padding-top: 22px
    }

    .sub_slider .btn_box li a:hover:before {
        opacity: 0
    }

    .sub_slider .btn_box.global br {
        display: block
    }

    .sub_slider .btn_box.global li a span {
        padding: 31px 0px 0px 10px
    }

    .sub_slider .btn_box.global li a:hover span {
        padding-top: 22px
    }
}

.sub_slider .slick-dots {
    position: absolute;
    top: 363px;
    left: 50%;
    width: 100%;
    max-width: 1920px;
    text-align: left;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.sub_slider .slick-dots li {
    display: inline-block;
    margin-right: 26px
}

.sub_slider .slick-dots li:first-child {
    margin-left: 378px
}

.sub_slider .slick-dots li:last-child {
    margin-right: 0px
}

.sub_slider .slick-dots li button {
    width: 8px;
    height: 8px;
    border-radius: 25px;
    background: #fff;
    opacity: 0.5;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    vertical-align: middle
}

.sub_slider .slick-dots li.slick-active button {
    width: 14px;
    height: 14px;
    background: none;
    border: 3px solid #ffffff;
    opacity: 1
}

@media (max-width: 1279px) {
    .sub_slider .slick-dots {
        top: 296px;
        left: 0;
        width: 100%;
        line-height: 10px;
        text-align: center;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    .sub_slider .slick-dots li:first-child {
        margin-left: 0
    }
}

@media (max-width: 767px) {
    .sub_slider .slick-dots {
        top: 228px
    }

    .sub_slider .slick-dots li button {
        width: 8px;
        height: 8px
    }

    .sub_slider .slick-dots li.slick-active button {
        width: 14px;
        height: 14px;
        border: 3px solid #ffffff
    }
}

.sub_slider .btn_arrow {
    position: absolute;
    z-index: 1;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100px;
    border-bottom: 1px solid #ffffff;
    color: #ffffff;
    font-size: 16px;
    line-height: 38px;
    opacity: 0.3;
    text-transform: uppercase
}

.sub_slider .btn_arrow.btn_prev {
    left: 0px;
    text-align: right;
    padding-right: 10px
}

.sub_slider .btn_arrow.btn_next {
    right: 0px;
    text-align: left;
    padding-left: 10px
}

.sub_slider .btn_arrow.slick-disabled {
    opacity: 0.3
}

.sub_slider .btn_arrow:hover {
    opacity: 1
}

@media (max-width: 1279px) {
    .sub_slider .btn_arrow {
        width: 64px;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .sub_slider .btn_arrow {
        display: none !important
    }
}


/*sub*/
.sub .bg_gray {
    background: var(--bg-border);
}

.sub.buda .bg_buda {
    background: var(--bg-buda);    
    /*background: url("//dreamgreen.co.kr/assets/ui/img/bptrail/buda_bg.png") no-repeat 0 0;
    background-size: 100%;*/
    color:var(--heading-buda-color);
}

.sub .bg_gra {
    color: #ffffff;
    background-color: #ff7747;
    background: -webkit-gradient(linear, right top, left top, from(#ff7747), to(#ffaf84));
    background: linear-gradient(to left, #ff7747, #ffaf84);
    background: -o-linear-gradient(to left, #ff7747, #ffaf84)
}

.sub .top_visual {
    width: 100%;
    height: 580px;
    position: relative;
    overflow: hidden;
    background-size: auto 100% !important;
    font-size: 15px;
    color: #ffffff
}

.sub .top_visual.big {
    width: 100%;
    height: 768px;
    position: relative;
    overflow: hidden;
    background-size: auto 100% !important;
    font-size: 15px;
    color: #ffffff
}

.sub .top_visual .sub-title {
    width: 300px;
    margin: auto;
}

.sub .top_visual span {
    display: block
}

.sub .top_visual .location {
    margin: 0px auto 70px
}

.sub .top_visual .location a {
    color: #ffffff
}

.sub .top_visual .video {
    position: absolute;
    left: 50%;
    /*height: 100%;*/
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0.5
}

.sub .top_visual .align {
    max-width: 1080px;
    width: 100%;
    position: relative;
    top: 110px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub .top_visual .logo_pro {
    height: 34px
}

.sub .top_visual .logo_pro+h1 {
    margin: 30px 0px 60px
}

.sub.info .top_visual {
    width: 100%;
    height: 300px;
    position: relative;
    overflow: hidden;
    background-size: auto 100% !important;
    font-size: 15px;
    color: #ffffff
}

.sub.info .top_visual span {
    display: block
}

.sub.info .top_visual .location {
    margin: 0px auto 50px
}

.sub.info .top_visual .location a {
    color: #ffffff
}

@media (max-width: 1279px) {
    .sub .top_visual .logo_pro+h1 {
        margin: 15px 0 50px
    }
}

@media (max-width: 767px) {
    .sub .top_visual .logo_pro {
        height: 20px
    }

    .sub .top_visual .logo_pro+h1 {
        margin: 12px 0px 0px
    }

    .sub.info .top_visual {
        width: 100%;
        height: 200px;
    }
}

.sub .top_visual .logo_company {
    height: 34px
}

.sub .top_visual .logo_company+h1 {
    margin: 30px 0px 60px
}

@media (max-width: 1279px) {
    .sub .top_visual .logo_company+h1 {
        margin: 15px 0 50px
    }
}

@media (max-width: 767px) {
    .sub .top_visual .logo_company {
        height: 20px
    }

    .sub .top_visual .logo_company+h1 {
        margin: 12px 0px 0px
    }
}
.sub .top_visual h1 {
    margin: 0px 0px 30px
}

.sub.buda .top_visual h1 {
    margin: 0px 0px 30px;
    writing-mode: horizontal-tb;
    max-height: 400px;
}

.sub.buda .bx_goods .sub_tit {
    font-weight: 600;
    margin: 0px 0px 10px;
}

.sub.buda .bx_goods .sub_img img {
    position: relative;
    width: 48%;
    margin: 5px 2px 5px 2px;
    border-radius: 10px;
}

.sub .top_visual .ico_beta {
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    content: "";
    width: 34px;
    height: 18px;
    display: inline-block;
    position: relative;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_beta_w.svg") no-repeat 0 0;
    vertical-align: middle;
    margin: 4px 0 0 6px
}

.sub .top_visual .ico_beta+h1 {
    margin: 30px 0px 60px
}

@media (max-width: 1279px) {
    .sub .top_visual .ico_beta+h1 {
        margin: 15px 0 50px
    }
}

@media (max-width: 767px) {
    .sub .top_visual .ico_beta {
        height: 20px
    }

    .sub .top_visual .ico_beta+h1 {
        margin: 15px 0px 0px
    }
}

.sub .top_visual .sub_title {
    font-size: 24px;
    line-height: 1.6
}

.sub .top_visual .ico_player {
    background: url("//dreamgreen.co.kr/assets/ui/img/sub/ico_player.svg") no-repeat 0 0;
    background-size: 100%;
    content: "";
    width: 80px;
    height: 80px;
    display: inline-block;
    position: relative;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

.sub .top_visual.has_srch {
    height: 300px;
    background-size: cover !important
}

.sub .top_visual.has_srch h1 {
    display: inline-block
}

.sub .top_visual.has_srch form {
    float: right;
    width: 540px
}

@media (max-width: 1279px) {
    .sub .top_visual.has_srch {
        height: 357px
    }

    .sub .top_visual.has_srch form {
        width: 344px
    }
}

@media (max-width: 767px) {
    .sub .top_visual.has_srch {
        height: 200px
    }

    .sub .top_visual.has_srch form {
        float: none;
        width: 100%
    }
}

@media (max-width: 1279px) {
    .sub .top_visual {
        height: 578px
    }

    .sub .top_visual .location {
        margin: 0px auto 90px;
        margin-left: -4.62%;
        padding: 0px
    }

    .sub .top_visual .align {
        top: 80px;
        padding: 0px 7.8%
    }

    .sub .top_visual h1 {
        margin: 0px 0px 15px
    }

    .sub .top_visual .ico_player {
        width: 72px;
        height: 72px
    }
}

@media (max-width: 767px) {
    .sub .top_visual {
        height: 360px
    }

    .sub .top_visual .align {
        max-height: 270px;
        padding: 0px 9.37%;
        top: 80px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        overflow: hidden
    }

    .sub .top_visual h1 {
        margin: 0px 0px 15px;
        font-size: 23px;
        line-height: 33px
    }

    .sub .top_visual .sub_title {
        font-size: 14px
    }

    .sub .top_visual .ico_player {
        width: 45px;
        height: 45px;
        display: none
    }

    .sub.buda .top_visual h1 {
        max-height: 270px;
    }

}

.sub .sub_menu {
    width: 100%;
    height: 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid var(--header-bottom_bar);
    background: var(--bg-color);
    overflow: visible;
    position: relative;
    -webkit-transition: -webkit-transform 400ms;
    transition: -webkit-transform 400ms;
    transition: transform 400ms;
    transition: transform 400ms, -webkit-transform 400ms
}

.sub.buda .sub_menu {
    width: 100%;
    height: 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid var(--buda-black);
    background: var(--bg-buda-color);
    overflow: visible;
    position: relative;
    -webkit-transition: -webkit-transform 400ms;
    transition: -webkit-transform 400ms;
    transition: transform 400ms;
    transition: transform 400ms, -webkit-transform 400ms
}

.sub.buda .sub_menu a {
    color:#fff;
}

.sub .sub_menu.s_purchase {
    height: 143px;
    border-bottom: none
}

.sub .sub_menu.s_purchase .wrap {
    height: 59px
}

.sub .sub_menu.s_purchase .inner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #ededed;
    background: #ffffff
}

.sub .sub_menu.s_purchase.fix {
    position: relative;
    top: auto;
    z-index: auto;
    height: 143px
}

.sub .sub_menu.s_purchase.fix .inner {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 5
}

.sub .sub_menu .wrap {
    height: 100%;
    max-width: 1080px
}

.sub .sub_menu .wrap:after {
    display: block;
    clear: both;
    content: ""
}

.sub .sub_menu a {
    font-size: 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 60px;
    padding: 0 20px;
    display: block;
    position: relative
}

.sub .sub_menu a .m_show {
    display: none
}

@media (max-width: 767px) {
    .sub .sub_menu a .m_show {
        display: inline
    }
}

.sub .sub_menu a span:not(.m_show) {
    display: inline
}

@media (max-width: 767px) {
    .sub .sub_menu a span:not(.m_show) {
        display: none
    }
}

@media (max-width: 1279px) {
    .sub .sub_menu {
        padding: 0 30px
    }

    .sub .sub_menu.s_purchase {
        padding: 0
    }

    .sub .sub_menu.s_purchase .inner {
        padding: 0 30px
    }

    .sub .sub_menu a {
        padding: 0 10px;
        margin-right: 10px
    }

    .sub .sub_menu a:last-child {
        margin-right: 0px
    }
}

@media (max-width: 767px) {
    .sub .sub_menu {
        height: 45px;
        padding: 0px 4.68%
    }

    .sub .sub_menu.s_purchase {
        height: 191px
    }

    .sub .sub_menu.s_purchase.fix {
        height: 191px
    }

    .sub .sub_menu.s_purchase .wrap {
        padding: 0px 4.68%;
        height: 44px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sub .sub_menu.s_purchase .inner {
        padding: 0
    }

    .sub .sub_menu.s_purchase .right {
        bottom: 215px;
        padding: 0px 7.9%
    }

    .sub .sub_menu a {
        line-height: 45px;
        padding: 0 10px
    }

    .sub .sub_menu a:last-child {
        margin-right: auto
    }
}

.sub .sub_menu .iscroll {
    position: relative;
    z-index: 1;
    width: calc(100% - 450px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 60px;
    overflow: hidden;
    -ms-touch-action: none;
    float: left
}

.sub .sub_menu .iscroll a.on {
    font-weight: 600
}

.sub .sub_menu .iscroll a.on:before {
    content: "";
    width: 100%;
    height: 2px;
    display: block;
    position: absolute;
    background: var(--nav-color);
    bottom: 1px;
    left: 0px
}

.sub.buda .sub_menu .iscroll a.on:before {
    content: "";
    width: 100%;
    height: 2px;
    display: block;
    position: absolute;
    background: var(--white);
    bottom: 1px;
    left: 0px
}

.sub .sub_menu .iscroll ul {
    width: 100%;
    padding: 0;
    margin: 0
}

.sub .sub_menu .iscroll ul:after {
    display: block;
    clear: both;
    content: ""
}

.sub .sub_menu .iscroll li {
    float: left
}

@media (max-width: 1279px) {
    .sub .sub_menu .iscroll {
        width: calc(100% - 400px)
    }

    .sub .sub_menu .iscroll li {
        margin-right: 20px
    }

    .sub .sub_menu .iscroll li:last-child {
        margin: 0px
    }
}

@media (max-width: 767px) {
    .sub .sub_menu .iscroll {
        width: 100%;
        height: 45px
    }

    .sub .sub_menu .iscroll li {
        margin-right: 10px
    }

    .sub .sub_menu .iscroll a {
        font-size: 13px;
        padding: 0 5px
    }
}

.sub .sub_menu #scroller {
    position: absolute;
    z-index: 1;
    width: 2400px;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -o-text-size-adjust: none;
    text-size-adjust: none
}

.sub .sub_menu .right {
    float: right
}

.sub .sub_menu .right a {
    float: left;
    position: relative
}

.sub .sub_menu .right a:not(.btn_squ):first-child {
    padding-left: 0
}

.sub .sub_menu .right a.btn_down {
    font-weight: 600
}

.sub .sub_menu .btn_squ {
    color: #ffffff;
    background: #000000;
    font-size: 20px;
    font-weight: 600;
    padding: 19px 29px 20px;
    margin-left: 20px;
    line-height: 1
}

.sub .sub_menu .btn_squ.disable {
    background: #cccccc
}

.sub .sub_menu .ico_download {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 2px;
    background-color: #222222;
    margin-left: 14px
}

.sub .sub_menu .ico_download:before {
    content: '';
    position: absolute;
    bottom: 8px;
    border-top: 2px solid #222222;
    border-left: 2px solid #222222;
    left: 50%;
    width: 4px;
    height: 4px;
    -webkit-transform: translate(-50%, 50%) rotate(-135deg);
    -ms-transform: translate(-50%, 50%) rotate(-135deg);
    transform: translate(-50%, 50%) rotate(-135deg)
}

.sub .sub_menu .ico_download:after {
    content: '';
    position: absolute;
    background-color: #222222;
    bottom: 4px;
    left: 50%;
    width: 2px;
    height: 9px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.sub .sub_menu .ico_win {
    display: inline-block;
    width: 17px;
    height: 18px;
    margin-left: 14px;
    vertical-align: -2px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win_black.svg") no-repeat 0;
    background-size: 17px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

@media (max-width: 1279px) {
    .sub .sub_menu .right .btn_squ {
        margin-right: -33px;
        margin-left: 10px
    }

    .sub .sub_menu .btn_squ {
        margin: 0px
    }
}

@media (max-width: 767px) {
    .sub .sub_menu .right {
        position: absolute;
        width: 100%;
        padding: 0px 4.69%;
        bottom: 69px;
        right: 0px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sub .sub_menu .right a {
        display: none;
        float: none
    }

    .sub .sub_menu .right a.show_dv {
        display: block
    }

    .sub .sub_menu .right a .ico_win {
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win_wh.svg") no-repeat 0;
        background-size: 17px
    }

    .sub .sub_menu .right .btn_squ {
        margin-right: 0px;
        margin-left: 0
    }

    .sub .sub_menu .btn_squ,
    .sub .sub_menu .btn_down {
        border-radius: 3px;
        font-size: 13px;
        padding: 12px 16px;
        width: 100%;
        margin: 5px auto;
        text-align: center
    }

    .sub .sub_menu .btn_down {
        display: inline-block !important;
        background: none;
        color: #ffffff;
        line-height: 1;
        padding: 11px 16px;
        border: 1px solid rgba(255, 255, 255, 0.6)
    }

    .sub .sub_menu .btn_down:first-child {
        margin-right: 20px
    }

    .sub .sub_menu .ico_download {
        background: #ffffff;
        margin-left: 10px
    }

    .sub .sub_menu .ico_download:before {
        border-color: #ffffff
    }

    .sub .sub_menu .ico_download:after {
        background-color: #ffffff
    }
}

.sub .sub_menu.fix {
    position: fixed;
    top: 0px;
    z-index: 4
}

.sub .sub_menu.fix .tip_info {
    display: none
}


/*sub container*/
.sub .container {
    font-size: 18px;
    min-height: 400px
}

.sub .container .wrap,
.sub .container .goods_point {
    padding: 80px 0px;
    max-width: 1080px;
    margin: 0 auto
}

.sub .container .wrap:after,
.sub .container .goods_point:after {
    display: block;
    clear: both;
    content: ""
}

.sub .container .wrap.product {
    padding-bottom: 0
}

.sub .container .goods_point {
    padding: 100px 0px 120px
}

.sub .container .bx_netcafe {
    padding: 80px 0 0
}

.sub .container .bx_netcafe .tbl_tit.center {
    margin-top: 0;
    padding-bottom: 0
}

.sub .container h2.blind+.bx_goods .wrap {
    padding: 60px 0 80px
}

.sub.buda .container h2.blind+.bx_goods .wrap {
    padding: 60px 0 0px
}

@media (max-width: 1279px) {
    .sub .container {
        font-size: 16px;
        min-height: unset
    }

    .sub .container .wrap,
    .sub .container .goods_point {
        padding: 70px 3.9%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sub .container .goods_point {
        padding: 80px 3.9% 100px
    }

    .sub .container .bx_netcafe {
        padding: 70px 3.9% 0
    }

    .sub .container h2.blind+.bx_goods .wrap {
        padding: 70px 3.9%
    }
}

@media (max-width: 767px) {
    .sub .container {
        font-size: 13px;
        width: 100%
    }

    .sub .container .wrap {
        padding: 50px 6.25%
    }

    .sub .container .goods_point {
        padding: 60px 6.25% 80px
    }

    .sub .container .bx_netcafe {
        padding: 50px 6.25% 0
    }

    .sub .container h2.blind+.bx_goods .wrap {
        padding: 50px 6.25%
    }
}


.sub .container .bx_goods {
    text-align: left
}

.sub .container .bx_goods .left {
    float: left
}

.sub .container .bx_goods .left .ico {
    max-width: 546px;   
}

.sub .container .bx_goods .left .zoom img {
    max-width: 100%;  
    border-radius: 10px;   
}

.sub .container .bx_goods .left .zoom #buda {
    max-width: 600px;  
    border-radius: 0px;   
}

.sub .container .bx_goods .left .zoom .ci_img {
    width: 100%;
    /*border: 1px solid var(--box-border);*/
}

.sub .container .bx_goods .left .zoom .ci-logo-info {
    width: 90%;
    background: url("//dreamgreen.co.kr/assets/ui/img/company/ci-info-bg.png") repeat;
}

.sub .container .bx_goods .txt_box .brand-r {
    vertical-align: top;
    font-size: 10px;
    margin: -2px 4px 0 1px;
}

.sub .container .bx_goods .left .ico img {
    float: left;
    width: 100px;
    border-radius: 10px;
    margin: 5px 5px 0 0;
}

.sub .container .bx_goods .right {
    float: right
}

.sub .container .bx_goods .right .zoom img {
    width: 100%;  
    border-radius: 10px;   
}

.sub .container .bx_goods .right .ico img {
    float: left;
    width: 100px;
    border-radius: 10px;
    margin: 5px 5px 0 0;
}

.sub .container .bx_goods .btn {
    margin: 50px 6px 0 0
}

.sub .container .bx_goods .btn+.btn,
.sub .container .bx_goods .btn+.pop_tuto+.btn {
    margin-top: 10px
}

.sub .container .bx_goods.bg_gra+.google_bnr,
.sub .container .bx_goods.bg_gra+.google_bnr_tp2,
.sub .container .bx_goods.bg_gra+.google_bnr_tp2 {
    margin-top: 30px
}

.sub .container .bx_goods+.google_bnr,
.sub .container .bx_goods+.google_bnr_tp2,
.sub .container .bx_goods+.google_bnr_tp2 {
    margin-top: 0px
}

.sub .container .bx_goods+.bx_qna {
    margin-top: 120px
}

.sub .container .bx_goods .detail_box .detail_img {
    width: 100%;
    margin-bottom: 20px
}

.sub .container .bx_goods .text_box {
    margin-top: 50px;
    float: left;
}

.sub_f .container .bx_goods .map_box {
    margin-top: -20px;
}

.sub_f .container .bx_goods .addr_box {
    margin-top: 20px;
    overflow: hidden;
}

.sub_f .container .bx_goods .addr_box .addr_left {
    width: 50%;
    float: left;
    line-height: 1.8;
    margin-top: 50px;
}

.sub_f .container .bx_goods .addr_box .addr_right {
    width: 50%;
    float: right;
    margin-top: 50px;
    line-height: 1.8;
    text-align: left;    
    margin-left: -1px;
    border-left: 1px solid #e5e5e5;
}

.sub_f .container .bx_goods .addr_box .addr_left dl {
    overflow: hidden;
    line-height: 1.8;
}

.sub_f .container .bx_goods .addr_box dl dt {
    float: left;
    font-weight: 600;
    padding-right: 6px;
}

.sub_f .container .bx_goods .addr_right h3, .sub_f .container .bx_goods .addr_right dl {
    padding-left: 68px;
    padding-bottom: 0.5em;
}

.sub_f .container .bx_goods h3 {
    font-size: 24px;
    margin-bottom: 5px;
    color: #333333;
}

@media (max-width: 1279px) {

    .sub .container .bx_goods .left,
    .sub .container .bx_goods .right {
        width: 49%
    }

    .sub .container .bx_goods img {
        width: 100%
    }

    .sub .container .bx_goods.bg_gra+.google_bnr,
    .sub .container .bx_goods.bg_gra+.google_bnr_tp2,
    .sub .container .bx_goods.bg_gra+.google_bnr_tp2 {
        margin-top: 15px
    }

    .sub .container .bx_goods .btn {
        margin: 26px 6px 0 auto
    }

    .sub .container .bx_goods+.bx_qna {
        margin-top: 100px
    }
}

@media (max-width: 767px) {
    .sub .container .bx_goods .wrap {
        padding: 50px 6.25%
    }

    .sub .container h2.blind+.bx_goods .wrap.buda {
        padding: 50px 6.25%
    }

    .sub .container .bx_goods .left .zoom img#buda {
        max-width: 100%;  
        border-radius: 0px;   
    }    

    .sub .container .bx_goods .left,
    .sub .container .bx_goods .right {
        width: 100%;
        margin: 0 auto;
        /*float: none;*/
        text-align: center
    }

    .sub .container .bx_goods .txt_box h2,
    .sub .container .bx_goods .txt_box p {
        text-align: left;
        line-height: 1.7
    }

    .sub .container .bx_goods .txt_box h2 {
        margin-bottom: 10px
    }

    .sub .container .bx_goods+.bx_qna {
        margin-top: 80px
    }

    .sub .container .bx_goods .left .ico img {
        width: 80px;
        margin: 5px 5px 0 0;
    }

    .sub .container .bx_goods .ci_down {
        text-align: left;
        padding: 0 0 0 30%;
    }

    .sub_f .container .bx_goods .addr_box .addr_left {
        width: 100%;
    }

    .sub_f .container .bx_goods .addr_box .addr_right {
        width: 100%;
    }

    .sub_f .container .bx_goods .addr_right h3, .sub_f .container .bx_goods .addr_right dl {
    padding-left: 0px;
    padding-bottom: 0.5em;
}
}

.sub .container .txt_box {
    text-align: left;
    vertical-align: top;
    width: 436px
}

.sub .container .txt_box.sm {
    width: 368px
}

.sub .container .txt_box.sm+.right {
    width: 712px
}

.sub .container .txt_box.big {
    width: 660px
}

.sub .container .txt_box.big+.right {
    width: 420px
}

/*
@media (min-width: 1279px) {
    .sub .container .txt_box.gmp h2 {
        margin: 55px 0
    }

    .sub .container .txt_box.gmx h2 {
        margin: 55px 0
    }

    .sub .container .txt_box.gau h2 {
        margin: 55px 0
    }

    .sub .container .txt_box.grc h2 {
        margin: 55px 0
    }

    .sub .container .txt_box.gst h2 {
        margin: 55px 0
    }
}
*/

.sub .container .txt_box h2 {
    margin: 10px 0px 33px
}

.sub .container .txt_box .txt_bg {
    margin-bottom: 14px
}

.sub .container .txt_box .row {
    margin-top: 33px
}

.sub .container .txt_box .row a.link {
    display: block
}

@media (max-width: 1279px) {

    .sub .container .txt_box.left,
    .sub .container .txt_box.right {
        width: 47%
    }

    .sub .container .txt_box.sm {
        width: 34%
    }

    .sub .container .txt_box.sm+.right {
        width: 65%
    }

    .sub .container .txt_box.big {
        width: 100%
    }

    .sub .container .txt_box.big+.right {
        width: 100%
    }

    .sub .container .txt_box p {
        max-width: 350px
    }

    .sub .container .txt_box.gmx h2 {
        margin: 0
    }

    .sub .container .txt_box h2 {
        margin: 0px 0px 14px
    }

    .sub .container .txt_box .txt_bg {
        margin-bottom: 8px
    }

    .sub .container .txt_box .row {
        margin-top: 14px
    }
}

@media (max-width: 767px) {
    .sub .container .txt_box {
        margin: 0 auto
    }

    .sub .container .txt_box.left,
    .sub .container .txt_box.right {
        width: 100%
    }

    .sub .container .txt_box.sm {
        width: 100%
    }

    .sub .container .txt_box.sm+.right {
        width: 100%
    }

    .sub .container .txt_box h2 {
        margin: 35px 0px 0px
    }

    .sub .container .txt_box h2 br {
        display: none
    }

    .sub .container .txt_box p {
        max-width: 100%
    }

    .sub .container .txt_box .tag {
        margin: 0px auto 14px
    }

    .sub .container .txt_box .txt_bg {
        margin-top: 0px;
        margin-bottom: 14px
    }

    .sub .container .txt_box .row {
        margin-top: 24px;
        text-align: left
    }
}

.sub .container .bg_gra h2 {
    font-weight: 600
}

.sub .container .bg_gra .wrap {
    min-height: 227px;
    padding: 70px 0
}

.sub .container .bg_gra .right {
    width: 644px;
    text-align: center;
    position: absolute;
    top: 50%;
    right: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub .container .bg_gra .txt_box .tag.guide {
    margin-top: 11px
}

@media (max-width: 1279px) {
    .sub .container .bg_gra .wrap {
        min-height: unset;
        position: relative;
        text-align: left;
        padding: 70px 10.2%
    }

    .sub .container .bg_gra h2 {
        margin-bottom: 0px
    }

    .sub .container .bg_gra h2 br {
        display: none
    }

    .sub .container .bg_gra h2+p {
        margin-top: 40px
    }

    .sub .container .bg_gra .txt_box p {
        max-width: 100%
    }

    .sub .container .bg_gra .txt_box .row {
        margin-top: 50px
    }

    .sub .container .bg_gra .txt_box .txt_bg {
        margin-bottom: 20px
    }

    .sub .container .bg_gra .txt_box .tag {
        margin-bottom: 30px
    }

    .sub .container .bg_gra .txt_box .tag br {
        display: block
    }

    .sub .container .bg_gra .left {
        Width: 100%;
        padding: 0;
        float: none;
        display: inline-block;
        margin: 0
    }

    .sub .container .bg_gra .right {
        Width: 100%;
        display: inline-block;
        margin: 50px 0px 0px;
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        float: none
    }
}

@media (max-width: 767px) {
    .sub .container .bg_gra .wrap {
        padding: 50px 12.5% 30px
    }

    .sub .container .bg_gra .txt_box h2 {
        text-align: left;
        margin: 0px
    }

    .sub .container .bg_gra .txt_box h2+p {
        margin: 24px 0px 0px
    }

    .sub .container .bg_gra .txt_box .row {
        margin-top: 30px
    }

    .sub .container .bg_gra .txt_box .tag {
        margin-bottom: 14px
    }

    .sub .container .bg_gra .txt_box .tag.guide {
        margin-top: 5px
    }

    .sub .container .bg_gra .left {
        margin: 0
    }

    .sub .container .bg_gra .right {
        margin: 20px 0px 0px
    }
}

.sub .container .down_box {
    width: 160px;
    margin: 0px 8px;
    display: inline-block;
    text-align: center
}

.sub .container .down_box:last-child {
    margin-right: 0px
}

.sub .container .down_box em,
.sub .container .down_box span {
    display: block;
    margin: 0 auto
}

.sub .container .down_box .txt {
    margin-top: 14px;
    overflow: hidden
}

.sub .container .down_box .link.white {
    display: block;
    margin-top: 18px;
    font-size: 14px
}

.sub .container .down_box .btn {
    margin-top: 24px
}

.sub .container .down_box .ico_win {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win_wh.svg") no-repeat 0 0;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    content: "";
    width: 61px;
    height: 61px;
    display: inline-block;
    position: relative;
    background-size: 100%
}

.sub .container .down_box .ico_app {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mac_wh.svg") no-repeat 0 0;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    content: "";
    width: 61px;
    height: 61px;
    display: inline-block;
    position: relative;
    background-size: 100%
}

@media (max-width: 1279px) {
    .sub .container .down_box {
        margin: 0px 0px;
        width: 26%;
        min-width: 160px
    }

    .sub .container .down_box:first-child {
        margin: 0px
    }

    .sub .container .down_box+.down_box {
        margin-left: 30px
    }

    .sub .container .down_box .ico_win {
        width: 54px;
        height: 54px
    }

    .sub .container .down_box .link.white {
        font-size: 13px
    }
}

@media (max-width: 767px) {
    .sub .container .down_box {
        width: 150px;
        min-width: unset;
        margin: 20px 10px !important
    }
}

.sub .container .cover {
    position: relative;
    display: inline-block;
    min-width: 300px;
    padding: 40px 0px;
    border: 3px dotted #ffffff;
    border-radius: 15px
}

.sub .container .cover .down_box:last-child {
    margin-right: 8px
}

.sub .container .cover strong {
    position: absolute;
    min-width: 300px;
    top: -38px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 16px;
    padding: 0px 10px;
    line-height: 1.2
}

@media (max-width: 1279px) {
    .sub .container .cover {
        width: 67%;
        min-width: 406px;
        margin: 30px 0px 0px 24px;
        padding: 40px 24px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: center
    }

    .sub .container .cover .down_box {
        margin: 0px;
        width: 45%
    }

    .sub .container .cover .down_box:last-child {
        margin: 0px
    }

    .sub .container .cover .down_box+.down_box {
        margin-left: 24px
    }
}

@media (max-width: 767px) {
    .sub .container .cover {
        width: 120%;
        min-width: 100%;
        padding: 20px 10%;
        margin: 50px -10% 20px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sub .container .cover .down_box {
        width: 150px;
        margin: 20px 10px !important
    }
}

.sub .container .tbl_veiw th {
    vertical-align: middle;
    width: 180px
}

.sub .container .tbl_veiw a {
    /*text-decoration: underline;*/
    font-weight: 600
}

@media (max-width: 1279px) {
    .sub .container .tbl_veiw th {
        width: 18%
    }
}

.sub .container+.bx_qna.wrap {
    margin: 0 auto
}

@media (max-width: 767px) {
    .sub .container+.bx_qna.wrap {
        margin: 10px auto 0
    }
}

.sub .bx_qna.wrap {
    max-width: 1080px;
    margin: 0 auto;
    padding: 34px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub .bx_qna.wrap+.goods_point {
    padding-top: 0px
}

@media (max-width: 1279px) {
    .sub .bx_qna.wrap {
        padding: 20px 30px;
        width: 92.2%
    }
}

@media (max-width: 767px) {
    .sub .bx_qna.wrap {
        padding: 20px 20px 30px;
        width: 87.5%;
        line-height: 1.7
    }
}

.sub .product h2 {
    margin-bottom: 60px
}

.sub .product .tbl_veiw th {
    font-weight: 600;
    width: 220px;
    text-align: center;
    vertical-align: middle
}

.sub .product .tbl_veiw td {
    padding: 22px 30px
}

@media (max-width: 1279px) {
    .sub .product h2 {
        margin-bottom: 33px
    }

    .sub .product .tbl_veiw th {
        width: 23%
    }

    .sub .product .tbl_veiw td {
        padding: 18px 2.6%
    }
}

@media (max-width: 767px) {
    .sub .product h2 {
        margin-bottom: 37px
    }
}

.sub .goods_point {
    text-align: center
}

.sub .goods_point .cont {
    overflow: hidden;
    margin: 60px auto 0px
}

.sub .goods_point .box {
    display: inline-block;
    vertical-align: top;
    width: 96%;
    padding: 0 28px
}

.sub .goods_point .box em {
    display: block;
    margin-bottom: 20px;
    color: #6c96ff;
    letter-spacing: 0.5px;
    font-weight: 600
}

.sub .goods_point .box p {
    word-break: keep-all;
    text-align: left;
    font-size: 16px;
}

.sub .goods_point .box p strong {
    display: block;
    font-size: 17px;
    margin-bottom: 10px
}

.sub .goods_point .box p strong br {
    display: none
}

.sub .goods_point .box .img-box {
    padding: 0 0 12px 0;
}

.sub .goods_point .box .txt-box {
    padding: 30px;
    border: solid 1px var(--box-border);
    background: var(--box-bg);
}

.sub .goods_point .box .txt-box .title {
    font-size: 18px;
    font-weight: 600;
    padding-top: 20px;
}

.sub .goods_point .box .txt-box .emp {
    color: var(--red);
}

.sub .goods_point .box img {
    width: 198px;
}

.sub .goods_point .box .img-box .boximg {
    margin-left: 8px;
}

.sub .goods_point .box .img-box .boximg.first {
    margin-left: 0px;
}

.sub .goods_point .box.sm {
    width: 235px;
    padding: 0 15px
}

.sub .goods_point .box.box_visual {
    width: auto;
    margin: 60px auto 100px
}

.sub .goods_point .box.box_visual img {
    width: 100%;
    max-width: 808px;
    height: auto
}

.sub .goods_point .box.box_visual.tp2 {
    margin: 0 auto 60px
}

.sub .goods_point .row {
    margin-bottom: 24px;
    font-size: 13px;
    line-height: 22px
}

@media (max-width: 1279px) {
    .sub .goods_point .cont {
        margin: 44px auto 0px
    }

    .sub .goods_point .cont+.btn.big,
    .sub .goods_point .cont+.row {
        margin-top: 44px
    }

    .sub .goods_point .box {
        /*width: 26%;*/
        width: 100%;
        padding: 0px 3.3%
    }

    .sub .goods_point .box img {
        height: 112px
    }

    .sub .goods_point .box.sm {
        width: 150px;
        padding: 0 10px
    }

    .sub .goods_point .box p {
        margin-top: 44px
    }

    .sub .goods_point .box p strong {
        font-size: 15px
    }

    .sub .goods_point .box p strong br {
        display: block
    }
}

@media (max-width: 767px) {
    .sub .goods_point h2 br {
        display: none
    }

    .sub .goods_point h2.sep {
        word-break: break-all
    }

    .sub .goods_point h2.sep br {
        display: block
    }

    .sub .goods_point .cont {
        margin: 42px auto 0px
    }

    .sub .goods_point .cont+.btn.big,
    .sub .goods_point .cont+.row {
        margin-top: 42px
    }

    .sub .goods_point .box {
        width: 100%;
        margin-bottom: 46px;
        padding: 0px
    }

    .sub .goods_point .box:last-child {
        margin-bottom: 0px
    }

    .sub .goods_point .box img {
        height: 107px
    }

    .sub .goods_point .box.box_visual {
        margin: 30px auto 50px
    }

    .sub .goods_point .box.sm {
        width: 100%;
        padding: 0
    }

    .sub .goods_point .box+.box {
        margin-left: 0
    }

    .sub .goods_point .box p {
        /*width: 200px;*/
        margin: 20px auto 0px;
        font-size: 13px
    }

    .sub .goods_point .box p strong br {
        display: block
    }

    .sub .goods_point .box .txt-box .title {
        padding-top: 0px;
    }

    .sub .goods_point .box .txt-box {
        padding: 20px;
    }
}

.sub .partner {
    /*margin-top: 120px;*/
    text-align: center;
    border-top: 1px solid #ededed;
}

.sub .partner .partner_slider {
    margin: 60px auto 20px;
    height: 70px;
    position: relative
}

.sub .partner .partner_slider img {
    width: 100%
}

.sub .partner .slick-list {
    height: 100%
}

.sub .partner .slick-slide {
    margin: 0px 27px
}

.sub .partner .slick-arrow {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub .partner .unit {
    width: 216px;
    height: 100%;
    display: block;
    border-radius: 6px
}

@media (max-width: 1279px) {
    .sub .partner {
        margin-top: 100px
    }

    .sub .partner .wrap {
        padding-left: 0;
        padding-right: 0
    }

    .sub .partner .partner_slider {
        margin: 49px auto 0px;
        height: 64px
    }

    .sub .partner .slick-slide {
        margin: 0px 15px
    }

    .sub .partner .unit {
        width: 190px
    }

    .sub .partner .slick-arrow {
        display: none !important
    }
}

@media (max-width: 767px) {
    .sub .partner {
        margin-top: 80px
    }

    .sub .partner .partner_slider {
        margin: 23px auto 0px;
        height: 41px
    }

    .sub .partner .slick-slide {
        margin: 0px 7px
    }

    .sub .partner .unit {
        width: 125px
    }
}

.sub .partner .btn_prev {
    position: absolute;
    display: block;
    width: 40px;
    height: 24px;
    left: -70px;
    padding-right: 10px
}

.sub .partner .btn_prev:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    top: 50%;
    width: 15px;
    height: 15px;
    left: 12px;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg)
}

.sub .partner .btn_prev:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 50%;
    left: 1px;
    width: 39px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.sub .partner .btn_next {
    position: absolute;
    display: block;
    width: 40px;
    height: 24px;
    right: -70px;
    padding-left: 10px
}

.sub .partner .btn_next:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    top: 50%;
    width: 15px;
    height: 15px;
    right: 12px;
    -webkit-transform: translate(50%, -50%) rotate(135deg);
    -ms-transform: translate(50%, -50%) rotate(135deg);
    transform: translate(50%, -50%) rotate(135deg)
}

.sub .partner .btn_next:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 50%;
    right: 1px;
    width: 39px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.sub .partner .btn_down {
    position: absolute;
    display: block;
    width: 24px;
    height: 40px;
    left: -70px;
    padding-right: 10px
}

.sub .partner .btn_down:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    left: 50%;
    width: 15px;
    height: 15px;
    bottom: 12px;
    -webkit-transform: translate(-50%, 50%) rotate(-135deg);
    -ms-transform: translate(-50%, 50%) rotate(-135deg);
    transform: translate(-50%, 50%) rotate(-135deg)
}

.sub .partner .btn_down:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    bottom: 1px;
    left: 50%;
    width: 2px;
    height: 39px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.sub .partner .btn_up {
    position: absolute;
    display: block;
    width: 24px;
    height: 40px;
    right: -70px;
    padding-left: 10px
}

.sub .partner .btn_up:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    left: 50%;
    width: 15px;
    height: 15px;
    top: 12px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.sub .partner .btn_up:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 1px;
    left: 50%;
    width: 2px;
    height: 39px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.sub .partner div:focus {
    outline: none
}

/*갤러리*/

.sub .gallery {
    /*margin-top: 120px;*/
    text-align: center
}

.sub .gallery .gallery_slider {
    max-height: 300px;
    position: relative
}

.sub .gallery .gallery_slider img {
    width: 100%;
    border-radius: 10px;
}

.sub .gallery .slick-list {
    height: 100%
}

.sub .gallery .slick-slide {
    margin: 0px 27px
}

.sub .gallery .slick-arrow {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub .gallery .unit {
    width: 216px;
    height: 100%;
    display: block;
    border-radius: 6px
}

.sub .gallery .gallery_slider .slick-list {
    overflow: visible;
}

@media (max-width: 1279px) {
    .sub .gallery {
        margin-top: 20px
    }

    .sub .gallery .wrap {
        padding-left: 0;
        padding-right: 0
    }

    .sub .gallery .gallery_slider {
        margin: 0px auto 0px;
        height: 80%
    }

    .sub .gallery .slick-slide {
        margin: 0px 15px
    }

    .sub .gallery .unit {
        width: 190px
    }

    .sub .gallery .slick-arrow {
        display: none !important
    }

}

@media (max-width: 767px) {
    .sub .gallery {
        margin-top: 20px
    }

    .sub .gallery .gallery_slider {
        margin: 0px auto 0px;
        height: 90%
    }

    .sub .gallery .slick-slide {
        margin: 0px 7px
    }

    .sub .gallery .unit {
        width: 125px
    }

}

.sub .gallery .btn_prev {
    position: absolute;
    display: block;
    width: 40px;
    height: 24px;
    left: -70px;
    padding-right: 10px
}

.sub .gallery .btn_prev:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    top: 50%;
    width: 15px;
    height: 15px;
    left: 12px;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg)
}

.sub .gallery .btn_prev:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 50%;
    left: 1px;
    width: 39px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.sub .gallery .btn_next {
    position: absolute;
    display: block;
    width: 40px;
    height: 24px;
    right: -70px;
    padding-left: 10px
}

.sub .gallery .btn_next:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    top: 50%;
    width: 15px;
    height: 15px;
    right: 12px;
    -webkit-transform: translate(50%, -50%) rotate(135deg);
    -ms-transform: translate(50%, -50%) rotate(135deg);
    transform: translate(50%, -50%) rotate(135deg)
}

.sub .gallery .btn_next:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 50%;
    right: 1px;
    width: 39px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.sub .gallery .btn_down {
    position: absolute;
    display: block;
    width: 24px;
    height: 40px;
    left: -70px;
    padding-right: 10px
}

.sub .gallery .btn_down:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    left: 50%;
    width: 15px;
    height: 15px;
    bottom: 12px;
    -webkit-transform: translate(-50%, 50%) rotate(-135deg);
    -ms-transform: translate(-50%, 50%) rotate(-135deg);
    transform: translate(-50%, 50%) rotate(-135deg)
}

.sub .gallery .btn_down:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    bottom: 1px;
    left: 50%;
    width: 2px;
    height: 39px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.sub .gallery .btn_up {
    position: absolute;
    display: block;
    width: 24px;
    height: 40px;
    right: -70px;
    padding-left: 10px
}

.sub .gallery .btn_up:before {
    content: '';
    position: absolute;
    border-top: 2px solid #aaaaaa;
    border-left: 2px solid #aaaaaa;
    left: 50%;
    width: 15px;
    height: 15px;
    top: 12px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.sub .gallery .btn_up:after {
    content: '';
    position: absolute;
    background-color: #aaaaaa;
    top: 1px;
    left: 50%;
    width: 2px;
    height: 39px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.sub .gallery div:focus {
    outline: none
}

/*//갤러리*/

.sub .goods_info {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #f0f0f0;
    margin-bottom: 80px
}

.sub .goods_info .bx_pay {
    padding: 50px 40px 60px 90px;
    color: #999999
}

.sub .goods_info .bx_pay:after {
    display: block;
    clear: both;
    content: ""
}

.sub .goods_info .bx_pay .left {
    padding-top: 12px
}

.sub .goods_info .bx_pay .right {
    min-width: 395px
}

.sub .goods_info .bx_pay h3 {
    font-size: 38px;
    margin: 18px auto 20px;
    color: #222222
}

.sub .goods_info .bx_pay .sub_tit {
    font-size: 24px;
    color: #222222
}

.sub .goods_info .bx_pay .link {
    margin-top: 32px;
    display: block;
    color: #222222
}

.sub .goods_info .tbl_pass {
    background: #fcfcfc;
    border-top: 1px #f0f0f0 solid;
    padding: 0 3.6%
}

.sub .goods_info .tbl_pass tbody,
.sub .goods_info .tbl_pass tr {
    border: none
}

@media (max-width: 1279px) {
    .sub .goods_info .bx_pay {
        padding: 50px 5.6% 60px
    }

    .sub .goods_info .bx_pay .left {
        padding-top: 10px;
        width: 50%
    }

    .sub .goods_info .bx_pay .left img {
        width: 100%
    }

    .sub .goods_info .bx_pay .right {
        width: 45%;
        min-width: unset
    }

    .sub .goods_info .bx_pay h3 {
        font-size: 32px;
        margin: 10px auto 12px
    }

    .sub .goods_info .bx_pay .sub_tit {
        font-size: 18px
    }

    .sub .goods_info .bx_pay .link {
        margin-top: 16px;
        display: block;
        color: #222222
    }
}

@media (max-width: 767px) {
    .sub .goods_info {
        margin-bottom: 40px
    }

    .sub .goods_info .bx_pay {
        padding: 30px 8.9% 35px
    }

    .sub .goods_info .bx_pay .left {
        padding-top: 0px;
        width: 100%;
        float: none;
        text-align: center
    }

    .sub .goods_info .bx_pay .left img {
        max-width: 400px
    }

    .sub .goods_info .bx_pay .right {
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 24px auto 0px;
        padding: 0px 6.57%;
        float: none
    }

    .sub .goods_info .bx_pay .right br {
        display: none
    }

    .sub .goods_info .bx_pay h3 {
        font-size: 23px;
        margin: 0px auto 13px
    }

    .sub .goods_info .bx_pay .sub_tit {
        font-size: 16px
    }

    .sub .goods_info .bx_pay .link {
        margin-top: 24px;
        display: block;
        color: #222222
    }
}

.sub.app .sub_menu .tip_set {
    float: left;
    position: relative
}

@media (max-width: 767px) {
    .sub.app .sub_menu .tip_set {
        float: none
    }
}

.sub.app .sub_menu .disable {
    cursor: default
}

.sub.app .sub_menu .disable .btn_down {
    color: #cecece
}

.sub.app .sub_menu .disable .btn_down .ico_download {
    background: #bcbcbc
}

.sub.app .sub_menu .disable .btn_down .ico_download:before {
    border-color: #bcbcbc
}

.sub.app .sub_menu .disable .btn_down .ico_download:after {
    background-color: #bcbcbc
}

.sub.app .sub_menu .disable .tip_info {
    padding: 6px 12px;
    background: #4285F4;
    border: none;
    color: #ffffff
}

.sub.app .sub_menu .disable .tip_info:before {
    content: "";
    width: 16px;
    height: 8px;
    display: block;
    position: absolute;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tip_org.png") no-repeat 0 0;
    right: 25px;
    bottom: -7px
}

.sub.app .tip_info {
    white-space: nowrap;
    padding: 6px 34px 6px 13px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1;
    position: absolute;
    background: #ffffff;
    border: 1px solid #f0f0f0;
    border-radius: 25px;
    top: -21px;
    right: 0px;
    z-index: 2
}

.sub.app .tip_info:before {
    content: "";
    width: 16px;
    height: 8px;
    display: block;
    position: absolute;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_tip.png") no-repeat 0 0;
    right: 25px;
    bottom: -7px
}

.sub.app .tip_info .btn_tip_close {
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    position: absolute;
    display: block;
    width: 15px;
    height: 15px;
    top: 50%;
    right: 8px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 50px;
    vertical-align: middle;
    background: #949494;
    cursor: pointer
}

.sub.app .tip_info .btn_tip_close:before,
.sub.app .tip_info .btn_tip_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 2px;
    background-color: #ffffff
}

.sub.app .tip_info .btn_tip_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.sub.app .tip_info .btn_tip_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

@media (max-width: 767px) {
    .sub.app .tip_info {
        display: none
    }
}

.sub.app .container .bx_qna {
    margin-top: 0
}

.bx_share {
    max-width: 1080px;
    margin: 140px auto 30px;
    text-align: center
}

.bx_share .fb-like {
    vertical-align: top !important
}

.bx_share .fb-like span {
    vertical-align: text-top !important
}

.bx_share #___plus_0 {
    vertical-align: top !important;
    margin-top: 2px !important
}

@media (max-width: 1279px) {
    .bx_share {
        margin: 120px auto 30px
    }
}

@media (max-width: 767px) {
    .bx_share {
        margin: 60px auto 20px
    }
}

.bx_share a {
    display: inline-block;
    vertical-align: top !important;
    height: 25px
}

.bx_share a img {
    vertical-align: text-top !important
}

html:lang(ko) .bx_share .fb-like span,
html:lang(ja) .bx_share .fb-like span {
    width: 177px !important
}

html:lang(ko) .bx_share .fb-like span iframe,
html:lang(ja) .bx_share .fb-like span iframe {
    width: 177px !important
}

.hotel .bx_compare .bx:last-child .tit {
    background: #4285F4 url("//dreamgreen.co.kr/assets/ui/img/hotel/bg_hotel_plus.png") no-repeat 95% 90%;
    background-size: 254px
}

.hotel .bx_compare .bx:last-child ul strong {
    color: #ff7747
}

.hotel .bx_compare .bx_arrow em,
.hotel .bx_compare .bx_arrow em:after {
    border-color: #ff7747
}

.hotel .goods_point .btn {
    background: #ff7747
}

.hotel .bx_complet {
    background-color: #ff7747;
    background: -webkit-gradient(linear, left bottom, left top, from(#ff7747), to(#ffaf84));
    background: linear-gradient(to top, #ff7747, #ffaf84);
    background: -o-linear-gradient(to top, #ff7747, #ffaf84);
    -webkit-box-shadow: 0px 20px 45px #f6d3c7;
    box-shadow: 0px 20px 45px #f6d3c7
}

.hotel .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/hotel/bg_hotel.png") no-repeat 90% 50%
}

.hotel.plus .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/hotel/bg_hotel_plus.png") no-repeat 90% 50%
}

.green .bx_complet {
    background-color: #F23656;
    background: -webkit-gradient(linear, left bottom, left top, from(#F23656), to(#F89BAB));
    background: linear-gradient(to top, #F23656, #F89BAB);
    background: -o-linear-gradient(to top, #F23656, #F89BAB);
    -webkit-box-shadow: 0px 20px 45px #f0c7c9;
    box-shadow: 0px 20px 45px #f0c7c9
}

.green .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/green/bg_green_max.png") no-repeat 90% 50%
}

.green .bg_gra {
    background-color: #E05272;
    background: -webkit-gradient(linear, right top, left top, from(#E05272), to(#EA8792));
    background: linear-gradient(to left, #E05272, #EA8792);
    background: -o-linear-gradient(to left, #E05272, #EA8792)
}

.gmx .lnb_tooltip p strong {
    color: #e8636a
}

.gmx .bx_compare .bx:last-child .tit {
    background: #e8636a url("//dreamgreen.co.kr/assets/ui/img/green/bg_green_pro.png") no-repeat 95% 90%;
    background-size: 277px
}

.gmx .bx_compare .bx:last-child ul strong {
    color: #e8636a
}

.gmx .bx_compare .bx_arrow em,
.gmx .bx_compare .bx_arrow em:after {
    border-color: #e8636a
}

.gmx .bg_gra {
    background-color: #e8636a;
    background: -webkit-gradient(linear, right top, left top, from(#e8636a), to(#ea878c));
    background: linear-gradient(to left, #e8636a, #ea878c);
    background: -o-linear-gradient(to left, #e8636a, #ea878c)
}

.gmx .txt_bg.crcl {
    color: #e8636a
}

.gmx .goods_point .btn {
    background: #e8636a
}

.gmx .goods_point .btn.c_def {
    background: #343434
}

.gmx .bx_complet {
    background-color: #e8636a;
    background: -webkit-gradient(linear, left bottom, left top, from(#e8636a), to(#ea878c));
    background: linear-gradient(to top, #e8636a, #ea878c);
    background: -o-linear-gradient(to top, #e8636a, #ea878c);
    -webkit-box-shadow: 0px 20px 45px #f0c7c9;
    box-shadow: 0px 20px 45px #f0c7c9
}

.gmx .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/gmx/bg_gmx.png") no-repeat 97% 50%
}

.gmx.pro .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/gmx/bg_gmx_pro.png") no-repeat 97% 50%
}

.gmx.diat .pc_none {
    display: none
}

@media (max-width: 767px) {

    .gmx.diat .goods_point h2 br,
    .gmx.diat .pc_none {
        display: block
    }
}

.gmx.diat .bx_info {
    background: url("//dreamgreen.co.kr/assets/ui/img/gmx/bg_diat.jpg") no-repeat 735px 58px
}

.gmx.diat .bx_info h2 {
    font-weight: 600
}

.gmx.diat .bx_info h2 span {
    font-weight: 100
}

.gmx.diat .bx_info .cont {
    margin: 40px auto 0
}

@media (max-width: 1279px) {
    .gmx.diat .bx_info {
        background-position: 90% 40px;
        padding: 90px 3.9% 70px
    }

    .gmx.diat .bx_info .cont {
        margin: 20px auto 0
    }
}

@media (max-width: 767px) {
    .gmx.diat .bx_info {
        background-position: 50% 175px;
        background-size: 115px;
        padding: 50px 6.25%
    }

    .gmx.diat .bx_info .cont {
        margin: 175px auto 0
    }
}

.gmx.diat .bx_info .bx_step {
    margin-top: 80px
}

.gmx.diat .bx_info .bx_step .cont_step {
    font-size: 15px;
    padding: 60px 30px
}

.gmx.diat .bx_info .bx_step .img {
    width: 100%;
    max-width: 368px
}

.gmx.diat .bx_info .bx_step .img+p {
    margin: 40px 0
}

.gmx.diat .bx_info .bx_step .tit {
    height: auto;
    padding: 30px 35px;
    background: #e8636a url(//dreamgreen.co.kr/assets/ui/img/common/bg_uninstall.png) no-repeat 135% 50%;
    font-size: 26px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.gmx.diat .bx_info .bx_step .tit strong {
    margin-bottom: 0px;
    font-size: 26px;
    display: inline-block
}

.gmx.diat .bx_info .bx_step .btns {
    margin-top: 0
}

.gmx.diat .bx_info .bx_step .bx {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 1279px) {
    .gmx.diat .bx_info .bx_step {
        margin-top: 70px
    }

    .gmx.diat .bx_info .bx_step .tit {
        font-size: 18px
    }

    .gmx.diat .bx_info .bx_step .tit strong {
        font-size: 18px
    }

    .gmx.diat .bx_info .bx_step .bx_temp {
        width: 3%
    }

    .gmx.diat .bx_info .bx_step .cont_step {
        font-size: 15px;
        padding: 40px 23px
    }

    .gmx.diat .bx_info .bx_step .img+p {
        margin: 30px 0
    }
}

@media (max-width: 767px) {
    .gmx.diat .bx_info .bx_step {
        margin-top: 50px
    }

    .gmx.diat .bx_info .bx_step .bx:first-child {
        margin-bottom: 40px
    }

    .gmx.diat .bx_info .bx_step .bx:first-child:after {
        display: none
    }

    .gmx.diat .bx_info .bx_step .tit {
        font-size: 15px
    }

    .gmx.diat .bx_info .bx_step .tit strong {
        font-size: 15px
    }

    .gmx.diat .bx_info .bx_step .cont_step {
        font-size: 13px
    }
}

.gmx.diat .bx_goods .txt_box {
    width: 550px
}

.gmx.diat .bx_goods .txt_box .tag strong {
    font-size: 15px
}

.gmx.diat .bx_goods .txt_box .tag span {
    margin-top: 10px;
    display: block
}

.gmx.diat .bx_goods .txt_box .tag .point {
    color: #ffed00
}

.gmx.diat .bx_goods .txt_box .tag a,
.gmx.diat .bx_goods .txt_box .tag a:hover,
.gmx.diat .bx_goods .txt_box .tag a:visited {
    color: #ffffff;
    text-decoration: underline
}

@media (max-width: 1279px) {
    .gmx.diat .bx_goods .txt_box {
        width: 100%
    }
}

.gmx.diat .bx_goods.bg_gra .right {
    width: 528px
}

@media (max-width: 1279px) {
    .gmx.diat .bx_goods.bg_gra .right {
        width: 100%
    }
}

.gmx.diat .goods_point h3 {
    font-size: 22px
}

.gmx.diat .goods_point h3 strong {
    color: #f9323f
}

@media (max-width: 1279px) {
    .gmx.diat .goods_point h3 {
        font-size: 18px
    }
}

@media (max-width: 767px) {
    .gmx.diat .goods_point h3 {
        font-size: 13px
    }
}

.gmx.diat .goods_point .cont+.cont {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .gmx.diat .goods_point .cont+.cont {
        margin-top: 50px
    }
}

@media (max-width: 767px) {
    .gmx.diat .goods_point .cont+.cont {
        margin-top: 40px
    }
}

.pool .bx_compare .bx:first-child ul strong {
    color: #222222
}

.pool .bx_compare .bx ul strong {
    color: #3d8cd1
}

.pool .bx_compare .bx:last-child .tit {
    background: #3d8cd1 url("//dreamgreen.co.kr/assets/ui/img/pool/bg_pool.png") no-repeat 95% 20%;
    background-size: 276px
}

.pool .bx_compare .bx_arrow em,
.pool .bx_compare .bx_arrow em:after {
    border-color: #3d8cd1
}

.pool .bg_gra {
    background-color: #3d8cd1;
    background: -webkit-gradient(linear, right top, left top, from(#3d8cd1), to(#7cc6f0));
    background: linear-gradient(to left, #3d8cd1, #7cc6f0);
    background: -o-linear-gradient(to left, #3d8cd1, #7cc6f0)
}

.pool .txt_bg.crcl {
    color: #3d8cd1
}

.pool .bx_complet {
    background-color: #3d8cd1;
    background: -webkit-gradient(linear, left bottom, left top, from(#3d8cd1), to(#7cc6f0));
    background: linear-gradient(to top, #3d8cd1, #7cc6f0);
    background: -o-linear-gradient(to top, #3d8cd1, #7cc6f0);
    -webkit-box-shadow: 0px 20px 45px #c9deef;
    box-shadow: 0px 20px 45px #c9deef
}

.pool .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/pool/bg_pool.png") no-repeat 95% 50%
}

.gau .bg_gra {
    background-color: #009b99;
    background: -webkit-gradient(linear, right top, left top, from(#009b99), to(#7cc3c2));
    background: linear-gradient(to left, #009b99, #7cc3c2);
    background: -o-linear-gradient(to left, #009b99, #7cc3c2)
}

.gau .bx_complet {
    background-color: #009b99;
    background: -webkit-gradient(linear, left bottom, left top, from(#009b99), to(#7cc3c2));
    background: linear-gradient(to top, #009b99, #7cc3c2);
    background: -o-linear-gradient(to top, #009b99, #7cc3c2);
    -webkit-box-shadow: 0px 20px 45px #c7e0e0;
    box-shadow: 0px 20px 45px #c7e0e0
}

.gau .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/gau/bg_gau.png") no-repeat 90% 50%
}

.grc .bg_gra {
    background-color: #f97955;
    background: -webkit-gradient(linear, right top, left top, from(#f97955), to(#fcaa93));
    background: linear-gradient(to left, #f97955, #fcaa93);
    background: -o-linear-gradient(to left, #f97955, #fcaa93)
}

.grc .bx_complet {
    background-color: #f97955;
    background: -webkit-gradient(linear, left bottom, left top, from(#f97955), to(#fcaa93));
    background: linear-gradient(to top, #f97955, #fcaa93);
    background: -o-linear-gradient(to top, #f97955, #fcaa93);
    -webkit-box-shadow: 0px 20px 45px #f2d1c7;
    box-shadow: 0px 20px 45px #f2d1c7
}

.grc .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/grc/bg_grc.png") no-repeat 87% 50%
}

.gen .bx_compare .bx:last-child .tit {
    background: #4285F4 url("//dreamgreen.co.kr/assets/ui/img/gen/bg_gen.png") no-repeat 95% 90%;
    background-size: 193px
}

.gen .bx_compare .bx:last-child ul strong {
    color: #ff7a02
}

.gen .bx_compare .bx_arrow em,
.gen .bx_compare .bx_arrow em:after {
    border-color: #ff7a02
}

.gen .bg_gra {
    background-color: #ff7a02;
    background: -webkit-gradient(linear, right top, left top, from(#ff7a02), to(#f7c581));
    background: linear-gradient(to left, #ff7a02, #f7c581);
    background: -o-linear-gradient(to left, #ff7a02, #f7c581)
}

.gen .txt_bg.crcl {
    color: #ff7a02
}

.gen .bx_complet {
    background-color: #ff7a02;
    background: -webkit-gradient(linear, left bottom, left top, from(#ff7a02), to(#f7c581));
    background: linear-gradient(to top, #ff7a02, #f7c581);
    background: -o-linear-gradient(to top, #ff7a02, #f7c581);
    -webkit-box-shadow: 0px 20px 45px #f0d5cb;
    box-shadow: 0px 20px 45px #f0d5cb
}

.gen .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/gen/bg_gen.png") no-repeat 95% 50%
}

.grm .goods_point .cont {
    padding: 30px 0
}

@media (max-width: 1279px) {
    .grm .goods_point .cont img {
        width: 100%;
        max-width: 624px
    }
}

@media (max-width: 767px) {
    .grm .goods_point .cont {
        padding: 10px 0
    }
}

.grm .bg_gra {
    background-color: #86645b;
    background: -webkit-gradient(linear, right top, left top, from(#86645b), to(#b29086));
    background: linear-gradient(to left, #86645b, #b29086);
    background: -o-linear-gradient(to left, #86645b, #b29086)
}

.grm .bx_complet {
    background-color: #86645b;
    background: -webkit-gradient(linear, left bottom, left top, from(#86645b), to(#b29086));
    background: linear-gradient(to top, #86645b, #b29086);
    background: -o-linear-gradient(to top, #86645b, #b29086);
    -webkit-box-shadow: 0px 20px 45px #ddd4d1;
    box-shadow: 0px 20px 45px #ddd4d1
}

.grm .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/grm/bg_grm.png") no-repeat 87% 80%
}

.grm.app .goods_point {
    border-top: 1px solid #ededed;
    max-width: 100%
}

.gst .bg_gra {
    background-color: #f2653f;
    background: -webkit-gradient(linear, right top, left top, from(#f2653f), to(#ff9266));
    background: linear-gradient(to left, #f2653f, #ff9266);
    background: -o-linear-gradient(to left, #f2653f, #ff9266)
}

.gst .bx_complet {
    background-color: #f2653f;
    background: -webkit-gradient(linear, left bottom, left top, from(#f2653f), to(#ff9266));
    background: linear-gradient(to top, #f2653f, #ff9266);
    background: -o-linear-gradient(to top, #f2653f, #ff9266);
    -webkit-box-shadow: 0px 20px 45px #f6d3c7;
    box-shadow: 0px 20px 45px #f6d3c7
}

.gst .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/gst/bg_gst.png") no-repeat 95% 50%
}

.gpk .container,
.gbp .container {
    max-width: 1080px;
    margin: 0 auto;
    padding: 80px 0 0
}

.gpk .partner .wrap,
.gbp .partner .wrap {
    padding: 0
}

@media (max-width: 1279px) {

    .gpk .container,
    .gbp .container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 70px 3.9% 0
    }

    .gpk .bx_qna.wrap,
    .gbp .bx_qna.wrap {
        width: 100%
    }
}

@media (max-width: 767px) {

    .gpk .container,
    .gbp .container {
        padding: 40px 6.25% 0
    }
}

.gpk .container .top {
    margin-bottom: 40px
}

.gpk .container .top h2 {
    margin-bottom: 10px
}

.gpk .container .top p {
    font-size: 18px;
    color: #999999
}

.gpk .container .bx_pack {
    margin-bottom: 80px
}

.gpk .container .bx_pack:last-child {
    margin-bottom: 0px
}

@media (max-width: 1279px) {
    .gpk .container .top {
        margin-bottom: 30px
    }

    .gpk .container .top p {
        font-size: 16px
    }

    .gpk .container .bx_pack {
        margin-bottom: 70px
    }
}

@media (max-width: 767px) {
    .gpk .container .top {
        margin-bottom: 20px
    }

    .gpk .container .top h2 {
        margin-bottom: 5px
    }

    .gpk .container .top p {
        font-size: 12px
    }

    .gpk .container .bx_pack {
        margin-bottom: 40px
    }
}

.gbp .tit_tick {
    margin: 0px 48px 54px 0px
}

.gbp .tit_tick span {
    display: inline-block;
    width: 64%;
    font-weight: 100
}

.gbp .tit_tick img {
    max-width: 370px;
    width: 36%
}

@media (max-width: 1279px) {
    .gbp .tit_tick {
        margin-right: 0px
    }
}

@media (max-width: 767px) {
    .gbp .tit_tick {
        margin: 0px 41px 24px 0px
    }

    .gbp .tit_tick img {
        display: none
    }

    .gbp .tit_tick span {
        width: 100%
    }
}

.gbp .bx_coupon {
    width: 100%;
    margin-bottom: 80px;
    background: #fffdfd;
    border: 1px solid #eed3d2;
    border-radius: 10px;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 767px) {
    .gbp .bx_coupon {
        margin-bottom: 40px
    }
}

.gbp .bx_coupon .tit {
    margin: 6% 0 4%;
    width: 60.5%
}

.gbp .bx_coupon .list {
    width: 90.37%;
    margin: 0 auto 4%
}

.gbp .bx_coupon .list:after {
    display: block;
    clear: both;
    content: ""
}

.gbp .bx_coupon .list li {
    width: 30.6%;
    float: left;
    margin: 0 1.35%
}

.gbp .bx_coupon .list li img {
    width: 100%
}

.gbp .bx_coupon .bx_noti {
    overflow: hidden;
    background: #fff4f4;
    border-top: 1px solid #eed3d2;
    border-radius: 0 0 10px 10px;
    text-align: center
}

.gbp .bx_coupon .bx_noti ul {
    width: 420px;
    margin: 3.3% auto 2.4%;
    overflow: hidden;
    font-size: 14px;
    line-height: 31px;
    color: #bc908e;
    text-align: left
}

.gbp .bx_coupon .bx_noti ul li {
    width: 100%;
    position: relative;
    padding-left: 18px;
    font-weight: bold
}

.gbp .bx_coupon .bx_noti ul em {
    font-size: 30px;
    line-height: 1;
    height: 18px;
    color: #eed3d2;
    position: absolute;
    top: 7px;
    left: 0
}

.gbp .bx_coupon .bx_noti ul a {
    color: #ff7600;
    text-decoration: underline
}

@media (max-width: 767px) {
    .gbp .bx_coupon .bx_noti ul {
        font-size: 10px;
        width: 90%;
        line-height: 1.7
    }

    .gbp .bx_coupon .bx_noti ul li {
        padding-left: 12px
    }

    .gbp .bx_coupon .bx_noti ul em {
        top: 2px;
        font-size: 17px
    }
}

@media (max-width: 1279px) {
    .gbp .tbl.tbl_pass .tkt_ico {
        display: none
    }

    .gbp .tbl.tbl_pass .tkt_txt {
        padding: 30px 0
    }

    .gbp .tbl.tbl_pass .tkt_txt .wrap {
        border-left: none
    }
}

.gbp.new .mid_bnr {
    width: 100%;
    height: 70px;
    background: -webkit-gradient(linear, right top, left top, from(#f8bd0b), color-stop(29%, #ff4d33), color-stop(42%, #ff5037), to(#ff237b));
    background: linear-gradient(270deg, #f8bd0b 0%, #ff4d33 29%, #ff5037 42%, #ff237b 100%)
}

.gbp.new .mid_bnr .wrap {
    width: 1280px;
    height: 70px;
    position: relative;
    color: #ffffff;
    text-align: center
}

.gbp.new .mid_bnr .wrap img {
    display: inline-block;
    position: absolute;
    left: 99px;
    top: -49px;
    width: 200px;
    height: 120px
}

.gbp.new .mid_bnr .wrap .bnr_tit {
    display: inline-block;
    line-height: 70px;
    margin-left: 209px
}

.gbp.new .mid_bnr .wrap .tit {
    display: inline-block;
    font-size: 22px;
    font-weight: 600
}

.gbp.new .mid_bnr .wrap .tit strong {
    color: #FFF500
}

.gbp.new .mid_bnr .wrap .tit.mobile {
    display: none
}

.gbp.new .mid_bnr .wrap .btn {
    min-width: 160px;
    width: auto;
    height: 44px;
    float: right;
    font-size: 17px;
    display: block;
    border: 2px solid #fff;
    border-radius: 30px;
    background: none;
    margin-left: 33px;
    margin-top: 13px;
    padding: 10px 30px 10px 30px
}

@media (max-width: 1279px) {
    .gbp.new .mid_bnr {
        height: 70px;
        position: relative
    }

    .gbp.new .mid_bnr .wrap {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: absolute;
        bottom: 0;
        height: 70px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        box-sizing: border-box;
        max-width: 768px;
        padding-left: 0
    }

    .gbp.new .mid_bnr .wrap img {
        width: 110px;
        height: 66px;
        padding-top: 4px;
        margin-left: 0;
        top: 0;
        left: 30px
    }

    .gbp.new .mid_bnr .wrap .bnr_tit {
        line-height: 70px;
        margin-left: 188px
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .tit {
        display: inline-block;
        font-size: 18px
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .tit.mobile {
        display: none
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .btn {
        min-width: 146px;
        padding: 8px 26px;
        font-size: 16px;
        height: 40px;
        margin-left: 28px;
        margin-top: 15px
    }
}

@media (max-width: 767px) {
    .gbp.new .mid_bnr {
        min-width: 375px;
        height: 94px
    }

    .gbp.new .mid_bnr .wrap {
        width: 376px;
        height: 94px;
        padding-left: 0
    }

    .gbp.new .mid_bnr .wrap img {
        width: 110px;
        height: 66px;
        padding-top: 0;
        position: absolute;
        bottom: 0;
        top: 29px;
        left: 0
    }

    .gbp.new .mid_bnr .wrap .bnr_tit {
        line-height: 24px;
        text-align: center;
        margin-left: 0;
        margin-top: 12px
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .tit {
        font-size: 15px;
        display: none
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .tit.mobile {
        display: block;
        line-height: 22px
    }

    .gbp.new .mid_bnr .wrap .bnr_tit .btn {
        height: 36px;
        min-width: 136px;
        line-height: 14px;
        font-size: 14px;
        display: inline-block;
        padding: 8px 27px;
        margin-left: 0;
        float: none;
        margin-top: 10px
    }
}

.gbp.new .tit_tick em {
    font-size: 18px
}

@media (max-width: 1279px) {
    .gbp.new .tit_tick em {
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .gbp.new .tit_tick em {
        font-size: 14px
    }
}

.gbp.new .bnr_container {
    display: none;
    width: 100%;
    height: 510px;
    background-color: #F7F7F7
}

.gbp.new .bnr_container input:-webkit-autofill,
.gbp.new .bnr_container input:-webkit-autofill:hover,
.gbp.new .bnr_container input:-webkit-autofill:focus,
.gbp.new .bnr_container input:-webkit-autofill:active {
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px #fff8f3 inset !important
}

.gbp.new .bnr_container .container {
    position: relative;
    padding: 0;
    max-width: 1240px;
    height: 510px
}

.gbp.new .bnr_container .container .close {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 30px;
    right: 30px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_close.png") no-repeat 0 0;
    background-size: cover;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

.gbp.new .bnr_container .tit {
    text-align: center;
    font-size: 38px;
    line-height: 56px;
    padding-top: 50px;
    margin-bottom: 30px;
    font-weight: 400
}

.gbp.new .bnr_container .bx_info {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 610px;
    height: 324px;
    background-color: #fff;
    float: left;
    padding: 40px 40px 20px 40px
}

.gbp.new .bnr_container .bx_info+.bx_info {
    margin-left: 20px;
    padding-top: 33px
}

.gbp.new .bnr_container .bx_info .third_wrap {
    margin-top: 10px;
    display: block
}

.gbp.new .bnr_container .bx_info .third_wrap .wrap {
    display: -webkit-box;
    display: flex;
    display: -ms-flexbox;
    padding: 0;
    max-width: none
}

.gbp.new .bnr_container .bx_info .bx_wrap {
    position: relative;
    min-height: 50px;
    font-size: 0
}

.gbp.new .bnr_container .bx_info .bx_wrap em {
    color: #4285F4
}

.gbp.new .bnr_container .bx_info .bx_wrap+.bx_wrap {
    margin-top: 10px
}

.gbp.new .bnr_container .bx_info .bx_wrap.third {
    display: inline-block;
    width: calc(50% - 5px)
}

.gbp.new .bnr_container .bx_info .bx_wrap.third.voucher {
    margin-left: 10px;
    margin-top: 0
}

.gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt .holder {
    pointer-events: none;
    color: #666
}

.gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt.num {
    width: 125px
}

.gbp.new .bnr_container .bx_info .slct_wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    position: relative;
    border: 1px solid #ddd;
    border-radius: 4px;
    height: 50px
}

.gbp.new .bnr_container .bx_info .slct_wrap.err {
    position: relative;
    border: 1px solid #f52222;
    -webkit-box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    box-shadow: 0px 0px 5px rgba(245, 34, 34, 0.2);
    color: #f52222;
    caret-color: #f52222;
    padding-right: 37px
}

.gbp.new .bnr_container .bx_info .slct_wrap.err .slct_box {
    border: 1px solid #f52222;
    border-width: 0 1px 1px 1px
}

.gbp.new .bnr_container .bx_info .slct_wrap .slct_trg {
    display: block;
    height: 100%;
    line-height: 50px;
    font-size: 15px;
    color: #666;
    padding: 0 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.gbp.new .bnr_container .bx_info .slct_wrap .slct_trg::after {
    display: inline-block;
    content: '';
    position: absolute;
    right: 0;
    top: 20px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct.png") no-repeat 99% 20%;
    background-size: #ffffff;
    width: 26px;
    height: 10px
}

.gbp.new .bnr_container .bx_info .slct_wrap.product {
    width: 260px
}

.gbp.new .bnr_container .bx_info .slct_wrap.product .slct_box {
    width: 260px
}

.gbp.new .bnr_container .bx_info .slct_wrap.year {
    width: 125px;
    margin: 0
}

.gbp.new .bnr_container .bx_info .slct_wrap.year .slct_box {
    width: 125px
}

.gbp.new .bnr_container .bx_info .slct_wrap .slct_box {
    z-index: 2;
    display: none;
    overflow: hidden;
    position: absolute;
    width: 100%;
    background: #fff;
    border: 1px solid #dddddd;
    border-radius: 0 0 4px 4px;
    border-width: 0 1px 1px 1px;
    left: -1px;
    top: 42px
}

.gbp.new .bnr_container .bx_info .slct_wrap .slct_box a {
    padding-left: 20px;
    text-align: left;
    font-size: 15px;
    line-height: 42px;
    height: 42px
}

.gbp.new .bnr_container .bx_info .tit_info {
    display: block;
    font-size: 20px;
    line-height: 30px
}

.gbp.new .bnr_container .bx_info .sub_tit {
    font-size: 15px;
    color: #666666;
    display: block;
    margin-bottom: 15px
}

.gbp.new .bnr_container .bx_info .info_list {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 530px;
    height: 130px;
    border: 2px solid #F0F0F0;
    overflow: auto;
    padding: 20px
}

.gbp.new .bnr_container .bx_info .info_list li {
    position: relative;
    font-size: 15px;
    margin-bottom: 8px
}

.gbp.new .bnr_container .bx_info .info_list .close {
    position: absolute;
    display: inline-block;
    width: 18px;
    height: 18px;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: auto;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mid_close.png") no-repeat 0 0;
    background-size: cover
}

.gbp.new .bnr_container .bx_info .btn {
    margin: 20px auto 0;
    display: block;
    text-align: center;
    width: 170px;
    height: 50px;
    border-radius: 50px;
    background-color: #4285F4;
    font-size: 18px;
    font-weight: 600;
    padding: 11px 51px;
    line-height: 27px
}

.gbp.new .bnr_container .bx_info .bx_ipt {
    width: 260px;
    vertical-align: top;
    display: inline-block;
    position: relative
}

.gbp.new .bnr_container .bx_info .bx_ipt .c_fill .ipt.fill {
    background-color: #fff8f3 !important
}

.gbp.new .bnr_container .bx_info .bx_ipt:nth-child(2n) {
    margin-left: 10px
}

.gbp.new .bnr_container .bx_info .bx_ipt label {
    position: absolute;
    z-index: 2;
    display: block;
    font-size: 15px;
    padding: 15px 0 15px 20px;
    line-height: 20px;
    width: auto;
    height: auto
}

.gbp.new .bnr_container .bx_info .first .txt_alert.err {
    margin: 7px 0 12px 0
}

.gbp.new .bnr_container .bx_info .second .txt_alert.err {
    margin: 7px 0 2px 0
}

.gbp.new .bnr_container .bx_info .third_wrap .txt_alert.err {
    margin: 3px 0 0 0
}

.gbp.new .bnr_container .bx_info .third_wrap .third .txt_alert.err {
    margin: -1px 0 0 0
}

.gbp.new .bnr_container .bx_info .col {
    margin-top: 10px
}

.gbp.new .bnr_container .bx_info .col .label {
    background-position: 0px 5px
}

.gbp.new .bnr_container .bx_info .col .terms {
    margin-left: 10px;
    line-height: 24px;
    font-size: 15px;
    color: #4285F4;
    text-decoration: underline
}

.gbp.new .bnr_container .bx_info .col .popup.pop_msg,
.gbp.new .bnr_container .bx_info .col .pop_msg.pop_browser {
    padding: 40px 0
}

.gbp.new .bnr_container .bx_info .col .msg {
    padding-top: 0;
    font-size: 30px;
    line-height: 45px
}

.gbp.new .bnr_container .bx_info .col .tt {
    padding: 0 40px;
    display: block;
    font-size: 16px;
    text-align: left;
    margin-bottom: 5px;
    font-weight: 600
}

@media (max-width: 1279px) {
    .gbp.new .bnr_container {
        height: auto
    }

    .gbp.new .bnr_container .tit {
        padding-top: 40px;
        margin-bottom: 20px;
        font-size: 24px;
        line-height: 36px;
        font-weight: 600
    }

    .gbp.new .bnr_container .container {
        height: auto;
        padding: 0 30px 30px
    }

    .gbp.new .bnr_container .container .close {
        top: 20px;
        right: 20px
    }

    .gbp.new .bnr_container .bx_info {
        width: 100%;
        float: none;
        min-height: 272px;
        height: auto;
        padding: 30px
    }

    .gbp.new .bnr_container .bx_info+.bx_info {
        margin: 0
    }

    .gbp.new .bnr_container .bx_info:last-child {
        margin-top: 30px;
        height: 333px
    }

    .gbp.new .bnr_container .bx_info .col .label {
        background-position: 0 4.5px;
        font-size: 15px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.first .txt_alert.err {
        margin-top: 7px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.second .txt_alert.err {
        margin-top: 7px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.third .txt_alert.err {
        margin-top: 0
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt {
        width: calc(50% - 5px)
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt input {
        height: 50px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt.num {
        width: calc(50% - 5px);
        margin-left: 10px
    }

    .gbp.new .bnr_container .bx_info .third_wrap .third .txt_alert.err {
        margin-top: 3px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.product {
        width: 100%
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.product .slct_box {
        width: calc(100% + 2px)
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.year {
        width: calc(50% - 5px);
        margin: 0
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.year .slct_box {
        width: calc(100% + 2px)
    }

    .gbp.new .bnr_container .bx_info .info_list {
        width: 100%;
        padding: 20px 26px 20px 20px
    }

    .gbp.new .bnr_container .bx_info .info_list li {
        margin-bottom: 12px
    }

    .gbp.new .bnr_container .bx_info .info_list .close {
        width: 18px;
        height: 18px;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mid_close.png") no-repeat 0 0;
        background-size: cover
    }
}

@media (max-width: 767px) {
    .gbp.new .bnr_container .container {
        height: 100%;
        padding: 0 24px 24px
    }

    .gbp.new .bnr_container .container .close {
        width: 24px;
        height: 24px
    }

    .gbp.new .bnr_container .bx_info {
        float: none;
        min-height: 319px;
        height: auto;
        padding: 20px
    }

    .gbp.new .bnr_container .bx_info+.bx_info {
        margin: 0
    }

    .gbp.new .bnr_container .bx_info .info_list {
        padding: 20px 20px 10px 20px
    }

    .gbp.new .bnr_container .bx_info .info_list li {
        margin-bottom: 10px;
        width: 100%;
        font-size: 14px;
        display: -webkit-box;
        display: flex;
        display: -ms-flexbox
    }

    .gbp.new .bnr_container .bx_info .info_list li span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        width: 90%
    }

    .gbp.new .bnr_container .bx_info .info_list .close {
        width: 18px;
        height: 18px;
        margin-top: 2px;
        margin-left: 6%;
        position: static;
        top: 5px;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_mid_close.png") no-repeat 0 0;
        background-size: cover
    }

    .gbp.new .bnr_container .bx_info .sub_tit {
        font-size: 13px
    }

    .gbp.new .bnr_container .bx_info .third_wrap .wrap {
        display: block
    }

    .gbp.new .bnr_container .bx_info .third_wrap .txt_alert.err {
        margin-top: -3px;
        margin-bottom: 15px
    }

    .gbp.new .bnr_container .bx_info .col {
        margin-top: 6px
    }

    .gbp.new .bnr_container .bx_info .col .label {
        display: inline-block;
        font-size: 14px;
        background-position: 0px 4.5px
    }

    .gbp.new .bnr_container .bx_info .col .terms {
        font-size: 14px
    }

    .gbp.new .bnr_container .bx_info:last-child {
        margin-top: 20px;
        height: auto;
        padding-bottom: 30px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.first .txt_alert.err {
        margin-bottom: 15px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.second .bx_ipt {
        width: 100%;
        height: auto
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.second .bx_ipt .txt_alert {
        margin-bottom: 5px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.second .bx_ipt:nth-child(2n) {
        margin-left: 0;
        margin-top: 10px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.third {
        width: 100%
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.third .txt_alert.err {
        margin-bottom: 15px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap.third.voucher {
        margin: 0
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt {
        height: 40px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt.num {
        width: calc(50% - 5px);
        margin-left: 10px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt input {
        height: 40px
    }

    .gbp.new .bnr_container .bx_info .bx_wrap .bx_ipt label {
        padding: 10px 0 10px 19px;
        font-size: 13px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap {
        height: 40px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap .slct_box {
        top: 36px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap .slct_trg {
        line-height: 40px;
        font-size: 13px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap .slct_trg:after {
        top: 15px
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.product {
        z-index: 4;
        width: 100%
    }

    .gbp.new .bnr_container .bx_info .slct_wrap.year {
        width: calc(50% - 5px)
    }

    .gbp.new .bnr_container .bx_info .info_list {
        overflow: visible;
        height: auto
    }
}

.gbp.new .container.b2bg {
    position: relative
}

.gbp.new .container .wing_bnr_tp3 {
    position: absolute;
    top: 50px;
    left: 50%;
    margin-left: 670px;
    z-index: 2;
    width: 160px
}

.gbp.new .container .wing_bnr_tp3 .bnr_side {
    margin-bottom: 30px;
    display: block
}

.gbp.new .container .wing_bnr_tp3 .google_bnr,
.gbp.new .container .wing_bnr_tp3 .google_bnr_tp2 {
    width: 100%;
    height: 600px
}

@media (max-width: 1279px) {
    .gbp.new .container .wing_bnr_tp3 {
        display: none !important
    }
}

.gbp.new .goods_info {
    margin-bottom: 50px
}

.gbp.new .goods_info .unit {
    text-align: right;
    padding-right: 31px;
    margin: 10px 0 31px 0;
    color: #4285F4;
    font-size: 14px;
    line-height: 20px
}

.gbp.new .goods_info .bx_wrap {
    padding: 0 30px
}

.gbp.new .goods_info .bx_wrap:after {
    content: "";
    display: block;
    clear: both
}

.gbp.new .goods_info .bx_price {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    width: 320px;
    min-height: 305px;
    padding: 30px;
    float: left;
    border: 1px solid #E5E5E5;
    font-weight: bold;
    border-radius: 10px
}

.gbp.new .goods_info .bx_price+.bx_price {
    margin-left: 29px
}

.gbp.new .goods_info .bx_price .grp_price .discount {
    position: absolute;
    top: 22px;
    right: 0
}

.gbp.new .goods_info .bx_price td {
    padding: 0;
    border-bottom: none;
    font-size: 17px;
    line-height: 25px;
    letter-spacing: -0.34px
}

.gbp.new .goods_info .bx_price td.fix {
    padding-top: 20px
}

.gbp.new .goods_info .bx_price td.sale {
    padding-top: 10px
}

.gbp.new .goods_info .bx_price td.sale.price::before {
    content: '-';
    display: inline-block;
    margin-right: 5px
}

.gbp.new .goods_info .bx_price td.now {
    padding: 25px 0 21px 0
}

.gbp.new .goods_info .bx_price td.now.price {
    font-size: 20px;
    color: #4285F4;
    letter-spacing: -0.4px
}

.gbp.new .goods_info .bx_price td.price {
    text-align: right
}

.gbp.new .goods_info .bx_price .btn {
    width: 258px;
    height: 44px;
    font-size: 17px
}

.gbp.new .goods_info .bx_price .tit_price {
    font-size: 20px;
    margin-bottom: 15px;
    letter-spacing: -0.4px;
    line-height: 24px;
    margin-top: 7px
}

@media (max-width: 1279px) {
    .gbp.new .goods_info .unit {
        margin: 10px 0 20px 0;
        padding-right: 18px;
        font-size: 13px
    }

    .gbp.new .goods_info .bx_wrap {
        padding: 0 2%
    }

    .gbp.new .goods_info .bx_price {
        width: 32%;
        min-height: 254px;
        padding: 37px 20px 20px 20px
    }

    .gbp.new .goods_info .bx_price+.bx_price {
        margin-left: 2%
    }

    .gbp.new .goods_info .bx_price .grp_price .discount {
        right: -12px
    }

    .gbp.new .goods_info .bx_price .tit_price {
        font-size: 16px
    }

    .gbp.new .goods_info .bx_price td {
        font-size: 14px
    }

    .gbp.new .goods_info .bx_price td.fix {
        padding-top: 10px
    }

    .gbp.new .goods_info .bx_price td.sale {
        padding-top: 3px
    }

    .gbp.new .goods_info .bx_price td.now {
        padding: 12px 0 20px 0
    }

    .gbp.new .goods_info .bx_price td.now.price {
        font-size: 17px
    }

    .gbp.new .goods_info .bx_price .btn {
        width: 100%;
        height: 40px;
        padding: 9px 10%;
        font-size: 15px;
        line-height: 20px
    }
}

@media (max-width: 767px) {
    .gbp.new .goods_info .unit {
        padding-right: 25px
    }

    .gbp.new .goods_info .bx_wrap {
        padding: 0 19px
    }

    .gbp.new .goods_info .bx_price {
        float: none;
        width: 100%;
        min-height: 290px;
        padding-top: 41px
    }

    .gbp.new .goods_info .bx_price+.bx_price {
        margin-left: 0;
        margin-top: 20px
    }

    .gbp.new .goods_info .bx_price .grp_price .discount {
        right: 18px;
        top: -10px
    }

    .gbp.new .goods_info .bx_price .tit_price {
        font-size: 20px
    }

    .gbp.new .goods_info .bx_price td {
        font-size: 15px
    }

    .gbp.new .goods_info .bx_price td.fix {
        padding-top: 15px
    }

    .gbp.new .goods_info .bx_price td.sale {
        padding-top: 5px
    }

    .gbp.new .goods_info .bx_price td.now {
        padding: 16px 0 23px 0
    }

    .gbp.new .goods_info .bx_price td.now.price {
        font-size: 20px
    }

    .gbp.new .goods_info .bx_price .btn {
        height: 50px;
        padding: 11px 10%;
        font-size: 18px;
        line-height: 27px
    }
}

.bx_goods:nth-child(4) {
    border-bottom: 1px solid #ededed
}

.file .top_visual,
.ebook .top_visual {
    height: 550px
}

@media (max-width: 1279px) {

    .file .top_visual,
    .ebook .top_visual {
        height: 468px
    }
}

@media (max-width: 767px) {

    .file .top_visual,
    .ebook .top_visual {
        height: 275px
    }
}

.file .floating_menu,
.ebook .floating_menu {
    top: 822px
}

.file .floating_menu.fix,
.ebook .floating_menu.fix {
    top: 50%
}

.sub_f {
    padding-top: 87px
}

.sub_f .skip_navi {
    top: -90px
}

.sub_f .location+.container {
    margin-top: 0px
}

.sub_f .container {
    font-size: 18px;
    width: 100%;
    max-width: 1080px;
    margin: 70px auto 100px;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding: 0px
}

.sub_f h1 {
    margin-bottom: 90px
}

.sub_f h1.center {
    text-align: center;
    margin-bottom: 0px
}

/* err */
.sub_f.err h1 {
    margin-bottom: 90px
}

.sub_f.err h1.center {
    font-size: 80px;
    text-align: center;
    margin-bottom: 90px
}

.sub_f.err .msg {
    text-align: center;
}

.sub_f.err .msg p {
    padding-top: 20px;
    padding-bottom: 20px;
}

@media (max-width: 767px) {

    .sub_f.err h1.center {
        margin-bottom: 50px
    }
}

/* //err */

.sub_f.com_msg .withdraw {
    max-width: 1080px
}

.sub_f.com_msg .withdraw h1 {
    width: 100%;
    margin: 0 0 38px
}

.sub_f.com_msg .withdraw .bx_notice {
    width: 400px;
    margin: 14px auto 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f.com_msg .withdraw .bx_notice.known {
    width: 100%;
    margin-top: 55px
}

.sub_f.com_msg .withdraw .bx_notice.known p {
    text-align: center
}

.sub_f.com_msg .withdraw .l_header.mtop {
    margin-top: 95px
}

.sub_f.com_msg .withdraw .bx_known {
    margin-top: 53px
}

.sub_f.com_msg .withdraw .bx_known.tp2 {
    margin-top: 43px
}

.sub_f.com_msg .withdraw .bx_known strong {
    display: block
}

.sub_f.com_msg .withdraw .bx_known strong.lineb {
    display: inline-block
}

.sub_f.com_msg .withdraw .tbl {
    margin: 24px auto 38px
}

.sub_f.com_msg .withdraw .tbl th {
    font-weight: 600;
    width: 220px;
    text-align: center;
    vertical-align: middle
}

.sub_f.com_msg .withdraw .tbl td {
    padding: 22px 30px;
    text-align: left;
    line-height: 26px
}

.sub_f.com_msg .withdraw .txt_point {
    text-decoration: none
}

.sub_f.com_msg .withdraw .btn.full {
    display: block;
    width: 400px;
    margin: 60px auto 0
}

.sub_f.com_msg .withdraw .btn.full+.btn {
    margin-top: 20px
}

@media (max-width: 1279px) {
    .sub_f.com_msg .withdraw {
        padding: 0px 3.9%
    }

    .sub_f.com_msg .withdraw h1 {
        margin: 0 0 28px
    }

    .sub_f.com_msg .withdraw .l_header {
        margin: 0px auto 40px
    }

    .sub_f.com_msg .withdraw .l_header p {
        line-height: 26px;
        font-size: 18px
    }

    .sub_f.com_msg .withdraw p {
        font-size: 18px
    }

    .sub_f.com_msg .withdraw .bx_notice.known {
        margin-top: 45px;
        padding: 24px 40px
    }

    .sub_f.com_msg .withdraw .bx_notice.known p {
        font-size: 16px
    }

    .sub_f.com_msg .withdraw .bx_known {
        font-size: 18px;
        margin-top: 64px
    }

    .sub_f.com_msg .withdraw .tbl {
        margin: 24px auto 26px
    }

    .sub_f.com_msg .withdraw .tbl th {
        width: 22%
    }

    .sub_f.com_msg .withdraw .tbl td {
        line-height: 24px
    }
}

@media (max-width: 767px) {
    .sub_f.com_msg .withdraw {
        padding: 0px 6.25%
    }

    .sub_f.com_msg .withdraw h1 {
        margin: 0 0 11px
    }

    .sub_f.com_msg .withdraw .l_header {
        margin: 0px auto 33px
    }

    .sub_f.com_msg .withdraw .l_header.mtop {
        margin-top: 44px
    }

    .sub_f.com_msg .withdraw .l_header p {
        line-height: 22px;
        font-size: 14px
    }

    .sub_f.com_msg .withdraw p {
        font-size: 14px
    }

    .sub_f.com_msg .withdraw .bx_known {
        font-size: 14px;
        margin-top: 44px
    }

    .sub_f.com_msg .withdraw .bx_known.tp2 {
        margin-top: 20px
    }

    .sub_f.com_msg .withdraw .bx_notice {
        width: 100%;
        margin: 16px auto 0
    }

    .sub_f.com_msg .withdraw .bx_notice.known {
        margin-top: 35px;
        padding: 24px 22px
    }

    .sub_f.com_msg .withdraw .bx_notice.known p {
        font-size: 13px
    }

    .sub_f.com_msg .withdraw .tbl {
        margin: 16px auto 14px
    }

    .sub_f.com_msg .withdraw .tbl th {
        display: block;
        width: 100%;
        text-align: left;
        padding: 17px 3.6% 0px;
        border: none
    }

    .sub_f.com_msg .withdraw .tbl td {
        display: block;
        line-height: 1.7;
        padding: 6px 3.6% 17px
    }

    .sub_f.com_msg .withdraw .btn.full {
        width: 100%;
        margin: 30px auto 0
    }
}

.sub_f.extend {
    background: #f5f5f5;
    padding: 0
}

@media (max-width: 1279px) {
    .sub_f.extend {
        overflow-x: auto
    }
}

.sub_f.extend .logo {
    display: inline-block;
    width: 120px;
    margin: 0 auto 20px
}

.sub_f.extend .logo img {
    width: 100%
}

.sub_f.extend .container {
    width: 100%;
    max-width: 980px;
    margin: 60px auto 80px;
    padding: 0
}

.sub_f.extend .container .logo {
    display: block;
    width: 120px;
    margin: 0 auto 20px
}

.sub_f.extend .container .logo img {
    width: 100%
}

.sub_f.extend .container .content {
    position: relative;
    width: 980px;
    background: #fff;
    padding: 80px 40px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #f1f1f1;
    -webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.13);
    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.13)
}

@media (max-width: 1279px) {
    .sub_f.extend .container .content {
        width: 100%
    }
}

.sub_f.extend h1 {
    margin-bottom: 46px
}

.sub_f.extend .sub_tit {
    position: absolute;
    width: auto;
    top: 97px;
    right: 40px;
    font-size: 25px
}

.sub_f.extend .bx_notice {
    padding: 14px 0 26px
}

.sub_f.extend .bx_notice.tp2 {
    padding-bottom: 0
}

.sub_f.extend .btns {
    margin: 0
}

.sub_f.extend .btns .btn.disable {
    background: #d7d7d7
}

.sub_f.extend .bx_t {
    display: block
}

.sub_f.extend .bx_t .left {
    padding: 0;
    margin-top: 60px
}

.sub_f.extend .bx_t .tbl_tit.small {
    font-weight: 100
}

.sub_f.extend .bx_b {
    float: left;
    width: 100%;
    display: block;
    padding: 20px 0
}

.sub_f.extend .bx_b .left {
    float: left
}

.sub_f.extend .bx_b .txt_neces {
    float: right;
    margin: 0
}

.sub_f.extend .bx_b .txt_neces .btn_link {
    font-size: 15px
}

.sub_f.extend .bx_b .type {
    display: inline-block;
    padding: 10px 40px 10px 20px;
    font-size: 15px;
    border: 1px solid #000;
    border-radius: 40px;
    line-height: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/icon_circle.png") no-repeat 85% 50%
}

.sub_f.extend .bx_b .type.check {
    border: none;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/icon_x.png") no-repeat 85% 50%;
    background-color: #4285F4;
    color: #fff
}

.sub_f.extend .bx_b .type+.type {
    margin-left: 9px
}

.sub_f.extend .bx_b .unlock {
    text-decoration: underline;
    font-size: 15px;
    margin-left: 9px
}

.sub_f.extend .tbl th {
    font-size: 13px;
    padding: 15px 10px;
    height: 50px
}

.sub_f.extend .tbl td {
    font-size: 12px;
    padding: 15px 10px;
    height: 70px
}

.sub_f.extend .tbl td .btn {
    font-size: 12px;
    padding: 12px 20px;
    border-radius: 5px
}

.sub_f.extend .tbl .tr_con td {
    padding: 10px 0;
    border-bottom: none
}

.sub_f.extend .tbl .tr_con .info {
    padding: 0
}

.sub_f.extend .tbl .tr_con .info dd,
.sub_f.extend .tbl .tr_con .info dt {
    padding: 10px 0;
    font-size: 15px;
    color: #222;
    line-height: 1;
    float: left
}

.sub_f.extend .tbl .tr_con .info dt {
    width: 15%
}

.sub_f.extend .tbl .tr_con .info dd {
    font-weight: bold;
    width: 85%
}

.sub_f.extend .done {
    display: inline-block;
    width: 26px;
    height: 26px;
    margin-left: 10px;
    vertical-align: middle;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/icon_clock.png") no-repeat center center
}

.sub_f.extend .tbl.tbl_board th,
.sub_f.extend .tbl.tbl_board td {
    padding: 15px 10px
}

@media (max-width: 1279px) {

    .sub_f.extend .sub_tit,
    .sub_f.extend .bx_notice,
    .sub_f.extend .bx_t,
    .sub_f.extend .bx_b,
    .sub_f.extend .tbl,
    .sub_f.extend .btns {
        display: none
    }

    .sub_f.extend .bx_ico .ico {
        padding: 0 0 10px;
        margin: 0;
        background: none
    }

    .sub_f.extend .bx_ico .info {
        display: block;
        max-width: 100%;
        text-align: center;
        font-size: 13px;
        border-left: none
    }
}

.sub_f .non_mem .txt_sub {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 18px;
    margin: 15px auto 45px
}

.sub_f .non_mem .bx_genuine {
    width: 100%;
    border-top: 1px solid #222222
}

.sub_f .non_mem .bx_genuine:after {
    display: block;
    clear: both;
    content: ""
}

.sub_f .non_mem .bx_genuine .cont {
    float: left;
    width: 100%;
    font-size: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #f0f0f0
}

.sub_f .non_mem .bx_genuine .cont .left {
    float: left;
    width: 220px;
    line-height: 46px;
    padding: 14px 0 14px 30px;
    font-weight: bold;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f .non_mem .bx_genuine .cont .right {
    float: left;
    width: calc(100% - 220px);
    padding: 0 0 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f .non_mem .bx_genuine .cont .right .bx_ipt {
    display: inline-block;
    margin: 14px 0
}

.sub_f .non_mem .bx_genuine .cont .right .bx_ipt+.bx_ipt {
    margin-left: 10px;
    margin-top: 0
}

.sub_f .non_mem .bx_genuine .cont .right .bx_ipt:nth-child(3n+1) {
    margin-left: 0
}

.sub_f .non_mem .bx_genuine .cont .right .bx_ipt .ipt {
    width: 260px;
    height: 48px
}

.sub_f .non_mem .bx_genuine .cont .right .txt_alert {
    display: block;
    margin: 12px 0 0
}

.sub_f .non_mem .bx_genuine .txt_alert {
    display: inline-block;
    margin-top: 15px
}

.sub_f .non_mem .bx_ico.ty2 {
    margin-top: 76px
}

.sub_f .non_mem .bx_ico.ty3 {
    padding: 50px 0;
    text-align: center
}

.sub_f .non_mem .bx_ico.ty3 .img_linked {
    display: inline-block;
    width: 103px;
    height: 80px;
    background: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 103 79' xml:space='preserve'%3E%3Cstyle%3E.st1,.st2%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23343434%7D.st2%7Bfill:%23222%7D%3C/style%3E%3Cpath d='M3 0h97c1.7 0 3 1.3 3 3v73c0 1.7-1.3 3-3 3H3c-1.7 0-3-1.3-3-3V3c0-1.7 1.3-3 3-3z' fill-rule='evenodd' clip-rule='evenodd' fill='%23fff'/%3E%3Cpath class='st1' d='M103 33.5v42.1c0 1.9-1.5 3.4-3.4 3.4H3.4C1.5 79 0 77.5 0 75.6V3.4C0 1.5 1.5 0 3.4 0h96.1c1.9 0 3.4 1.5 3.4 3.4v30.1h.1zm-3-.6V12.1 4.6c-.1-.9-.8-1.6-1.7-1.6H4.7C3.8 3 3 3.7 3 4.7v69.6c0 .9.8 1.7 1.7 1.7h93.6c.9 0 1.7-.8 1.7-1.7V32.9z'/%3E%3Cpath class='st1' d='M1 16h100v3H1v-3zM92.5 12c-1.4 0-2.5-1.1-2.5-2.5S91.1 7 92.5 7 95 8.1 95 9.5 93.9 12 92.5 12zm-8 0c-1.4 0-2.5-1.1-2.5-2.5S83.1 7 84.5 7 87 8.1 87 9.5 85.9 12 84.5 12zm-8 0c-1.4 0-2.5-1.1-2.5-2.5S75.1 7 76.5 7 79 8.1 79 9.5 77.9 12 76.5 12z'/%3E%3Cpath class='st2' d='M60 46.5C60 55.6 52.6 63 43.5 63S27 55.6 27 46.5 34.4 30 43.5 30H45c.3 0 .6.1.8.2h.2v.1c.6.3 1 1 1 1.7s-.4 1.4-1 1.7v.5c-.8-.2-1.6-.3-2.5-.3C36.6 34 31 39.6 31 46.5a12.5 12.5 0 0025 0c0-.9-.1-1.7-.3-2.5h.5c.3-.6 1-1 1.7-1s1.4.4 1.7 1h.1v.2c.1.3.2.5.2.8v.4c.1.4.1.7.1 1.1z'/%3E%3Cpath class='st2' d='M60.5 63H59c-.3 0-.6-.1-.8-.2H58v-.1c-.6-.3-1-1-1-1.7s.4-1.4 1-1.7v-.5c.8.2 1.6.3 2.5.3C67.4 59 73 53.4 73 46.5a12.5 12.5 0 00-25 0c0 .9.1 1.7.3 2.5h-.5c-.3.6-1 1-1.7 1s-1.4-.4-1.7-1h-.1v-.2c-.2-.2-.3-.5-.3-.8v-.4-1.1C44 37.4 51.4 30 60.5 30S77 37.4 77 46.5 69.6 63 60.5 63z'/%3E%3C/svg%3E") 0 0 no-repeat
}

.sub_f .non_mem .bx_ico.ty3 p {
    font-size: 32px;
    margin: 10px auto 20px
}

.sub_f .non_mem .bx_ico.ty3 a.btn {
    color: #fff;
    text-decoration: none
}

.sub_f .non_mem .bx_ico.ty3 a.btn+.btn {
    margin-left: 16px
}

.sub_f .non_mem .top_empty {
    margin-top: 55px
}

.sub_f .non_mem .half_area .tbl_tit,
.sub_f .non_mem .half_area .txt_neces {
    margin: 0px auto 9px;
    padding: 0;
    line-height: 36px
}

.sub_f .non_mem .half_area .right_cont {
    float: right;
    margin-bottom: 14px
}

.sub_f .non_mem .half_area .left_cont {
    float: left
}

.sub_f .non_mem .half_area .left_cont.t_view {
    display: none
}

.sub_f .non_mem .half_area .slct_list {
    float: left
}

.sub_f .non_mem .half_area .slct_list li {
    position: relative;
    display: inline-block;
    line-height: 30px
}

.sub_f .non_mem .half_area .slct_list li:before {
    content: "";
    width: 1px;
    height: 15px;
    display: block;
    position: absolute;
    background: #dedede;
    top: 50%;
    left: 20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub_f .non_mem .half_area .slct_list li.non_bar .tit {
    padding: 0
}

.sub_f .non_mem .half_area .slct_list li:first-child:before {
    display: none
}

.sub_f .non_mem .half_area .slct_list li:first-child .tit {
    padding: 0
}

.sub_f .non_mem .half_area .slct_list .tit {
    display: inline-block;
    padding: 0 0 0 40px;
    text-align: right;
    font-size: 15px;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f .non_mem .half_area .slct_list .slct_mem {
    display: inline-block;
    width: auto
}

.sub_f .non_mem .btns .btn {
    min-width: 190px;
    padding: 18px 20px 20px
}

@media (max-width: 1279px) {
    .sub_f .non_mem .bx_genuine .cont .left {
        width: 24%;
        padding: 14px 10px 14px 20px
    }

    .sub_f .non_mem .bx_genuine .cont .right {
        width: 76%;
        padding: 0
    }

    .sub_f .non_mem .bx_genuine .cont .right .bx_ipt+.bx_ipt {
        margin-left: 10px
    }

    .sub_f .non_mem .bx_genuine .cont .right .bx_ipt:nth-child(2n+1) {
        margin-left: 0
    }

    .sub_f .non_mem .bx_ico.ty2 {
        margin-top: 80px
    }

    .sub_f .non_mem .top_empty {
        margin-top: 35px
    }

    .sub_f .non_mem .half_area .right_cont {
        float: left;
        display: block;
        width: 100%;
        margin-bottom: 24px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list {
        width: 100%
    }

    .sub_f .non_mem .half_area .right_cont .slct_list li {
        display: block;
        width: 100%;
        line-height: 36px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list li:before {
        display: none
    }

    .sub_f .non_mem .half_area .right_cont .slct_list .tit {
        width: 160px;
        padding: 0;
        text-align: left;
        font-size: 15px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list .slct_mem {
        width: 176px;
        font-size: 15px;
        direction: ltr
    }

    .sub_f .non_mem .half_area .left_cont {
        display: block;
        width: 100%;
        margin-top: 0;
        margin-bottom: 15px
    }

    .sub_f .non_mem .half_area .left_cont.t_view {
        display: block;
        line-height: 25px
    }
}

@media (max-width: 767px) {
    .sub_f .non_mem .txt_sub {
        font-size: 14px;
        margin: 15px auto 35px
    }

    .sub_f .non_mem .bx_genuine .cont {
        padding: 15px 0;
        font-size: 13px
    }

    .sub_f .non_mem .bx_genuine .cont .left {
        float: none;
        display: block;
        width: 100%;
        line-height: 40px;
        padding: 0
    }

    .sub_f .non_mem .bx_genuine .cont .right {
        float: none;
        display: block;
        width: 100%
    }

    .sub_f .non_mem .bx_genuine .cont .right .awesomplete {
        width: 100%
    }

    .sub_f .non_mem .bx_genuine .cont .right .bx_ipt {
        width: 100%;
        margin: 0
    }

    .sub_f .non_mem .bx_genuine .cont .right .bx_ipt+.bx_ipt {
        margin-top: 10px;
        margin-left: 0
    }

    .sub_f .non_mem .bx_genuine .cont .right .bx_ipt .ipt {
        width: 100%;
        height: 40px
    }

    .sub_f .non_mem .bx_genuine .cont .right .txt_alert {
        display: block;
        margin: 12px 0 0
    }

    .sub_f .non_mem .bx_genuine .txt_alert {
        display: inline-block;
        margin-top: 15px
    }

    .sub_f .non_mem .bx_ico.ty2 {
        margin: 40px 0
    }

    .sub_f .non_mem .bx_ico.ty3 {
        padding: 25px 0
    }

    .sub_f .non_mem .bx_ico.ty3 .img_linked {
        width: 63px;
        height: 48px
    }

    .sub_f .non_mem .bx_ico.ty3 p {
        font-size: 14px;
        margin: 10px auto 20px
    }

    .sub_f .non_mem .bx_ico.ty3 a.btn {
        display: block;
        width: 135px;
        margin: 0 auto
    }

    .sub_f .non_mem .bx_ico.ty3 a.btn+.btn {
        margin: 10px auto 0
    }

    .sub_f .non_mem .half_area .tbl_tit {
        margin: 0px
    }

    .sub_f .non_mem .half_area .txt_neces.col3 {
        margin-bottom: 25px
    }

    .sub_f .non_mem .half_area .txt_neces.col3 .btn_link {
        display: inline-block;
        text-align: left
    }

    .sub_f .non_mem .half_area .right_cont {
        margin-bottom: 25px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list li {
        line-height: 32px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list .tit {
        width: 49%;
        text-align: left;
        font-size: 13px
    }

    .sub_f .non_mem .half_area .right_cont .slct_list .slct_mem {
        width: 50%;
        font-size: 13px
    }

    .sub_f .non_mem .half_area .left_cont {
        margin: 0 0 15px
    }

    .sub_f .non_mem .half_area .left_cont.t_view {
        line-height: 15px
    }

    .sub_f .non_mem .btns .btn {
        width: 100%
    }

    .sub_f .non_mem .btns .btn+.btn {
        margin-top: 12px
    }
}

.sub_f .tbl_detail {
    margin-top: 30px
}

@media (max-width: 1279px) {
    .sub_f {
        padding-top: 60px
    }

    .sub_f .skip_navi {
        top: -50px
    }

    .sub_f h1 {
        margin-bottom: 50px
    }

    .sub_f .container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 16px;
        margin: 50px auto 80px;
        padding: 0px 3.9%
    }

    .sub_f .container.mp_bt {
        margin: 50px auto 135px
    }

    .sub_f .non_mem .top_empty .t_view {
        display: block;
        line-height: 50px
    }
}

@media (max-width: 767px) {
    .sub_f {
        padding-top: 44px
    }

    .sub_f h1 {
        margin-bottom: 30px
    }

    .sub_f .location+.container {
        margin-top: 40px
    }

    .sub_f .skip_navi {
        top: -44px
    }

    .sub_f .container {
        font-size: 13px;
        margin: 32px auto 50px;
        padding: 0px 6.25%
    }

    .sub_f .tbl_detail {
        margin-top: 0px
    }

    .sub_f .non_mem .txt_sub {
        font-size: 14px;
        margin: 15px auto 35px
    }

    .sub_f .non_mem .half_area .right {
        float: left;
        display: block;
        width: 100%
    }

    .sub_f .non_mem .half_area .right .tbl_mem,
    .sub_f .non_mem .half_area .right tbody,
    .sub_f .non_mem .half_area .right tr {
        display: block;
        width: 100%
    }

    .sub_f .non_mem .half_area .right td {
        display: inline-block
    }

    .sub_f .non_mem .half_area .right td.tip {
        margin-right: calc(100% - 285px)
    }

    .sub_f .non_mem .half_area .right td.tip,
    .sub_f .non_mem .half_area .right td.tom {
        margin-left: 20px
    }

    .sub_f .non_mem .half_area .left {
        float: left;
        display: block;
        width: 100%
    }

    .sub_f .non_mem .btns .btn {
        width: 100%
    }

    .sub_f .non_mem .btns .btn+.btn {
        margin-top: 12px
    }
}

.sub_f .tbl+.col2,
.sub_f .sub .tbl+.goods_info,
.sub .sub_f .tbl+.goods_info {
    border-top: 1px solid #222222;
    margin-top: 30px;
    padding-top: 20px
}

.sub_f.print .container {
    width: 100%;
    max-width: 100%;
    margin: 0px auto 100px;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

.sub_f.print .container h1 {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

@media (max-width: 1279px) {
    .sub_f.print .container h1 {
        margin-bottom: 76px
    }
}

@media (max-width: 767px) {
    .sub_f.print .container h1 {
        margin-bottom: 13px
    }
}

.sub_f.print .lst {
    overflow: hidden
}

.sub_f.print .lst dt,
.sub_f.print .lst dd {
    float: left;
    padding: 7px 0
}

.sub_f.print .lst dt {
    width: 20%
}

.sub_f.print .lst dd {
    width: 80%
}

.sub_f.print2 .container {
    width: 100%;
    max-width: 100%;
    margin: 0px auto;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding: 0
}

.sub_f.install .container {
    margin: 0px auto;
    padding: 80px 0px 100px
}

@media (max-width: 1279px) {
    .sub_f.install .container {
        padding: 70px 4.68% 80px
    }
}

@media (max-width: 767px) {
    .sub_f.install .container {
        padding: 40px 6.25% 50px
    }
}

.sub_f.install .bx_complet {
    width: 100%;
    height: 280px;
    margin-bottom: 80px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    z-index: 1;
    text-align: left
}

.sub_f.install .bx_complet:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0px
}

.sub_f.install .bx_complet h1 {
    margin: 0px 88px;
    padding-left: 198px;
    z-index: 2;
    color: #ffffff;
    font-weight: 100;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 1.26
}

.sub_f.install .bx_complet h1:before {
    content: "";
    width: 146px;
    height: 146px;
    display: block;
    position: absolute;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_check_big.png") no-repeat 0 50%;
    top: 50%;
    left: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub_f.install.gmx .bx_complet {
    margin-bottom: 40px
}

@media (max-width: 767px) {
    .sub_f.install.gmx .bx_complet {
        margin-bottom: 30px
    }
}

.sub_f.install.gmx .bottom_bnr {
    margin: 0 0 71px
}

@media (max-width: 767px) {
    .sub_f.install.gmx .bottom_bnr {
        margin: 0 -6.25% 44px
    }
}

.sub_f.install h2 {
    margin-bottom: 54px
}

.sub_f.install h3 {
    margin-bottom: 34px;
    font-size: 26px;
    font-weight: 100;
    text-align: left
}

.sub_f.install h3+.cont .bx_unit {
    cursor: pointer
}

.sub_f.install h3.tit_reinstall {
    margin: 50px auto 34px;
    text-align: center;
    font-size: 38px;
    line-height: 1.2;
    letter-spacing: -1.9px
}

@media (max-width: 1279px) {
    .sub_f.install .bx_complet {
        margin-bottom: 70px
    }

    .sub_f.install .bx_complet h1 {
        padding-left: 0px
    }

    .sub_f.install .bx_complet h1:before {
        display: none
    }
}

@media (max-width: 767px) {
    .sub_f.install h2 {
        margin-bottom: 27px
    }

    .sub_f.install .bx_complet {
        height: 200px
    }

    .sub_f.install .bx_complet h1 {
        margin: 0px 20px
    }

    .sub_f.install h3.tit_reinstall {
        margin: 80px auto 30px;
        font-size: 23px;
        letter-spacing: -2.3px
    }
}

.sub_f.install .tit_line {
    position: relative;
    margin-bottom: 90px
}

.sub_f.install .tit_line:before {
    content: "";
    width: 44px;
    height: 1px;
    display: block;
    position: absolute;
    background: #222222;
    bottom: -40px;
    left: 50%;
    margin-left: -22px
}

.sub_f.install .cont {
    width: 1100px;
    margin: 0px 0px 87px -10px
}

.sub_f.install .cont:after {
    display: block;
    clear: both;
    content: ""
}

.sub_f.install .cont .bx_qna {
    margin-bottom: 24px
}

.sub_f.install .cont:last-child {
    margin-bottom: 0px
}

.sub_f.install .bx_unit {
    display: inline-block;
    margin: 0px 6px
}

.sub_f.install .bx_unit .desc {
    overflow: hidden
}

@media (max-width: 1279px) {
    .sub_f.install .cont {
        text-align: center;
        width: 102%;
        margin: 0px -1% 50px
    }

    .sub_f.install .bx_unit {
        display: block;
        float: left;
        width: 31.33%;
        margin: 10px 1%
    }

    .sub_f.install .bx_unit .desc {
        overflow: hidden
    }
}

@media (max-width: 767px) {
    .sub_f.install .cont {
        width: 100%;
        margin: 0 0 50px
    }

    .sub_f.install .bx_unit {
        float: none;
        width: auto;
        margin: 10px 0
    }
}

.sub_f.install .special {
    text-align: center
}

.sub_f.install .special .cont {
    max-width: 1110px;
    margin: 0px -1%
}

@media (max-width: 767px) {
    .sub_f.install .special .cont {
        margin: 0px
    }
}

.sub_f.install .special .bx_qna .bx_txt {
    text-align: left
}

.sub_f.install .special .bx_unit {
    width: 100%;
    max-width: 340px;
    margin: 0px 11px
}

.sub_f.install .special .bx_unit .top {
    height: 230px
}

.sub_f.install .special .bx_unit .top img {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sub_f.install .special .bx_unit .desc {
    padding: 34px 0px;
    margin-top: 0px;
    height: auto
}

.sub_f.install .special .bx_unit .desc strong {
    font-size: 20px;
    margin: 0px 0px 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.sub_f.install .special .bx_unit .desc strong+span {
    font-size: 15px;
    color: #666666;
    height: 75px;
    margin-bottom: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

@media (max-width: 767px) {
    .sub_f.install .special .bx_unit .desc strong+span {
        height: auto
    }
}

@media (max-width: 1279px) {
    .sub_f.install .special .bx_unit {
        width: 49%;
        max-width: inherit;
        margin: 8px 1%
    }

    .sub_f.install .special .bx_unit:nth-child(2n) {
        margin-right: 0
    }

    .sub_f.install .special .bx_unit:nth-child(2n-1) {
        margin-left: 0
    }
}

@media (max-width: 767px) {
    .sub_f.install .special .bx_qna .bx_txt {
        text-align: center
    }

    .sub_f.install .special .bx_unit {
        width: auto;
        float: none;
        min-height: 0;
        margin: 10px auto
    }

    .sub_f.install .special .bx_unit .desc {
        padding: 34px 30px
    }

    .sub_f.install .special .bx_unit .desc br {
        display: none
    }
}

.sub_f.install.stop .bx_complet {
    height: 223px;
    background-color: #e53c3a;
    background: -webkit-gradient(linear, left bottom, left top, from(#e53c3a), to(#fc776e));
    background: linear-gradient(to top, #e53c3a, #fc776e);
    background: -o-linear-gradient(to top, #e53c3a, #fc776e);
    background-color: #e53c3a;
    -webkit-box-shadow: 0px 20px 45px #f4cfcf;
    box-shadow: 0px 20px 45px #f4cfcf
}

.sub_f.install.stop .bx_complet:before {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/bg_stop.png") no-repeat 90% 100%
}

.sub_f.install.stop .bx_complet h1:before {
    width: 150px;
    height: 155px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_noti_big.png") no-repeat 90% 100%
}

@media (max-width: 767px) {
    .sub_f.install.stop .bx_complet {
        height: 120px
    }
}

.sub_f.install .cnt_top .subtit {
    margin: 60px 0 80px
}

@media (max-width: 767px) {
    .sub_f.install .cnt_top .subtit {
        margin: 27px 0 37px
    }
}

.sub_f.install .bx_step {
    margin-bottom: 100px
}

@media (max-width: 767px) {
    .sub_f.install .bx_step {
        margin-bottom: 50px
    }
}

.sub_f.install .bx_step .bx .tit {
    height: auto;
    padding: 30px 35px;
    background: #4285F4 url(//dreamgreen.co.kr/assets/ui/img/common/bg_uninstall.png) no-repeat 135% 50%;
    font-size: 26px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f.install .bx_step .bx .tit strong {
    margin-bottom: 0px;
    font-size: 26px;
    display: inline-block
}

@media (max-width: 1279px) {
    .sub_f.install .bx_step .bx .tit {
        font-size: 18px
    }

    .sub_f.install .bx_step .bx .tit strong {
        font-size: 18px
    }
}

@media (max-width: 767px) {
    .sub_f.install .bx_step .bx:first-child:after {
        display: none
    }

    .sub_f.install .bx_step .bx .tit {
        font-size: 15px
    }

    .sub_f.install .bx_step .bx .tit strong {
        font-size: 15px
    }

    .sub_f.install .bx_step .bx h4 {
        font-size: 15px
    }
}

.sub_f.install .bx_step .guide strong {
    display: block
}

.sub_f.install .bx_step .guide .cont_step {
    text-align: center
}

.sub_f.install .bx_step .guide .btns {
    margin-top: 40px
}

.ly_new {
    padding-top: 87px
}

@media (max-width: 1279px) {
    .ly_new {
        padding-top: 60px
    }
}

@media (max-width: 767px) {
    .ly_new {
        padding-top: 44px
    }
}

.ly_new .skip_navi {
    top: -90px
}

.ly_new .location+.container {
    margin-top: 0px
}

.ly_new .container {
    min-width: 1280px;
    padding: 0 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 18px;
    width: 100%;
    max-width: 1280px;
    margin: 20px auto 100px;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

@media (max-width: 1279px) {
    .ly_new .container {
        min-width: auto;
        padding: 0 30px
    }
}

@media (max-width: 767px) {
    .ly_new .container {
        padding: 30px 24px 0
    }
}

.ly_new .container h1 {
    margin-bottom: 0
}

.ly_new h1.center {
    text-align: center;
    margin-bottom: 0px
}

.ly_new .location {
    min-width: 1280px;
    padding: 0 20px
}

@media (max-width: 1279px) {
    .ly_new .location {
        min-width: 100%;
        padding: 0 30px
    }
}

@media (max-width: 767px) {
    .ly_new .location {
        padding: 0 24px
    }
}

.ly_new .location+.top_visual2 {
    padding-top: 40px
}

.has_vis .location {
    margin: 42px auto 63px
}

@media (max-width: 1279px) {
    .has_vis .location {
        margin: 42px auto 21px
    }
}

.top_visual2 {
    background: #2C2628;
    color: #ffffff
}

.top_visual2 .inner {
    overflow: hidden;
    position: relative;
    width: 1240px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.top_visual2 .bx_photo img {
    display: none;
    width: 100%
}

@media (min-width: 1279px) {
    .top_visual2 .bx_photo .blog_vis_pc {
        display: block
    }
}

@media (max-width: 1279px) {
    .top_visual2 .bx_photo .blog_vis_tb {
        display: block
    }
}

@media (max-width: 767px) {
    .top_visual2 .bx_photo .blog_vis_tb {
        display: none
    }

    .top_visual2 .bx_photo .blog_vis_m {
        display: block
    }
}

.top_visual2 .btns {
    position: absolute;
    bottom: 0;
    left: 0;
    margin-top: 0;
    margin-bottom: 32px;
    line-height: 0;
    font-size: 0
}

.top_visual2 .btns .btn {
    margin: 0
}

.top_visual2 .btns .btn+.btn {
    margin-left: 14px
}

@media (max-width: 1279px) {
    .top_visual2 .inner {
        width: 100%
    }

    .top_visual2 .bx_photo img {
        width: auto;
        width: 100%
    }

    .top_visual2 .btns {
        left: 3.9%;
        bottom: 20px;
        margin: 0
    }

    .top_visual2 .btns .btn+.btn {
        margin-left: 10px
    }
}

@media (max-width: 767px) {
    .top_visual2 .btns {
        position: static;
        margin: 0;
        padding: 20px 24px;
        background: #2C2628
    }

    .top_visual2 .btns .btn {
        width: 100%;
        margin: 0;
        padding: 17px 0 16px
    }

    .top_visual2 .btns .btn+.btn {
        margin-top: 10px;
        margin-left: 0
    }

    .top_visual2 .btn.black {
        padding: 16px 0 15px;
        background: none;
        border: 1px solid #fff;
        border-radius: 4px
    }
}

.report .container {
    max-width: 100%;
    background: #f7f7f7;
    padding: 100px 0px 120px;
    margin: 0 auto
}

@media (max-width: 1279px) {
    .report .container {
        padding: 60px
    }
}

@media (max-width: 767px) {
    .report .container {
        padding: 0px
    }
}

.report .bx_report {
    width: 100%;
    max-width: 840px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #ffffff;
    border: 4px solid #222222;
    -webkit-box-shadow: 0 10px 15px 1px rgba(0, 0, 0, 0.4);
    box-shadow: 0 10px 15px 1px rgba(0, 0, 0, 0.4);
    outline: 1px solid #222222
}

@media (max-width: 767px) {
    .report .bx_report {
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

.report .bx_report .cnt_top {
    padding: 60px 30px 55px;
    border-bottom: 2px dashed #222222;
    text-align: center;
    position: relative
}

.report .bx_report .cnt_top .left {
    margin: 10px auto 0px
}

@media (max-width: 1279px) {
    .report .bx_report .cnt_top {
        padding: 54px 4.68% 58px
    }

    .report .bx_report .cnt_top .left {
        padding-right: 0px
    }
}

@media (max-width: 767px) {
    .report .bx_report .cnt_top {
        padding: 54px 6.25% 58px
    }
}

.report .bx_report .cnt_top h1 {
    font-weight: 100;
    margin-bottom: 25px;
    line-height: 1.3em
}

.report .bx_report .cnt_top .txt_pen {
    background: #fff5c3;
    line-height: 2
}

.report .bx_report .cont {
    max-width: 424px;
    width: 100%;
    margin: 0 auto;
    padding: 54px 0px 70px;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.report .bx_report .cont .tit {
    font-weight: 600
}

.report .bx_report .cont .unit {
    margin: 14px 0px 54px;
    background: #f7f7f7;
    width: 100%;
    padding: 15px 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px
}

.report .bx_report .cont .unit li {
    padding: 4px 0px
}

.report .bx_report .cont .unit .ipt {
    margin: 5px 0px 0px 23px;
    width: 86%
}

.report .bx_report .cont .unit .dpe2 {
    padding: 17px 24px 30px;
    margin-bottom: 9px;
    background: #eaeaea
}

.report .bx_report .cont .unit .dpe2 li {
    padding: 0
}

.report .bx_report .cont .unit .dpe2 li+li {
    margin-top: 6px
}

@media (max-width: 767px) {
    .report .bx_report .cont {
        padding: 54px 6.25% 58px
    }
}

.report .bx_report .bx_textarea {
    margin: 14px 0px 24px
}

.report .bx_report .bx_textarea textarea,
.report .bx_report .bx_textarea .holder {
    font-size: 15px;
    padding: 14px 16px
}

.report .bx_report .txt_point {
    font-size: 15px
}

.lang_js th {
    word-break: normal
}

.cnt_print {
    width: 100%;
    background-color: #f5f5f5;
    margin-top: 90px;
    padding: 80px 0
}

.cnt_print::-webkit-scrollbar {
    -webkit-appearance: none
}

.cnt_print::-webkit-scrollbar:vertical {
    width: 12px
}

.cnt_print::-webkit-scrollbar:horizontal {
    height: 12px
}

.cnt_print::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    border: 2px solid #d2d2d2
}

.cnt_print::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d2d2d2
}

.cnt_print .estimate {
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    width: 100%;
    max-width: 1080px;
    margin: 0px auto;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

.cnt_print .estimate .lst_estimate {
    position: relative;
    overflow: hidden;
    padding: 40px 65px 0 65px;
    margin: 10px !important;
    border: 1px solid #e5e5e5
}

.cnt_print .estimate .lst_estimate h3 {
    font-size: 56px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 10px
}

.cnt_print .estimate .lst_estimate h4+.lst {
    margin-top: 5px
}

.cnt_print .estimate .lst_estimate .date {
    position: absolute;
    top: 70px;
    right: 70px;
    text-align: right;
    line-height: 1.4;
    font-size: 13px;
    color: #999999
}

.cnt_print .estimate .lst_estimate .date time {
    margin-left: 5px
}

.cnt_print .estimate .lst_estimate .noti {
    font-size: 15px;
    color: #999999
}

.cnt_print .estimate .lst_estimate .sign {
    text-align: right;
    line-height: 1.4;
    font-size: 15px
}

.cnt_print .estimate .lst_estimate .sign .txt_sign {
    margin-top: 5px;
    font-size: 18px
}

.cnt_print .estimate .lst_estimate .lst {
    border-top: 1px solid #222222;
    padding: 20px 0 15px 0;
    margin-top: 30px;
    font-size: 15px
}

.cnt_print .estimate .lst_estimate .lst dt,
.cnt_print .estimate .lst_estimate .lst dd {
    padding: 3px 0
}

.cnt_print .estimate .lst_estimate .lst dd {
    font-weight: 600
}

.cnt_print .estimate .lst_estimate .tbl_board {
    border-top: 0
}

.cnt_print .estimate .lst_estimate .tbl_board th {
    padding: 25px 5px 13px;
    border-bottom: 1px solid #222222;
    font-size: 17px
}

.cnt_print .estimate .lst_estimate .tbl_board td {
    height: 50px;
    padding: 18px 5px
}

.cnt_print .estimate .lst_estimate .tbl_board td.price {
    padding: 15px 30px;
    top: 20px;
    border-bottom: 1px solid #ffffff;
    font-weight: 600
}

.cnt_print .estimate .lst_estimate .tbl_board td.price strong {
    margin-left: 10px;
    font-size: 38px;
    vertical-align: -6px;
    font-weight: 100
}

.cnt_print .estimate .lst_estimate .tbl_board td.price span {
    font-weight: 100
}

.cnt_print .estimate .lst_estimate address {
    text-align: center;
    margin: 13px auto;
    line-height: 1
}

.cnt_print .btns {
    width: 100%;
    max-width: 1080px;
    margin: 30px auto 0 auto;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding-bottom: 30px;
    border-bottom: 1px solid #222222
}

@media (max-width: 1279px) {
    .cnt_print {
        background-color: #fff;
        padding: 0;
        margin-top: 0
    }
}

@media (max-width: 767px) {
    .cnt_print {
        overflow-x: auto
    }

    .cnt_print .estimate {
        min-width: 610px;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .cnt_print .btns {
        min-width: 610px
    }
}

.sub_f.print2 {
    padding-top: 0;
    min-width: 1080px;
    line-height: 1.7
}

.sub_f.print2 .cnt_print2 {
    width: 100%;
    margin-top: 0;
    padding: 0 0 50px;
    background-color: #f5f5f5
}

.sub_f.print2 .cnt_print2::-webkit-scrollbar {
    -webkit-appearance: none
}

.sub_f.print2 .cnt_print2::-webkit-scrollbar:vertical {
    width: 12px
}

.sub_f.print2 .cnt_print2::-webkit-scrollbar:horizontal {
    height: 12px
}

.sub_f.print2 .cnt_print2::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    border: 2px solid #d2d2d2
}

.sub_f.print2 .cnt_print2::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d2d2d2
}

.sub_f.print2 .cnt_print2 .btns {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding: 30px 0;
    border-bottom: none
}

.sub_f.print2 .cnt_print2 .half {
    display: table;
    table-layout: fixed;
    width: 100%;
    padding-top: 72px
}

.sub_f.print2 .cnt_print2 .half+.half {
    padding-top: 31px
}

.sub_f.print2 .cnt_print2 .half .left,
.sub_f.print2 .cnt_print2 .half .right {
    display: table-cell;
    position: relative;
    width: 50%;
    margin-top: 36px;
    vertical-align: top
}

.sub_f.print2 .cnt_print2 .half .left h4,
.sub_f.print2 .cnt_print2 .half .right h4 {
    position: absolute;
    left: 20px;
    top: -38px;
    line-height: 1;
    font-size: 17px
}

.sub_f.print2 .cnt_print2 .half .left {
    padding-right: 20px
}

.sub_f.print2 .cnt_print2 .half .left h4 {
    left: 0
}

.sub_f.print2 .cnt_print2 .half .right {
    padding-left: 20px
}

.sub_f.print2 .cnt_print2 .half .entire {
    display: table-cell;
    position: relative;
    width: 100%;
    margin-top: 36px;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f.print2 .cnt_print2 .half .entire.tp2 {
    padding-bottom: 30px;
    border-bottom: 1px solid #f0f0f0
}

.sub_f.print2 .cnt_print2 .half .entire h4 {
    left: 0;
    padding-bottom: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f.print2 .cnt_print2 .half .entire .lst dt {
    width: 30%
}

.sub_f.print2 .cnt_print2 .half .entire .lst dd {
    width: 70%
}

.sub_f.print2 .cnt_print2 .estimate {
    overflow: hidden;
    width: 960px;
    margin: 0 auto;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.1)
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate {
    position: relative;
    overflow: hidden;
    padding: 60px 70px 0;
    margin: 10px !important;
    border: 1px solid #e5e5e5
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate h3 {
    font-size: 56px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 10px
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .date {
    position: absolute;
    top: 66px;
    right: 70px;
    text-align: right;
    line-height: 1.5;
    font-size: 13px;
    color: #999999
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .date time {
    margin-left: 5px
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .noti {
    margin-left: 10px;
    text-indent: -10px;
    font-size: 15px;
    color: #999999;
    line-height: 1.7
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .noti a {
    color: #4285F4
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .noti2 {
    padding-top: 25px;
    font-size: 15px;
    color: #999999;
    line-height: 1.7;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board {
    margin: 10px 0 50px;
    border-top: 0
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board th {
    padding: 15px 20px;
    border-bottom: 1px solid #222222;
    font-size: 17px;
    font-weight: 600;
    vertical-align: middle
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board th .unit {
    display: block;
    font-weight: 100;
    font-size: 13px
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board td {
    height: 50px;
    padding: 24px 20px
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board td.price {
    padding: 14px 20px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ffffff;
    font-weight: 600
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board td.price strong {
    margin-left: 10px;
    font-size: 38px;
    vertical-align: -6px;
    font-weight: 100
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board td.price span {
    font-weight: 100
}

.sub_f.print2 .cnt_print2 .estimate .lst_estimate address {
    text-align: center;
    margin: 46px auto 64px;
    line-height: 1
}

.sub_f.print2 .cnt_print2 .estimate .lst {
    overflow: hidden;
    padding: 12px 0 11px 0;
    border-top: 1px solid #222222;
    font-size: 15px
}

.sub_f.print2 .cnt_print2 .estimate .lst dt,
.sub_f.print2 .cnt_print2 .estimate .lst dd {
    display: block;
    float: left;
    min-height: 26px;
    padding: 2px 0
}

.sub_f.print2 .cnt_print2 .estimate .lst dt {
    width: 35%
}

.sub_f.print2 .cnt_print2 .estimate .lst dd {
    width: 65%;
    font-weight: 600;
    word-break: break-all
}

.sub_f.print2 .cnt_print2 .estimate .lst2 {
    overflow: hidden;
    padding: 11px 0 19px;
    font-size: 15px
}

.sub_f.print2 .cnt_print2 .estimate .lst2 dt,
.sub_f.print2 .cnt_print2 .estimate .lst2 dd {
    display: block;
    float: left;
    min-height: 26px;
    padding: 2px 0
}

.sub_f.print2 .cnt_print2 .estimate .lst2 dt {
    width: 17.25%
}

.sub_f.print2 .cnt_print2 .estimate .lst2 dd {
    width: 82.75%;
    font-weight: 600;
    word-break: break-word
}

@media (max-width: 1279px) {
    .sub_f.print2 .cnt_print2 h4 {
        font-size: 18px
    }

    .sub_f.print2 .cnt_print2 .btns .btn {
        padding: 13px 30px 16px;
        font-size: 16px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .lst {
        font-size: 15px
    }

    .sub_f.print2 .cnt_print2 .tbl th,
    .sub_f.print2 .cnt_print2 .tbl td {
        font-size: 15px
    }
}

.file .container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    max-width: 1080px;
    margin: 0px auto;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding: 80px 0 100px
}

.file .cnt_top+.tbl_board {
    margin-top: 70px
}

@media (max-width: 1279px) {
    .file .cnt_top+.tbl_board {
        margin-top: 40px
    }
}

@media (max-width: 767px) {
    .file .cnt_top+.tbl_board {
        margin-top: 50px
    }
}

.file .cnt_top+.google_bnr,
.file .cnt_top+.google_bnr_tp2,
.file .cnt_top+.google_bnr_tp2 {
    margin: 0px auto 60px
}

@media (max-width: 767px) {

    .file .cnt_top+.google_bnr,
    .file .cnt_top+.google_bnr_tp2,
    .file .cnt_top+.google_bnr_tp2 {
        margin-bottom: 30px
    }
}

.file .location a {
    color: #999999
}

.file.sub_f {
    padding-top: 90px
}

.file.sub_f .container {
    font-size: 18px;
    width: 100%;
    max-width: 1080px;
    margin: 0px auto;
    position: relative;
    display: block;
    clear: both;
    content: "";
    padding: 0px 0px 80px
}

@media (max-width: 1279px) {
    .file.sub_f {
        padding-top: 50px
    }

    .file.sub_f .container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0px 4.68% 80px
    }
}

@media (max-width: 767px) {
    .file.sub_f {
        padding-top: 44px
    }

    .file.sub_f .container {
        padding: 40px 6.25% 50px
    }
}

.file .view_paging {
    overflow: hidden;
    border-top: 1px solid #222222;
    margin-top: 30px;
    padding-top: 20px
}

.file .view_paging .left {
    float: left
}

.file .view_paging .right {
    float: right
}

.file .tbl_board .chk+label {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.file .tbl_board th:first-child {
    padding: 15px 5px
}

@media (max-width: 1279px) {
    .file .container {
        padding: 60px 3.9% 70px
    }

    .file .tbl_file {
        display: table;
        table-layout: fixed
    }

    .file .tbl_file tbody {
        display: table-row-group
    }

    .file .tbl_file tr {
        display: table-row;
        float: none
    }

    .file .tbl_file th,
    .file .tbl_file td {
        display: table-cell;
        float: none;
        width: auto
    }

    .file .tbl_file th {
        width: 20%
    }

    .file .tbl_file td {
        padding: 10px 3%;
        display: table-cell;
        float: none;
        width: auto
    }
}

@media (max-width: 767px) {
    .file .container {
        padding: 35px 6.25% 64px
    }

    .file .sub_menu a.btn_squ {
        display: block
    }

    .file .tbl_board colgroup col:first-child {
        width: 30% !important
    }

    .file .tbl_board th:first-child {
        width: 20%;
        padding: 15px
    }

    .file .tbl_board.media tr {
        padding: 15px 3.6%
    }

    .file .tbl_file th {
        width: 34%
    }

    .file .tbl_file .ipt,
    .file .tbl_file .slct {
        width: 100% !important
    }
}

.reg {
    text-align: left;
    font-size: 18px
}

.reg .sub_tit {
    margin-bottom: 0px;
    font-weight: 100
}

.reg .tbl {
    vertical-align: top
}

.reg .tbl+.bx_ico {
    margin-top: 80px
}

.reg .tbl colgroup {
    display: none
}

.reg .tbl th {
    width: 280px
}

.reg .tbl th .impt {
    padding-right: 0px
}

.reg .tbl .chk+label {
    margin: 10px 0px
}

.reg .tbl .chk+label+.txt_alert {
    margin-top: 0
}

@media (max-width: 1279px) {
    .reg .tbl th {
        width: 23%
    }

    .reg .tbl+.bx_ico {
        margin-top: 70px
    }

    .reg .tbl label+.slct {
        margin-top: 5px
    }

    .reg .tbl .box_slc {
        margin-top: 14px
    }

    .reg .tbl .box_slc label+.slct {
        margin-top: 0
    }
}

@media (max-width: 767px) {
    .reg .tbl th {
        font-size: 13px;
        width: 34%;
        min-width: 90px
    }

    .reg .tbl th br {
        display: none
    }

    .reg .tbl .box_slc {
        margin-top: 0
    }
}

.reg .textarea_file {
    height: 78px
}

.reg .bx_notice+.bx_ico {
    margin-top: 20px
}

.reg .box_tool {
    display: inline-block
}

@media (max-width: 767px) {
    .reg .box_tool {
        width: 50%;
        margin: 0
    }

    .reg .box_tool .radio+.label {
        width: auto
    }
}

@media (max-width: 767px) {
    .reg .bx_ico img {
        padding: 0 0 10px
    }
}

.reg .bx_agr {
    margin: 20px 0px 10px;
    padding-bottom: 50px;
    border-bottom: 1px solid #f0f0f0
}

@media (max-width: 1279px) {
    .reg .bx_agr {
        padding-bottom: 40px
    }
}

@media (max-width: 767px) {
    .reg .bx_agr {
        padding-bottom: 20px
    }
}

.reg .txt_alert {
    margin-top: 10px
}

.reg .txt_alert+.txt_alert {
    margin-top: 4px
}

.reg .bx_textarea .holder {
    padding: 33px 50px
}

.reg .lst_sty_squ {
    color: #999999
}

.reg .lst_sty_squ li {
    text-indent: -12px;
    padding-left: 12px
}

.reg .lst_sty_squ li:before {
    content: "";
    width: 2px;
    height: 2px;
    display: inline-block;
    position: relative;
    background: #999999;
    vertical-align: middle;
    margin-right: 10px
}

@media (max-width: 767px) {
    .reg .lst_sty_squ li {
        margin-bottom: 0
    }
}

.reg .lst_sty_dash {
    color: #999999
}

.reg .lst_sty_dash li {
    text-indent: -12px;
    padding-left: 12px
}

.reg .lst_sty_dash li:before {
    content: '-';
    vertical-align: text-bottom;
    margin-right: 7px
}

@media (max-width: 767px) {
    .reg .lst_sty_dash li {
        margin-bottom: 0
    }
}

.reg .lst_sm {
    margin-bottom: 18px
}

.reg .lst_sm li {
    font-size: 13px;
    color: #666666;
    text-indent: -7px;
    padding-left: 7px
}

.reg .txt_sm {
    margin: 10px 0;
    padding-left: 13px;
    color: #999999
}

.reg .ipt,
.reg .slct {
    margin-right: 10px;
    margin-top: 0px;
    vertical-align: middle;
    color: var(--heading-color);
}

.reg .ipt.cnt,
.reg .slct.cnt {
    width: 100px !important;
    display: inline;
    font-weight: 600;
}

.reg .ipt+.btn,
.reg .slct+.btn {
    vertical-align: middle;
    padding: 17px 30px
}

.reg .bx_alert {
    display: block
}

/* 옵션수량선택 */
.op_num_box {
    overflow: hidden;
    clear: both;
}
.op_num_box button.op_numOut {
    background-color: #f7f7f7;
}
.op_num_box button {
    vertical-align: middle;
    float: left;
    width: 50px;
    height: 50px;
    border: 1px solid #dbdbdb;
    padding: 9px 9px;
    border-radius: 4px;
}
.sprite {
    display: inline-block;
}
button {
    overflow: visible;
    border: 0 none;
    background-color: transparent;
    cursor: pointer;
}
.sprite:before, .sprite:after {
    content: '';
    display: block;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    background-image: url(/assets/ui/img/common/sprite.png);
    background-repeat: no-repeat;
    background-size: 200px 200px;
}
.sprite.op_numOut:after {
    width: 9px;
    height: 9px;
    background-position: -86px 0;
}
.sprite.op_numAdd:after {
    width: 9px;
    height: 9px;
    background-position: -76px 0;
}
.op_num_box .op_num input {
    display: inline-block;
    width: 80px;
    border: none;
    padding: 0;
    text-align: center;
    color: #000;
    height: 50px;
    line-height: 50px;
    font-weight: 600;
    font-size: 15px;
}
.op_num_box .op_num {
    float: left;
    width: 80px;
    height: 50px;
}

.op_titlebox {
    display: flex;  
    flex-direction: column;
    align-items: center;  
}
.op_title {
    font-weight: 600;
    font-size: 15px;
}
.op_img img {
    max-width: 100px;
    min-width: 50px;
    border-radius: 10%;
}
.op_dcuprice {
    text-align: center;
    color: var(--para-color);
    font-weight: 200;
}
.op_uprice {
    text-align: center;
    color: var(--heading-color);
}
.op_dc {
    color: var(--primary-color);
    font-size: 12px;
    padding-left: 5px;
}
.op_dtl {
    margin: 0 0 0 200px;
}

/* 옵션수량선택 */

@media (max-width: 1279px) {
    .reg .textarea_file {
        height: 64px
    }

    .reg .ipt+.btn,
    .reg .slct+.btn {
        padding: 17px 30px
    }
}

@media (max-width: 767px) {

    .reg h2,
    .reg h2.sub_tit {
        margin-bottom: 30px
    }

    .reg .ipt,
    .reg .slct {
        width: 100% !important;
        height: 40px;
        display: block;
        color: var(--heading-color);
    }

    .reg .ipt.cnt,
    .reg .slct.cnt {
        width: 50% !important;
        display: inline;
    }

    .reg .ipt+.btn,
    .reg .slct+.btn {
        margin-top: 10px;
        padding: 13px 15px 14px !important
    }

    .reg .textarea_file {
        height: 54px
    }

    .reg .tbl_file .passwordArea .btn.squ {
        width: 100%
    }

    .op_num_box {
        display: flex;
        overflow: hidden;
        clear: both;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
    }
    .op_num_box button {
        width: 40px;
        height: 40px;
    }

    .op_num_box .op_num input {
        height: 40px;
        line-height: 40px;
        font-size: 13px;
    }
    .op_num_box .op_num {
        height: 40px;
    }
    .op_img img {
        max-width: 200px;
        min-width: 10px;
        border-radius: 10%;
        margin: 0 0 10px 0;
    }
    .op_dtl {
        margin: 20px 0 0 0;
    }
    
}

.mypage .empty {
    text-align: center
}

.mypage .empty img {
    width: 176px
}

.mypage .empty strong {
    display: block;
    padding: 40px 0 34px
}

@media (max-width: 1279px) {
    .mypage .empty {
        padding-top: 40px
    }

    .mypage .empty strong {
        padding-bottom: 56px
    }
}

@media (max-width: 767px) {
    .mypage .empty {
        padding-top: 20px
    }

    .mypage .empty .ico {
        width: 88px
    }

    .mypage .empty strong {
        padding: 20px 0 10px
    }
}

.mypage .tbl_tit {
    margin: 70px auto 0px
}

@media (max-width: 767px) {
    .mypage .tbl_tit {
        margin-top: 40px
    }
}

.mypage .half_area .tbl_tit,
.mypage .half_area .txt_chk,
.mypage .half_area .txt_side,
.mypage .half_area .txt_neces {
    margin: 0px auto 9px;
    padding: 0;
    line-height: 36px
}

@media (max-width: 767px) {

    .mypage .half_area .tbl_tit,
    .mypage .half_area .txt_chk,
    .mypage .half_area .txt_side,
    .mypage .half_area .txt_neces {
        line-height: 1
    }
}

.mypage .half_area+.tbl_tit {
    margin-top: 50px
}

@media (max-width: 767px) {
    .mypage .half_area+.tbl_tit {
        margin-top: 40px
    }
}

@media (max-width: 767px) {
    .mypage .half_area .left {
        float: left;
        margin: 0 0 15px
    }

    .mypage .half_area .right {
        float: right;
        margin: 0 0 15px
    }

    .mypage .half_area .right .btn_link {
        line-height: 19px
    }

    .mypage .half_area .col2,
    .mypage .half_area .sub .goods_info,
    .sub .mypage .half_area .goods_info {
        margin-bottom: 27px;
        float: none;
        text-align: left
    }

    .mypage .half_area .col2 a,
    .mypage .half_area .sub .goods_info a,
    .sub .mypage .half_area .goods_info a {
        display: inline-block
    }

    .mypage .half_area .col2 .bar,
    .mypage .half_area .sub .goods_info .bar,
    .sub .mypage .half_area .goods_info .bar {
        vertical-align: middle
    }
}

.mypage .tab {
    width: 100%;
    margin-bottom: 80px;
    display: table
}

.mypage .tab:after {
    display: block;
    clear: both;
    content: ""
}

.mypage .tab br {
    display: none
}

@media (max-width: 1279px) {
    .mypage .tab {
        margin-bottom: 70px
    }
}

@media (max-width: 767px) {
    .mypage .tab {
        margin-bottom: 50px
    }

    .mypage .tab br {
        display: block
    }
}

.mypage .tab a {
    width: 50%;
    height: 70px;
    font-size: 20px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    color: #999;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #e5e5e5;
    border-bottom-color: #222222
}

@media (max-width: 1279px) {
    .mypage .tab a {
        height: 65px
    }
}

@media (max-width: 767px) {
    .mypage .tab a {
        height: 50px;
        font-size: 14px;
        line-height: 18px
    }
}

.mypage .tab .on {
    color: #222222;
    font-weight: 600;
    border: 1px solid #222222;
    border-top: 2px solid #222222;
    border-bottom: none
}

.mypage .sub_tab {
    float: right;
    margin-bottom: 20px
}

.mypage .sub_tab:after {
    display: block;
    clear: both;
    content: ""
}

.mypage .sub_tab .tit {
    display: none
}

.mypage .sub_tab ul {
    display: block
}

@media (max-width: 767px) {
    .mypage .sub_tab {
        float: none
    }

    .mypage .sub_tab .tit {
        display: block;
        font-size: 14px;
        margin-bottom: 15px
    }

    .mypage .sub_tab .tit .ico_angle_down {
        overflow: hidden;
        text-indent: -2000em;
        font-size: 1px;
        overflow: hidden;
        position: relative;
        display: inline-block;
        width: 10px;
        height: 5px;
        vertical-align: middle;
        margin: -2px 0px 0px 8px
    }

    .mypage .sub_tab .tit .ico_angle_down:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 3px;
        height: 3px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: -1px;
        border-right: 2px solid #222222;
        border-bottom: 2px solid #222222
    }

    .mypage .sub_tab .tit.on+ul {
        display: block
    }

    .mypage .sub_tab .tit.on .ico_angle_down {
        position: relative;
        display: inline-block;
        width: 10px;
        height: 5px;
        margin: -4px 0px 0px 8px
    }

    .mypage .sub_tab .tit.on .ico_angle_down:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 3px;
        height: 3px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: 1px;
        border-top: 2px solid #222222;
        border-left: 2px solid #222222
    }

    .mypage .sub_tab .tit.on .ico_angle_down:before {
        border-right: none;
        border-bottom: none
    }

    .mypage .sub_tab ul {
        display: none
    }
}

.mypage .sub_tab li {
    float: left;
    position: relative;
    padding: 0 30px;
    line-height: 1
}

.mypage .sub_tab li:after {
    content: "";
    width: 1px;
    height: 11px;
    display: block;
    position: absolute;
    background: #999999;
    top: 50%;
    margin-top: -4px;
    right: 0
}

.mypage .sub_tab li:last-child {
    padding-right: 0
}

.mypage .sub_tab li:last-child:after {
    display: none
}

@media (max-width: 767px) {
    .mypage .sub_tab li {
        width: 50%;
        padding: 13px 3.6%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        box-sizing: border-box
    }

    .mypage .sub_tab li:after {
        display: none
    }
}

.mypage .sub_tab li a {
    font-size: 15px
}

.mypage .sub_tab li a.on {
    font-weight: 600
}

@media (max-width: 1279px) {
    .mypage .sub_tab li a {
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .mypage .sub_tab li a {
        font-size: 13px
    }
}

.mypage .tbl+h3 {
    margin-top: 70px
}

.mypage .bx_info {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mypage .bx_info h3 {
    padding: 19px 0;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--table-top-border);
}

.mypage .bx_info p {
    font-size: 15px
}

.mypage .bx_info p.txt {
    line-height: 28px
}

.mypage .bx_info.subtit .ico_tit {
    height: 37px
}

.mypage .bx_info.customer {
    margin-top: 60px
}

.mypage .bx_info.customer .ico_tit {
    height: 37px
}

.mypage .bx_info.non_mem {
    margin-top: 60px
}

@media (max-width: 1279px) {
    .mypage .bx_info h3 {
        margin-bottom: 30px
    }

    .mypage .bx_info.subtit .ico_tit {
        height: 38px
    }

    .mypage .bx_info.customer {
        margin-top: 60px
    }

    .mypage .bx_info.customer .ico_tit {
        height: 38px
    }

    .mypage .bx_info p {
        font-size: 16px
    }

    .mypage .bx_info p.txt {
        font-size: 15px
    }
}

@media (max-width: 767px) {
    .mypage .bx_info h3 {
        margin-bottom: 20px;
        padding: 10px 0 15px
    }

    .mypage .bx_info p.txt {
        font-size: 13px
    }
}

.mypage .case_box {
    display: block;
    position: relative
}

.mypage .case_box .case {
    display: inline-block;
    position: relative;
    height: 100px;
    padding-right: 20px;
    margin-top: 0;
    line-height: 1;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mypage .case_box .case .tag {
    display: block;
    max-width: 100px;
    height: 16px;
    padding: 10px 0;
    font-size: 15px;
    font-weight: 100;
    line-height: 1.05;
    word-break: break-word
}

.mypage .case_box .case .tag.my {
    font-size: 16px
}

.mypage .case_box .case strong {
    line-height: 1
}

.mypage .case_box .case2 {
    padding-left: 22px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/border_dash.png") repeat-y 0 0;
    color: var(--heading-color);
}

.mypage .case_box .case2 .tag {
    left: 20px;
    color: var(--heading-color);
}

.mypage .case_box .arw {
    position: absolute;
    display: block;
    width: 30px;
    height: 14px;
    right: 38px;
    bottom: 20px
}

.mypage .case_box .arw:before {
    content: '';
    position: absolute;
    border-top: 2px solid #4285F4;
    border-left: 2px solid #4285F4;
    top: 50%;
    width: 8px;
    height: 8px;
    right: 7px;
    -webkit-transform: translate(50%, -50%) rotate(135deg);
    -ms-transform: translate(50%, -50%) rotate(135deg);
    transform: translate(50%, -50%) rotate(135deg)
}

.mypage .case_box .arw:after {
    content: '';
    position: absolute;
    background-color: #4285F4;
    top: 50%;
    right: 1px;
    width: 29px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.mypage .case_box .ticket {
    position: relative;
    display: inline-block;
    width: 94px;
    margin-top: 63px;
    margin-left: 10px;
    bottom: -5px
}

.mypage .case_box .ticket .bu_ticket {
    width: auto;
    height: 37px
}

.mypage .case_box .ticket .arw {
    position: absolute;
    display: block;
    width: 30px;
    height: 14px;
    right: 0;
    bottom: 12px
}

.mypage .case_box .ticket .arw:before {
    content: '';
    position: absolute;
    border-top: 2px solid #4285F4;
    border-left: 2px solid #4285F4;
    top: 50%;
    width: 8px;
    height: 8px;
    right: 7px;
    -webkit-transform: translate(50%, -50%) rotate(135deg);
    -ms-transform: translate(50%, -50%) rotate(135deg);
    transform: translate(50%, -50%) rotate(135deg)
}

.mypage .case_box .ticket .arw:after {
    content: '';
    position: absolute;
    background-color: #4285F4;
    top: 50%;
    right: 1px;
    width: 29px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

@media (max-width: 1279px) {
    .mypage .case_box .ticket {
        margin-top: 37px
    }
}

@media (max-width: 767px) {
    .mypage .case_box .ticket {
        width: 76px;
        margin-top: 38px;
        margin-left: 0;
        bottom: 0;
        float: right;
        display: block
    }

    .mypage .case_box .ticket .arw {
        position: absolute;
        display: block;
        width: 23px;
        height: 14px;
        bottom: 11px
    }

    .mypage .case_box .ticket .arw:before {
        content: '';
        position: absolute;
        border-top: 2px solid #4285F4;
        border-left: 2px solid #4285F4;
        top: 50%;
        width: 8px;
        height: 8px;
        right: 7px;
        -webkit-transform: translate(50%, -50%) rotate(135deg);
        -ms-transform: translate(50%, -50%) rotate(135deg);
        transform: translate(50%, -50%) rotate(135deg)
    }

    .mypage .case_box .ticket .arw:after {
        content: '';
        position: absolute;
        background-color: #4285F4;
        top: 50%;
        right: 1px;
        width: 22px;
        height: 2px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }
}

.mypage .bx_case {
    margin-top: 32px
}

.mypage .bx_case .case {
    float: right;
    position: relative;
    width: 30px;
    height: 14px;
    margin-top: 9px
}

.mypage .bx_case .case .arw {
    right: 40px;
    bottom: 0
}

@media (max-width: 1279px) {
    .mypage .bx_case {
        margin-top: 15px
    }

    .mypage .bx_case .case {
        float: none;
        width: auto;
        height: auto;
        margin-top: 0
    }

    .mypage .bx_case .case .arw {
        bottom: -32px;
        right: 30px
    }
}

@media (max-width: 767px) {
    .mypage .bx_case {
        margin-top: 17px;
        margin-bottom: 32px
    }

    .mypage .bx_case .case .arw {
        bottom: -32px;
        right: 22px
    }
}

.mypage .case {
    display: block;
    position: relative;
    margin-top: 52px;
    line-height: 1.2;
    font-weight: 600;
    font-size: 24px;
    color: #4285F4
}

.mypage .case strong {
    font-size: 70px
}

.mypage .case .arw {
    position: absolute;
    display: block;
    width: 30px;
    height: 14px;
    right: 40px;
    bottom: 20px
}

.mypage .case .arw:before {
    content: '';
    position: absolute;
    border-top: 2px solid #4285F4;
    border-left: 2px solid #4285F4;
    top: 50%;
    width: 8px;
    height: 8px;
    right: 7px;
    -webkit-transform: translate(50%, -50%) rotate(135deg);
    -ms-transform: translate(50%, -50%) rotate(135deg);
    transform: translate(50%, -50%) rotate(135deg)
}

.mypage .case .arw:after {
    content: '';
    position: absolute;
    background-color: #4285F4;
    top: 50%;
    right: 1px;
    width: 29px;
    height: 2px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.mypage .bx_myinfo {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 31px 36px 33px 36px;
    overflow: hidden;
    border: 2px solid var(--table-top-border);
    background: var(--box-bg);
    line-height: 1.5;
    position: relative
}

.mypage .bx_myinfo .left {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    width: 320px;
    padding-right: 20px
}

.mypage .bx_myinfo .left strong {
    display: block;
    line-height: 1.2;
    font-size: 38px;
    font-weight: 100;
    word-break: break-all
}

@media (max-width: 1279px) {
    .mypage .bx_myinfo .left {
        padding-right: 0px
    }
}

.mypage .bx_myinfo .left.bx_nm {
    width: 400px
}

@media (max-width: 767px) {
    .mypage .bx_myinfo .left.bx_nm {
        width: 100%;
        text-align: left
    }
}

.mypage .bx_myinfo .bx_right {
    float: right
}

.mypage .bx_myinfo .bx_right .right {
    float: left;
    display: block;
    width: 295px

}

.mypage .bx_myinfo .bx_right .right h3 {
    padding-bottom: 11px
}

@media (max-width: 1279px) {
    .mypage .bx_myinfo .bx_right .right h3 {
        padding-bottom: 10px
    }
}

.mypage .bx_myinfo .bx_right .right h3:before {
    display: none
}

.mypage .bx_myinfo .bx_right .right:last-child {
    width: 296px
}

.mypage .bx_myinfo .bx_right .right:last-child .case_box .case {
    padding-top: 36px;
    margin-right: 60px
}

@media (max-width: 1279px) {
    .mypage .bx_myinfo .bx_right .right:last-child {
        width: 220px
    }

    .mypage .bx_myinfo .bx_right .right:last-child .case_box .case {
        padding-top: 32px;
        margin-right: 23px
    }
}

@media (max-width: 767px) {
    .mypage .bx_myinfo .bx_right .right:last-child .case_box .case {
        padding-top: 0;
        height: 100%
    }
}

.mypage .bx_myinfo .bx_right .right.dp_none {
    display: none
}

.mypage .bx_myinfo .right {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: right;
    width: 345px
}

.mypage .bx_myinfo .right h3 {
    height: auto;
    padding-top: 0;
    margin-bottom: 0;
    border: 0
}

.mypage .bx_myinfo .right p {
    position: absolute;
    top: 115px;
    left: 370px;
    width: 180px;
    font-size: 21px;
    word-break: keep-all
}

.mypage .cnt_myinfo {
    overflow: hidden;
    margin-top: 80px
}

.mypage .cnt_myinfo .info_basic {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    width: 680px;
    font-size: 15px
}

.mypage .cnt_myinfo .info_basic .ico_tit {
    width: auto;
    height: 37px
}

.mypage .cnt_myinfo .info_basic i,
.mypage .cnt_myinfo .bx_info i {
    font-size: 37px
}

.mypage .cnt_myinfo .info_basic h3 {
    padding: 19px 0;
    margin-bottom: 0;
    border-bottom: 1px solid var(--table-top-border);
}

@media (max-width: 767px) {
    .mypage .cnt_myinfo .info_basic h3 {
        padding: 10px 0 15px
    }
}

.mypage .cnt_myinfo .info_basic .lst {
    margin: 17px 0
}

.mypage .cnt_myinfo .info_basic .btns {
    margin-top: 30px;
    margin-bottom: 30px;
    padding-top: 30px;
    text-align: center;
    border-top: 1px solid var(--box-border-bottom);
}

@media (max-width: 1279px) {
    .mypage .cnt_myinfo .info_basic .btns {
        margin-top: 0
    }
}

.mypage .cnt_myinfo .info_basic .info_txt {
    padding: 16px 0;
    height: 319px;
    font-size: 15px;
    line-height: 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mypage .cnt_myinfo .bx_info {
    float: right;
    width: 345px
}

.mypage .cnt_myinfo .bx_info p {
    color: var(--heading-color);
}

.mypage .cnt_myinfo .bx_info p.txt_alert {
    display: inline-block;
    font-size: 13px;
    color: #f52222;
    margin: 0
}

@media (max-width: 767px) {
    .mypage .cnt_myinfo .bx_info p.txt_alert {
        font-size: 12px
    }
}

.mypage .cnt_myinfo .btns {
    padding-bottom: 30px;
    border-bottom: 1px solid #222222
}

.mypage .tbl_user {
    height: 250px
}

.mypage .tbl_my+.bx_notice {
    padding: 15px 0 0
}

@media (max-width: 1279px) {
    .mypage h3 {
        font-size: 18px;
        font-weight: 600
    }

    .mypage .case_box .case {
        height: 75px;
        padding-right: 15px
    }

    .mypage .case_box .case strong {
        font-size: 45px
    }

    .mypage .case_box .case .tag {
        max-width: 80px
    }

    .mypage .case_box .case .tag.my {
        padding: 0 0 16px 0
    }

    .mypage .case_box .case2 {
        padding-left: 17px
    }

    .mypage .case_box .case2 .tag {
        left: 15px
    }

    .mypage .case {
        margin-top: 50px;
        font-size: 22px
    }

    .mypage .case strong {
        font-size: 62px
    }

    .mypage .case .arw {
        position: absolute;
        display: block;
        width: 25px;
        height: 12px;
        right: 30px
    }

    .mypage .case .arw:before {
        content: '';
        position: absolute;
        border-top: 1px solid #4285F4;
        border-left: 1px solid #4285F4;
        top: 50%;
        width: 7px;
        height: 7px;
        right: 6px;
        -webkit-transform: translate(50%, -50%) rotate(135deg);
        -ms-transform: translate(50%, -50%) rotate(135deg);
        transform: translate(50%, -50%) rotate(135deg)
    }

    .mypage .case .arw:after {
        content: '';
        position: absolute;
        background-color: #4285F4;
        top: 50%;
        right: 1px;
        width: 24px;
        height: 1px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }

    .mypage .bx_myinfo {
        padding: 31px 30px 38px 30px
    }

    .mypage .bx_myinfo .left {
        width: 190px
    }

    .mypage .bx_myinfo .left.left {
        width: 190px
    }

    .mypage .bx_myinfo .left strong {
        font-size: 32px
    }

    .mypage .bx_myinfo .bx_right .right {
        width: 205px
    }

    .mypage .bx_myinfo .bx_right .right:after {
        top: 40px
    }

    .mypage .bx_myinfo .right {
        width: 225px
    }

    .mypage .bx_myinfo .right h3:before {
        left: 250px
    }

    .mypage .bx_myinfo .right p {
        width: 150px;
        top: 95px;
        left: 250px;
        font-size: 18px
    }

    .mypage .cnt_myinfo {
        margin-top: 70px
    }

    .mypage .cnt_myinfo .info_basic {
        width: calc(100% - 285px)
    }

    .mypage .cnt_myinfo .info_basic .ico_tit {
        height: 38px
    }

    .mypage .cnt_myinfo .info_basic .info_txt {
        height: 323px;
        padding: 23px 0;
        line-height: 26px
    }

    .mypage .cnt_myinfo .info_basic .info_txt span {
        display: block;
        margin-bottom: 14px
    }

    .mypage .cnt_myinfo .info_basic .info_txt br {
        display: none
    }

    .mypage .cnt_myinfo .bx_info {
        width: 255px
    }
}

@media (max-width: 767px) {
    .mypage .cnt_myinfo .ico_tit {
        height: 24px !important
    }

    .mypage .cnt_myinfo h3 {
        font-size: 14px
    }

    .mypage .case_box .case {
        height: 71px;
        min-width: 65px;
        padding-left: 0;
        padding-right: 30px
    }

    .mypage .case_box .case .tag {
        max-width: 80px;
        font-size: 13px
    }

    .mypage .case_box .case .tag.my {
        font-size: 13px;
        padding: 0 0 18px 0
    }

    .mypage .case_box .case strong {
        font-size: 40px;
        line-height: 1
    }

    .mypage .case_box .case2 {
        padding-left: 30px
    }

    .mypage .case_box .case2 .tag {
        left: 20px
    }

    .mypage .case {
        margin-top: 6px;
        padding-left: 20px;
        font-size: 16px
    }

    .mypage .case strong {
        font-size: 40px
    }
}

@media (max-width: 767px) and (max-width: 767px) {
    .mypage .case .arw {
        right: 22px;
        bottom: 16px
    }
}

@media (max-width: 767px) {
    .mypage .bx_myinfo {
        padding: 24px 26px 30px
    }

    .mypage .bx_myinfo .left {
        float: none;
        width: 100%;
        margin-bottom: 40px
    }

    .mypage .bx_myinfo .left strong {
        font-size: 23px
    }

    .mypage .bx_myinfo .bx_right {
        float: none
    }

    .mypage .bx_myinfo .bx_right .right {
        width: 100%
    }

    .mypage .bx_myinfo .bx_right .right:last-child {
        width: 100%;
        margin: 40px auto 0
    }

    .mypage .bx_myinfo .bx_right .right:last-child .ticket {
        margin-top: 0;
        bottom: -5px
    }

    .mypage .bx_myinfo .right {
        float: none;
        width: 100%
    }

    .mypage .bx_myinfo .right h3 {
        position: relative;
        padding: 0 !important;
        margin-bottom: 18px;
        border-bottom: 0;
        font-size: 14px
    }

    .mypage .bx_myinfo .right h3:before {
        top: -8px;
        left: -5px;
        display: none
    }

    .mypage .bx_myinfo .right p {
        display: none;
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        font-size: 13px
    }

    .mypage .cnt_myinfo {
        margin-top: 40px
    }

    .mypage .cnt_myinfo .info_basic {
        float: none;
        width: 100%
    }

    .mypage .cnt_myinfo .info_basic .lst {
        margin: 0
    }

    .mypage .cnt_myinfo .info_basic .btns {
        margin-top: 0;
        padding-top: 20px;
        padding-bottom: 20px;
        border-top: 0
    }

    .mypage .cnt_myinfo .info_basic .info_txt {
        height: auto;
        padding: 20px 0;
        font-size: 13px;
        line-height: 20px;
        border-bottom: 1px solid #f0f0f0
    }

    .mypage .cnt_myinfo .info_basic .info_txt span {
        margin-bottom: 18px
    }

    .mypage .cnt_myinfo .bx_info {
        float: none;
        width: 100%;
        padding-bottom: 20px;
        border-bottom: 1px solid #f0f0f0;
        margin-top: 40px
    }

    .mypage .cnt_myinfo .bx_info.non_mem {
        border-bottom: none
    }

    .mypage .bx_info p {
        font-size: 13px
    }
}

.box_vid {
    margin: 60px auto 0;
    width: 1080px;
    height: 572px
}

.txt_editer .box_vid {
    margin: 0 0 0 -40px;
    width: 980px;
    height: 552px
}

.box_vid iframe {
    width: 100%;
    height: 100%
}

@media (max-width: 1279px) {
    .box_vid {
        margin: 40px auto 0;
        width: 720px;
        height: 382px
    }
    .txt_editer .box_vid {
        margin: 0 0 0 -50px;
        width: 630px;
        height: 354px
    }
}

@media (max-width: 767px) {
    .box_vid {
        margin: 50px auto 0;
        width: 350px;
        height: 185px
    }
    .txt_editer .box_vid {
        margin: 0 0 0 -40px;
        width: 308px;
        height: 174px
    }
}

.customer h2 {
    margin-bottom: 55px
}

@media (max-width: 1279px) {
    .customer h2 {
        margin-bottom: 40px
    }
}

@media (max-width: 767px) {
    .customer h2 {
        margin-bottom: 25px
    }

    .customer h2 .m_block {
        display: block
    }
}

.customer.sub_f .container .cnt {
    padding: 80px 0 0
}

.customer.sub_f .container .cnt+.cnt {
    padding: 95px 0 0
}

@media (max-width: 1279px) {
    .customer.sub_f .container .cnt {
        padding: 70px 0 0
    }

    .customer.sub_f .container .cnt+.cnt {
        padding: 80px 0 0
    }
}

@media (max-width: 767px) {
    .customer.sub_f .container .cnt {
        padding: 50px 0 0
    }

    .customer.sub_f .container .cnt+.cnt {
        padding: 50px 0 0
    }
}

.customer .container {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
    display: block;
    clear: both;
    content: ""
}

.customer .container .wrap+.wrap {
    padding-top: 95px;
    padding-bottom: 0
}

@media (max-width: 1279px) {
    .customer .container .wrap+.wrap {
        padding-top: 80px
    }
}

@media (max-width: 767px) {
    .customer .container .wrap+.wrap {
        padding-top: 50px
    }
}

.customer .container .cnt {
    padding: 80px 0px 0
}

@media (max-width: 1279px) {
    .customer .container .cnt {
        padding: 70px 3.9% 0
    }
}

@media (max-width: 767px) {
    .customer .container .cnt {
        padding: 50px 6.25% 0
    }
}

.customer .container .cnt+.cnt {
    padding-top: 95px
}

@media (max-width: 1279px) {
    .customer .container .cnt+.cnt {
        padding-top: 80px
    }
}

@media (max-width: 767px) {
    .customer .container .cnt+.cnt {
        padding-top: 50px
    }
}

.customer .container .cnt h2 {
    text-align: center
}

.customer .container .cnt .bx_list {
    overflow: hidden;
    display: table;
    table-layout: fixed;
    width: 100%;
    margin: 40px 0;
    padding: 0;
    background: var(--bg-color);
    border-top: 1px solid var(--table-top-border);
    border-bottom: 1px solid var(--box-border-bottom);
}

.customer .container .cnt .bx_list .unit {
    display: table-cell;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.customer .container .cnt .bx_list .unit a {
    position: relative;
    display: block;
    padding: 30px 40px 68px
}

.customer .container .cnt .bx_list .unit.f_item a {
    padding-left: 30px
}

.customer .container .cnt .bx_list .unit span {
    font-size: 20px
}

.customer .container .cnt .bx_list .unit strong {
    display: block;
    font-size: 18px;
    margin: 4px 0 6px;
    height: auto;
    overflow: hidden
}

.customer .container .cnt .bx_list .unit em {
    position: absolute;
    bottom: 40px;
    font-weight: 100;
    font-size: 13px;
    border-bottom: 1px solid #222222
}

.customer .container .cnt .bx_list .unit em:after {
    content: "→";
    position: absolute;
    top: 0;
    right: -14px
}

@media (max-width: 1279px) {
    .customer .container .cnt .bx_list {
        margin: 30px 0
    }

    .customer .container .cnt .bx_list .unit {
        display: block;
        width: 100%;
        float: none;
        border-bottom: 1px solid #f0f0f0
    }

    .customer .container .cnt .bx_list .unit a {
        padding: 20px 30px !important
    }

    .customer .container .cnt .bx_list .unit span {
        font-size: 16px;
        vertical-align: middle
    }

    .customer .container .cnt .bx_list .unit strong {
        display: inline-block;
        font-size: 16px;
        width: calc(100% - 60px);
        height: auto;
        margin: 0 0 0 30px;
        vertical-align: middle
    }

    .customer .container .cnt .bx_list .unit em {
        display: none
    }

    .customer .container .cnt .bx_list .unit:last-child {
        border-bottom: none
    }
}

@media (max-width: 767px) {
    .customer .container .cnt .bx_list .unit a {
        padding: 20px 10px !important
    }

    .customer .container .cnt .bx_list .unit span {
        font-size: 13px
    }

    .customer .container .cnt .bx_list .unit strong {
        font-size: 13px;
        width: calc(100% - 35px);
        margin: 0 0 0 10px
    }
}

.customer .container .cnt.lic ul {
    text-align: center
}

@media (max-width: 1279px) {
    .customer .container .cnt.lic ul {
        text-align: left
    }

    .customer .container .cnt.lic ul li {
        text-align: center
    }
}

.customer .container .cnt.lic ul li {
    display: inline-block;
    width: 31.5%;
    padding: 60px 0;
    margin-right: 24px;
    border-radius: 10px;
    border: 1px solid #f0f0f0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.customer .container .cnt.lic ul li:last-child {
    margin-right: 0;
    margin-bottom: 0
}

.customer .container .cnt.lic ul li img {
    display: block;
    width: 262px;
    margin: 0 auto 30px
}

.customer .container .cnt.lic ul li p {
    margin-bottom: 40px;
    font-size: 15px;
    color: #666
}

@media (max-width: 1279px) {
    .customer .container .cnt.lic ul li {
        width: 48%;
        margin: 0 20px 20px 0;
        padding: 50px 0
    }

    .customer .container .cnt.lic ul li:nth-child(2n) {
        margin-right: 0
    }

    .customer .container .cnt.lic ul li img {
        width: 222px;
        margin-bottom: 20px
    }

    .customer .container .cnt.lic ul li p {
        margin-bottom: 30px;
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .customer .container .cnt.lic ul li {
        width: 100%;
        margin: 0 0 20px;
        padding: 40px 0
    }

    .customer .container .cnt.lic ul li img {
        width: 170px;
        margin-bottom: 15px
    }

    .customer .container .cnt.lic ul li p {
        font-size: 12px
    }
}

.customer .container .cnt.lic ul.has_one {
    text-align: center
}

.customer .container .cnt.evt .bx_cont,
.customer .container .cnt.evt .bx_qna {
    overflow: hidden;
    padding: 10px 30px;
    background: #ffffff
}

.customer .container .cnt.evt .left {
    width: 340px;
    margin-right: 60px;
    padding: 20px 0
}

.customer .container .cnt.evt .left img {
    width: 100%;
    height: 352px
}

.customer .container .cnt.evt .right {
    width: calc(100% - 400px);
    text-align: left
}

.customer .container .cnt.evt .right .unit {
    display: block;
    padding: 20px 0;
    border-bottom: 1px solid #f0f0f0
}

.customer .container .cnt.evt .right .unit:last-child {
    border-bottom: 0
}

.customer .container .cnt.evt .right .unit img {
    width: 140px;
    height: 90px;
    margin-right: 30px
}

.customer .container .cnt.evt .right .unit p {
    display: inline-block;
    width: 440px;
    padding-top: 15px
}

.customer .container .cnt.evt .right .unit p strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.customer .container .cnt.evt .right .unit p span {
    font-size: 15px
}

@media (max-width: 1279px) {

    .customer .container .cnt.evt .bx_cont,
    .customer .container .cnt.evt .bx_qna {
        margin-bottom: 0
    }

    .customer .container .cnt.evt .bx_cont+.bx_qna,
    .customer .container .cnt.evt .bx_qna+.bx_qna {
        margin: 80px 0;
        padding: 20px 30px
    }

    .customer .container .cnt.evt .left {
        width: 294px;
        margin-right: 40px
    }

    .customer .container .cnt.evt .left img {
        height: 304px
    }

    .customer .container .cnt.evt .right {
        width: calc(100% - 334px)
    }

    .customer .container .cnt.evt .right .unit img {
        width: 116px;
        height: 74px;
        margin-right: 16px;
        vertical-align: middle
    }

    .customer .container .cnt.evt .right .unit p {
        width: calc(100% - 145px);
        padding-top: 0;
        vertical-align: middle
    }

    .customer .container .cnt.evt .right .unit p strong {
        white-space: normal
    }

    .customer .container .cnt.evt .right .unit p span {
        display: none
    }
}

@media (max-width: 767px) {

    .customer .container .cnt.evt .bx_cont,
    .customer .container .cnt.evt .bx_qna {
        padding: 0;
        margin-bottom: 0
    }

    .customer .container .cnt.evt .bx_cont+.bx_qna,
    .customer .container .cnt.evt .bx_qna+.bx_qna {
        margin: 60px 0;
        padding: 18px 7.14% 28px;
        text-align: center
    }

    .customer .container .cnt.evt .left {
        float: none;
        width: 100%;
        margin: 0 auto !important;
        padding: 25px 10px;
        border-bottom: 1px solid #f0f0f0;
        text-align: center
    }

    .customer .container .cnt.evt .left img {
        max-width: 260px;
        height: auto
    }

    .customer .container .cnt.evt .right {
        float: none;
        width: 100%
    }

    .customer .container .cnt.evt .right .unit {
        padding: 25px 10px
    }

    .customer .container .cnt.evt .right .unit img {
        width: 105px;
        height: 67px;
        margin-right: 20px
    }
}

.customer .container .cnt_top {
    padding-bottom: 0px
}

.customer .container .cnt_top .bx_tab {
    margin: 60px 0 0
}

@media (max-width: 1279px) {
    .customer .container .cnt_top .bx_tab {
        margin-top: 35px
    }
}

@media (max-width: 767px) {
    .customer .container .cnt_top .bx_tab {
        margin-top: 20px
    }
}

@media (max-width: 1279px) {
    .customer .container .cnt_top+.wrap {
        padding-top: 80px
    }
}

@media (max-width: 767px) {
    .customer .container .cnt_top+.wrap {
        padding-top: 60px
    }
}

.customer .container .cnt_top .subtit {
    margin: 15px 0 0px
}

.customer .container .cnt_top .bx_srch {
    margin-top: 45px
}

.customer .container .left {
    float: left;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.customer .container .right {
    float: right;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.customer .container .left_menu {
    display: none;
}

/*2025.11.11 추가*/
.customer .container .intranet.left_menu {
    width: 252px;
    float: left;
    text-align: left;
    display: block;
}


@media (max-width: 1279px) {
    .customer .container .left_menu,
    .customer .container .intranet.left_menu {
        width: 100%;
        margin-top: 0px;
        margin-bottom: 40px;
        clear: both;
        float: none
    }
}

@media (max-width: 767px) {
    .customer .container .left_menu {
        margin-bottom: 20px
    }
}

.customer .container .left_menu h3 {
    display: none
}

@media (max-width: 1279px) {
    .customer .container .left_menu h3 {
        display: block
    }

    .customer .container .left_menu h3 a .ico_angle_down {
        overflow: hidden;
        position: relative;
        display: inline-block;
        width: 10px;
        height: 5px;
        vertical-align: middle;
        margin: -2px 0px 0px 8px
    }

    .customer .container .left_menu h3 a .ico_angle_down:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 3px;
        height: 3px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: -1px;
        border-right: 2px solid #222222;
        border-bottom: 2px solid #222222
    }

    .customer .container .left_menu h3 a.on .ico_angle_down {
        position: relative;
        display: inline-block;
        width: 10px;
        height: 5px;
        margin: -4px 0px 0px 8px
    }

    .customer .container .left_menu h3 a.on .ico_angle_down:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 3px;
        height: 3px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-top: 1px;
        border-top: 2px solid #222222;
        border-left: 2px solid #222222
    }

    .customer .container .left_menu h3 a.on .ico_angle_down:before {
        border-right: none;
        border-bottom: none
    }
}

.customer .container .left_menu .lst {
    /*margin-top: -19px*/
    margin-top: 0px;
    display:block;
}

.customer .container .left_menu #ccate {
    display:none;
}

.customer .container .left_menu .lst li {
    font-size: 20px;
    padding: 10px 0px
}

.customer .container .left_menu .lst li a {
    display: block
}

.customer .container .left_menu .lst li .on {
    position: relative;
    font-weight: 600;
    text-decoration: underline;
    text-underline-position: under
}

.customer .container .left_menu .lst li.main_int_menu {
    position: relative;
    font-weight: 600;
    text-align: center;
    background: var(--bg-border);
    border-radius: 10px;
}

.customer .container .left_menu .lst li.sub_int_menu {
    font-size: 16px;
    padding-left: 20px;
}

.customer .container .left_menu .bx_top {
    border-top: 2px solid #222222;
    border-bottom: 1px solid #222222;
    padding: 12px 0px 20px
}

.customer .container .left_menu .bx_top h3 {
    margin-bottom: 10px
}

@media (max-width: 1279px) {
    .customer .container .left_menu .lst {
        display: none;
        margin-top: 15px
    }

    .customer .container .left_menu #ccate {
        display:block;
    }

    .customer .container .left_menu .lst:after {
        display: block;
        clear: both;
        content: ""
    }

    .customer .container .left_menu .lst li {
        width: 49%;
        padding: 13px 3.6%;
        display: inline-block;
        vertical-align: top;
        overflow: hidden;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .customer .container .left_menu .lst li a {
        font-size: 16px;
        max-height: 40px;
        overflow: hidden
    }
}

@media (max-width: 767px) {
    .customer .container .left_menu .lst li a {
        font-size: 13px
    }

    .customer .container .left_menu .lst li .on {
        font-size: 13px
    }

    /*2025.11.07 추가*/
    .customer .container .left_menu {
        display: none;
    }

    /*2025.11.11 추가*/
    .customer .container .intranet.left_menu {
        display:block;
    }
    
}

.customer .container .right_cont {
    /*float: right;
    width: 804px*/
    width: 100%;
}

.customer .container .right_cont .form-box{
    display: block;
    max-width: 1080px;
    padding: 0 0 20px 0px;
}
.customer .container .right_cont .form-box .S01{
    display: inline-block;
    width: 25%;
}
.customer .container .right_cont .form-box .S02{
    display: inline-block;
    width: 25%;
}
.customer .container .right_cont .form-box .S03{
    display: inline-block;
    width: 25%;
}

.customer .container .right_cont .count_info {
    font-weight: 600;
}

/*2025.11.11 추가*/
.customer .container .intranet.right_cont {
    float: right;
    width: 804px
}

.customer .container .right_cont .bx_cont.veiw,
.customer .container .right_cont .veiw.bx_qna {
    font-size: 15px
}

.customer .container .right_cont .bx_cont.veiw h3,
.customer .container .right_cont .veiw.bx_qna h3 {
    font-size: 20px;
    margin-bottom: 24px
}

.customer .container .right_cont .bx_cont.veiw h4,
.customer .container .right_cont .veiw.bx_qna h4 {
    font-size: 15px;
    margin-bottom: 14px
}

.customer .container .right_cont .bx_cont.veiw p,
.customer .container .right_cont .veiw.bx_qna p {
    margin-bottom: 32px
}

.customer .container .right_cont .bx_cont.veiw p+.lst_sm,
.customer .container .right_cont .veiw.bx_qna p+.lst_sm {
    margin: -26px 0px 0px 12px
}

.customer .container .right_cont .bx_cont.veiw .lst_sm li,
.customer .container .right_cont .veiw.bx_qna .lst_sm li {
    font-size: 13px;
    color: #666666
}

@media (max-width: 1279px) {
    .customer .container .right_cont,
    .customer .container .intranet.right_cont {
        width: 100%
    }
}

.customer .container .tbl_board .goods {
    width: 180px
}

@media (max-width: 1279px) {
    .customer .container .tbl_board .goods {
        width: 100%
    }
}

.customer .container .goods_best {
    width: 1100px;
    margin: -10px 0px 70px -10px
}

.customer .container .goods_best:after {
    display: block;
    clear: both;
    content: ""
}

.customer .container .goods_best .unit {
    width: 530px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fcfcfc;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    padding: 34px 30px 24px;
    margin: 10px;
    float: left
}

.customer .container .goods_best .unit .tit {
    font-size: 26px;
    margin-bottom: 12px;
    display: block
}

.customer .container .goods_best .unit li a {
    font-size: 15px;
    line-height: 2.6;
    width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.customer .container .goods_best .unit li a:before {
    content: "";
    width: 2px;
    height: 2px;
    display: inline-block;
    position: relative;
    background: #666666;
    vertical-align: middle;
    margin-right: 4px
}

.customer .container .goods_best .unit .link {
    margin-top: 12px;
    display: block
}

@media (max-width: 1279px) {
    .customer .container .goods_best {
        width: 100%;
        margin: 0 0 50px
    }

    .customer .container .goods_best .unit {
        margin: 10px 0px;
        padding: 38px 38px 26px;
        width: 100%
    }

    .customer .container .goods_best .unit .tit {
        font-size: 24px
    }

    .customer .container .goods_best .unit li a {
        font-size: 16px
    }

    .customer .container .goods_best .unit:first-child {
        margin-top: 0px
    }

    .customer .container .bx_qna {
        margin: 0
    }
}

@media (max-width: 767px) {
    .customer .container .goods_best {
        margin: 0px auto 30px
    }

    .customer .container .goods_best .unit {
        margin: 10px 0px;
        padding: 24px 7.14% 21px;
        width: 100%
    }

    .customer .container .goods_best .unit .tit {
        font-size: 18px
    }

    .customer .container .goods_best .unit li a {
        padding: 0 0 12px 6px;
        font-size: 13px;
        line-height: 1.6;
        white-space: normal;
        text-indent: -6px
    }

    .customer .container .goods_best .unit .link {
        margin-top: 0px
    }

    .customer .container .bx_qna {
        margin: 0px;
        padding: 18px 7.14% 28px
    }

    .customer .container .right_cont .form-box{
        max-width: 1080px;
    }
    .customer .container .right_cont .form-box .S01{
        width: 100%;
    }
    .customer .container .right_cont .form-box .S02{
        width: 100%;
    }
    .customer .container .right_cont .form-box .S03{
        width: 100%;
        padding: 5px 0 0 0;
    }
    .customer .container .right_cont .form-box .btn{
        width: 100%;
    }
}

.customer .container .goods_all {
    width: 100%;
    margin: -7px 0px 74px 0px;
    text-align: left
}

.customer .container .goods_all .bx_unit {
    margin: 7px 9px 6px;
    cursor: pointer;
    float: left
}

.customer .container .goods_all .bx_unit .desc {
    height: 180px
}

.customer .container .goods_all .bx_unit:nth-child(5n+1) {
    margin-left: 0px
}

.customer .container .goods_all .bx_unit:nth-child(5n) {
    margin-right: 0px
}

.customer .container .goods_all:after {
    display: block;
    clear: both;
    content: ""
}

.customer .container .goods_all.cus {
    margin-bottom: 0
}

.customer .container .goods_all.cus+.bx_btn {
    margin-top: 40px;
    text-align: center
}

@media (min-width: 1279px) {
    .customer .container .goods_all.cus .bx_unit {
        width: 165px;
        min-height: unset;
        margin: 9px
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(5n+1) {
        margin-left: 9px
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(5n) {
        margin-right: 9px
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(6n+1) {
        margin-left: 0px
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(6n) {
        margin-right: 0px
    }

    .customer .container .goods_all.cus .bx_unit .ico_pro {
        height: 48px
    }

    .customer .container .goods_all.cus .bx_unit strong {
        font-size: 16px;
        margin-top: 20px
    }
}

@media (max-width: 1279px) {
    .customer .container .goods_all.cus {
        margin: -6px 0 0
    }

    .customer .container .goods_all.cus .bx_unit {
        width: 23%;
        min-height: unset;
        margin: 9px 1%
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(5n+1) {
        margin-left: 1%
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(5n) {
        margin-right: 1%
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(4n+1) {
        margin-left: 0px
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(4n) {
        margin-right: 0px
    }

    .customer .container .goods_all.cus .bx_unit .ico_pro {
        height: 48px
    }

    .customer .container .goods_all.cus .bx_unit strong {
        font-size: 16px;
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .customer .container .goods_all.cus .bx_unit {
        width: 48%;
        height: unset;
        min-height: unset;
        margin: 10px 0
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(2n+1) {
        margin-left: 0px;
        margin-right: 2%
    }

    .customer .container .goods_all.cus .bx_unit:nth-child(2n) {
        margin-right: 0px
    }

    .customer .container .goods_all.cus .bx_unit .ico_pro {
        height: 36px
    }

    .customer .container .goods_all.cus .bx_unit strong {
        font-size: 13px;
        margin-top: 15px
    }
}

@media (max-width: 1279px) {
    .customer .container .goods_all {
        width: 102%;
        text-align: left;
        margin: -6px -1% 50px;
        position: relative
    }

    .customer .container .goods_all .bx_unit {
        display: block;
        float: left;
        width: 31.33%;
        margin: 9px 1%
    }

    .customer .container .goods_all .bx_unit:nth-child(5n+1) {
        margin-left: 1%
    }

    .customer .container .goods_all .bx_unit:nth-child(5n) {
        margin-right: 1%
    }

    .customer .container .goods_all.cus .btn {
        margin-top: 30px
    }
}

@media (max-width: 767px) {
    .customer .container .goods_all {
        width: 100%;
        margin-bottom: 30px;
        margin-left: 0;
        margin-right: 0
    }

    .customer .container .goods_all .bx_unit {
        width: 49%;
        height: 135px
    }

    .customer .container .goods_all .bx_unit:nth-child(n) {
        margin: 6px 1%
    }

    .customer .container .goods_all .bx_unit:nth-child(odd) {
        margin-left: 0px
    }

    .customer .container .goods_all .bx_unit:nth-child(2n) {
        margin-right: 0px
    }

    .customer .container .goods_all .bx_unit img {
        height: 46px
    }

    .customer .container .goods_all .bx_unit .desc {
        height: auto;
        background: none;
        padding: 0px 14px
    }

    .customer .container .goods_all .bx_unit .desc strong {
        font-size: 14px;
        margin: 0px
    }

    .customer .container .goods_all .bx_unit .desc span {
        display: none
    }

    .customer .container .goods_all .bx_unit .more {
        width: 42px;
        height: 42px
    }

    .customer .container .goods_all .bx_unit .more:before {
        border-bottom: 42px solid #ffffff;
        border-left: 42px solid transparent
    }

    .customer .container .goods_all.guide {
        margin: 0px 0 30px
    }

    .customer .container .goods_all.cus .btn {
        margin-top: 20px
    }
}

.customer .container .tbl_detail th {
    text-align: left
}

.customer .container .tbl_detail+.btns {
    overflow: hidden;
    border-top: 1px solid #222222;
    margin-top: 30px;
    padding-top: 20px
}

.customer .container .bx_down {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    padding: 30px 0px
}

.customer .container .bx_down:after {
    display: block;
    clear: both;
    content: ""
}

.customer .container .bx_down .bx_left,
.customer .container .bx_down .ico,
.customer .container .bx_down .bx_txt,
.customer .container .bx_down .bx_btn {
    display: inline-block;
    vertical-align: middle
}

.customer .container .bx_down .ico {
    margin: 0px 38px 0px 43px
}

.customer .container .bx_down .ico[src*='ico_dock'] {
    width: 54px;
    height: 52px
}

.customer .container .bx_down .bx_txt {
    width: 340px
}

.customer .container .bx_down .bx_btn {
    position: relative;
    display: inline-block;
    width: 193px;
    background: none;
    text-align: center;
    vertical-align: middle
}

.customer .container .bx_down .bx_btn span {
    display: block;
    margin-bottom: 12px
}

.customer .container .bx_down .bx_btn+.bx_btn:before {
    content: "";
    width: 9px;
    height: 58px;
    position: absolute;
    top: 50%;
    left: -11px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-right: 9px;
    border-right: 2px dotted #d8d8d8
}

@media (max-width: 1279px) {
    .customer .container .bx_down {
        text-align: center;
        padding: 50px 20px;
        margin: 0
    }

    .customer .container .bx_down .bx_left {
        display: block;
        margin-bottom: 41px
    }

    .customer .container .bx_down .bx_txt {
        width: auto;
        max-width: 800px;
        text-align: left
    }

    .customer .container .bx_down .ico {
        margin: 0px 25px 0px 0px
    }

    .customer .container .bx_down .bx_btn {
        width: 33%;
        max-width: 205px
    }

    .customer .container .bx_down .bx_btn span {
        display: block;
        margin-bottom: 20px
    }
}

@media (max-width: 767px) {
    .customer .container .bx_down {
        padding: 25px 7.14% 0px;
        margin: 0
    }

    .customer .container .bx_down .bx_left,
    .customer .container .bx_down .ico,
    .customer .container .bx_down .bx_txt,
    .customer .container .bx_down .bx_btn {
        display: block
    }

    .customer .container .bx_down .ico {
        width: 34px;
        margin: 0px auto
    }

    .customer .container .bx_down .bx_left {
        margin-bottom: 13px
    }

    .customer .container .bx_down .bx_txt {
        width: 100%;
        margin-top: 9px;
        text-align: center
    }

    .customer .container .bx_down .bx_btn {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 20px 0px;
        border-bottom: 1px dotted #d8d8d8
    }

    .customer .container .bx_down .bx_btn span {
        float: left;
        line-height: 41px;
        margin: 0
    }

    .customer .container .bx_down .bx_btn a {
        float: right
    }

    .customer .container .bx_down .bx_btn+.bx_btn:before {
        display: none
    }

    .customer .container .bx_down .bx_btn:after {
        display: block;
        clear: both;
        content: ""
    }

    .customer .container .bx_down .bx_btn:last-child {
        border: none
    }
}

.customer .container .noti_pc_only+.btn {
    display: none
}

@media (max-width: 1279px) {
    .customer .container .noti_pc_only {
        margin: 70px 0 50px
    }

    .customer .container .noti_pc_only.has_bor {
        margin: 0
    }

    .customer .container .noti_pc_only.has_bor p:before {
        content: '';
        position: absolute;
        top: 6px;
        left: -30px;
        height: 125px;
        border-left: 2px dotted #d1d1d1
    }

    .customer .container .noti_pc_only+.btn {
        display: inline-block;
        margin: 30px 0 0 calc(50% - 70px)
    }
}

@media (max-width: 767px) {
    .customer .container .noti_pc_only {
        margin: 50px 0 40px
    }

    .customer .container .noti_pc_only.has_bor p:before {
        border: none
    }
}

.customer .container .bx_qna {
    background: var(--bg-color);
    margin-top: 120px
}

.customer .container .bx_qna.non_mem {
    margin-top: 60px;
    padding: 34px 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 1279px) {
    .customer .container .bx_qna.non_mem {
        margin-top: 50px;
        padding: 34px 30px
    }
}

@media (max-width: 767px) {
    .customer .container .bx_qna.non_mem {
        margin-top: 30px
    }
}

.customer .licen .bx_cont,
.customer .licen .bx_qna {
    padding: 50px 80px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    min-height: 416px;
    position: relative
}

.customer .licen .bx_cont h3,
.customer .licen .bx_qna h3 {
    font-size: 30px
}

.customer .licen .bx_cont .min,
.customer .licen .bx_qna .min {
    max-width: 400px;
    width: 100%;
    margin: 0 auto
}

.customer .licen .cont {
    width: 100%;
    position: relative;
    -webkit-transform: translateY(-10%);
    -ms-transform: translateY(-10%);
    transform: translateY(-10%);
    margin-top: 10%
}

.customer .licen .txt_alert {
    text-align: left
}

.customer .licen .txt_rst {
    margin: 14px auto 20px !important
}

.customer .licen .txt_rst+p {
    margin: -8px 0px 10px
}

.customer .licen .slct,
.customer .licen .bx_ipts {
    margin-top: 10px
}

.customer .licen .bx_txt {
    font-size: 15px;
    border-top: 1px solid #e1e1e1;
    margin-top: 24px;
    padding-top: 14px
}

.customer .licen a.txt_point {
    text-decoration: underline
}

@media (max-width: 1279px) {

    .customer .licen .bx_cont,
    .customer .licen .bx_qna {
        min-height: 381px;
        padding: 70px 80px
    }

    .customer .licen .bx_cont h3,
    .customer .licen .bx_qna h3 {
        font-size: 32px
    }

    .customer .licen .txt_rst {
        font-size: 18px;
        margin: 14px auto 15px !important
    }

    .customer .licen .bx_txt {
        font-size: 16px
    }
}

@media (max-width: 767px) {

    .customer .licen .bx_cont,
    .customer .licen .bx_qna {
        min-height: unset;
        padding: 40px 7.14%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .customer .licen .bx_cont h3,
    .customer .licen .bx_qna h3 {
        font-size: 21px;
        line-height: 1.38
    }

    .customer .licen .cont {
        width: 100%;
        position: relative;
        top: auto;
        left: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }

    .customer .licen .txt_rst {
        font-size: 14px
    }

    .customer .licen .bx_txt {
        font-size: 13px
    }
}

.customer .prod .top {
    margin: 84px 0 40px;
    text-align: center
}

.customer .prod .top .ico {
    display: inline-block;
    width: 72px;
    margin-right: 20px;
    vertical-align: top
}

.customer .prod .top form {
    display: inline-block;
    width: 540px
}

.customer .prod .top form .bx_srch {
    height: 70px
}

.customer .prod .tuto_vidio {
    padding-bottom: 0
}

.customer .prod .tuto_vidio .bx_col2 {
    margin: 0 0 100px
}

.customer .prod .tuto_vidio .bx_qna {
    margin-top: 100px
}

@media (max-width: 1279px) {
    .customer .prod .top {
        margin: 84px 0 10px
    }

    .customer .prod .top .ico {
        width: 60px
    }

    .customer .prod .top form {
        width: 344px
    }

    .customer .prod .top form .bx_srch {
        height: 57px
    }

    .customer .prod .tuto_vidio .cont {
        padding: 0
    }

    .customer .prod .tuto_vidio .bx_col2 {
        margin-bottom: 80px
    }

    .customer .prod .tuto_vidio .bx_qna {
        margin-top: 80px
    }
}

@media (max-width: 767px) {
    .customer .prod .top {
        margin: 0 0 10px
    }

    .customer .prod .top .ico {
        width: 64px;
        margin: 0 0 30px
    }

    .customer .prod .top form {
        width: 100%
    }

    .customer .prod .top form .bx_srch {
        height: 33px
    }

    .customer .prod .tuto_vidio .cont {
        padding: 0
    }

    .customer .prod .tuto_vidio .bx_col2 {
        margin-bottom: 60px
    }

    .customer .prod .tuto_vidio .bx_qna {
        margin-top: 60px
    }
}

.customer .search .top h1 {
    display: inline-block;
    margin-bottom: 95px
}

.customer .search .top form {
    float: right;
    width: 402px
}

@media (max-width: 1279px) {
    .customer .search .top form {
        width: 324px
    }
}

@media (max-width: 767px) {
    .customer .search .top h1 {
        margin-bottom: 30px;
    }

    .customer .search .top form {
        float: none;
        width: 100%;
        margin-bottom: 40px
    }
}

.customer .search .tbl_detail {
    margin-top: 0
}

@media (max-width: 767px) {
    .customer .search .tbl_detail {
        margin-top: 20px
    }

    .customer .search .tbl_detail th.subject_header {
        border-top: 1px solid #222222
    }
}

.customer .search.container .cnt {
    padding-top: 0;
    overflow: hidden
}

.customer .bx_top+.file_tree {
    border-top: none
}

.customer .file_tree {
    padding: 10px 0px;
    border-bottom: 1px solid #f0f0f0;
    border-top: 2px solid #222222
}

.customer .file_tree .ico_sign {
    width: 20px;
    height: 20px;
    margin: -4px 10px 0px 0px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    background: #343434;
    border-radius: 5px;
    z-index: 2
}

.customer .file_tree .ico_sign:before {
    content: "";
    width: 9px;
    height: 2px;
    display: block;
    position: absolute;
    background: #ffffff;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.customer .file_tree .ico_sign:after {
    content: "";
    width: 2px;
    height: 9px;
    display: block;
    position: absolute;
    background: #ffffff;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.customer .file_tree li {
    position: relative
}

.customer .file_tree li a {
    height: auto;
    display: block;
    padding: 5px 0px;
    padding-left: 30px;
    text-indent: -30px;
    overflow: hidden
}

.customer .file_tree li a.on .ico_sign:after,
.customer .file_tree li a.end .ico_sign:after {
    display: none
}

.customer .file_tree li a.on+ul,
.customer .file_tree li a.end+ul {
    display: block
}

.customer .file_tree li a:before {
    content: "";
    width: 1px;
    height: 100%;
    display: block;
    position: absolute;
    background: #ddd;
    left: 10px
}

.customer .file_tree .dep1:last-child>a:before,
.customer .file_tree .dep2:last-child>a:before,
.customer .file_tree .dep3:last-child>a:before {
    top: auto;
    bottom: 10px
}

.customer .file_tree .dep1:first-child>a:before,
.customer .file_tree .dep2:first-child>a:before,
.customer .file_tree .dep3:first-child>a:before {
    top: 10px
}

.customer .file_tree .dep1:last-child>a:before,
.customer .file_tree .dep2:last-child>a:before {
    height: 10px;
    top: 0px
}

.customer .file_tree .dep3:last-child>a:before {
    top: auto;
    bottom: 16px
}

.customer .file_tree .dep1_area,
.customer .file_tree .dep2_area,
.customer .file_tree .dep3_area {
    display: none;
    position: relative;
    margin-left: 20px
}

.customer .file_tree .dep3_area .end {
    margin-left: 10px
}

.customer .file_tree .dep3_area .end .ico_sign {
    display: none
}

.customer .file_tree .dep3_area .end:before {
    width: 10px;
    height: 1px;
    top: 50%;
    left: -10px
}

.customer .google_bnr,
.customer .google_bnr_tp2,
.customer .google_bnr_tp2 {
    margin-top: 140px
}

@media (max-width: 1279px) {
    .customer .t_block {
        display: block
    }

    .customer .google_bnr,
    .customer .google_bnr_tp2,
    .customer .google_bnr_tp2 {
        margin-top: 80px
    }
}

@media (max-width: 767px) {
    .customer .m_block {
        display: block
    }

    .customer .google_bnr,
    .customer .google_bnr_tp2,
    .customer .google_bnr_tp2 {
        margin-top: 50px
    }
}

.ebook h2 {
    margin-bottom: 62px
}

.ebook .container strong,
.ebook .container span {
    display: block
}

.ebook .bx_cont,
.ebook .bx_qna {
    margin-bottom: 80px;
    padding: 0 0px 20px;
    background: var(--bg-color);
    border-top: none;
    border-bottom: none;
    font-size: 0
}

.ebook .bx_cont:after,
.ebook .bx_qna:after {
    display: block;
    clear: both;
    content: ""
}

.ebook .bx_cont a,
.ebook .bx_qna a {
    display: block;
    width: 100%;
    height: 100%
}

.ebook .unit {
    width: 397px;
    display: inline-block;
    margin-left: 24px;
    text-align: left;

    /** ebook TOP박스 디자인 보류 23.01.08
    width: 397px;
    height: 411px;
    display: inline-block;
    position: relative;
    margin-left: 24px;
    text-align: left;
    overflow: hidden;
    border-radius: 0 0 0 10%;
    **/
}

.ebook .unit:first-child {
    margin-left: 0px
}

.ebook .unit .bx_txt {
    margin: 24px 0px 0px;
    font-size: 18px
}

.ebook .unit img {
    width: 100%;
    max-height: 397px;
    border-radius: 0 0 0 10%;
    border: 1px solid var(--item-box-border);

    /** ebook TOP박스 디자인 보류 23.01.08
    width: 100%;
    **/
}

.ebook .unit strong,
.ebook .unit span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ebook .unit span {
    font-size: 15px
}

.ebook .unit span.txt_bg {
    margin-top: 13px
}

.ebook .unit .emp {
    color: var(--emp);
}

.ebook .unit .end {
    color: var(--secondary);
}

.ebook span.txt_bg {
    display: inline-block;
    background: var(--btn-bg-color);
    width: 100px;
    padding: 10px 0 11px;
    font-size: 13px;
    border-radius: 0px;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.ebook span.txt_bg.end {
    background: #cccccc;
    color: #ffffff;
}

.ebook span.txt_bg.gray {
    background: #cccccc
}

@media (max-width: 1279px) {
    .ebook h2 {
        margin-bottom: 39px
    }

    .ebook .bx_cont,
    .ebook .bx_qna {
        text-align: center;
        margin-bottom: 70px
    }

    .ebook .unit {
        width: 32%;
        margin-left: 2%;
        font-size: 18px
    }

    .ebook .unit strong,
    .ebook .unit span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        height: 50px
    }

    .ebook .unit span {
        font-size: 16px;
        margin-top: 14px
    }

    .ebook span.txt_bg {
        height: auto;
        display: inline-block;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .ebook h2 {
        margin-bottom: 30px
    }

    .ebook .bx_cont,
    .ebook .bx_qna {
        margin-bottom: 40px;
        padding: 0
    }

    .ebook .unit {
        width: 100%;
        max-width: 340px;
        margin: 0 auto;
        display: block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 14px
    }

    .ebook .unit:first-child {
        margin: 0 auto
    }

    .ebook .unit strong,
    .ebook .unit span {
        height: auto;
        margin: 0 auto;
        -webkit-line-clamp: unset
    }

    .ebook .unit span {
        margin-top: 4px;
        font-size: 13px
    }

    .ebook .unit .bx_txt {
        margin: 14px 0px 40px
    }

    .ebook span.txt_bg {
        margin-top: 11px;
        font-size: 11px
    }
}

.ebook .tbl {
    font-size: 15px
}

.ebook .tbl strong {
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.ebook .tbl span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ebook .tbl td {
    padding: 20px 0px 20px 30px;
    line-height: 1.6
}

.ebook .tbl td a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%
}

.ebook .tbl td .left {
    padding-right: 126px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.ebook .tbl .t_img {
    width: 170px
}

.ebook .tbl .t_img img {
    /*width: 100%*/
    width: 90px;
    /*border-radius: 5%;*/
    border: 1px var(--item-box-border) solid;
}

.ebook .tbl .right {
    display: block;
    width: 126px;
    text-align: center;
    position: absolute;
    top: 50%;
    right: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width: 1279px) {
    .ebook .tbl {
        font-size: 16px
    }

    .ebook .tbl td {
        padding: 20px 0px 20px 20px
    }

    .ebook .tbl td .left {
        padding-right: 110px
    }

    .ebook .tbl .t_img {
        width: 160px
    }

    .ebook .tbl .right {
        width: 110px
    }
}

@media (max-width: 767px) {
    .ebook .tbl strong {
        font-size: 13px
    }

    .ebook .tbl td {
        padding: 25px 0px 25px 3.6%
    }

    .ebook .tbl td .left {
        padding-right: 3.6%
    }

    .ebook .tbl td .left span {
        display: none
    }

    .ebook .tbl td .right {
        position: relative;
        width: 100%;
        margin-top: 11px;
        text-align: left;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }

    .ebook .tbl .t_img {
        width: 115px
    }

    .ebook .tbl .txt_bg {
        padding: 6px 9px
    }
}

.privacy h3 {
    margin: 0px 0px 14px;
    font-size: 18px;
    font-weight: 600
}

.privacy h4 {
    margin: 0px 0px 14px;
    font-size: 15px
}

.privacy h4+p {
    margin-bottom: 30px
}

.privacy h4+.lst {
    margin-bottom: 34px
}

.privacy .slct {
    margin: 15px 0px 0px
}

.privacy .bx_cont,
.privacy .bx_qna {
    font-size: 15px;
    padding: 25px 25px 0px
}

.privacy .cont {
    margin: 50px 16px
}

@media (max-width: 767px) {
    .privacy .slct {
        width: 100% !important
    }

    .privacy .cont {
        margin: 35px 0px
    }
}

.privacy .step {
    margin-bottom: 44px
}

.privacy .step a {
    text-decoration: underline
}

.privacy .step p+.lst {
    margin-top: 5px
}

.privacy .step p+p,
.privacy .step p+.bx {
    margin-top: 30px
}

.privacy .step dl dt,
.privacy .step dl dd {
    width: auto;
    float: none;
    padding: 0
}

.privacy .step dl dt {
    margin-top: 5px
}

.privacy .step dl dd {
    margin-bottom: 20px
}

.privacy .step dl .lst_sm {
    margin: 0px
}

.privacy .step .lsty_num {
    padding-left: 17px
}

.privacy .step .lsty_num>em {
    margin-left: -17px
}

.privacy .step .lsty_sign {
    padding-left: 6px
}

.privacy .step .lsty_sign>em {
    margin-left: -6px
}

.privacy .step .lsty_non>.lst_sm,
.privacy .step .lsty_non>dl,
.privacy .step .lsty_non .lst {
    padding-left: 17px
}

.privacy .step .lst>li:last-child .lst_sm:last-child,
.privacy .step .lst>li:last-child dd:last-child {
    margin-bottom: 0px
}

.privacy .step .lst_sm {
    margin: 5px 0px 20px;
    font-size: 13px;
    color: #666666
}

.privacy .step .lst_sm .lsty_num {
    padding-left: 12px
}

.privacy .step .lst_sm .lsty_num>em {
    margin-left: -12px
}

.privacy .step p+.tbl {
    margin-bottom: 30px
}

.privacy .step .tbl {
    margin: 10px 0px 0px;
    text-align: center
}

.privacy .step .bx {
    margin-bottom: 30px
}

.privacy .step .bx h4 {
    margin: 0
}

.privacy .step .bx span {
    display: block
}

@media (max-width: 767px) {
    .privacy h3 {
        margin-bottom: 10px;
        font-size: 14px
    }

    .privacy .slct {
        width: 100% !important;
        margin-top: 0
    }

    .privacy .bx_cont,
    .privacy .bx_qna {
        padding: 15px 15px 0px;
        font-size: 13px
    }

    .privacy .cont {
        margin: 35px 5px
    }

    .privacy .step {
        margin-bottom: 30px
    }

    .privacy .step dl dd {
        margin-bottom: 10px
    }

    .privacy .step .lst_sm {
        margin: 5px 0px 10px
    }
}

.download .tab {
    margin: 0px 0px 68px;
    font-size: 20px
}

.download .tab a {
    display: inline-block;
    margin-right: 50px
}

.download .tab a:last-child {
    margin-right: 0px
}

.download .tab a .tab_tt {
    font-weight: 100
}

.download .tab a .on+.tab_tt {
    font-weight: 600
}

.download .tab em {
    vertical-align: middle;
    margin: -4px 10px 0px 0px
}

.download .tab .ico_all {
    position: relative;
    display: inline-block;
    margin: 6px 0;
    margin: -4px 10px 0px 0px
}

.download .tab .ico_all,
.download .tab .ico_all:before,
.download .tab .ico_all:after {
    width: 19px;
    height: 3px;
    background-color: #b0b0b0
}

.download .tab .ico_all:before,
.download .tab .ico_all:after {
    content: '';
    position: absolute;
    left: 0
}

.download .tab .ico_all:before {
    top: -6px
}

.download .tab .ico_all:after {
    top: 6px
}

.download .tab .ico_all.on {
    background: #4285F4
}

.download .tab .ico_all.on:before,
.download .tab .ico_all.on:after {
    background: #4285F4
}

.download .tab .ico_win {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win.svg") no-repeat 0 0;
    content: "";
    width: 17px;
    height: 17px;
    display: inline-block;
    position: relative;
    background-size: 100%
}

.download .tab .ico_win.on {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win_on.svg") no-repeat 0 0
}

.download .tab .ico_pc {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_down_pc.svg") no-repeat 0 0;
    content: "";
    width: 19px;
    height: 19px;
    display: inline-block;
    position: relative;
    background-size: 100%
}

.download .tab .ico_pc.on {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_down_pc_on.svg") no-repeat 0 0
}

.download .tab .ico_play {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_googleplay.svg") no-repeat 0 0;
    background-size: 100%;
    content: "";
    width: 19px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .tab .ico_play.on {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_googleplay_on.svg") no-repeat 0 0
}

.download .tab .ico_app {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_iApp.svg") no-repeat 0 0;
    content: "";
    width: 18px;
    height: 22px;
    display: inline-block;
    position: relative
}

.download .tab .ico_app.on {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_iApp_on.svg") no-repeat 0 0
}

.download article {
    width: 1100px;
    margin-left: -10px
}

.download article:after {
    display: block;
    clear: both;
    content: ""
}

.download .bx_unit {
    margin: 0px 10px 20px;
    display: inline-block;
    vertical-align: top;
    overflow: visible;
    float: left
}

.download .bx_unit .ico_pro {
    max-height: 60px
}

.download .bx_unit .desc {
    height: 120px;
    padding: 19px 0px 0px;
    overflow: visible;
    margin-top: 0
}

.download .bx_unit .desc>span {
    font-size: 10px;
    color: #cccccc
}

.download .bx_unit .icos {
    margin-top: 25px
}

.download .bx_unit .icos .btn_win,
.download .bx_unit .icos .btn_play,
.download .bx_unit .icos .btn_app,
.download .bx_unit .icos .btn_appstore,
.download .bx_unit .icos .btn_pc {
    margin: 0px 10px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

.download .bx_unit .icos .w_grp {
    position: relative;
    display: inline-block
}

.download .bx_unit .icos .btn_win {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_win_on.svg") no-repeat 50% 50%;
    background-size: 19px 19px;
    content: "";
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .bx_unit .icos .btn_pc {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_down_pc_on.svg") no-repeat 50% 50%;
    background-size: 19px 19px;
    content: "";
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .bx_unit .icos .btn_play {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_googleplay_on.svg") no-repeat 50% 50%;
    background-size: 19px 19px;
    content: "";
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .bx_unit .icos .btn_app {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_iApp_on.svg") no-repeat 50% 50%;
    background-size: 19px 19px;
    content: "";
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .bx_unit .icos .btn_appstore {
    background: url("//dreamgreen.co.kr/assets/ui/img/common/ico_appstore_on.svg") no-repeat 50% 50%;
    background-size: 19px 19px;
    content: "";
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative
}

.download .bx_unit .icos .popup,
.download .bx_unit .icos .pop_browser {
    position: absolute;
    width: 450px;
    padding: 40px;
    max-height: none;
    z-index: 3;
    top: 40px;
    left: 0px;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    font-size: 18px;
    color: #222222
}

.download .bx_unit .icos .popup.rgt,
.download .bx_unit .icos .rgt.pop_browser {
    left: auto;
    right: 0px
}

.download .bx_unit .icos .popup .bx_dw,
.download .bx_unit .icos .pop_browser .bx_dw {
    width: 160px;
    display: inline-block;
    margin-left: 24px
}

.download .bx_unit .icos .popup .bx_dw:first-child,
.download .bx_unit .icos .pop_browser .bx_dw:first-child {
    margin-left: 0px
}

.download .bx_unit .icos .popup .bx_dw img,
.download .bx_unit .icos .pop_browser .bx_dw img {
    width: 61px
}

.download .bx_unit .icos .popup .bx_dw span,
.download .bx_unit .icos .pop_browser .bx_dw span {
    margin: 14px auto 24px
}

.download .bx_unit .icos .popup .link,
.download .bx_unit .icos .pop_browser .link {
    display: block;
    clear: both;
    content: "";
    text-align: left;
    display: block;
    border-top: 1px solid #222222;
    margin-top: 20px;
    padding-top: 14px
}

.download .bx_unit .icos .popup .link span,
.download .bx_unit .icos .pop_browser .link span {
    display: inline;
    margin-right: 5px
}

@media (max-width: 1279px) {
    .download .tab {
        margin: 0px 0px 68px
    }

    .download .tab a {
        font-size: 16px
    }

    .download .bx_unit {
        display: block;
        float: left;
        width: 31.33%;
        min-height: 317px;
        margin: 0 1% 18px;
        padding-top: 30px
    }

    .download .bx_unit .icos {
        margin-top: 23px
    }

    .download .bx_unit .icos .w_grp,
    .download .bx_unit .icos .btn_play,
    .download .bx_unit .icos .btn_app {
        margin: 0 10px
    }

    .download .bx_unit .icos .w_grp .btn_win,
    .download .bx_unit .icos .w_grp .btn_play,
    .download .bx_unit .icos .w_grp .btn_app {
        margin: 0
    }

    .download .bx_unit .icos .popup,
    .download .bx_unit .icos .pop_browser,
    .download .bx_unit .icos .popup.rgt,
    .download .bx_unit .icos .rgt.pop_browser {
        width: 90% !important;
        max-height: 80%;
        position: fixed;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        margin-top: 22px;
        padding: 40px;
        text-align: center
    }

    .download .bx_unit .icos .popup .bx_dw,
    .download .bx_unit .icos .pop_browser .bx_dw,
    .download .bx_unit .icos .popup.rgt .bx_dw,
    .download .bx_unit .icos .rgt.pop_browser .bx_dw {
        width: 30%;
        margin: 0 1%
    }

    .download .bx_unit .icos .popup .link,
    .download .bx_unit .icos .pop_browser .link {
        margin-top: 30px;
        padding-top: 20px
    }

    .download .bx_unit .icos .popup .link span,
    .download .bx_unit .icos .pop_browser .link span {
        display: inline
    }

    .download .bx_unit .icos .popup .bx_dw span,
    .download .bx_unit .icos .pop_browser .bx_dw span {
        margin: 20px auto 28px
    }

    .download .bx_unit strong {
        font-size: 18px
    }

    .download .bx_unit .ico_pro+strong {
        margin-bottom: 30px
    }

    .download .bx_unit .desc {
        height: 154px;
        padding-top: 30px
    }

    .download .bx_unit .desc>span {
        font-size: 13px
    }

    .download article {
        width: auto;
        margin: 0 -1%
    }
}

@media (max-width: 767px) {
    .download .tab {
        margin: 0 0 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .download .tab a {
        display: block;
        margin-right: 0;
        font-size: 13px;
        vertical-align: top;
        text-align: center
    }

    .ie9 .download .tab a {
        display: inline-block;
        margin-right: 15px
    }

    .download .tab .tab_tt {
        display: block;
        padding-top: 10px
    }

    .download .tab .ico_all,
    .download .tab .ico_pc,
    .download .tab .ico_win,
    .download .tab .ico_play,
    .download .tab .ico_app {
        display: inline-block;
        text-align: center;
        margin: 0 auto
    }

    .download .tab .ico_all:after,
    .download .tab .ico_pc:after,
    .download .tab .ico_win:after,
    .download .tab .ico_play:after,
    .download .tab .ico_app:after {
        display: block;
        clear: both;
        content: ""
    }

    .download .tab .ico_all {
        margin-top: 0
    }

    .download .bx_unit {
        width: 100%;
        float: none;
        margin: 0 auto 20px;
        padding-top: 40px
    }

    .download .bx_unit .icos .w_grp,
    .download .bx_unit .icos .btn_play,
    .download .bx_unit .icos .btn_app,
    .download .bx_unit .icos .btn_appstore {
        width: 46px;
        height: 46px;
        background-color: #f8f8f8;
        border-radius: 50%;
        margin: 0 10px;
        vertical-align: top
    }

    .download .bx_unit .icos .w_grp .btn_win,
    .download .bx_unit .icos .btn_pc {
        margin-top: 12px
    }

    .download .bx_unit .icos .btn_play {
        background-position: 17px 50%
    }

    .download .bx_unit .icos .btn_appstore {
        background-size: 17.5px 17.5px
    }

    .download .bx_unit .icos .popup,
    .download .bx_unit .icos .pop_browser,
    .download .bx_unit .icos .popup.rgt,
    .download .bx_unit .icos .rgt.pop_browser {
        width: 87.5% !important;
        max-width: inherit;
        padding: 30px 20px
    }

    .download .bx_unit .icos .popup .bx_dw,
    .download .bx_unit .icos .pop_browser .bx_dw,
    .download .bx_unit .icos .popup.rgt .bx_dw,
    .download .bx_unit .icos .rgt.pop_browser .bx_dw {
        display: block;
        width: auto;
        margin: 0
    }

    .download .bx_unit .icos .popup .bx_dw span,
    .download .bx_unit .icos .pop_browser .bx_dw span,
    .download .bx_unit .icos .popup.rgt .bx_dw span,
    .download .bx_unit .icos .rgt.pop_browser .bx_dw span {
        margin: 0 auto;
        font-size: 14px
    }

    .download .bx_unit .icos .popup .bx_dw .btn,
    .download .bx_unit .icos .pop_browser .bx_dw .btn,
    .download .bx_unit .icos .popup.rgt .bx_dw .btn,
    .download .bx_unit .icos .rgt.pop_browser .bx_dw .btn {
        margin: 20px auto 30px
    }

    .download .bx_unit .icos .popup img,
    .download .bx_unit .icos .pop_browser img,
    .download .bx_unit .icos .popup.rgt img,
    .download .bx_unit .icos .rgt.pop_browser img {
        display: none
    }

    .download .bx_unit .icos .popup .link,
    .download .bx_unit .icos .pop_browser .link,
    .download .bx_unit .icos .popup.rgt .link,
    .download .bx_unit .icos .rgt.pop_browser .link {
        margin-top: 0
    }

    .download .bx_unit strong {
        margin-top: 15px;
        font-size: 18px
    }

    .download .bx_unit .ico_pro+strong {
        margin-bottom: 40px
    }

    .download .bx_unit .desc span {
        font-size: 13px
    }

    .download article {
        margin: 0
    }
}

.plan .container {
    min-height: 900px
}

.plan .container .tit_c {
    margin-bottom: 37px
}

@media (max-width: 1279px) {
    .plan .container {
        min-height: auto
    }

    .plan .container .tit_c {
        margin-bottom: 30px;
        font-size: 42px;
        line-height: 62px;
        text-align: left
    }
}

@media (max-width: 767px) {
    .plan .container .tit_c {
        margin-bottom: 10px;
        font-size: 30px;
        line-height: 34px
    }
}

.plan .wrap_prod {
    overflow: hidden
}

.plan .wrap_prod h2 {
    margin: 40px 0 50px;
    font-size: 34px;
    line-height: 50px;
    text-align: center
}

.plan .wrap_prod .cell_prod {
    position: relative;
    float: left;
    padding: 0 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center
}

.plan .wrap_prod .cell_prod img {
    width: 110px;
}

.plan .wrap_prod .cell_prod::before {
    display: block;
    content: '';
    position: absolute;
    right: 0;
    top: 20px;
    width: 1px;
    height: 100px;
    background: #E5E5E5
}

.plan .wrap_prod .cell_prod:last-child::before {
    display: none
}

.plan .wrap_prod.cell3 .cell_prod {
    width: 33.3%
}

.plan .wrap_prod.cell2 .cell_prod {
    width: 50%
}

.plan .wrap_prod .symbol .txt {
    display: block;
    margin: 20px 0;
    font-weight: 600;
    font-size: 22px;
    line-height: 33px
}

.plan .wrap_prod .disc {
    margin-bottom: 10px
}

.plan .wrap_prod .disc p {
    font-size: 18px;
    line-height: 1
}

.plan .wrap_prod .disc p+p {
    margin-top: 19px
}

.plan .wrap_prod .point {
    color: #4285F4
}

@media (max-width: 1279px) {
    .plan .wrap_prod h2 {
        margin: 60px 0 30px;
        font-size: 32px
    }

    .plan .wrap_prod .disc p {
        font-size: 16px;
        line-height: 18px
    }

    .plan .wrap_prod .disc p+p {
        margin-top: 21px
    }
}

@media (max-width: 767px) {
    .plan .wrap_prod h2 {
        margin: 50px 0 30px;
        font-size: 23px;
        line-height: 34px
    }

    .plan .wrap_prod .cell_prod {
        float: none
    }

    .plan .wrap_prod .cell_prod::before {
        display: none
    }

    .plan .wrap_prod .cell_prod+.cell_prod {
        margin-top: 50px
    }

    .plan .wrap_prod.cell3 .cell_prod {
        width: 100%
    }

    .plan .wrap_prod.cell2 .cell_prod {
        width: 100%
    }

    .plan .wrap_prod .disc p {
        font-size: 16px;
        line-height: 18px
    }

    .plan .wrap_prod .disc p+p {
        margin-top: 21px
    }
}

.mail .cnt_top h2 {
    margin: 0
}

.sub_f.error {
    padding-top: 0;
    background: #ffe6bf
}

.sub_f.error .container.tp2 {
    margin: 55px auto 85px
}

.sub_f.error .img {
    display: block;
    width: 640px;
    margin: 0 auto
}

.sub_f.error .bx_error {
    position: relative;
    width: 640px;
    margin: 0 auto;
    padding: 55px 56px 40px;
    background: #fff;
    border-radius: 5px;
    border-bottom: 5px solid #ececec;
    -webkit-box-shadow: 2px 5px 20px #ead3af;
    box-shadow: 2px 5px 20px #ead3af
}

.sub_f.error .bx_error h1 {
    margin-bottom: 35px;
    font-size: 30px;
    font-weight: 600
}

.sub_f.error .bx_error p {
    font-size: 15px;
    line-height: 26px
}

.sub_f.error .bx_error p strong {
    margin-top: 15px;
    font-size: 15px
}

.sub_f.error .bx_error p.accent {
    color: #f52222
}

.sub_f.error .bx_error strong {
    display: block;
    margin-top: 60px;
    font-size: 18px
}

.sub_f.error .bx_error .logo {
    display: block;
    position: absolute;
    right: 58px;
    bottom: 45px;
    width: 132px;
    height: 13px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/logo_gomcorp2.png") no-repeat 0 0;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden
}

@media (max-width: 1279px) {
    .sub_f.error .container {
        padding-top: 0
    }

    .sub_f.error .container.tp2 {
        margin: 35px auto 60px
    }
}

@media (max-width: 767px) {
    .sub_f.error .container.tp2 {
        margin: 20px auto 30px
    }

    .sub_f.error .img {
        width: 100%
    }

    .sub_f.error .bx_error {
        padding: 30px;
        width: auto
    }

    .sub_f.error .bx_error h1 {
        font-size: 20px
    }

    .sub_f.error .bx_error p {
        font-size: 13px
    }

    .sub_f.error .bx_error p strong {
        font-size: 13px
    }

    .sub_f.error .bx_error strong {
        margin-top: 30px;
        font-size: 12px
    }

    .sub_f.error .bx_error .logo {
        position: static;
        margin-top: 20px
    }
}

.ie8 .com_msg .bx_ico {
    text-align: center
}

.ie8 .com_msg .bx_ico .ico {
    margin-right: 0;
    padding-right: 0
}

.ie8 .com_msg br {
    display: none
}

.ie8 .tip_info {
    display: none
}

.ie8 .install.sub_f .bx_complet h1 {
    margin-top: -50px
}

.ie8 .install.sub_f .bx_complet h1:before {
    top: 0
}

.ie8 .install.sub_f .special .bx_unit .top img {
    top: 30px
}

.ie8 .install.sub_f .special .bx_unit .desc br {
    display: none
}

.ie8 .customer .licen .bx_cont,
.ie8 .customer .licen .bx_qna {
    display: table;
    width: 100%
}

.ie8 .customer .licen .cont {
    display: table-cell;
    position: static;
    vertical-align: middle
}

.mix_w {
    position: relative;
    clear: both;
    width: 100%;
    padding: 90px 0 100px
}

.mix_w .area_1080 {
    max-width: 1080px;
    margin: 0 auto
}

.mix_w div[class^='area_'] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 1279px) {
    .mix_w {
        padding: 60px 0 80px
    }

    .mix_w div[class*='area_'] {
        padding-left: 3.9%;
        padding-right: 3.9%
    }
}

@media (max-width: 767px) {
    .mix_w {
        padding: 44px 0 50px
    }

    .mix_w div[class*='area_'] {
        padding-left: 6.25%;
        padding-right: 6.25%
    }
}

.bridge_txt {
    position: relative;
    padding: 100px 0 80px;
    text-align: center;
    border-bottom: 1px solid #ebebeb
}

.bridge_txt h1 {
    margin-bottom: 47px
}

.bridge_txt h1 br {
    display: none
}

.bridge_txt p {
    margin-bottom: 60px
}

.bridge_txt .big.full {
    max-width: 400px
}

.bridge_txt+.bx_step_wrap {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .bridge_txt {
        padding: 70px 0 60px
    }

    .bridge_txt h1 {
        margin-bottom: 50px
    }

    .bridge_txt h1 br {
        display: block
    }

    .bridge_txt p {
        margin-bottom: 50px
    }

    .bridge_txt+.bx_step_wrap {
        margin-top: 60px
    }
}

@media (max-width: 767px) {
    .bridge_txt {
        padding: 50px 0 40px
    }

    .bridge_txt h1 {
        margin-bottom: 35px
    }

    .bridge_txt h1 br {
        display: block
    }

    .bridge_txt p {
        margin-bottom: 30px
    }

    .bridge_txt+.bx_step_wrap {
        margin-top: 40px
    }
}

@media (max-width: 1279px) {
    .blog .container .stit {
        padding-bottom: 10px
    }
}

@media (max-width: 767px) {
    .blog .container .stit {
        padding-bottom: 0
    }
}

.blog .cont {
    overflow: hidden
}

.blog .bx_sort::after {
    display: block;
    clear: both;
    content: ""
}

.blog .sort {
    position: absolute;
    right: 0;
    top: 0
}

@media (max-width: 767px) {
    .blog .sort {
        position: relative
    }
}

.blog .view h1 {
    font-size: 46px;
    line-height: 62px
}

.blog .view .date {
    margin-top: 10px;
    font-size: 14px;
    color: #999
}

.blog .view .bx_sns {
    margin-top: 20px;
    text-align: right;
    font-size: 0;
    line-height: 0
}

.blog .view .cont {
    padding-top: 30px;
    font-size: 18px;
    line-height: 1.6em;
    max-width: 950px;
}

.blog .view .cont p,
.blog .view .cont ul,
.blog .view .cont ol,
.blog .view .cont h2,
.blog .view .cont h3,
.blog .view .cont h4,
.blog .view .cont h5,
.blog .view .cont h6,
.blog .view .cont table,
.blog .view .cont hr,
.blog .view .cont div {
    max-width: 950px
}

.blog .view .cont p,
.blog .view .cont span {
    font-size: 18px !important;
    line-height: 1.6em !important
}

.blog .view .cont h2 {
    font-size: 30px
}

.blog .view .cont img {
    /*width: 100%;*/
    max-width: 100%;
    border-radius: 20px;
    margin: 10px 0 10px 0;
}

.blog .view .cont a {
    color: blue
}

.blog .view .cont a:hover {
    text-decoration: underline
}

.blog .view .cont table {
    max-width: 100%
}

.blog .view .bx_hash {
    margin-top: 70px;
    padding-top: 20px;
    border-top: 1px solid #222
}

.blog .view .bx_hash a {
    color: #222
}

@media (max-width: 1279px) {
    .blog .view.container {
        padding: 0;
        margin-top: 0
    }

    .blog .view .location {
        padding: 0
    }

    .blog .view h1 {
        margin: 20px 30px 0;
        font-size: 30px;
        line-height: 42px
    }

    .blog .view .top {
        margin: 13px 30px 0
    }

    .blog .view .bx_sns {
        margin-top: 30px
    }

    .blog .view .cont {
        max-width: auto;
        padding-top: 10px;
        font-size: 16px;
        line-height: 26px;
        margin: 0 20px 0 20px;
    }

    .blog .view .cont p,
    .blog .view .cont ul,
    .blog .view .cont ol,
    .blog .view .cont h2,
    .blog .view .cont h3,
    .blog .view .cont h4,
    .blog .view .cont h5,
    .blog .view .cont h6,
    .blog .view .cont table,
    .blog .view .cont hr,
    .blog .view .cont div {
        margin: 0 30px
    }

    .blog .view .cont p * {
        margin: 0
    }

    .blog .view .cont div {
        width: auto !important
    }

    .blog .view .cont table {
        width: auto !important
    }

    .blog .view .cont img {
        width: auto !important;
        height: auto !important
    }

    .blog .view h2 {
        font-size: 26px
    }

    .blog .view .bx_hash {
        margin: 60px 30px 0
    }
}

@media (max-width: 767px) {
    .blog .view h1 {
        margin: 32px 24px 0;
        font-size: 26px;
        line-height: 34px
    }

    .blog .view .top {
        margin: 8px 24px 0
    }

    .blog .view .date {
        margin-top: 0;
        font-size: 13px
    }

    .blog .view .cont p,
    .blog .view .cont ul,
    .blog .view .cont ol,
    .blog .view .cont h2,
    .blog .view .cont h3,
    .blog .view .cont h4,
    .blog .view .cont h5,
    .blog .view .cont h6,
    .blog .view .cont table,
    .blog .view .cont hr,
    .blog .view .cont div {
        margin: 0 10px
    }

    .blog .view .cont p * {
        margin: 0
    }

    .blog .view .bx_hash {
        margin: 30px 24px 0
    }
}

/* market */
@media (max-width: 1279px) {
    .market .container .stit {
        padding-bottom: 10px
    }
}

@media (max-width: 767px) {
    .market .container .stit {
        padding-bottom: 0
    }
}

.market .cont {
    overflow: hidden
}

.market .bx_sort::after {
    display: block;
    clear: both;
    content: ""
}

.market .sort {
    position: absolute;
    right: 0;
    top: 0
}

@media (max-width: 767px) {
    .market .sort {
        position: relative
    }
}

.market .view h1 {
    font-size: 46px;
    line-height: 62px
}

.market .view .date {
    margin-top: 10px;
    font-size: 14px;
    color: #999
}

.market .view .bx_sns {
    margin-top: 20px;
    text-align: right;
    font-size: 0;
    line-height: 0
}

.market .view .cont {
    padding-top: 30px;
    font-size: 18px;
    line-height: 1.6em
}

.market .view .cont p,
.market .view .cont ul,
.market .view .cont ol,
.market .view .cont h2,
.market .view .cont h3,
.market .view .cont h4,
.market .view .cont h5,
.market .view .cont h6,
.market .view .cont table,
.market .view .cont hr,
.market .view .cont div {
    max-width: 950px
}

.market .view .cont p,
.market .view .cont span {
    font-size: 18px !important;
    line-height: 1.6em !important
}

.market .view .cont h2 {
    font-size: 30px
}

.market .view .cont img {
    width: 100%;
    max-width: 100%
}

.market .view .cont a {
    color: blue
}

.market .view .cont a:hover {
    text-decoration: underline
}

.market .view .cont table {
    max-width: 100%
}

.market .view .bx_hash {
    margin-top: 70px;
    padding-top: 20px;
    border-top: 1px solid #222
}

.market .view .bx_hash a {
    color: #222
}

@media (max-width: 1279px) {
    .market .view.container {
        padding: 0;
        margin-top: 0
    }

    .market .view .location {
        padding: 0
    }

    .market .view h1 {
        margin: 20px 30px 0;
        font-size: 30px;
        line-height: 42px
    }

    .market .view .top {
        margin: 13px 30px 0
    }

    .market .view .bx_sns {
        margin-top: 30px
    }

    .market .view .cont {
        max-width: auto;
        padding-top: 20px;
        font-size: 16px;
        line-height: 26px
    }

    .market .view .cont p,
    .market .view .cont ul,
    .market .view .cont ol,
    .market .view .cont h2,
    .market .view .cont h3,
    .market .view .cont h4,
    .market .view .cont h5,
    .market .view .cont h6,
    .market .view .cont table,
    .market .view .cont hr,
    .market .view .cont div {
        margin: 0 30px
    }

    .market .view .cont p * {
        margin: 0
    }

    .market .view .cont div {
        width: auto !important
    }

    .market .view .cont table {
        width: auto !important
    }

    .market .view .cont img {
        width: auto !important;
        height: auto !important
    }

    .market .view h2 {
        font-size: 26px
    }

    .market .view .bx_hash {
        margin: 60px 30px 0
    }
}

@media (max-width: 767px) {
    .market .view h1 {
        margin: 32px 24px 0;
        font-size: 26px;
        line-height: 34px
    }

    .market .view .top {
        margin: 8px 24px 0
    }

    .market .view .date {
        margin-top: 0;
        font-size: 13px
    }

    .market .view .cont p,
    .market .view .cont ul,
    .market .view .cont ol,
    .market .view .cont h2,
    .market .view .cont h3,
    .market .view .cont h4,
    .market .view .cont h5,
    .market .view .cont h6,
    .market .view .cont table,
    .market .view .cont hr,
    .market .view .cont div {
        margin: 0 24px
    }

    .market .view .cont p * {
        margin: 0
    }

    .market .view .bx_hash {
        margin: 30px 24px 0
    }
}
/* market */

.buy_area {
    background-color: #F1F1F1
}

.buy_area .cont {
    display: block;
    clear: both;
    content: "";
    width: 100%;
    max-width: 1080px;
    height: 84px;
    margin: 0 auto;
    padding: 20px 0 19px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.buy_area .r_area {
    float: right
}

.buy_area .btn_area {
    display: inline-block;
    margin-left: 8px
}

.buy_area .btn_area .btn {
    display: inline-block;
    min-width: 120px;
    padding: 10px 15px 9px;
    font-size: 17px;
    line-height: 25px;
    vertical-align: top;
    margin: 0
}

.buy_area .btn_area .btn+.btn {
    margin-left: 7px
}

.buy_area .slct_area {
    display: inline-block;
    width: 350px;
    height: 44px;
    z-index: 2;
    position: relative;
    border: 1px solid #C8C8C8;
    background-color: #ffffff;
    border-radius: 25px;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.buy_area .slct_area .slct_trg2 {
    display: block;
    position: relative;
    padding: 0 44px 0 20px;
    margin: 0;
    font-size: 16px;
    line-height: 43px;
    font-weight: 600;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.buy_area .slct_area .slct_trg2::after {
    display: inline-block;
    content: '';
    position: absolute;
    right: 20px;
    top: 10px;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/arr_down.svg") no-repeat 0 0;
    width: 24px;
    height: 24px
}

.buy_area .slct_area .slct_trg2 .text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.buy_area .slct_area .slct_box2 {
    display: none;
    overflow: hidden;
    position: absolute;
    left: -1px;
    top: 43px;
    width: 100%;
    padding: 10px 0;
    background: #fff;
    border: 1px solid #C8C8C8;
    border-width: 0 1px 1px 1px;
    border-radius: 0 0 20px 20px
}

.buy_area .slct_area .slct_box2 a {
    display: block;
    padding: 10px 19px;
    text-align: left;
    font-weight: 100;
    font-size: 16px;
    line-height: 24px
}

.buy_area .slct_area .slct_box2 a:hover {
    background: #F7F7F7;
    font-weight: 600
}

.buy_area .slct_area .slct_box2 a.on {
    color: inherit;
    background: #F7F7F7;
    font-weight: 600
}

.buy_area .slct_area .sale {
    display: inline;
    color: #F52222;
    margin-left: 8px;
    font-size: 14px
}

.buy_area .slct_area.on {
    border-bottom-width: 0;
    border-radius: 20px 20px 0 0;
    height: 44px
}

.buy_area .slct_area.single .slct_trg2 {
    padding: 0 20px;
    cursor: default
}

.buy_area .slct_area.single .slct_trg2::after {
    display: none
}

.buy_area .slct_area.single.on .slct_box2 {
    display: none !important
}

@media (max-width: 1279px) {
    .buy_area {
        padding: 0 24px;
        margin: 0 -30px
    }

    .buy_area .cont {
        max-width: none;
        height: auto;
        padding: 5px 0px 20px
    }

    .buy_area .stit {
        display: none
    }

    .buy_area .r_area {
        float: none
    }

    .buy_area .btn_area {
        margin-top: 15px
    }

    .buy_area .slct_area {
        width: 62.8%;
        margin-top: 15px
    }

    .buy_area .slct_area .sale {
        margin-left: 17px
    }
}

@media (max-width: 767px) {
    .buy_area {
        padding: 0px 24px;
        margin: 0
    }

    .buy_area .cont {
        padding: 9px 0px 24px
    }

    .buy_area .btn_area {
        display: block;
        margin-left: 0
    }

    .buy_area .btn_area.single .btn {
        min-width: auto;
        width: 100%
    }

    .buy_area .btn_area .btn {
        min-width: auto;
        width: 48%
    }

    .buy_area .btn_area .btn+.btn {
        margin-left: 2.9%
    }

    .buy_area .slct_area {
        width: 100%;
        height: 40px
    }

    .buy_area .slct_area .slct_trg2 {
        padding: 0 34px 0 20px;
        font-size: 15px;
        line-height: 40px
    }

    .buy_area .slct_area .slct_trg2::after {
        right: 10px;
        top: 8px
    }

    .buy_area .slct_area .slct_trg2 .text {
        display: inline
    }

    .buy_area .slct_area .slct_box2 {
        top: 39px
    }

    .buy_area .slct_area .slct_box2 a {
        font-size: 15px
    }

    .buy_area .slct_area.single .slct_trg2 {
        padding: 0 15px
    }

    .buy_area .slct_area.on {
        height: 40px
    }

    .buy_area .slct_area .sale {
        margin-left: 4px;
        font-size: 12px;
        line-height: 40px
    }
}

.member {
    padding-top: 90px
}

.member .skip_navi {
    top: -90px
}

.member .container h1 {
    font-weight: 600;
    margin: 0px 0px 9px -200px;
    width: 800px
}

.member .container h1.h_bottom {
    margin-bottom: 38px
}

.member p.p_bottom {
    margin-bottom: 64px
}

.member p.p_mid {
    margin-bottom: 54px
}

.member .btn.full {
    margin-top: 30px
}

.member .btn.full.none {
    margin-top: 20px
}

.member .btn.full+.btn.full {
    margin-top: 20px
}

.member .btn.full.top {
    margin-top: 55px
}

.member .l_header {
    margin: 0px auto 65px
}

.member .l_header .btn.full {
    margin-top: 64px
}

.member .l_header p {
    font-size: 18px;
    line-height: 28px
}

.member .l_header .txt_chk {
    margin-top: 20px
}

.member .l_header.bottom {
    margin: 0px auto 57px
}

.member .l_header.bx_top {
    margin: 70px auto 0
}

.member .tbl_sns {
    margin-top: 60px
}

.member .tbl_sns td {
    padding: 36px 0;
    text-align: center
}

.member .tbl_sns td span {
    display: block;
    padding-bottom: 10px;
    font-weight: 600
}

@media (max-width: 1279px) {
    .member {
        padding: 60px 0% 0px
    }

    .member .container h1 {
        margin: 0px 0px 26px 0px;
        width: 100%
    }

    .member .container h1.down {
        margin-bottom: 35px
    }

    .member .container h1.h_bottom {
        margin-bottom: 44px
    }

    .member .p_bottom {
        margin-bottom: 54px
    }

    .member .l_header {
        margin: 0px auto 61px
    }

    .member .l_header.bottom {
        margin: 0px auto 55px
    }

    .member .l_header.bx_top {
        margin: 67px auto 0
    }

    .member .tbl_sns td {
        font-size: 15px
    }
}

@media (max-width: 767px) {
    .member .container h1 {
        margin: 0px 0px 8px 0;
        width: 100%
    }

    .member .container h1.down {
        margin-bottom: 35px
    }

    .member .container h1.h_bottom {
        margin-bottom: 25px
    }

    .member p.p_bottom {
        margin-bottom: 26px;
        line-height: 1.6
    }

    .member p.p_mid {
        margin-bottom: 31px
    }

    .member .l_header {
        margin: 0px auto 30px
    }

    .member .l_header p {
        font-size: 14px;
        line-height: 24px
    }

    .member .l_header.bottom {
        margin: 0px auto 28px
    }

    .member .l_header.bx_top {
        margin: 29px auto 0
    }

    .member .btn.full {
        margin-top: 25px
    }

    .member .btn.full.none {
        margin-top: 10px
    }

    .member .btn.full+.btn.full {
        margin-top: 15px
    }

    .member .btn.full.top {
        margin-top: 25px
    }

    .member .tbl_sns {
        margin-top: 30px
    }

    .member .tbl_sns td {
        font-size: 13px;
        padding: 26px 0
    }

    .member .tbl_sns td span {
        padding-bottom: 2px
    }
}

.member.join .ipt:disabled {
    border: 1px solid #dddddd;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #f3f3f3;
    color: #222222
}

.member.join .ipt:disabled[value] {
    color: #c4c4c4
}

.member.join .radio+.label {
    margin: 10px 40px 10px 0px
}

.member.join .radio+.label.right {
    margin-right: 0
}

@media (max-width: 1279px) {
    .member.join .radio+.label {
        margin-right: 33px
    }
}

.member.join .tab {
    margin-top: 50px
}

.member.join .txt_point {
    text-decoration: underline
}

.member.join .bx_notice {
    line-height: 2.5
}

.member.join .txt_alert {
    font-weight: 100;
    padding-left: 26px
}

.member.join input:-webkit-autofill,
.member.join input:-webkit-autofill:hover,
.member.join input:-webkit-autofill:focus,
.member.join input:-webkit-autofill:active {
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px #fff8f3 inset !important
}

@media (max-width: 1279px) {
    .member.join .container .squ.full {
        margin-top: 0
    }

    .member.join .btn.squ.big {
        padding: 21px 24px
    }

    .member.join .btn.r_squ.big {
        height: 60px;
        padding: 5px 24px
    }
}

@media (max-width: 767px) {
    .member.join .tab {
        margin-top: 35px
    }

    .member.join .bx_notice {
        padding: 11px 0px;
        font-size: 13px
    }

    .member.join .bx_notice label {
        font-size: 13px
    }

    .member.join .squ.full {
        font-size: 14px
    }

    .member.join .btn.big {
        height: 55px;
        padding: 0px 24px;
        font-size: 14px
    }

    .member.join .btn.r_squ.big {
        height: 55px;
        padding: 0px 24px
    }
}

.member .line {
    display: block;
    text-align: center;
    text-decoration: underline;
    margin: 21px 0px 27px
}

.member .line.big {
    font-weight: 600;
    font-size: 15px
}

.member .line.pw {
    margin: 25px 0px 27px
}

.member .line.up {
    margin-top: 30px
}

.member .impt {
    display: block;
    width: 100%;
    text-align: center;
    margin: 30px 0px
}

.member .right {
    margin-right: 0px
}

.member .bx_notice {
    text-align: left;
    padding: 32px 0px
}

.member .bx_notice label {
    font-size: 15px
}

.member .slct {
    cursor: pointer;
    margin-top: 40px
}

.member .slct.top {
    margin-top: 10px
}

.member .slct.on {
    border: 1px solid #4285F4;
    background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct_on.png") no-repeat 94.5% 50%
}

.member .slct:disabled {
    cursor: default;
    background-color: #f3f3f3;
    color: #c4c4c4
}

.member .slct:disabled[value] {
    color: #c4c4c4
}

.member .ipt {
    color: var(--heading-color);
}

@media (max-width: 767px) {
    .member .ipt {
        padding: 0px 15px 0px 20px;
        font-size: 12px;
        height: 40px;
        border-radius: 6px;
    }

    .member .impt {
        margin: 20px 0px
    }

    .member .line {
        margin: 13px auto 18px
    }

    .member .line.big {
        font-size: 13px
    }

    .member .line.pw {
        margin: 21px auto 23px
    }

    .member .line.type2 {
        margin: 21px auto 8px
    }

    .member .line.up {
        margin: 12px auto 3px
    }

    .member .slct {
        margin-top: 20px
    }

    .member .slct.on {
        background: #fff url("//dreamgreen.co.kr/assets/ui/img/common/bg_slct_on.png") no-repeat 95.3% 50%
    }
}

.member .tab {
    width: 100%;
    height: 50px
}

.member .tab:after {
    display: block;
    clear: both;
    content: ""
}

.member .tab .item {
    display: block;
    width: 50%;
    height: 100%;
    line-height: 50px;
    float: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid var(--sign-border);
    border-bottom: 1px solid var(--sign-bottom);
    color: var(--heading-color);
}

.member .tab .item:first-child {
    border-right: none
}

.member .tab .item.on {
    font-weight: 600;
    color: var(--heading-color);
    border: 1px solid var(--sign-bottom);
    border-color: var(--sign-bottom);
    border-top: 3px solid var(--sign-bottom);
    border-bottom: none;
    background-color: transparent;
    
}

.member .tab .item.off {
    background-color: #f3f3f3
}

.member .txt {
    font-size: 15px;
    margin: 30px 6.25%
}

.member .location {
    width: 100%
}

.member .container {
    width: 100%;
    max-width: 400px;
    margin: 0px auto 100px;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.member .container .chk_box {
    margin: 15px auto 6px
}

.member .container .chk_box .item {
    display: inline-block;
    text-align: left;
    margin-right: 30px
}

.member .container .chk_box .item:last-child {
    margin-right: 0px
}

.member .container .find {
    margin: 40px 0px 10px
}

.member .container .find.down {
    margin: 30px 0px 30px
}

.member .container .find .item {
    word-break: keep-all
}

.member .container .find .item:before {
    content: "";
    width: 1px;
    height: 14px;
    display: inline-block;
    position: relative;
    background: #e5e5e5;
    margin: 0px 6.25%;
    vertical-align: middle
}

.member .container .find .item:first-child:before {
    display: none
}

.member .container .find .item.line {
    text-decoration: underline
}

.member .container p.bx {
    margin-bottom: 26px
}

@media (max-width: 767px) {
    .member .container p.bx {
        margin-bottom: 17px
    }
}

.member .container .bx {
    margin-bottom: 60px
}

.member .container .bx .btn {
    background: #4285F4;
    font-size: 18px;
    padding: 19px 20px 21px
}

@media (max-width: 767px) {
    .member .container .bx {
        margin-bottom: 35px
    }
}

.member .container .bx_gray {
    margin-bottom: 60px
}

.member .container .bx_gray .btn.full {
    margin-top: 0
}

@media (max-width: 767px) {
    .member .container .bx_gray {
        margin-bottom: 35px
    }
}

@media (max-width: 1279px) {
    .member .container {
        margin: 0px auto 80px
    }

    .member .container .chk_box {
        position: relative;
        margin: 14px 0 8px
    }

    .member .container .chk_box .item label {
        font-size: 15px
    }

    .member .container .find {
        margin: 40px 0 20px;
        font-size: 16px
    }

    .member .container .bx .btn {
        padding: 16px 20px
    }
}

@media (max-width: 767px) {
    .member .container {
        padding: 0px 20px;
        margin: 29px auto 50px
    }

    .member .container .chk_box {
        margin: 17px 0 8px
    }

    .member .container .chk_box .item label {
        font-size: 13px
    }

    .member .container .find.down {
        font-size: 13px;
        margin: 25px auto
    }

    .member .container .bx .btn {
        font-size: 15px;
        padding: 20px 25px
    }
}

.member .container .bx_ipt {
    text-align: left;
    height: auto
}

.member .container .bx_ipt+.bx_ipt {
    margin-top: 10px
}

.member .container .sns {
    border-top: 1px solid #e5e5e5;
    font-size: 0
}

.member .container .sns:after {
    display: block;
    clear: both;
    content: ""
}

.member .container .sns p {
    margin: 44px 0px 35px;
    font-size: 18px
}

@media (max-width: 767px) {
    .member .container .sns p {
        margin: 31px 0 21px;
        font-size: 14px
    }
}

.member .container .sns .icos {
    display: inline-block;
    width: 50px;
    height: 50px;
    font-size: 12px
}

.member .container .sns .icos+a {
    margin-left: 46px
}

@media (max-width: 1279px) {
    .member .container .sns .icos+a {
        margin-left: 12%
    }
}

@media (max-width: 767px) {
    .member .container .sns .icos+a {
        margin-left: 5%
    }
}

.member .container .sns .btn {
    margin-top: 10px;
    display: block;
    height: 60px;
    padding: 0px 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.member .container .sns .btn span {
    line-height: 60px;
    vertical-align: middle
}

.member .container .sns .btn img {
    vertical-align: middle;
    margin-right: 10px
}

.member .container .sns .btn img[src*='naver'],
.member .container .sns .btn img[src*='facebook'],
.member .container .sns .btn img[src*='wechat'] {
    width: 80px
}

.member .container .sns .btn img[src*='google'] {
    width: 78px
}

.member .container .sns .btn img[src*='line'],
.member .container .sns .btn img[src*='qq'] {
    width: 50px
}

.member .container .sns .btn img[src*='insta'] {
    width: 70px;
    margin-top: 2px
}

.member .container .sns .btn img[src*='vk'] {
    width: 30px
}

.member .container .sns .btn img[src*='youku'] {
    width: 90px;
    margin-top: 3px
}

@media (max-width: 1279px) {
    .member .container .sns .btn {
        height: 50px
    }

    .member .container .sns .btn span {
        line-height: 50px
    }
}

@media (max-width: 767px) {
    .member .container .sns .btn {
        height: 55px
    }

    .member .container .sns .btn span {
        line-height: 55px
    }
}

.member .container .txt {
    font-size: 14px
}

@media (max-width: 1279px) {
    .member .container .txt {
        margin: 30px 6.25%
    }
}

@media (max-width: 767px) {
    .member .container .txt {
        margin: 20px 6.25% 35px
    }
}

.member .container .txt_rst {
    margin: 93px 0px;
    font-size: 18px
}

.member .container .txt_rst .txt_point {
    text-decoration: underline
}

.member .container .txt_rst+.btn {
    margin-top: 0px
}

@media (max-width: 1279px) {
    .member .container .txt_rst {
        margin: 53px 0px;
        font-size: 15px
    }
}

.member .txt_alert a {
    color: #4285F4;
    text-decoration: underline
}

.member .bx_ico {
    margin-top: 40px
}

.member .bx_ico+form {
    margin-top: 40px
}

.member .bx_ico.notice_mail {
    display: block;
    padding: 25px;
    margin: 26px auto 0;
    text-align: center
}

.member .bx_ico.notice_mail .ico {
    padding-right: 0
}

.member .bx_ico .info {
    max-width: 205px
}

.member .bx_ico .info.full {
    max-width: 350px
}

.member .bx_ico .info.center {
    display: block;
    padding-left: 0;
    padding-top: 20px;
    border: 0;
    text-align: center;
    margin: 0 auto
}

.member .bx_ico.center {
    display: block;
    padding: 25px;
    margin: 30px auto 0;
    text-align: center
}

.member .bx_ico.center .ico {
    padding-right: 0;
    margin: 0 auto
}

.member .bx_robot {
    margin: 25px auto;
    width: 304px
}

@media (max-width: 1279px) {
    .member .tool_set {
        position: static
    }

    .member .ico_tooltip+.tooltip {
        top: 100%;
        left: 50%;
        padding: 15px;
        width: 250px;
        margin-left: -125px;
        font-size: 12px
    }

    .member .bx_ico {
        margin-top: 40px;
        line-height: 1.3;
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .member .bx_ico {
        margin-top: 20px
    }

    .member .bx_ico .info {
        max-width: 100%
    }

    .member .bx_ico .info.center {
        padding-top: 7px
    }

    .member .bx_ico.notice_mail {
        margin: 16px auto 0;
        padding: 17px
    }

    .member .bx_ico.center {
        margin: 20px auto 0;
        padding: 17px
    }

    .member .bx_robot {
        margin: 16px auto 23px
    }
}

.buy {
    position: relative
}

.buy h2 {
    font-size: 46px
}

.buy_sns {
    padding: 20px 0 10px 0;
    text-align: center;
}

.buy .step {
    position: absolute;
    right: 0;
    top: 0px;
    font-size: 15px
}

.buy .step:after {
    display: block;
    clear: both;
    content: ""
}

.buy .step p {
    float: left;
    position: relative;
    padding-right: 73px;
    text-align: center;
    color: #cecece;
    font-weight: 100
}

.buy .step p span {
    display: block;
    width: 50px;
    height: 50px;
    margin: 0 auto 5px auto;
    font-family: 'Myriad Pro';
    line-height: 53px;
    font-size: 23px;
    color: var(--heading-color);
    background: var(--cart-level-bg);
    border: 1px solid var(--cart-level-border);
    border-radius: 50%
}

.buy .step p:after {
    top: 27px;
    right: 30px;
    content: '';
    position: absolute;
    display: block;
    vertical-align: middle;
    width: 12px;
    height: 12px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    margin-left: -4px;
    border-top: 1px solid var(--cart-level-angle);
    border-right: 1px solid var(--cart-level-angle);
}

.buy .step p:last-child {
    padding-right: 0
}

.buy .step p:last-child:after {
    display: none
}

.buy .step p.on {
    font-weight: 600;
    color: var(--heading-color);
}

.buy .step p.on span {
    color: var(--white);
    background-color: var(--cart-level-on-bg);
    border: 1px solid var(--cart-level-on-bg);
}

.buy .step p.on:after {
    border-color: var(--table-top-border);
}

@media (max-width: 1279px) {
    .buy .step {
        right: 4.68%
    }

    .buy .step p {
        padding-right: 60px
    }

    .buy .step p span {
        width: 42px;
        height: 42px;
        line-height: 46px
    }

    .buy .step p:after {
        top: 23px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .buy .step {
        position: static;
        margin: -8px 0 43px
    }

    .buy .step p {
        padding-right: 20px;
        line-height: 1;
        font-size: 12px
    }

    .buy .step p span {
        width: 25px;
        height: 25px;
        line-height: 27px;
        font-size: 12px;
        text-indent: -1px
    }

    .buy .step p:after {
        top: 15px;
        right: 5px;
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 5px;
        height: 5px;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        margin-left: -2px;
        border-top: 1px solid #cecece;
        border-right: 1px solid #cecece
    }

    .buy_sns {
        padding: 30px 0 20px 0;
        text-align: center;
    }
}

.buy .container h3 {
    font-size: 38px;
    line-height: 1.4;
    font-weight: 100;
    margin-bottom: 40px
}

@media (max-width: 1279px) {
    .buy .container h3 {
        font-size: 32px
    }
}

.buy .container .tbl {
    margin-top: 80px
}

.buy .container .tbl+.link {
    text-align: right;
    display: block;
    margin-top: 20px;
    text-decoration: underline
}

@media (max-width: 1279px) {
    .buy .container .tbl {
        margin-top: 70px
    }
}

@media (max-width: 767px) {
    .buy .container .tbl {
        margin-top: 10px
    }

    .buy .container .tbl+.link {
        text-align: center
    }
}

.buy .container .info.gmxm_open {
    margin-top: 20px
}

.buy .container .info .txt_info {
    letter-spacing: -0.32px;
    font-size: 16px;
    display: inline-block;
    position: relative;
    line-height: 30px;
    padding-left: 38px
}

.buy .container .info .txt_info:before {
    content: "";
    width: 30px;
    height: 30px;
    display: inline-block;
    background: url("//dreamgreen.co.kr/assets/ui/img/common/icon_bulb.gif") no-repeat 0 0;
    background-size: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width: 767px) {
    .buy .container h3 {
        margin-bottom: 20px;
        font-size: 23px
    }

    .buy .container h3+.tbl caption {
        font-size: 13px
    }
}

.buy .container .step+.tbl,
.buy .container h3+.tbl {
    margin-top: 0px
}

@media (max-width: 1279px) {
    .buy h2 {
        width: 60%;
        font-size: 42px;
        margin-bottom: 70px
    }

    .buy h3,
    .buy .tbl_ticket caption {
        margin-bottom: 30px;
        padding-bottom: 0
    }
}

@media (max-width: 767px) {
    .buy h2 {
        width: 50%;
        font-size: 23px;
        margin-bottom: 35px
    }

    .buy h3,
    .buy .tbl_ticket caption {
        margin-bottom: 17px;
        padding-bottom: 0
    }
}

.buy .total {
    padding: 10px 20px;
    overflow: hidden;
    background-color: #f7f7f7;
    border-radius: 10px;
    color: #000000
}

.buy .total span {
    display: inline-block;
    vertical-align: middle;
    float: left;
    font-size: 18px;
    line-height: 1.5
}

.buy .total strong,
.buy .total output {
    display: inline-block;
    font-weight: 600;
    float: right;
    vertical-align: middle;
    font-size: 22px;
    line-height: 1.2
}

.buy .total .txt_vat {
    font-size: 12px;
    font-weight: 100
}

@media (max-width: 767px) {
    .buy .total {
        padding: 5px 20px
    }

    .buy .total span {
        font-size: 14px;
        line-height: 23px
    }

    .buy .total strong,
    .buy .total output {
        font-size: 18px;
        line-height: 21px
    }
}

.buy .membership {
    padding: 10px 20px;
    overflow: hidden;    
    background-color: var(--item-member_bg);
    border-color: var(--item-member_border);
    color: var(--heading-color);
    border-radius: 10px;
    margin-bottom: 20px;
    border-style: dashed;
    border-width: 2px;
    
}

.buy .membership span {
    display: inline-block;
    vertical-align: middle;
    float: left;
    font-size: 18px;
    line-height: 1.5
}

.buy .membership strong,
.buy .membership output {
    display: inline-block;
    font-weight: 600;
    float: right;
    vertical-align: middle;
    font-size: 22px;
    line-height: 1.2
}

.buy .membership .txt_vat {
    font-size: 12px;
    font-weight: 100
}

.buy .membership_cart {
    padding: 6px 14px;
    overflow: hidden;
    background-color: var(--item-member_bg);    
    color: var(--item-member_txt);
    border-color: var(--item-member_border);
    border-radius: 10px;
    margin: 10px 0 10px 0;
    border-style: dashed;
    border-width: 2px;
}

.buy .membership_cart span {
    display: inline-block;
    vertical-align: middle;
    float: left;
    font-size: 13px;
    line-height: 1.5
}

.buy .membership_cart .mem_pay i {
    display: inline-block;
    vertical-align: middle;
    float: right;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5
}

.buy .membership_cart .mem_pay {
    display: inline-block;
    vertical-align: middle;
    font-size: 13px;
    line-height: 1.5
}

.buy .membership_cart strong,
.buy .membership_cart output {
    display: inline-block;
    font-weight: 600;
    float: right;
    vertical-align: middle;
    font-size: 22px;
    line-height: 1.2
}

.buy .membership_cart .txt_vat {
    font-size: 12px;
    font-weight: 100
}

.buy .membership_cart .pay .dc_per {
    float: left;
    font-size: 12px;
    color: #e53c3a;
    padding: 1px 5px 0 5px;
}

@media (max-width: 767px) {
    .buy .membership {
        padding: 10px 0 0 5px;
        border-style: dashed;
        border-width: 2px;
    }

    .buy .membership span {
        font-size: 14px;
        line-height: 23px
    }

    .buy .membership strong,
    .buy .membership output {
        font-size: 18px;
        line-height: 21px
    }

    .buy .membership_cart {
        /*padding: 10px 0 0 5px;*/
        border-style: dashed;
        border-width: 2px;
    }

    .buy .membership_cart span {
        font-size: 14px;
        line-height: 23px
    }

    .buy .membership_cart strong,
    .buy .membership_cart output {
        font-size: 18px;
        line-height: 21px
    }

    .cart-table .cart .sec-grid-1 {
        margin: 5px 0 5px 0;
    }
}

.buy .tbl+.bx_ico {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .buy .tbl+.bx_ico {
        margin-top: 70px
    }
}

@media (max-width: 767px) {
    .buy .tbl .slct {
        display: block
    }
}

.buy .ie_noti {
    margin-top: 80px;
    border-bottom: 1px solid #f0f0f0
}

.buy .ie_noti strong {
    display: block;
    margin-bottom: 4px
}

.buy .ie_noti a {
    text-decoration: underline
}

.buy .ie_noti td {
    padding: 20px 30px;
    border: none
}

.buy .ie_noti td p+p {
    margin-top: 8px
}

.buy .ie_noti tr:first-child td {
    padding-top: 40px
}

.buy .ie_noti tr:last-child td {
    padding-bottom: 40px
}

@media (max-width: 1279px) {
    .buy .ie_noti {
        margin-top: 70px
    }

    .buy .ie_noti td {
        padding: 20px
    }
}

@media (max-width: 767px) {
    .buy .ie_noti {
        margin-top: 30px
    }

    .buy .ie_noti strong {
        margin-bottom: 10px
    }

    .buy .ie_noti p {
        font-size: 12px
    }

    .buy .ie_noti td {
        padding: 15px 3.57%
    }

    .buy .ie_noti tr:first-child td {
        padding-top: 30px
    }

    .buy .ie_noti tr:last-child td {
        padding-bottom: 30px
    }
}

.buy .bx_event {
    overflow: hidden;
    position: relative;
    padding: 50px 60px;
    border: 1px solid #f0f0f0;
    border-radius: 10px
}

.buy .bx_event .label {
    position: absolute;
    top: 0;
    left: 0;
    width: 120px;
    padding: 80px 0 7px 0;
    background-color: #4285F4;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
    color: #ffffff
}

.buy .bx_event .txt {
    display: inline-block;
    width: 500px;
    vertical-align: middle
}

.buy .bx_event .txt strong {
    display: block;
    font-size: 30px
}

.buy .bx_event .txt p {
    margin: 20px 0px 40px;
    line-height: 1.5;
    font-size: 15px;
    color: #999999
}

.buy .bx_event .info {
    display: inline-block;
    vertical-align: middle;
    margin-right: 60px
}

.buy .bx_event .info img {
    vertical-align: middle;
    max-width: 390px
}

@media (max-width: 1279px) {
    .buy .bx_event {
        padding: 50px 30px;
        text-align: center
    }

    .buy .bx_event .txt {
        padding-top: 00px;
        margin-right: 0px;
        width: 100%
    }

    .buy .bx_event .txt strong {
        font-size: 28px
    }

    .buy .bx_event .txt p {
        font-size: 16px
    }

    .buy .bx_event .info {
        width: 100%
    }

    .buy .bx_event .info img {
        margin-right: 0;
        display: block;
        margin: 0px auto 30px
    }

    .buy .bx_event .info .btn {
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .buy .bx_event {
        padding: 44px 5px 30px
    }

    .buy .bx_event .label {
        padding: 55px 0 0 0;
        line-height: 2;
        font-size: 12px
    }

    .buy .bx_event .txt {
        float: none;
        width: auto;
        padding-top: 0;
        margin: 0;
        font-size: 13px
    }

    .buy .bx_event .txt strong {
        line-height: 1.2;
        font-size: 18px;
        margin-top: 0
    }

    .buy .bx_event .txt p {
        margin: 15px 0 20px;
        font-size: 12px
    }

    .buy .bx_event .info {
        width: 100%;
        float: none;
        margin: 0
    }

    .buy .bx_event .info img {
        display: block;
        width: 92%;
        max-width: 390px;
        margin: 0 auto 34px
    }

    .buy .bx_event .info .btn {
        margin-top: 20px
    }
}

.buy .bx_ico+.bx_ico {
    margin-top: 10px
}

.buy .bx_ico+h3 {
    margin-top: 80px
}

.buy .bx_ico+.mb_hidden h3 {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .buy .bx_ico+.mb_hidden h3 {
        margin-top: 70px
    }
}

@media (max-width: 1279px) {
    .buy .bx_ico+h3 {
        margin-top: 70px
    }
}

@media (max-width: 767px) {
    .buy .bx_ico+h3 {
        margin-top: 40px
    }
}

.buy .bottom_bnr {
    margin: 30px 0 71px
}

@media (max-width: 1279px) {
    .buy .bottom_bnr {
        margin-bottom: 51px
    }
}

@media (max-width: 767px) {
    .buy .bottom_bnr {
        margin: 20px -6.25% 50px
    }
}

.buy .bx_pay {
    border-top: 1px solid #222222;
    border-bottom: 1px solid #f0f0f0;
    overflow: hidden;
    padding: 30px 0
}

@media (max-width: 767px) {
    .buy .bx_pay {
        padding: 25px 0
    }
}

.buy .bx_pay .left {
    display: table-cell;
    vertical-align: middle;
    width: 545px;
    padding: 0 0 0 20px;
    text-align: center
}

.buy .bx_pay .left img {
    width: 100%;
    max-width: 400px
}

@media (max-width: 1279px) {
    .buy .bx_pay .left {
        width: 417px;
        padding: 0 74px 0 20px
    }
}

@media (max-width: 767px) {
    .buy .bx_pay .left {
        display: block;
        width: auto;
        padding: 0 5%;
        margin-bottom: 18px
    }
}

.buy .bx_pay .right {
    display: table-cell;
    width: 515px
}

.buy .bx_pay .right .tit {
    display: block;
    font-size: 26px;
    line-height: 1.4
}

.buy .bx_pay .right .tit+.txt_pro {
    margin-top: 14px
}

.buy .bx_pay .right .tit+p {
    margin-top: 40px
}

.buy .bx_pay .right .total {
    padding: 11px 20px 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (max-width: 1279px) {
    .buy .bx_pay .right {
        padding-right: 18px
    }

    .buy .bx_pay .right .tit {
        font-size: 22px
    }

    .buy .bx_pay .right .tit+.txt_pro {
        margin-top: 24px
    }

    .buy .bx_pay .right .tit+p {
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .buy .bx_pay .right {
        display: block;
        width: auto;
        padding: 0;
        text-align: center
    }

    .buy .bx_pay .right .tit {
        width: 90%;
        margin: 0 auto;
        font-size: 18px
    }

    .buy .bx_pay .right .tit+.txt_pro {
        margin: 20px auto 25px
    }

    .buy .bx_pay .right p {
        margin: 0 auto;
        width: 60%;
        min-width: 220px
    }

    .buy .bx_pay .right .total {
        width: 90%;
        padding: 13px 20px 13px
    }
}

.buy .bx_pay .right .txt_pro {
    display: block;
    margin-bottom: 50px;
    font-size: 15px;
    line-height: 1.7
}

@media (max-width: 1279px) {
    .buy .bx_pay .right .txt_pro {
        margin-bottom: 26px
    }
}

.buy .bx_pay .right .pay {
    margin-bottom: 30px;
    text-align: right;
    line-height: 1
}

.buy .bx_pay .right .pay span {
    float: left;
    color: #999999
}

.buy .bx_pay .right .pay .tag {
    color: #999999;
    float: none;
    display: block;
    margin-top: 5px
}

@media (max-width: 1279px) {
    .buy .bx_pay .right .pay {
        margin-bottom: 17px;
        font-size: 18px;
        line-height: 1.2
    }
}

@media (max-width: 767px) {
    .buy .bx_pay .right .pay {
        margin-bottom: 13px;
        font-size: 15px;
        width: 90%
    }

    .buy .bx_pay .right .pay+.pay {
        margin-bottom: 20px
    }
}

.buy .bx_pay .bx_ipt {
    margin-bottom: 30px
}

.buy .bx_pay .bx_ipt .ipt {
    width: 242px;
    height: 40px;
    margin-right: 9px;
    vertical-align: middle
}

.buy .bx_pay .bx_ipt .btn {
    vertical-align: middle;
    width: 90px;
    padding: 10px 10px 12px
}

.buy .bx_pay .bx_ipt .txt_alert.err {
    margin-bottom: 0
}

@media (max-width: 1279px) {
    .buy .bx_pay .bx_ipt {
        margin-bottom: 20px
    }

    .buy .bx_pay .bx_ipt .ipt {
        width: calc(100% - 102px)
    }
}

@media (max-width: 767px) {
    .buy .bx_pay .bx_ipt {
        height: auto
    }

    .buy .bx_pay .bx_ipt .ipt {
        display: inline-block;
        width: calc(90% - 88px) !important
    }

    .buy .bx_pay .bx_ipt .txt_alert {
        width: 93%;
        margin: 10px auto 0
    }

    .buy .bx_pay .bx_ipt .btn {
        padding: 12px 5px 13px;
        width: 75px
    }
}

.buy .bx_pay.upgrade {
    background-color: #fdfdfd;
    text-align: center;
    padding-left: 15px;
    padding-right: 15px
}

.buy .bx_pay.upgrade p {
    line-height: 1.3
}

.buy .bx_pay.upgrade h3 {
    margin-bottom: 25px;
    font-weight: 600
}

.buy .bx_pay.upgrade .wrap_ipt {
    margin-top: 30px;
    display: inline-block;
    max-width: 380px;
    width: 100%;
    text-align: left
}

.buy .bx_pay.upgrade .wrap_ipt .ipt {
    width: 100%
}

.buy .bx_pay.upgrade .wrap_ipt .ipt+.ipt {
    margin-top: 10px
}

.buy .bx_pay.upgrade+.bx_ico {
    margin-top: 30px
}

.buy .bx_pay.upgrade+.bx_ico img {
    width: 43px
}

.buy .bx_pay.complete {
    border: 0;
    padding-top: 160px;
    text-align: center;
    font-size: 32px;
    background: #f7f7f7 url("//dreamgreen.co.kr/assets/ui/img/common/bu_complete.svg") no-repeat 50% 50px;
    background-size: 83px 80px
}

.buy .bx_pay.complete .total {
    display: inline-block;
    padding: 5px 20px;
    margin-top: 20px
}

.buy .bx_pay.complete .total span {
    line-height: 1.5
}

.buy .bx_pay.complete .total strong,
.buy .bx_pay.complete .total output {
    margin-left: 10px;
    font-size: 18px;
    line-height: 1.5
}

.buy .bx_pay+h3,
.buy .bx_pay+form h3 {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .buy .bx_pay.complete {
        padding: 130px 0 40px 0;
        margin-top: 90px;
        background-position: 50% 30px;
        background-size: 70px 70px
    }

    .buy .bx_pay+h3 {
        margin-top: 60px
    }
}

@media (max-width: 767px) {
    .buy .bx_pay.complete {
        margin-top: 0;
        padding: 85px 0 20px 0;
        background-position: 50% 20px;
        background-size: 50px 50px;
        font-size: 14px
    }

    .buy .bx_pay.complete .total {
        margin-top: 5px
    }

    .buy .bx_pay.complete .total strong,
    .buy .bx_pay.complete .total output {
        font-size: 14px
    }

    .buy .bx_pay+h3 {
        margin-top: 32px
    }

    .buy .bx_pay.upgrade p {
        font-size: 14px
    }
}

.buy .bx_notice.i_pay {
    padding: 30px 0 60px;
    border-bottom: 1px solid #f0f0f0
}

@media (max-width: 1279px) {
    .buy .bx_notice.i_pay {
        padding: 20px 0 50px
    }
}

@media (max-width: 767px) {
    .buy .bx_notice.i_pay {
        padding: 20px 0
    }
}

.buy .btn_fold {
    position: relative;
    cursor: pointer
}

.buy .btn_fold h4 {
    display: none
}

@media (max-width: 767px) {
    .buy .btn_fold {
        margin-top: 20px;
        border-bottom: 1px solid #f0f0f0
    }

    .buy .btn_fold h4 {
        display: block;
        padding: 6px 0;
        line-height: 2
    }

    .buy .btn_fold+.bx_notice {
        display: none
    }

    .buy .btn_fold :after {
        top: 50%;
        right: 5px;
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 8px;
        height: 8px;
        -webkit-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        -ms-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        margin-top: -2px;
        border-top: none;
        border-left: none;
        border-right: 4px solid #222222;
        border-bottom: 4px solid #222222
    }

    .buy .btn_fold.on :after {
        content: '';
        position: absolute;
        display: block;
        vertical-align: middle;
        width: 8px;
        height: 8px;
        -webkit-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        -ms-transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        transform: translate(-50%, -50%) scale(1, 0.83333) rotate(45deg);
        margin-top: 2px;
        border-top: 4px solid #222222;
        border-left: 4px solid #222222;
        border-right: none;
        border-bottom: none
    }

    .buy .btn_fold.on+.bx_notice {
        display: block
    }
}

.buy .tooltip {
    width: 445px !important
}

.buy .tooltip strong {
    display: block;
    margin-bottom: 20px;
    font-size: 15px;
    color: #222222
}

.buy .tooltip li {
    margin-bottom: 20px
}

.buy .tooltip table td {
    padding: 16px 40px 0 40px;
    line-height: 1.2
}

.buy .tooltip table td:last-child {
    text-align: right
}

.buy .tooltip table tr:last-child td {
    padding-bottom: 20px
}

.buy .tooltip .btn_close {
    position: absolute;
    display: block;
    width: 27px;
    height: 27px;
    text-indent: -2000em;
    font-size: 1px;
    overflow: hidden;
    top: 10px;
    right: 10px;
    border: 1px solid #222222;
    background-color: #ffffff;
    cursor: pointer
}

.buy .tooltip .btn_close:before,
.buy .tooltip .btn_close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    background-color: #222222
}

.buy .tooltip .btn_close:before {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.buy .tooltip .btn_close:after {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg)
}

.buy .popup,
.buy .pop_browser {
    line-height: 1.5
}

.buy .popup li,
.buy .pop_browser li {
    margin-bottom: 20px
}

.buy .popup table,
.buy .pop_browser table {
    width: 100%;
    border-top: 2px solid #222222;
    margin-bottom: 20px;
    text-align: center
}

.buy .popup table th,
.buy .pop_browser table th {
    padding: 8px 0;
    border-bottom: 1px solid #222222
}

.buy .popup table td,
.buy .pop_browser table td {
    border-bottom: 1px solid #f0f0f0;
    padding: 8px 0;
    line-height: 1.2;
    color: #999
}

@media (max-width: 767px) {

    .buy .popup,
    .buy .pop_browser {
        font-size: 14px
    }
}

@media (max-width: 767px) {
    .buy .bx_ico .info {
        padding-left: 0
    }
}

.buy .max_review {
    margin-top: 60px;
    padding: 25px 35px 30px 30px;
    text-align: left
}

.buy .max_review .bx_review {
    display: inline-block;
    text-align: left
}

.buy .max_review .tit {
    font-size: 15px;
    letter-spacing: -0.3px;
    margin-left: 30px;
    padding-top: 5px
}

.buy .max_review .tit strong {
    font-size: 18px;
    display: inline-block;
    margin-bottom: 10px
}

.buy .max_review .tit span {
    color: #4285F4
}

.buy .max_review .widget {
    max-width: 960px;
    margin: 20px auto 0;
    padding-top: 20px;
    border-top: 1px solid #DEDEDE
}

@media (max-width: 767px) {
    .buy .max_review {
        margin-top: 50px;
        text-align: center;
        padding: 30px 15px
    }

    .buy .max_review img {
        width: 100px
    }

    .buy .max_review .bx_review {
        display: block;
        text-align: center
    }

    .buy .max_review .bx_review {
        margin-top: 30px
    }

    .buy .max_review .tit {
        width: 100%;
        padding-top: 0;
        margin: 0 auto;
        font-size: 13px
    }

    .buy .max_review .tit strong {
        font-size: 15px
    }

    .buy .max_review .widget {
        border-top: none;
        padding-top: 0;
        margin-top: 35px
    }
}

/*마켓*/

.buy .bx_maket_pay {
    border-top: 1px solid var(--table-top-border);
    border-bottom: 1px solid #f0f0f0;
    overflow: hidden;
    padding: 10px 0
}

.confirm_message {
    text-align: center;
    vertical-align: middle;
    margin: 50px 5% 50px 5%;
}

.confirm_message h1 {
    font-size: 32px;
    font-weight: 600;
    padding-bottom: 0px;
    margin: 50px 0 40px 0;
}

.confirm_message p {
    font-size: 18px;
}

.confirm_message .receipt {
    margin-top: 20px;
    cursor: pointer;
}

@media (max-width: 767px) {
    .buy .bx_maket_pay {
        padding: 10px 0
    }
}

.buy .bx_maket_pay .left {
    display: table-cell;
    /*vertical-align: middle;*/
    width: 545px;
    padding: 0 20px 0 0;
    text-align: center
}

.buy .bx_maket_pay .left .thumbnails {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    overflow-x: auto;
    overflow-y: hidden;
    height: 5%;
    z-index: 30;
    margin-top: 20px;
    /* border-left: 6px solid black; */
    scroll-snap-type: mandatory;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.buy .bx_maket_pay .left .thumbnails label {
    padding-bottom: 5px;
}

.buy .bx_maket_pay .left .thumbnails .thumbnailImage {
    margin: 0 5px 0 0;
    -moz-scroll-snap-align: start;
    -ms-scroll-snap-align: start;
    scroll-snap-align: start;
    max-width: 25%;
    cursor: pointer;
}

.buy .bx_maket_pay .left .thumbnails .thumbnailImage .thumbnail_responsive {
    width: 80px;
    max-width: 100px
}

.buy .tbl th {
    padding: 14px 10px 14px 20px;
    background-color: var(--th-bg);
}

.buy .tbl .certi_mark {
    float: left;
    padding: 5px 20px 0 0;
}

.buy .tbl .haccp_info {
    margin-top: 0px;
}

.buy .tbl .certi_mark .ico {
    overflow: hidden;
    width: 26px;
    height: 40px;
    display: inline-block;
    background: url(//dreamgreen.co.kr/assets/ui/img/common/sp_mark.png) no-repeat;
    color: transparent;
    font-size: 1px;
    line-height: 200px;
}

.buy .tbl .haccp_mark {
    float: left;
    padding: 5px 20px 0 0;
}

.buy .tbl .haccp_info {
    margin-top: 12px;
}

.buy .tbl .haccp_mark .ico {
    overflow: hidden;
    width: 40px;
    height: 40px;
    display: inline-block;
    background: url(//dreamgreen.co.kr/assets/ui/img/common/haccp_mafra.svg) no-repeat;
    background-size: 100%;
    color: transparent;
    font-size: 1px;
    line-height: 200px;
}

.buy .tbl .nwtxt_link  {
    text-decoration:underline;
    font-weight: bold;
}

.buy .bx_maket_pay .left img {
    width: 100%;
    /*max-width: 400px*/
}

@media (max-width: 1279px) {
    .buy .bx_maket_pay .left {
        width: 520px;
        padding: 0 20px 0 0;
        flex-wrap: wrap
    }
}

@media (max-width: 767px) {
    .buy .bx_maket_pay .left {
        display: block;
        width: auto;
        padding: 0 0%;
        margin-bottom: 18px
    }

    .buy .bx_maket_pay .left .thumbnails {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        height: 5%;
        z-index: 30;
        margin-top: 20px;
        /* border-left: 6px solid black; */
        scroll-snap-type: mandatory;
        -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    
}

.buy .bx_maket_pay .right {
    display: table-cell;
    width: 515px
}

.buy .bx_maket_pay .right h5.sub-title{
    font-weight: 200;
    font-size: 16px;
}

.buy .bx_maket_pay .right h5.star{
    font-weight: 100;
    font-size: 18px;
    padding-bottom: 30px;
    color: var(--emp);
}

.buy .bx_maket_pay .right .tit {
    display: block;
    font-size: 26px;
    line-height: 1.4
}

.buy .bx_maket_pay .right .tit+.txt_pro {
    margin-top: 14px
}

.buy .bx_maket_pay .right .tit+p {
    margin-top: 30px
}

.buy .bx_maket_pay .right .total {
    padding: 11px 20px 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

/*다이렉트*/
.buy .tbl .right {
    /*display: table-cell;*/
    width: 100%
}

.buy .tbl .right .tit {
    display: block;
    font-size: 26px;
    line-height: 1.4
}

.buy .tbl .right h5.sub-title {
    font-weight: 200;
    font-size: 16px;
}

.buy .tbl .right .tit+.txt_pro {
    margin-top: 14px
}

.buy .tbl .right .tit+p {
    margin-top: 30px
}

.buy .tbl .right .total {
    padding: 11px 20px 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.buy .tbl .right .pay {
    margin-bottom: 20px;
    text-align: right;
    line-height: 1;
    margin: 10px 10px 12px 8px;
}

.buy .tbl .right .mem_pay {
    margin-bottom: 10px;
    text-align: right;
    line-height: 1
}

.buy .tbl .right .pay span {
    float: left;
    color: #999999;
    font-size: 15px;
}

.buy .tbl .right .pay .dc_per {
    float: left;
    font-size: 12px;
    color: #e53c3a;
    padding: 0.2em 1px 0 1em;
}

.buy .tbl .right .pay .tag {
    color: #999999;
    float: none;
    display: block;
    margin-top: 5px
}

.buy .tbl .right .fa-angle-right {
    font-size: 10px;
    padding-right: 2px;
}

.buy .tbl .right .fa-credit-card {
    font-size: 18px;
    padding-right: 2px;
}

.buy .tbl .itemicon {
    width: 100%;
    /*height: 180px;*/
    margin-top: -4px;
    margin-right: 11px;
    border-radius: 15px;
}

.buy .tbl .membership {
    padding: 2px 10px 6px 10px;
    overflow: hidden;    
    background-color: var(--item-member_bg);
    border-color: var(--item-member_border);
    color: var(--heading-color);
    border-radius: 10px;
    margin-bottom: 20px;
    border-style: dashed;
    border-width: 2px;
}
/*다이렉스 끝*/

@media (max-width: 1279px) {
    .buy .bx_maket_pay .right {
        padding-right: 18px
    }

    .buy .bx_maket_pay .right .tit {
        font-size: 22px
    }

    .buy .bx_maket_pay .right .tit+.txt_pro {
        margin-top: 24px
    }

    .buy .bx_maket_pay .right .tit+p {
        margin-top: 20px
    }
}

@media (max-width: 767px) {
    .buy .bx_maket_pay .right {
        display: block;
        width: auto;
        padding: 0;
        text-align: center
    }

    .buy .bx_maket_pay .right .tit {
        width: 96%;
        margin: 0 auto;
        font-size: 18px
    }

    .buy .bx_maket_pay .right .tit+.txt_pro {
        margin: 20px auto 25px
    }

    .buy .bx_maket_pay .right p {
        margin: 0 auto;
        width: 60%;
        min-width: 220px
    }

    .buy .bx_maket_pay .right .total {
        width: 100%;
        padding: 13px 20px 13px
    }

    .buy .tbl .itemicon {
        width: 100%;
        height: 100%;
        margin: -4px 4px 4px 0;
        border-radius: 15px;
    }
}

.buy .bx_maket_pay .right .txt_pro {
    display: block;
    margin-bottom: 50px;
    font-size: 15px;
    line-height: 1.7
}

@media (max-width: 1279px) {
    .buy .bx_maket_pay .right .txt_pro {
        margin-bottom: 26px
    }
}

.discount {
    color:red;
}

.buy .bx_maket_pay .right .pay {
    margin-bottom: 20px;
    text-align: right;
    line-height: 1
}

.buy .bx_maket_pay .right .mem_pay {
    margin-bottom: 10px;
    text-align: right;
    line-height: 1
}

.buy .bx_maket_pay .right .pay span {
    float: left;
    color: #999999
}

.buy .bx_maket_pay .right .pay label {
    float: left;
    color: #999999;
    font-size: 18px;
    margin-top: 8px;
}

.buy .bx_maket_pay .right .pay .dc_per {
    float: left;
    font-size: 12px;
    color: #e53c3a;
    padding: 0.2em 1px 0 1em;
}

.buy .bx_maket_pay .right .pay .tag {
    color: #999999;
    float: none;
    display: block;
    margin-top: 5px
}

@media (max-width: 1279px) {
    .buy .bx_maket_pay .right .pay {
        margin-bottom: 17px;
        font-size: 18px;
        line-height: 1.2
    }
}

@media (max-width: 767px) {
    .buy .bx_maket_pay .right .pay {
        margin-bottom: 13px;
        font-size: 15px;
        width: 90%
    }
    .buy .bx_maket_pay .right .pay label {
        display: none;
        font-size: 15px;
    }
    .buy .bx_maket_pay .right .pay+.pay {
        margin-bottom: 20px
    }
}

.buy .bx_maket_pay .bx_ipt {
    margin-bottom: 30px
}

.buy .bx_maket_pay .bx_ipt .ipt {
    width: 412px;
    height: 40px;
    margin-right: 9px;
    vertical-align: middle
}

.buy .bx_maket_pay .bx_ipt .btn {
    vertical-align: middle;
    width: 90px;
    padding: 10px 10px 12px
}

.buy .bx_maket_pay .bx_ipt .txt_alert.err {
    margin-bottom: 0
}

@media (max-width: 1279px) {
    .buy .bx_maket_pay .bx_ipt {
        margin-bottom: 20px
    }

    .buy .bx_maket_pay .bx_ipt .ipt {
        width: calc(100% - 102px)
    }
}

@media (max-width: 767px) {
    .buy .bx_maket_pay .bx_ipt {
        height: auto
    }

    .buy .bx_maket_pay .bx_ipt .ipt {
        display: inline-block;
        width: calc(100% - 88px) !important
    }

    .buy .bx_maket_pay .bx_ipt .txt_alert {
        width: 93%;
        margin: 10px auto 0
    }

    .buy .bx_maket_pay .bx_ipt .btn {
        padding: 12px 5px 13px;
        width: 75px
    }
}

.buy .bx_maket_pay.upgrade {
    background-color: #fdfdfd;
    text-align: center;
    padding-left: 15px;
    padding-right: 15px
}

.buy .bx_maket_pay.upgrade p {
    line-height: 1.3
}

.buy .bx_maket_pay.upgrade h3 {
    margin-bottom: 25px;
    font-weight: 600
}

.buy .bx_maket_pay.upgrade .wrap_ipt {
    margin-top: 30px;
    display: inline-block;
    max-width: 380px;
    width: 100%;
    text-align: left
}

.buy .bx_maket_pay.upgrade .wrap_ipt .ipt {
    width: 100%
}

.buy .bx_maket_pay.upgrade .wrap_ipt .ipt+.ipt {
    margin-top: 10px
}

.buy .bx_maket_pay.upgrade+.bx_ico {
    margin-top: 30px
}

.buy .bx_maket_pay.upgrade+.bx_ico img {
    width: 43px
}



.buy .bx_maket_pay.complete {
    border: 0;
    padding-top: 160px;
    text-align: center;
    font-size: 32px;
    background: #f7f7f7 url("//dreamgreen.co.kr/assets/ui/img/common/bu_complete.svg") no-repeat 50% 50px;
    background-size: 83px 80px
}

.buy .bx_maket_pay.complete .total {
    display: inline-block;
    padding: 5px 20px;
    margin-top: 20px
}

.buy .bx_maket_pay.complete .total span {
    line-height: 1.5
}

.buy .bx_maket_pay.complete .total strong,
.buy .bx_maket_pay.complete .total output {
    margin-left: 10px;
    font-size: 18px;
    line-height: 1.5
}

.buy .bx_maket_pay+h3,
.buy .bx_maket_pay+form h3 {
    margin-top: 80px
}

@media (max-width: 1279px) {
    .buy .bx_maket_pay.complete {
        padding: 130px 0 40px 0;
        margin-top: 90px;
        background-position: 50% 30px;
        background-size: 70px 70px
    }

    .buy .bx_maket_pay+h3 {
        margin-top: 60px
    }
}

@media (max-width: 767px) {
    .buy .bx_maket_pay.complete {
        margin-top: 0;
        padding: 85px 0 20px 0;
        background-position: 50% 20px;
        background-size: 50px 50px;
        font-size: 14px
    }

    .buy .bx_maket_pay.complete .total {
        margin-top: 5px
    }

    .buy .bx_maket_pay.complete .total strong,
    .buy .bx_maket_pay.complete .total output {
        font-size: 14px
    }

    .buy .bx_maket_pay+h3 {
        margin-top: 32px
    }

    .buy .bx_maket_pay.upgrade p {
        font-size: 14px
    }
}
/*마켓 End*/

.ie8 .buy .bx_compare .bx,
.ie8 .buy .bx_step .bx {
    width: 48%
}

.ie8 .popup,
.ie8 .pop_browser {
    top: 50%;
    left: 50%
}

@media print {
    body {
        padding: 0 !important
    }

    header {
        display: none
    }

    footer {
        display: none
    }

    h2 {
        display: none
    }

    .location {
        display: none
    }

    .container {
        margin: 0 !important
    }

    .cnt_print {
        padding: 0;
        margin: 0 !important;
        background: none !important
    }

    .cnt_print .estimate {
        background: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        border: 0
    }

    .cnt_print .estimate .lst_estimate {
        padding: 0;
        margin: 0px !important;
        border: 0
    }

    .cnt_print .estimate .lst_estimate h3 {
        font-size: 50px
    }

    .cnt_print .estimate .lst_estimate .date {
        top: 0;
        right: 0
    }

    .cnt_print .btns {
        display: none
    }

    .sub_f.print2 {
        min-width: inherit;
        line-height: 1.5
    }

    .sub_f.print2 .cnt_print2 {
        padding: 0;
        background: none;
        color: #222
    }

    .sub_f.print2 .cnt_print2 .btns {
        display: none
    }

    .sub_f.print2 .cnt_print2 .half {
        padding-top: 62px
    }

    .sub_f.print2 .cnt_print2 .estimate {
        width: 100%;
        margin: 0;
        padding: 0;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .sub_f.print2 .cnt_print2 .estimate h4 {
        font-size: 15px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate {
        padding: 20px 0 0;
        margin: 0px !important;
        border: 0
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate h3 {
        font-size: 50px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .date {
        top: 0;
        right: 0;
        margin-top: 25px;
        font-size: 12px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .lst,
    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .lst2 {
        font-size: 12px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .lst2 {
        margin-top: 50px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board th,
    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board td {
        font-size: 13px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .tbl_board th .unit {
        font-size: 10px
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate address {
        margin: 50px auto 0
    }

    .sub_f.print2 .cnt_print2 .estimate .lst_estimate .noti {
        font-size: 12px
    }
}

.txt_editer p {
    display: block;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1__qem;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    color: var(--heading-color);
}

.txt_editer center {
    display: block;
    text-align: center
}

.txt_editer hr {
    display: block;
    -webkit-margin-before: 0.5em;
    -webkit-margin-after: 0.5em;
    -webkit-margin-start: auto;
    -webkit-margin-end: auto;
    border-style: inset;
    border-width: 1px
}

.txt_editer video {
    -o-object-fit: contain;
    object-fit: contain
}

.txt_editer h1 {
    display: block;
    font-size: 2em;
    -webkit-margin-before: 0.67__qem;
    -webkit-margin-after: 0.67em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer :matches(article, aside, nav, section) h1 {
    font-size: 1.5em;
    -webkit-margin-before: 0.83__qem;
    -webkit-margin-after: 0.83em
}

.txt_editer :matches(article, aside, nav, section) :matches(article, aside, nav, section) h1 {
    font-size: 1.17em;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1em
}

.txt_editer :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) h1 {
    font-size: 1.00em;
    -webkit-margin-before: 1.33__qem;
    -webkit-margin-after: 1.33em
}

.txt_editer :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) h1 {
    font-size: .83em;
    -webkit-margin-before: 1.67__qem;
    -webkit-margin-after: 1.67em
}

.txt_editer :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) :matches(article, aside, nav, section) h1 {
    font-size: .67em;
    -webkit-margin-before: 2.33__qem;
    -webkit-margin-after: 2.33em
}

.txt_editer h2 {
    display: block;
    font-size: 1.5em;
    -webkit-margin-before: 0.83__qem;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer h3 {
    display: block;
    font-size: 1.17em;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer h4 {
    display: block;
    -webkit-margin-before: 1.33__qem;
    -webkit-margin-after: 1.33em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer h5 {
    display: block;
    font-size: .83em;
    -webkit-margin-before: 1.67__qem;
    -webkit-margin-after: 1.67em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer h6 {
    display: block;
    font-size: .67em;
    -webkit-margin-before: 2.33__qem;
    -webkit-margin-after: 2.33em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    font-weight: 600
}

.txt_editer table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: gray
}

.txt_editer thead {
    display: table-header-group;
    vertical-align: middle;
    border-color: inherit
}

.txt_editer tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit
}

.txt_editer tfoot {
    display: table-footer-group;
    vertical-align: middle;
    border-color: inherit
}

.txt_editer table>tr {
    vertical-align: middle
}

.txt_editer col {
    display: table-column
}

.txt_editer colgroup {
    display: table-column-group
}

.txt_editer tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit
}

.txt_editer td,
.txt_editer th {
    display: table-cell;
    vertical-align: inherit
}

.txt_editer th {
    font-weight: 600
}

.txt_editer caption {
    display: table-caption;
    text-align: -webkit-center
}

.txt_editer ul,
.txt_editer menu,
.txt_editer dir {
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 40px;
    padding-left: 40px
}

.txt_editer ol {
    display: block;
    list-style-type: decimal;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 40px;
    padding-left: 40px
}

.txt_editer li {
    display: list-item;
    text-align: -webkit-match-parent
}

.txt_editer ul ul,
.txt_editer ol ul {
    list-style-type: circle
}

.txt_editer ol ol ul,
.txt_editer ol ul ul,
.txt_editer ul ol ul,
.txt_editer ul ul ul {
    list-style-type: square
}

.txt_editer dd {
    display: block;
    -webkit-margin-start: 40px
}

.txt_editer dl {
    display: block;
    -webkit-margin-before: 1__qem;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0
}

.txt_editer dt {
    display: block
}

.txt_editer ol ul,
.txt_editer ul ol,
.txt_editer ul ul,
.txt_editer ol ol {
    -webkit-margin-before: 0;
    -webkit-margin-after: 0
}

.txt_editer i,
.txt_editer cite,
.txt_editer em,
.txt_editer var,
.txt_editer address,
.txt_editer dfn,
.txt_editer blockquote {
    font-style: italic
}

.txt_editer .cke_editable {
    font-size: 13px;
    line-height: 1.6
}

/*
.txt_editer blockquote {
    font-style: italic;
    padding: 2px 0;
    border-style: solid;
    border-color: #ccc;
    border-width: 0;
    display: block;
    padding-left: 20px;
    padding-right: 8px;
    border-left-width: 5px
}
*/

.txt_editer blockquote {
    padding: 30px;
    border-left: 5px solid var(--blockquote-border);
    background: var(--blockquote-bg);
    margin: 50px 0;
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
    color: var(--heading-color);
    font-style: italic;
    border-radius: 6px;
}

.txt_editer .cke_contents_rtl blockquote {
    padding-left: 8px;
    padding-right: 20px;
    border-right-width: 5px
}

.txt_editer a {
    color: #0782C1
}

.txt_editer ol,
.txt_editer ul,
.txt_editer dl {
    *margin-right: 0px;
    padding: 0 40px
}

.txt_editer h1,
.txt_editer h2,
.txt_editer h3,
.txt_editer h4,
.txt_editer h5,
.txt_editer h6 {
    font-weight: normal;
    line-height: 1.2
}

.txt_editer hr {
    border: 0px;
    border-top: 1px solid #ccc
}

.txt_editer img.right {
    border: 1px solid #ccc;
    float: right;
    margin-left: 15px;
    padding: 5px
}

.txt_editer img.left {
    border: 1px solid #ccc;
    float: left;
    margin-right: 15px;
    padding: 5px
}

.txt_editer pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    -webkit-tab-size: 4;
    tab-size: 4
}

.txt_editer .marker {
    background-color: Yellow
}

.txt_editer span[lang] {
    font-style: italic
}

/*
.txt_editer figure {
    text-align: center;
    border: solid 1px #ccc;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.05);
    padding: 10px;
    margin: 10px 20px;
    display: inline-block
}
*/

.txt_editer figure>figcaption {
    text-align: center;
    display: block
}

.txt_editer a>img {
    padding: 1px;
    margin: 1px;
    border: none;
    outline: 1px solid #0782C1
}

@media (max-width: 1279px) {
    .txt_editer img {
        width: 100% !important;
        height: auto !important
    }
}

@media (max-width: 767px) {

    .txt_editer ul,
    .txt_editer menu,
    .txt_editer dir,
    .txt_editer ol {
        -webkit-padding-start: 18px;
        padding-left: 18px
    }

    .txt_editer blockquote {
        padding-left: 0px;
        margin-left: 0px
    }
}


html:lang(ko),
html:lang(ko) body {
    letter-spacing: -0.05rem
}

html:lang(ko) header .area_dep .dep3_goods .tit,
html:lang(ko) body header .area_dep .dep3_goods .tit {
    letter-spacing: -0.05rem
}

@media (min-width: 1279px) {

    html:lang(ko) .btn_qna_fix,
    html:lang(ko) body .btn_qna_fix {
        font-size: 14px
    }
}

html:lang(ja),
html:lang(ja) body {
    letter-spacing: -0.05rem;
    word-break: normal !important
}

html:lang(ja) header .area_dep .dep3_goods .tit,
html:lang(ja) body header .area_dep .dep3_goods .tit {
    letter-spacing: -0.05rem
}

.lang_en header .area_dep .dep3_goods .tit {
    letter-spacing: -0.02rem
}

.lang_js .member .container .chk_box {
    text-align: left
}

.lang_js .member .container .chk_box .item {
    margin-right: 0
}

.bottom_space {
    margin-bottom: 100px;
}

.bottom_space .txt {
    display: none;
}

@keyframes spin {
    from {
      transform: rotate(0);
    }
    to {
      transform: rotate(360deg);
    }
}


/*-- new_container --*/
.new_container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
  }
  
  @media (min-width: 576px) {
    .new_container {
      max-width: 100%;
      padding-right: 30px;
      padding-left: 30px;
      margin-right: auto;
      margin-left: auto;
    }
  }
  
  @media (min-width: 768px) {
    .new_container {
      max-width: 100%;
      padding-right: 25px;
      padding-left: 25px;
      margin-right: auto;
      margin-left: auto;
    }
  }
  
  @media (min-width: 992px) {
    .new_container {
      max-width: 960px;
      margin-right: auto;
      margin-left: auto;
    }
  }
  
  @media (min-width: 1200px) {
    .new_container {
      max-width: 1140px;
      margin-right: auto;
      margin-left: auto;
    }
  }
  
  @media (min-width: 1280px) {
    .new_container {
      max-width: 1200px;
    }
  }
  
/*-- //new_container --*/


/*col lwj*/

.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.mt-1,
.my-1 {
  margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
  margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
  margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
  margin-left: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.mt-3,
.my-3 {
  margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
  margin-right: 1rem !important;
}

.mb-3,
.my-3 {
  margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
  margin-left: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.mt-4,
.my-4 {
  margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-5,
.my-5 {
  margin-top: 1rem !important;
}

.mr-5,
.mx-5 {
  margin-right: 3rem !important;
}

.mb-5,
.my-5 {
  margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
  margin-left: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 0rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.m-n1 {
  margin: -0.25rem !important;
}

.mt-n1,
.my-n1 {
  margin-top: -0.25rem !important;
}

.mr-n1,
.mx-n1 {
  margin-right: -0.25rem !important;
}

.mb-n1,
.my-n1 {
  margin-bottom: -0.25rem !important;
}

.ml-n1,
.mx-n1 {
  margin-left: -0.25rem !important;
}

.m-n2 {
  margin: -0.5rem !important;
}

.mt-n2,
.my-n2 {
  margin-top: -0.5rem !important;
}

.mr-n2,
.mx-n2 {
  margin-right: -0.5rem !important;
}

.mb-n2,
.my-n2 {
  margin-bottom: -0.5rem !important;
}

.ml-n2,
.mx-n2 {
  margin-left: -0.5rem !important;
}

.m-n3 {
  margin: -1rem !important;
}

.mt-n3,
.my-n3 {
  margin-top: -1rem !important;
}

.mr-n3,
.mx-n3 {
  margin-right: -1rem !important;
}

.mb-n3,
.my-n3 {
  margin-bottom: -1rem !important;
}

.ml-n3,
.mx-n3 {
  margin-left: -1rem !important;
}

.m-n4 {
  margin: -1.5rem !important;
}

.mt-n4,
.my-n4 {
  margin-top: -1.5rem !important;
}

.mr-n4,
.mx-n4 {
  margin-right: -1.5rem !important;
}

.mb-n4,
.my-n4 {
  margin-bottom: -1.5rem !important;
}

.ml-n4,
.mx-n4 {
  margin-left: -1.5rem !important;
}

.m-n5 {
  margin: -3rem !important;
}

.mt-n5,
.my-n5 {
  margin-top: -3rem !important;
}

.mr-n5,
.mx-n5 {
  margin-right: -3rem !important;
}

.mb-n5,
.my-n5 {
  margin-bottom: -3rem !important;
}

.ml-n5,
.mx-n5 {
  margin-left: -3rem !important;
}

.m-auto {
  margin: auto !important;
}

.mt-auto,
.my-auto {
  margin-top: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.mb-auto,
.my-auto {
  margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

@media (min-width: 576px) {
  .m-sm-0 {
    margin: 0 !important;
  }

  .mt-sm-0,
  .my-sm-0 {
    margin-top: 0 !important;
  }

  .mr-sm-0,
  .mx-sm-0 {
    margin-right: 0 !important;
  }

  .mb-sm-0,
  .my-sm-0 {
    margin-bottom: 0 !important;
  }

  .ml-sm-0,
  .mx-sm-0 {
    margin-left: 0 !important;
  }

  .m-sm-1 {
    margin: 0.25rem !important;
  }

  .mt-sm-1,
  .my-sm-1 {
    margin-top: 0.25rem !important;
  }

  .mr-sm-1,
  .mx-sm-1 {
    margin-right: 0.25rem !important;
  }

  .mb-sm-1,
  .my-sm-1 {
    margin-bottom: 0.25rem !important;
  }

  .ml-sm-1,
  .mx-sm-1 {
    margin-left: 0.25rem !important;
  }

  .m-sm-2 {
    margin: 0.5rem !important;
  }

  .mt-sm-2,
  .my-sm-2 {
    margin-top: 0.5rem !important;
  }

  .mr-sm-2,
  .mx-sm-2 {
    margin-right: 0.5rem !important;
  }

  .mb-sm-2,
  .my-sm-2 {
    margin-bottom: 0.5rem !important;
  }

  .ml-sm-2,
  .mx-sm-2 {
    margin-left: 0.5rem !important;
  }

  .m-sm-3 {
    margin: 1rem !important;
  }

  .mt-sm-3,
  .my-sm-3 {
    margin-top: 1rem !important;
  }

  .mr-sm-3,
  .mx-sm-3 {
    margin-right: 1rem !important;
  }

  .mb-sm-3,
  .my-sm-3 {
    margin-bottom: 1rem !important;
  }

  .ml-sm-3,
  .mx-sm-3 {
    margin-left: 1rem !important;
  }

  .m-sm-4 {
    margin: 1.5rem !important;
  }

  .mt-sm-4,
  .my-sm-4 {
    margin-top: 1.5rem !important;
  }

  .mr-sm-4,
  .mx-sm-4 {
    margin-right: 1.5rem !important;
  }

  .mb-sm-4,
  .my-sm-4 {
    margin-bottom: 1.5rem !important;
  }

  .ml-sm-4,
  .mx-sm-4 {
    margin-left: 1.5rem !important;
  }

  .m-sm-5 {
    margin: 3rem !important;
  }

  .mt-sm-5,
  .my-sm-5 {
    margin-top: 3rem !important;
  }

  .mr-sm-5,
  .mx-sm-5 {
    margin-right: 3rem !important;
  }

  .mb-sm-5,
  .my-sm-5 {
    margin-bottom: 3rem !important;
  }

  .ml-sm-5,
  .mx-sm-5 {
    margin-left: 3rem !important;
  }

  .p-sm-0 {
    padding: 0 !important;
  }

  .pt-sm-0,
  .py-sm-0 {
    padding-top: 0 !important;
  }

  .pr-sm-0,
  .px-sm-0 {
    padding-right: 0 !important;
  }

  .pb-sm-0,
  .py-sm-0 {
    padding-bottom: 0 !important;
  }

  .pl-sm-0,
  .px-sm-0 {
    padding-left: 0 !important;
  }

  .p-sm-1 {
    padding: 0.25rem !important;
  }

  .pt-sm-1,
  .py-sm-1 {
    padding-top: 0.25rem !important;
  }

  .pr-sm-1,
  .px-sm-1 {
    padding-right: 0.25rem !important;
  }

  .pb-sm-1,
  .py-sm-1 {
    padding-bottom: 0.25rem !important;
  }

  .pl-sm-1,
  .px-sm-1 {
    padding-left: 0.25rem !important;
  }

  .p-sm-2 {
    padding: 0.5rem !important;
  }

  .pt-sm-2,
  .py-sm-2 {
    padding-top: 0.5rem !important;
  }

  .pr-sm-2,
  .px-sm-2 {
    padding-right: 0.5rem !important;
  }

  .pb-sm-2,
  .py-sm-2 {
    padding-bottom: 0.5rem !important;
  }

  .pl-sm-2,
  .px-sm-2 {
    padding-left: 0.5rem !important;
  }

  .p-sm-3 {
    padding: 1rem !important;
  }

  .pt-sm-3,
  .py-sm-3 {
    padding-top: 1rem !important;
  }

  .pr-sm-3,
  .px-sm-3 {
    padding-right: 1rem !important;
  }

  .pb-sm-3,
  .py-sm-3 {
    padding-bottom: 1rem !important;
  }

  .pl-sm-3,
  .px-sm-3 {
    padding-left: 1rem !important;
  }

  .p-sm-4 {
    padding: 1.5rem !important;
  }

  .pt-sm-4,
  .py-sm-4 {
    padding-top: 1.5rem !important;
  }

  .pr-sm-4,
  .px-sm-4 {
    padding-right: 1.5rem !important;
  }

  .pb-sm-4,
  .py-sm-4 {
    padding-bottom: 1.5rem !important;
  }

  .pl-sm-4,
  .px-sm-4 {
    padding-left: 1.5rem !important;
  }

  .p-sm-5 {
    padding: 3rem !important;
  }

  .pt-sm-5,
  .py-sm-5 {
    padding-top: 3rem !important;
  }

  .pr-sm-5,
  .px-sm-5 {
    padding-right: 3rem !important;
  }

  .pb-sm-5,
  .py-sm-5 {
    padding-bottom: 3rem !important;
  }

  .pl-sm-5,
  .px-sm-5 {
    padding-left: 3rem !important;
  }

  .m-sm-n1 {
    margin: -0.25rem !important;
  }

  .mt-sm-n1,
  .my-sm-n1 {
    margin-top: -0.25rem !important;
  }

  .mr-sm-n1,
  .mx-sm-n1 {
    margin-right: -0.25rem !important;
  }

  .mb-sm-n1,
  .my-sm-n1 {
    margin-bottom: -0.25rem !important;
  }

  .ml-sm-n1,
  .mx-sm-n1 {
    margin-left: -0.25rem !important;
  }

  .m-sm-n2 {
    margin: -0.5rem !important;
  }

  .mt-sm-n2,
  .my-sm-n2 {
    margin-top: -0.5rem !important;
  }

  .mr-sm-n2,
  .mx-sm-n2 {
    margin-right: -0.5rem !important;
  }

  .mb-sm-n2,
  .my-sm-n2 {
    margin-bottom: -0.5rem !important;
  }

  .ml-sm-n2,
  .mx-sm-n2 {
    margin-left: -0.5rem !important;
  }

  .m-sm-n3 {
    margin: -1rem !important;
  }

  .mt-sm-n3,
  .my-sm-n3 {
    margin-top: -1rem !important;
  }

  .mr-sm-n3,
  .mx-sm-n3 {
    margin-right: -1rem !important;
  }

  .mb-sm-n3,
  .my-sm-n3 {
    margin-bottom: -1rem !important;
  }

  .ml-sm-n3,
  .mx-sm-n3 {
    margin-left: -1rem !important;
  }

  .m-sm-n4 {
    margin: -1.5rem !important;
  }

  .mt-sm-n4,
  .my-sm-n4 {
    margin-top: -1.5rem !important;
  }

  .mr-sm-n4,
  .mx-sm-n4 {
    margin-right: -1.5rem !important;
  }

  .mb-sm-n4,
  .my-sm-n4 {
    margin-bottom: -1.5rem !important;
  }

  .ml-sm-n4,
  .mx-sm-n4 {
    margin-left: -1.5rem !important;
  }

  .m-sm-n5 {
    margin: -3rem !important;
  }

  .mt-sm-n5,
  .my-sm-n5 {
    margin-top: -3rem !important;
  }

  .mr-sm-n5,
  .mx-sm-n5 {
    margin-right: -3rem !important;
  }

  .mb-sm-n5,
  .my-sm-n5 {
    margin-bottom: -3rem !important;
  }

  .ml-sm-n5,
  .mx-sm-n5 {
    margin-left: -3rem !important;
  }

  .m-sm-auto {
    margin: auto !important;
  }

  .mt-sm-auto,
  .my-sm-auto {
    margin-top: auto !important;
  }

  .mr-sm-auto,
  .mx-sm-auto {
    margin-right: auto !important;
  }

  .mb-sm-auto,
  .my-sm-auto {
    margin-bottom: auto !important;
  }

  .ml-sm-auto,
  .mx-sm-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 768px) {
  .m-md-0 {
    margin: 0 !important;
  }

  .mt-md-0,
  .my-md-0 {
    margin-top: 0 !important;
  }

  .mr-md-0,
  .mx-md-0 {
    margin-right: 0 !important;
  }

  .mb-md-0,
  .my-md-0 {
    margin-bottom: 0 !important;
  }

  .ml-md-0,
  .mx-md-0 {
    margin-left: 0 !important;
  }

  .m-md-1 {
    margin: 0.25rem !important;
  }

  .mt-md-1,
  .my-md-1 {
    margin-top: 0.25rem !important;
  }

  .mr-md-1,
  .mx-md-1 {
    margin-right: 0.25rem !important;
  }

  .mb-md-1,
  .my-md-1 {
    margin-bottom: 0.25rem !important;
  }

  .ml-md-1,
  .mx-md-1 {
    margin-left: 0.25rem !important;
  }

  .m-md-2 {
    margin: 0.5rem !important;
  }

  .mt-md-2,
  .my-md-2 {
    margin-top: 0.5rem !important;
  }

  .mr-md-2,
  .mx-md-2 {
    margin-right: 0.5rem !important;
  }

  .mb-md-2,
  .my-md-2 {
    margin-bottom: 0.5rem !important;
  }

  .ml-md-2,
  .mx-md-2 {
    margin-left: 0.5rem !important;
  }

  .m-md-3 {
    margin: 1rem !important;
  }

  .mt-md-3,
  .my-md-3 {
    margin-top: 1rem !important;
  }

  .mr-md-3,
  .mx-md-3 {
    margin-right: 1rem !important;
  }

  .mb-md-3,
  .my-md-3 {
    margin-bottom: 1rem !important;
  }

  .ml-md-3,
  .mx-md-3 {
    margin-left: 1rem !important;
  }

  .m-md-4 {
    margin: 1.5rem !important;
  }

  .mt-md-4,
  .my-md-4 {
    margin-top: 1.5rem !important;
  }

  .mr-md-4,
  .mx-md-4 {
    margin-right: 1.5rem !important;
  }

  .mb-md-4,
  .my-md-4 {
    margin-bottom: 1.5rem !important;
  }

  .ml-md-4,
  .mx-md-4 {
    margin-left: 1.5rem !important;
  }

  .m-md-5 {
    margin: 3rem !important;
  }

  .mt-md-5,
  .my-md-5 {
    margin-top: 3rem !important;
  }

  .mr-md-5,
  .mx-md-5 {
    margin-right: 3rem !important;
  }

  .mb-md-5,
  .my-md-5 {
    margin-bottom: 3rem !important;
  }

  .ml-md-5,
  .mx-md-5 {
    margin-left: 3rem !important;
  }

  .p-md-0 {
    padding: 0 !important;
  }

  .pt-md-0,
  .py-md-0 {
    padding-top: 0 !important;
  }

  .pr-md-0,
  .px-md-0 {
    padding-right: 0 !important;
  }

  .pb-md-0,
  .py-md-0 {
    padding-bottom: 0 !important;
  }

  .pl-md-0,
  .px-md-0 {
    padding-left: 0 !important;
  }

  .p-md-1 {
    padding: 0.25rem !important;
  }

  .pt-md-1,
  .py-md-1 {
    padding-top: 0.25rem !important;
  }

  .pr-md-1,
  .px-md-1 {
    padding-right: 0.25rem !important;
  }

  .pb-md-1,
  .py-md-1 {
    padding-bottom: 0.25rem !important;
  }

  .pl-md-1,
  .px-md-1 {
    padding-left: 0.25rem !important;
  }

  .p-md-2 {
    padding: 0.5rem !important;
  }

  .pt-md-2,
  .py-md-2 {
    padding-top: 0.5rem !important;
  }

  .pr-md-2,
  .px-md-2 {
    padding-right: 0.5rem !important;
  }

  .pb-md-2,
  .py-md-2 {
    padding-bottom: 0.5rem !important;
  }

  .pl-md-2,
  .px-md-2 {
    padding-left: 0.5rem !important;
  }

  .p-md-3 {
    padding: 1rem !important;
  }

  .pt-md-3,
  .py-md-3 {
    padding-top: 1rem !important;
  }

  .pr-md-3,
  .px-md-3 {
    padding-right: 1rem !important;
  }

  .pb-md-3,
  .py-md-3 {
    padding-bottom: 1rem !important;
  }

  .pl-md-3,
  .px-md-3 {
    padding-left: 1rem !important;
  }

  .p-md-4 {
    padding: 1.5rem !important;
  }

  .pt-md-4,
  .py-md-4 {
    padding-top: 1.5rem !important;
  }

  .pr-md-4,
  .px-md-4 {
    padding-right: 1.5rem !important;
  }

  .pb-md-4,
  .py-md-4 {
    padding-bottom: 1.5rem !important;
  }

  .pl-md-4,
  .px-md-4 {
    padding-left: 1.5rem !important;
  }

  .p-md-5 {
    padding: 3rem !important;
  }

  .pt-md-5,
  .py-md-5 {
    padding-top: 3rem !important;
  }

  .pr-md-5,
  .px-md-5 {
    padding-right: 3rem !important;
  }

  .pb-md-5,
  .py-md-5 {
    padding-bottom: 3rem !important;
  }

  .pl-md-5,
  .px-md-5 {
    padding-left: 3rem !important;
  }

  .m-md-n1 {
    margin: -0.25rem !important;
  }

  .mt-md-n1,
  .my-md-n1 {
    margin-top: -0.25rem !important;
  }

  .mr-md-n1,
  .mx-md-n1 {
    margin-right: -0.25rem !important;
  }

  .mb-md-n1,
  .my-md-n1 {
    margin-bottom: -0.25rem !important;
  }

  .ml-md-n1,
  .mx-md-n1 {
    margin-left: -0.25rem !important;
  }

  .m-md-n2 {
    margin: -0.5rem !important;
  }

  .mt-md-n2,
  .my-md-n2 {
    margin-top: -0.5rem !important;
  }

  .mr-md-n2,
  .mx-md-n2 {
    margin-right: -0.5rem !important;
  }

  .mb-md-n2,
  .my-md-n2 {
    margin-bottom: -0.5rem !important;
  }

  .ml-md-n2,
  .mx-md-n2 {
    margin-left: -0.5rem !important;
  }

  .m-md-n3 {
    margin: -1rem !important;
  }

  .mt-md-n3,
  .my-md-n3 {
    margin-top: -1rem !important;
  }

  .mr-md-n3,
  .mx-md-n3 {
    margin-right: -1rem !important;
  }

  .mb-md-n3,
  .my-md-n3 {
    margin-bottom: -1rem !important;
  }

  .ml-md-n3,
  .mx-md-n3 {
    margin-left: -1rem !important;
  }

  .m-md-n4 {
    margin: -1.5rem !important;
  }

  .mt-md-n4,
  .my-md-n4 {
    margin-top: -1.5rem !important;
  }

  .mr-md-n4,
  .mx-md-n4 {
    margin-right: -1.5rem !important;
  }

  .mb-md-n4,
  .my-md-n4 {
    margin-bottom: -1.5rem !important;
  }

  .ml-md-n4,
  .mx-md-n4 {
    margin-left: -1.5rem !important;
  }

  .m-md-n5 {
    margin: -3rem !important;
  }

  .mt-md-n5,
  .my-md-n5 {
    margin-top: -3rem !important;
  }

  .mr-md-n5,
  .mx-md-n5 {
    margin-right: -3rem !important;
  }

  .mb-md-n5,
  .my-md-n5 {
    margin-bottom: -3rem !important;
  }

  .ml-md-n5,
  .mx-md-n5 {
    margin-left: -3rem !important;
  }

  .m-md-auto {
    margin: auto !important;
  }

  .mt-md-auto,
  .my-md-auto {
    margin-top: auto !important;
  }

  .mr-md-auto,
  .mx-md-auto {
    margin-right: auto !important;
  }

  .mb-md-auto,
  .my-md-auto {
    margin-bottom: auto !important;
  }

  .ml-md-auto,
  .mx-md-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 992px) {
  .m-lg-0 {
    margin: 0 !important;
  }

  .mt-lg-0,
  .my-lg-0 {
    margin-top: 0 !important;
  }

  .mr-lg-0,
  .mx-lg-0 {
    margin-right: 0 !important;
  }

  .mb-lg-0,
  .my-lg-0 {
    margin-bottom: 0 !important;
  }

  .ml-lg-0,
  .mx-lg-0 {
    margin-left: 0 !important;
  }

  .m-lg-1 {
    margin: 0.25rem !important;
  }

  .mt-lg-1,
  .my-lg-1 {
    margin-top: 0.25rem !important;
  }

  .mr-lg-1,
  .mx-lg-1 {
    margin-right: 0.25rem !important;
  }

  .mb-lg-1,
  .my-lg-1 {
    margin-bottom: 0.25rem !important;
  }

  .ml-lg-1,
  .mx-lg-1 {
    margin-left: 0.25rem !important;
  }

  .m-lg-2 {
    margin: 0.5rem !important;
  }

  .mt-lg-2,
  .my-lg-2 {
    margin-top: 0.5rem !important;
  }

  .mr-lg-2,
  .mx-lg-2 {
    margin-right: 0.5rem !important;
  }

  .mb-lg-2,
  .my-lg-2 {
    margin-bottom: 0.5rem !important;
  }

  .ml-lg-2,
  .mx-lg-2 {
    margin-left: 0.5rem !important;
  }

  .m-lg-3 {
    margin: 1rem !important;
  }

  .mt-lg-3,
  .my-lg-3 {
    margin-top: 1rem !important;
  }

  .mr-lg-3,
  .mx-lg-3 {
    margin-right: 1rem !important;
  }

  .mb-lg-3,
  .my-lg-3 {
    margin-bottom: 1rem !important;
  }

  .ml-lg-3,
  .mx-lg-3 {
    margin-left: 1rem !important;
  }

  .m-lg-4 {
    margin: 1.5rem !important;
  }

  .mt-lg-4,
  .my-lg-4 {
    margin-top: 1.5rem !important;
  }

  .mr-lg-4,
  .mx-lg-4 {
    margin-right: 1.5rem !important;
  }

  .mb-lg-4,
  .my-lg-4 {
    margin-bottom: 1.5rem !important;
  }

  .ml-lg-4,
  .mx-lg-4 {
    margin-left: 1.5rem !important;
  }

  .m-lg-5 {
    margin: 3rem !important;
  }

  .mt-lg-5,
  .my-lg-5 {
    margin-top: 3rem !important;
  }

  .mr-lg-5,
  .mx-lg-5 {
    margin-right: 3rem !important;
  }

  .mb-lg-5,
  .my-lg-5 {
    margin-bottom: 3rem !important;
  }

  .ml-lg-5,
  .mx-lg-5 {
    margin-left: 3rem !important;
  }

  .p-lg-0 {
    padding: 0 !important;
  }

  .pt-lg-0,
  .py-lg-0 {
    padding-top: 0 !important;
  }

  .pr-lg-0,
  .px-lg-0 {
    padding-right: 0 !important;
  }

  .pb-lg-0,
  .py-lg-0 {
    padding-bottom: 0 !important;
  }

  .pl-lg-0,
  .px-lg-0 {
    padding-left: 0 !important;
  }

  .p-lg-1 {
    padding: 0.25rem !important;
  }

  .pt-lg-1,
  .py-lg-1 {
    padding-top: 0.25rem !important;
  }

  .pr-lg-1,
  .px-lg-1 {
    padding-right: 0.25rem !important;
  }

  .pb-lg-1,
  .py-lg-1 {
    padding-bottom: 0.25rem !important;
  }

  .pl-lg-1,
  .px-lg-1 {
    padding-left: 0.25rem !important;
  }

  .p-lg-2 {
    padding: 0.5rem !important;
  }

  .pt-lg-2,
  .py-lg-2 {
    padding-top: 0.5rem !important;
  }

  .pr-lg-2,
  .px-lg-2 {
    padding-right: 0.5rem !important;
  }

  .pb-lg-2,
  .py-lg-2 {
    padding-bottom: 0.5rem !important;
  }

  .pl-lg-2,
  .px-lg-2 {
    padding-left: 0.5rem !important;
  }

  .p-lg-3 {
    padding: 1rem !important;
  }

  .pt-lg-3,
  .py-lg-3 {
    padding-top: 1rem !important;
  }

  .pr-lg-3,
  .px-lg-3 {
    padding-right: 1rem !important;
  }

  .pb-lg-3,
  .py-lg-3 {
    padding-bottom: 1rem !important;
  }

  .pl-lg-3,
  .px-lg-3 {
    padding-left: 1rem !important;
  }

  .p-lg-4 {
    padding: 1.5rem !important;
  }

  .pt-lg-4,
  .py-lg-4 {
    padding-top: 1.5rem !important;
  }

  .pr-lg-4,
  .px-lg-4 {
    padding-right: 1.5rem !important;
  }

  .pb-lg-4,
  .py-lg-4 {
    padding-bottom: 1.5rem !important;
  }

  .pl-lg-4,
  .px-lg-4 {
    padding-left: 1.5rem !important;
  }

  .p-lg-5 {
    padding: 3rem !important;
  }

  .pt-lg-5,
  .py-lg-5 {
    padding-top: 3rem !important;
  }

  .pr-lg-5,
  .px-lg-5 {
    padding-right: 3rem !important;
  }

  .pb-lg-5,
  .py-lg-5 {
    padding-bottom: 3rem !important;
  }

  .pl-lg-5,
  .px-lg-5 {
    padding-left: 1rem !important;
  }

  .m-lg-n1 {
    margin: -0.25rem !important;
  }

  .mt-lg-n1,
  .my-lg-n1 {
    margin-top: -0.25rem !important;
  }

  .mr-lg-n1,
  .mx-lg-n1 {
    margin-right: -0.25rem !important;
  }

  .mb-lg-n1,
  .my-lg-n1 {
    margin-bottom: -0.25rem !important;
  }

  .ml-lg-n1,
  .mx-lg-n1 {
    margin-left: -0.25rem !important;
  }

  .m-lg-n2 {
    margin: -0.5rem !important;
  }

  .mt-lg-n2,
  .my-lg-n2 {
    margin-top: -0.5rem !important;
  }

  .mr-lg-n2,
  .mx-lg-n2 {
    margin-right: -0.5rem !important;
  }

  .mb-lg-n2,
  .my-lg-n2 {
    margin-bottom: -0.5rem !important;
  }

  .ml-lg-n2,
  .mx-lg-n2 {
    margin-left: -0.5rem !important;
  }

  .m-lg-n3 {
    margin: -1rem !important;
  }

  .mt-lg-n3,
  .my-lg-n3 {
    margin-top: -1rem !important;
  }

  .mr-lg-n3,
  .mx-lg-n3 {
    margin-right: -1rem !important;
  }

  .mb-lg-n3,
  .my-lg-n3 {
    margin-bottom: -1rem !important;
  }

  .ml-lg-n3,
  .mx-lg-n3 {
    margin-left: -1rem !important;
  }

  .m-lg-n4 {
    margin: -1.5rem !important;
  }

  .mt-lg-n4,
  .my-lg-n4 {
    margin-top: -1.5rem !important;
  }

  .mr-lg-n4,
  .mx-lg-n4 {
    margin-right: -1.5rem !important;
  }

  .mb-lg-n4,
  .my-lg-n4 {
    margin-bottom: -1.5rem !important;
  }

  .ml-lg-n4,
  .mx-lg-n4 {
    margin-left: -1.5rem !important;
  }

  .m-lg-n5 {
    margin: -3rem !important;
  }

  .mt-lg-n5,
  .my-lg-n5 {
    margin-top: -3rem !important;
  }

  .mr-lg-n5,
  .mx-lg-n5 {
    margin-right: -3rem !important;
  }

  .mb-lg-n5,
  .my-lg-n5 {
    margin-bottom: -3rem !important;
  }

  .ml-lg-n5,
  .mx-lg-n5 {
    margin-left: -3rem !important;
  }

  .m-lg-auto {
    margin: auto !important;
  }

  .mt-lg-auto,
  .my-lg-auto {
    margin-top: auto !important;
  }

  .mr-lg-auto,
  .mx-lg-auto {
    margin-right: auto !important;
  }

  .mb-lg-auto,
  .my-lg-auto {
    margin-bottom: auto !important;
  }

  .ml-lg-auto,
  .mx-lg-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 1200px) {
  .m-xl-0 {
    margin: 0 !important;
  }

  .mt-xl-0,
  .my-xl-0 {
    margin-top: 0 !important;
  }

  .mr-xl-0,
  .mx-xl-0 {
    margin-right: 0 !important;
  }

  .mb-xl-0,
  .my-xl-0 {
    margin-bottom: 0 !important;
  }

  .ml-xl-0,
  .mx-xl-0 {
    margin-left: 0 !important;
  }

  .m-xl-1 {
    margin: 0.25rem !important;
  }

  .mt-xl-1,
  .my-xl-1 {
    margin-top: 0.25rem !important;
  }

  .mr-xl-1,
  .mx-xl-1 {
    margin-right: 0.25rem !important;
  }

  .mb-xl-1,
  .my-xl-1 {
    margin-bottom: 0.25rem !important;
  }

  .ml-xl-1,
  .mx-xl-1 {
    margin-left: 0.25rem !important;
  }

  .m-xl-2 {
    margin: 0.5rem !important;
  }

  .mt-xl-2,
  .my-xl-2 {
    margin-top: 0.5rem !important;
  }

  .mr-xl-2,
  .mx-xl-2 {
    margin-right: 0.5rem !important;
  }

  .mb-xl-2,
  .my-xl-2 {
    margin-bottom: 0.5rem !important;
  }

  .ml-xl-2,
  .mx-xl-2 {
    margin-left: 0.5rem !important;
  }

  .m-xl-3 {
    margin: 1rem !important;
  }

  .mt-xl-3,
  .my-xl-3 {
    margin-top: 1rem !important;
  }

  .mr-xl-3,
  .mx-xl-3 {
    margin-right: 1rem !important;
  }

  .mb-xl-3,
  .my-xl-3 {
    margin-bottom: 1rem !important;
  }

  .ml-xl-3,
  .mx-xl-3 {
    margin-left: 1rem !important;
  }

  .m-xl-4 {
    margin: 1.5rem !important;
  }

  .mt-xl-4,
  .my-xl-4 {
    margin-top: 1.5rem !important;
  }

  .mr-xl-4,
  .mx-xl-4 {
    margin-right: 1.5rem !important;
  }

  .mb-xl-4,
  .my-xl-4 {
    margin-bottom: 1.5rem !important;
  }

  .ml-xl-4,
  .mx-xl-4 {
    margin-left: 1.5rem !important;
  }

  .m-xl-5 {
    margin: 3rem !important;
  }

  .mt-xl-5,
  .my-xl-5 {
    margin-top: 3rem !important;
  }

  .mr-xl-5,
  .mx-xl-5 {
    margin-right: 3rem !important;
  }

  .mb-xl-5,
  .my-xl-5 {
    margin-bottom: 3rem !important;
  }

  .ml-xl-5,
  .mx-xl-5 {
    margin-left: 3rem !important;
  }

  .p-xl-0 {
    padding: 0 !important;
  }

  .pt-xl-0,
  .py-xl-0 {
    padding-top: 0 !important;
  }

  .pr-xl-0,
  .px-xl-0 {
    padding-right: 0 !important;
  }

  .pb-xl-0,
  .py-xl-0 {
    padding-bottom: 0 !important;
  }

  .pl-xl-0,
  .px-xl-0 {
    padding-left: 0 !important;
  }

  .p-xl-1 {
    padding: 0.25rem !important;
  }

  .pt-xl-1,
  .py-xl-1 {
    padding-top: 0.25rem !important;
  }

  .pr-xl-1,
  .px-xl-1 {
    padding-right: 0.25rem !important;
  }

  .pb-xl-1,
  .py-xl-1 {
    padding-bottom: 0.25rem !important;
  }

  .pl-xl-1,
  .px-xl-1 {
    padding-left: 0.25rem !important;
  }

  .p-xl-2 {
    padding: 0.5rem !important;
  }

  .pt-xl-2,
  .py-xl-2 {
    padding-top: 0.5rem !important;
  }

  .pr-xl-2,
  .px-xl-2 {
    padding-right: 0.5rem !important;
  }

  .pb-xl-2,
  .py-xl-2 {
    padding-bottom: 0.5rem !important;
  }

  .pl-xl-2,
  .px-xl-2 {
    padding-left: 0.5rem !important;
  }

  .p-xl-3 {
    padding: 1rem !important;
  }

  .pt-xl-3,
  .py-xl-3 {
    padding-top: 1rem !important;
  }

  .pr-xl-3,
  .px-xl-3 {
    padding-right: 1rem !important;
  }

  .pb-xl-3,
  .py-xl-3 {
    padding-bottom: 1rem !important;
  }

  .pl-xl-3,
  .px-xl-3 {
    padding-left: 1rem !important;
  }

  .p-xl-4 {
    padding: 1.5rem !important;
  }

  .pt-xl-4,
  .py-xl-4 {
    padding-top: 1.5rem !important;
  }

  .pr-xl-4,
  .px-xl-4 {
    padding-right: 1.5rem !important;
  }

  .pb-xl-4,
  .py-xl-4 {
    padding-bottom: 1.5rem !important;
  }

  .pl-xl-4,
  .px-xl-4 {
    padding-left: 1.5rem !important;
  }

  .p-xl-5 {
    padding: 3rem !important;
  }

  .pt-xl-5,
  .py-xl-5 {
    padding-top: 3rem !important;
  }

  .pr-xl-5,
  .px-xl-5 {
    padding-right: 3rem !important;
  }

  .pb-xl-5,
  .py-xl-5 {
    padding-bottom: 3rem !important;
  }

  .pl-xl-5,
  .px-xl-5 {
    padding-left: 3rem !important;
  }

  .m-xl-n1 {
    margin: -0.25rem !important;
  }

  .mt-xl-n1,
  .my-xl-n1 {
    margin-top: -0.25rem !important;
  }

  .mr-xl-n1,
  .mx-xl-n1 {
    margin-right: -0.25rem !important;
  }

  .mb-xl-n1,
  .my-xl-n1 {
    margin-bottom: -0.25rem !important;
  }

  .ml-xl-n1,
  .mx-xl-n1 {
    margin-left: -0.25rem !important;
  }

  .m-xl-n2 {
    margin: -0.5rem !important;
  }

  .mt-xl-n2,
  .my-xl-n2 {
    margin-top: -0.5rem !important;
  }

  .mr-xl-n2,
  .mx-xl-n2 {
    margin-right: -0.5rem !important;
  }

  .mb-xl-n2,
  .my-xl-n2 {
    margin-bottom: -0.5rem !important;
  }

  .ml-xl-n2,
  .mx-xl-n2 {
    margin-left: -0.5rem !important;
  }

  .m-xl-n3 {
    margin: -1rem !important;
  }

  .mt-xl-n3,
  .my-xl-n3 {
    margin-top: -1rem !important;
  }

  .mr-xl-n3,
  .mx-xl-n3 {
    margin-right: -1rem !important;
  }

  .mb-xl-n3,
  .my-xl-n3 {
    margin-bottom: -1rem !important;
  }

  .ml-xl-n3,
  .mx-xl-n3 {
    margin-left: -1rem !important;
  }

  .m-xl-n4 {
    margin: -1.5rem !important;
  }

  .mt-xl-n4,
  .my-xl-n4 {
    margin-top: -1.5rem !important;
  }

  .mr-xl-n4,
  .mx-xl-n4 {
    margin-right: -1.5rem !important;
  }

  .mb-xl-n4,
  .my-xl-n4 {
    margin-bottom: -1.5rem !important;
  }

  .ml-xl-n4,
  .mx-xl-n4 {
    margin-left: -1.5rem !important;
  }

  .m-xl-n5 {
    margin: -3rem !important;
  }

  .mt-xl-n5,
  .my-xl-n5 {
    margin-top: -3rem !important;
  }

  .mr-xl-n5,
  .mx-xl-n5 {
    margin-right: -3rem !important;
  }

  .mb-xl-n5,
  .my-xl-n5 {
    margin-bottom: -3rem !important;
  }

  .ml-xl-n5,
  .mx-xl-n5 {
    margin-left: -3rem !important;
  }

  .m-xl-auto {
    margin: auto !important;
  }

  .mt-xl-auto,
  .my-xl-auto {
    margin-top: auto !important;
  }

  .mr-xl-auto,
  .mx-xl-auto {
    margin-right: auto !important;
  }

  .mb-xl-auto,
  .my-xl-auto {
    margin-bottom: auto !important;
  }

  .ml-xl-auto,
  .mx-xl-auto {
    margin-left: auto !important;
  }
}
/* //col*/
/*main gallery */


.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

.col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.col-1 {
  flex: 0 0 8.33333%;
  max-width: 8.33333%;
}

.col-2 {
  flex: 0 0 16.66667%;
  max-width: 16.66667%;
}

.col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  flex: 0 0 33.33333%;
  max-width: 33.33333%;
}

.col-5 {
  flex: 0 0 41.66667%;
  max-width: 41.66667%;
}

.col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  flex: 0 0 58.33333%;
  max-width: 58.33333%;
}

.col-8 {
  flex: 0 0 66.66667%;
  max-width: 66.66667%;
}

.col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  flex: 0 0 83.33333%;
  max-width: 83.33333%;
}

.col-11 {
  flex: 0 0 91.66667%;
  max-width: 91.66667%;
}

.col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

.m-0 {
    margin: 0 !important;
  }
  
  .mt-0,
  .my-0 {
    margin-top: 0 !important;
  }
  
  .mr-0,
  .mx-0 {
    margin-right: 0 !important;
  }
  
  .mb-0,
  .my-0 {
    margin-bottom: 0 !important;
  }
  
  .ml-0,
  .mx-0 {
    margin-left: 0 !important;
  }
  
  .m-1 {
    margin: 0.25rem !important;
  }
  
  .mt-1,
  .my-1 {
    margin-top: 0.25rem !important;
  }
  
  .mr-1,
  .mx-1 {
    margin-right: 0.25rem !important;
  }
  
  .mb-1,
  .my-1 {
    margin-bottom: 0.25rem !important;
  }
  
  .ml-1,
  .mx-1 {
    margin-left: 0.25rem !important;
  }
  
  .m-2 {
    margin: 0.5rem !important;
  }
  
  .mt-2,
  .my-2 {
    margin-top: 0.5rem !important;
  }
  
  .mr-2,
  .mx-2 {
    margin-right: 0.5rem !important;
  }
  
  .mb-2,
  .my-2 {
    margin-bottom: 0.5rem !important;
  }
  
  .ml-2,
  .mx-2 {
    margin-left: 0.5rem !important;
  }
  
  .m-3 {
    margin: 1rem !important;
  }
  
  .mt-3,
  .my-3 {
    margin-top: 1rem !important;
    margin-left: 2rem !important;
  }
  
  .mr-3,
  .mx-3 {
    margin-right: 1rem !important;
  }
  
  .mb-3,
  .my-3 {
    margin-bottom: 1rem !important;
    margin-right: 2rem !important;
  }
  
  .ml-3,
  .mx-3 {
    margin-left: 1rem !important;
  }
  
  .m-4 {
    margin: 1.5rem !important;
  }
  
  .mt-4,
  .my-4 {
    margin-top: 1.5rem !important;
  }
  
  .mr-4,
  .mx-4 {
    margin-right: 1.5rem !important;
  }
  
  .mb-4,
  .my-4 {
    margin-bottom: 1.5rem !important;
  }
  
  .ml-4,
  .mx-4 {
    margin-left: 1.5rem !important;
  }
  
  .m-5 {
    margin: 3rem !important;
  }
  
  .mt-5,
  .my-5 {
    margin-top: 1rem !important;
  }
  
  .mr-5,
  .mx-5 {
    margin-right: 3rem !important;
  }
  
  .mb-5,
  .my-5 {
    margin-bottom: 3rem !important;
  }
  
  .ml-5,
  .mx-5 {
    margin-left: 3rem !important;
  }
  
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }

  .col-md-1 {
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }

  .col-md-2 {
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }

  .col-md-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-md-4 {
    /*
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
    */
    flex: 0 0 31%;
    max-width: 31%;
  }

  .col-md-5 {
    flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }

  .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-md-7 {
    flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }

  .col-md-8 {
    flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }

  .col-md-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-md-10 {
    flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }

  .col-md-11 {
    flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }

  .col-md-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  @media (min-width: 992px) {
    .m-lg-0 {
      margin: 0 !important;
    }
  
    .mt-lg-0,
    .my-lg-0 {
      margin-top: 0 !important;
    }
  
    .mr-lg-0,
    .mx-lg-0 {
      margin-right: 0 !important;
    }
  
    .mb-lg-0,
    .my-lg-0 {
      margin-bottom: 0 !important;
    }
  
    .ml-lg-0,
    .mx-lg-0 {
      margin-left: 0 !important;
    }
  
    .m-lg-1 {
      margin: 0.25rem !important;
    }
  
    .mt-lg-1,
    .my-lg-1 {
      margin-top: 0.25rem !important;
    }
  
    .mr-lg-1,
    .mx-lg-1 {
      margin-right: 0.25rem !important;
    }
  
    .mb-lg-1,
    .my-lg-1 {
      margin-bottom: 0.25rem !important;
    }
  
    .ml-lg-1,
    .mx-lg-1 {
      margin-left: 0.25rem !important;
    }
  
    .m-lg-2 {
      margin: 0.5rem !important;
    }
  
    .mt-lg-2,
    .my-lg-2 {
      margin-top: 0.5rem !important;
    }
  
    .mr-lg-2,
    .mx-lg-2 {
      margin-right: 0.5rem !important;
    }
  
    .mb-lg-2,
    .my-lg-2 {
      margin-bottom: 0.5rem !important;
    }
  
    .ml-lg-2,
    .mx-lg-2 {
      margin-left: 0.5rem !important;
    }
  
    .m-lg-3 {
      margin: 1rem !important;
    }
  
    .mt-lg-3,
    .my-lg-3 {
      margin-top: 1rem !important;
    }
  
    .mr-lg-3,
    .mx-lg-3 {
      margin-right: 1rem !important;
    }
  
    .mb-lg-3,
    .my-lg-3 {
      margin-bottom: 1rem !important;
    }
  
    .ml-lg-3,
    .mx-lg-3 {
      margin-left: 1rem !important;
    }
  
    .m-lg-4 {
      margin: 1.5rem !important;
    }
  
    .mt-lg-4,
    .my-lg-4 {
      margin-top: 1.5rem !important;
    }
  
    .mr-lg-4,
    .mx-lg-4 {
      margin-right: 1.5rem !important;
    }
  
    .mb-lg-4,
    .my-lg-4 {
      margin-bottom: 1.5rem !important;
    }
  
    .ml-lg-4,
    .mx-lg-4 {
      margin-left: 1.5rem !important;
    }
  
    .m-lg-5 {
      margin: 3rem !important;
    }
  
    .mt-lg-5,
    .my-lg-5 {
      margin-top: 3rem !important;
    }
  
    .mr-lg-5,
    .mx-lg-5 {
      margin-right: 3rem !important;
    }
  
    .mb-lg-5,
    .my-lg-5 {
      margin-bottom: 3rem !important;
    }
  
    .ml-lg-5,
    .mx-lg-5 {
      margin-left: 3rem !important;
    }
  
  }
  
  @media (min-width: 1200px) {
    .m-xl-0 {
      margin: 0 !important;
    }
  
    .mt-xl-0,
    .my-xl-0 {
      margin-top: 0 !important;
    }
  
    .mr-xl-0,
    .mx-xl-0 {
      margin-right: 0 !important;
    }
  
    .mb-xl-0,
    .my-xl-0 {
      margin-bottom: 0 !important;
    }
  
    .ml-xl-0,
    .mx-xl-0 {
      margin-left: 0 !important;
    }
  
    .m-xl-1 {
      margin: 0.25rem !important;
    }
  
    .mt-xl-1,
    .my-xl-1 {
      margin-top: 0.25rem !important;
    }
  
    .mr-xl-1,
    .mx-xl-1 {
      margin-right: 0.25rem !important;
    }
  
    .mb-xl-1,
    .my-xl-1 {
      margin-bottom: 0.25rem !important;
    }
  
    .ml-xl-1,
    .mx-xl-1 {
      margin-left: 0.25rem !important;
    }
  
    .m-xl-2 {
      margin: 0.5rem !important;
    }
  
    .mt-xl-2,
    .my-xl-2 {
      margin-top: 0.5rem !important;
    }
  
    .mr-xl-2,
    .mx-xl-2 {
      margin-right: 0.5rem !important;
    }
  
    .mb-xl-2,
    .my-xl-2 {
      margin-bottom: 0.5rem !important;
    }
  
    .ml-xl-2,
    .mx-xl-2 {
      margin-left: 0.5rem !important;
    }
  
    .m-xl-3 {
      margin: 1rem !important;
    }
  
    .mt-xl-3,
    .my-xl-3 {
      margin-top: 1rem !important;
    }
  
    .mr-xl-3,
    .mx-xl-3 {
      margin-right: 1rem !important;
    }
  
    .mb-xl-3,
    .my-xl-3 {
      margin-bottom: 1rem !important;
    }
  
    .ml-xl-3,
    .mx-xl-3 {
      margin-left: 1rem !important;
    }
  
    .m-xl-4 {
      margin: 1.5rem !important;
    }
  
    .mt-xl-4,
    .my-xl-4 {
      margin-top: 1.5rem !important;
    }
  
    .mr-xl-4,
    .mx-xl-4 {
      margin-right: 1.5rem !important;
    }
  
    .mb-xl-4,
    .my-xl-4 {
      margin-bottom: 1.5rem !important;
    }
  
    .ml-xl-4,
    .mx-xl-4 {
      margin-left: 1.5rem !important;
    }
  
    .m-xl-5 {
      margin: 3rem !important;
    }
  
    .mt-xl-5,
    .my-xl-5 {
      margin-top: 3rem !important;
    }
  
    .mr-xl-5,
    .mx-xl-5 {
      margin-right: 3rem !important;
    }
  
    .mb-xl-5,
    .my-xl-5 {
      margin-bottom: 3rem !important;
    }
  
    .ml-xl-5,
    .mx-xl-5 {
      margin-left: 3rem !important;
    }
  }

@media (min-width: 768px) {
    .col-md {
      flex-basis: 0;
      flex-grow: 1;
      max-width: 100%;
    }
  
    .col-md-auto {
      flex: 0 0 auto;
      width: auto;
      max-width: 100%;
    }
  
    .col-md-1 {
      flex: 0 0 8.33333%;
      max-width: 8.33333%;
    }
  
    .col-md-2 {
      flex: 0 0 16.66667%;
      max-width: 16.66667%;
    }
  
    .col-md-3 {
      flex: 0 0 25%;
      max-width: 25%;
    }
  
    .col-md-4 {
      /*
      flex: 0 0 33.33333%;
      max-width: 33.33333%;
      */
      flex: 0 0 29.5%;
      max-width: 29.5%;
    }
  
    .col-md-5 {
      flex: 0 0 41.66667%;
      max-width: 41.66667%;
    }
  
    .col-md-6 {
      flex: 0 0 50%;
      max-width: 50%;
    }
  
    .col-md-7 {
      flex: 0 0 58.33333%;
      max-width: 58.33333%;
    }
  
    .col-md-8 {
      flex: 0 0 66.66667%;
      max-width: 66.66667%;
    }
  
    .col-md-9 {
      flex: 0 0 75%;
      max-width: 75%;
    }
  
    .col-md-10 {
      flex: 0 0 83.33333%;
      max-width: 83.33333%;
    }
  
    .col-md-11 {
      flex: 0 0 91.66667%;
      max-width: 91.66667%;
    }
  
    .col-md-12 {
      flex: 0 0 100%;
      max-width: 100%;
    }         
  }

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.protfolio-item a {
    display: block;
}
.hover14 figure {
    position: relative;
    margin: 0px;
    overflow: hidden;
}
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
    display: block;
}
.hover14 figure::before {
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    transform: skewX(-25deg);
}
.img-fluid {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}

/* Preload images */
  
  .lightboxOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: black;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    opacity: 0.8;
    display: none;
  }
  
  .lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-weight: normal;
  }
  
  .lightbox .lb-image {
    display: block;
    height: auto;
    max-width: inherit;
    border-radius: 3px;
  }
  
  .lightbox a img {
    border: none;
  }
  
  .lb-outerContainer {
    position: relative;
    background-color: white;
    *zoom: 1;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 4px;
  }
  
  .lb-outerContainer:after {
    content: "";
    display: table;
    clear: both;
  }
  
  .lb-container {
    padding: 4px;
  }
  
  .lb-loader {
    position: absolute;
    top: 43%;
    left: 0;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
  }
  
  .lb-cancel {
    display: block;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    background: url(//dreamgreen.co.kr/assets/ui/img/common/loading-bar.gif) no-repeat;
  }
  
  .lb-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
  }
  
  .lb-container>.nav {
    left: 0;
  }
  
  .lb-nav a {
    outline: none;
    background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==");
  }
  
  .lb-prev,
  .lb-next {
    height: 100%;
    cursor: pointer;
    display: block;
  }
  
  .lb-nav a.lb-prev {
    width: 100px;
    float: left;
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/common/ico_sprite_prev.svg) 60px 48% no-repeat;
    background-size: 30px;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    transition: opacity 0.2s;
  }
  
  .lb-nav a.lb-prev:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 0.5;
  }
  
  .lb-nav a.lb-next {
    width: 100px;
    right: 0;
    float: right;
    background: var(--dark) url(//dreamgreen.co.kr/assets/ui/img/common/ico_sprite_next.svg) 10px 48% no-repeat;
    background-size: 30px;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    transition: opacity 0.2s;
  }
  
  .lb-nav a.lb-next:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 0.5;
  }
  
  .lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    *zoom: 1;
    width: 100%;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
  }
  
  .lb-dataContainer:after {
    content: "";
    display: table;
    clear: both;
  }
  
  .lb-data {
    padding: 0 4px;
    color: #ccc;
  }
  
  .lb-data .lb-details {
    width: 90%;
    float: left;
    text-align: left;
    line-height: 1.1em;
    margin-top: 1em;
  }
  
  .lb-data .lb-caption {
    font-size: 16px;
    line-height: 1.8em;
    color: #fff;
    letter-spacing: .5px;
  }
  
  .lb-data .lb-number {
    display: block;
    clear: left;
    padding-top: 1em;
    font-size: 1em;
    color: var(--secondary-color);
  }
  
  .lb-data .lb-close {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    margin-top: 1em;
    background: url(//dreamgreen.co.kr/assets/ui/img/common/ico_close_white.png) top right no-repeat;
    text-align: right;
    outline: none;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
    transition: opacity 0.2s;
  }
  
  .lb-data .lb-close:hover {
    cursor: pointer;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
  }
  
  @media screen and (max-width: 320px) {
    .lb-data .lb-details {
      width: 89%;
      margin-top: 1em;
    }
  
    .lb-data .lb-caption {
      font-size: 12px;
    }
  }
  
  .w3l-block {
    background-color: #f8f9fa;
  }
  
  .w3l-block h3 {
    font-size: 30px;
    font-weight: 400;
  }
  
  @media (max-width: 1080px) {
    .w3l-block h3 {
      font-size: 26px;
    }
  }
  
  @media (max-width: 1024px) {
    .w3l-block h3 {
      font-size: 24px;
    }
  }
  
  .protfolio-item a {
    display: block;
  }
  
  .hover14 figure {
    position: relative;
    margin: 0px;
    overflow: hidden;
  }
  
  .hover14 figure::before {
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    transform: skewX(-25deg);
  }
  
  .hover14 figure:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
  }
  
  @-webkit-keyframes shine {
    100% {
      left: 125%;
    }
  }
  
  @keyframes shine {
    100% {
      left: 100%;
    }
  }
  
  @media (max-width: 568px) {
    .protfolio-item {
      padding: 0 8px;
    }
  
    .galler-top {
      padding: 0 10px;
    }

    .col-md-4 {
        flex: 0 0 28.5%;
        max-width: 28.5%;
    }
  }
  
  @media (max-width: 767px) {
    .row {
        display: flex;
        flex-wrap: wrap;
        margin-right: 10px;
        margin-left: 10px;
    }
}

@media (max-width: 1279px) {
    .row {
        display: flex;
        flex-wrap: wrap;
        margin-right: 10px;
        margin-left: 10px;
    }
}
/* //main gallery */

.btn.youtube_video i{
    font-size: 26px;
    vertical-align: sub;
    padding-right: 5px;
}

/* modal mask*/
#mask {  
    position:absolute;  
    left:0;
    top:0;
    z-index:9000;  
    background-color:#000;  
    display:none;  
}


/*--알림설정--*/
/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    vertical-align:middle;
    margin: 0 1.5em 0 1.5em;
  }
  
  .switch-title {
    position: relative;
    display: inline-block;
    width: 40%;
    height: 34px;
    text-align:left;
    float: left;
    padding-top: 20px;
  }
  
  .switch-sub-title {
    position: relative;
    display: inline-block;
    width: 60%;
    height: 34px;
    float: right;
  }
  
  .switch-sub-title-item {
    margin: 0 2.1em 0 2.1em;
  }
  
  .switch-sub {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 34px;
    float: left;
  }
  
  /* Hide default HTML checkbox */
  .switch input {display:none;}
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: var(--light-toggle);
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }
  
  .slider p {
      margin:0px;
      display:inline-block;
      font-size:15px;
      font-weight:bold;
  }

  @media (max-width: 736px) {
  
    .switch {
      position: relative;
      display: inline-block;
      width: 43px;
      height: 25px;
      vertical-align: middle;
      margin: 0 0.5em 0 0.5em;
    }
  
    .slider:before {
      position: absolute;
      content: "";
      height: 18px;
      width: 18px;
      left: -4px;
      bottom: 4px;
      background-color: white;
      -webkit-transition: .4s;
      transition: .4s;
    }

    .profilebox .profileselect {
        font-size: 13px;
    }

    .profilebox .profileinput {
        font-size: 13px;
    }
  }
  /*--//알림설정--*/

  /* 프로필 이미지 */
  .profile_img {
    width: 52px;
    height: 52px;
    overflow: hidden;
    border-radius: 50%;
    float: right;
    background-size: 100%;
  }

  .profile_img.left {
    float: left;
  }

  .profilebox{
    padding: 1.2em 1.2em;
    display: flex;
    flex-direction: column;
  }

  .profilebox .profileselect{
    padding: 1.2em 1.2em;
    height: 70px;
    line-height: 26px;
    font-size: 15px;
    border: 1px solid var(--bg-border);
    background-color: var(--bg-light);
    outline: none;
    color: var(--heading-color);
    border-radius: 6px;
    margin-bottom: 20px;
  }

  .profilebox .profileinput{
    padding: 1.2em 1.2em;
    line-height: 26px;
    font-size: 15px;
    border: 1px solid var(--bg-border);
    background-color: var(--bg-light);
    outline: none;
    color: var(--heading-color);
    border-radius: 6px;
    margin-bottom: 20px;
  }

  .profilebox .profilepass {
    padding: 1.2em 1.2em;
    line-height: 26px;
    border: 1px solid var(--bg-border);
    background-color: var(--bg-light);
    outline: none;
    color: var(--heading-color);
    border-radius: 6px;
    margin-bottom: 0px;
  }

  .profilebox .txtpass {
    margin-right: 20px;
  }

  .profilebox .msgbox {
    display: inline-block;
  }
  
/* //프로필 이미지 */


/*-- reserv search*/
.searchbar-widget {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    padding-bottom: 10px;
}
.calendar-input {                        
    position: relative;
    width: 180px;
    margin-right: 10px;
    float: left;
}
.calendar-input i{                        
    position: absolute;
    right: 30px;
    top:16px;
    color: var(--para-color);
    cursor: pointer;
}

.search-input{
    position: relative;
    width: 250px;
    margin-right: 10px;
    float: left;
}
.search-input i{                        
    position: absolute;
    right: 30px;
    top:16px;
    font-size: 18px;
    color: var(--para-color);
    cursor: pointer;
}
.calendar-class, .search-class{
    color: var(--heading-color)
}
.searchcnt {
    font-size: 15px;
    padding-left: 10px;
}

@media (max-width: 736px) {
    .calendar-input {                        
        position: relative;
        width: 100%;
        margin-right: 10px;
        padding-bottom: 10px;
    }
    .search-input{
        position: relative;
        width: 100%;
        margin-right: 10px;
    }
    .pop-title{
        /*border-bottom:1px solid var(--dark) ;*/
        font-size: 18px;
    }
}
  /*-- //reserv search*/

.pop-title{
    /*border-bottom:1px solid var(--dark) ;*/
    font-size: 24px;
}

/* 예약 */
.display-list-row .list-item {
    background: #f7f7f7;
    border-radius: 10px;
    padding: 20px;
    margin-top: 14px;
}

/* kakao_adfit */
.kakao_adfit {
    margin: 0 auto;
    text-align: center;
}

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #777;
    border-radius: 10px;
    margin-left: 5px;
}

.pull-right {
    float: right!important;
    margin: 0;
}

.badge-primary {
    background-color: #03a9f4;
}

.pay_notice_ico{
    height: 30px;
    border-radius: 10px;
}

.applepay_notice{
    font-weight: bold;
    color: #000;
}

.fc_price{
    display:none;
    text-align: center;
}
.display-price-chk{
    text-align: right;
}
.reload{
    float: left;
    cursor: pointer;
    padding-right: 10px;
}
.reload .fa-solid{
    size: 18px;
    font-weight: 600;
}

.bx_goods .label {
    font-weight: 200 !important;
    border-radius: 4px;
}

.bx_goods .label {
    display: inline;
    padding: 0.1em 0.4em 0.2em 0.3em;
    font-size: 60%;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25em;
}

.bx_goods .label-info {
    background-color: #515046;
}

.bx_goods .label-info.blue {
    background-color: #258fff;
}
.bx_goods .label-info.red {
    background-color: #E0513A;
}
.bx_goods .label-info.green {
    background-color: #228B22;
}
.calendar .label, .display-price-chk i.label{
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

.calendar .label-NAVER, .display-price-chk i.label-NAVER{
    background-color: #5cb85c;
}
.calendar .label-ONDA, .display-price-chk i.label-ONDA {
    background-color: #000;
}
.calendar .label-CAMPVILLAGE, .display-price-chk i.label-CAMPVILLAGE {
    background-color: #337ab7;
}

.affiliate_msg .affiliate.logo img{
    height: 10px;
    padding-left: 6px;
}

.affiliate.logo img{
    height: 22px;
    padding-left: 6px;
}

.affiliate.title{
    size: 20px;
    padding-left: 6px;
}

@media (max-width: 1200px) {

    .affiliate.logo img{
        height: 20px;
    }
    .affiliate.title{
        size: 20px;
    }

}

@media (max-width: 768px) {
    .affiliate.logo img{
        height: 16px;
    }
    .affiliate.title{
        size: 16px;
    }
    
}

@media (max-width: 576px) {
    .affiliate.logo img{
        height: 14px;
    }
    .affiliate.title{
        size: 14px;
    }
}

.story_btnbox {
    text-align: center;
    margin-top: 30px;
}

.story_btn {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: 50px;
    padding: 0 20px;
    background: #0d6efd;
    border: 2px solid #0d6efd;
    border-radius: 5px;
    color: #fff;
    font-weight: 600;
    transition: 0.5s;
}

.story_btnbox a {
    color: #fff;
}

/* 첨부파일 & 링크 */
#bo_v_file,
#bo_v_link {
    margin-bottom: 10px;
}

#bo_v_file h2,
#bo_v_link h2 {
    text-align: left;
    padding: 10px 10px 8px;
    background: #f7f8f9;
    font-size: 14px;
    overflow: inherit;
    line-height: 1.5;
    margin-bottom: 0px;
    font-weight: 600;
}

#bo_v_file ul {
    margin-bottom: 10px;
}

#bo_v_file ul,
#bo_v_link ul {
    padding: 15px;
    border: 1px solid #ddd;
}

#bo_v_file li,
#bo_v_link li {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    -webkit-box-shadow: inherit;
    box-shadow: inherit;
    position: relative;
}

#bo_v_file li i,
#bo_v_link li i {
    margin-right: 8px;
}

#bo_v_file li i,
#bo_v_file a,
#bo_v_link li i,
#bo_v_link a {
    float: none;
    display: inline-block;
    font-size: 14px;
    color: #646873;
    word-break: break-all;
}

#bo_v_file .bo_v_file_cnt {
    display: block;
    font-size: 13px;
    text-align: right;
    color: #8c8d90;
}

#bo_v_link .bo_v_link_cnt {
    position: absolute;
    top: 0;
    right: 0;
    color: #8c8d90;
}

#bo_v_file .bo_v_file_list {
    display: block;
    text-align: left;
}

/* 첨부파일 & 링크 hover */
#bo_v_file li:hover,
#bo_v_link li:hover {
    color: #3e4046;
    border-color: #3e4046;
}

#bo_v_file li:hover i,
#bo_v_link li:hover i {
    color: #3e4046;
}

#bo_v_file li:hover .bo_v_file_cnt,
#bo_v_link li:hover .bo_v_link_cnt {
    color: #3e4046;
}

#bo_v_file a:focus,
#bo_v_file li:hover a,
#bo_v_file a:active,
#bo_v_link a:focus,
#bo_v_link li:hover a,
#bo_v_link a:active {
    color: #3e4046;
}

/* buda */
.gowun-batang-regular {
    font-family: "Gowun Batang", serif;
    font-weight: 400;
    font-style: normal;
}

/* 회사연혁 */
.history {
    margin-left: 50px;
}

.history h2 {
    position: relative;
    font-size: 33px;
    color: var(--heading-color);
    line-height: 1;
}

.history h2:before {
    content: "";
    position: absolute;
    left: -48px;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    height: 17px;
    border-radius: 100%;
    background: #fff;
    border: 5px solid var(--indigo);
    box-sizing: border-box;
}

.history div {
    position: relative;
    padding: 0 0 0 48px;
}

.history div:before {
    content: "";
    position: absolute;
    left: 8px;
    top: 0;
    width: 2px;
    height: 100%;
    background: #ddd;
}

.history div:first-child:before {
    top: 10px;
    height: calc(100% - 10px);
}


.history ol {
    padding: 20px 0 74px;
}

.history li {
    font-size: 17px;
    color: var(--heading-color);
    line-height: 29px;
}

.history li .history_month {
    font-weight: 600;
    display:inline-block;
    width: 30px;
}

.history li .history_content {
    color: var(--heading-color);
}

/* modal */
/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.8); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    background-color: var(--bg-color);
    margin: auto;
    padding: 0px;
    /*border: 2px solid var(--bg-border);*/
    position: fixed;
    top: 50%;
    left: 50%;
    width: 900px !important;
    max-height: 506px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

/* The Close Button */
.close {
    position: relative;
    color: #b3b3b3;
    float: right;
    width: 23px;
    height: 23px;
    font-size: 34px;
    padding-right: 5px;
    top:-60px;
    z-index: 9999; /* Sit on top */
}

.close:hover,
.close:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

@media (max-width: 1279px) {
    .modal-content {
        width: 50%;
    }
}

@media (max-width: 767px) {
    .modal-content {
        width: 95%;
    }
}
/* //modal */

/* new paging */
.new_paging {
    text-align: center;
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pagination > li {
  display: inline;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: var(--heading-color);
  text-decoration: none;
  background-color: var(--bg-color);
  border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
  margin-left: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  /*color: #482f8e;*/
  background-color: #eee;
  border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 2;
  color: #fff;
  cursor: default;
  background-color: #482f8e;
  border-color: #482f8e;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
  color: #ddd;
  cursor: not-allowed;
  background-color: var(--bg-color);
  border-color: #ddd;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 18px;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.pager {
  padding-left: 0;
  margin: 20px 0;
  text-align: center;
  list-style: none;
}
.pager li {
  display: inline;
}
.pager li > a,
.pager li > span {
  display: inline-block;
  padding: 5px 14px;
  background-color: var(--bg-color);
  border: 1px solid #ddd;
  border-radius: 15px;
}
.pager li > a:hover,
.pager li > a:focus {
  text-decoration: none;
  background-color: #eee;
}
.pager .next > a,
.pager .next > span {
  float: right;
}
.pager .previous > a,
.pager .previous > span {
  float: left;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
  color: #ddd;
  cursor: not-allowed;
  background-color: var(--bg-color);
}
/* //new paging */

#APIintroArea {
    max-width: 1080;
    text-align: center;
    font-size: 14px;
    color: var(--heading-color);
    padding: 150px;
    border: 1px solid var(--bg-border);
}


.bx_goods .wrap .bannerList {
    text-align: center;
}

.customer .container .right_cont .viewImg{
    max-width: 100%;
    border: 1px solid var(--bg-border);
    border-radius: 10px;
}

@media (max-width: 1279px) {
    #APIintroArea  {
        padding: 100px;
    }
    .customer .container .right_cont .viewImg{
        max-width: 50%;
        border: 1px solid var(--bg-border);
        border-radius: 10px;
    }    

}

@media (max-width: 767px) {
    #APIintroArea  {
        padding: 50px;
    }

    .customer .container .right_cont .viewImg{
        max-width: 100%;
        border: 1px solid var(--bg-border);
        border-radius: 10px;
    }    
}


/* main 슬라이딩 베너
/* 슬라이더 영역 */
.main .partner-box {
    padding: 50px 0 50px 0;
    border-top: 1px solid var(--bg-border);
}

.main .partner-box .wrap .item-slider {
    width: 100%;
    height: 30px;
    overflow: hidden;
    position: relative;
}

/* 전체 이미지 묶음 */
.main .partner-box .wrap .item-slider .image-box {
    display: flex;
    width: max-content;
    height: 100%;
    animation: bannermove 40s linear infinite;
}

/* 이미지 공통 */
.main .partner-box .wrap .item-slider .image-box img {
    height: 100%;
    margin-right: 80px;
}

/* 애니메이션 */
@keyframes bannermove {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
/* main 슬라이딩 베너


/* sub 슬라이딩 베너
/* 슬라이더 영역 */
.sub .partner-box {
    padding: 50px 0 50px 0;
    border-top: 1px solid var(--bg-border);
}

.sub .partner-box .wrap .item-slider {
    width: 100%;
    height: 25px;
    overflow: hidden;
    position: relative;
}

/* 전체 이미지 묶음 */
.sub .partner-box .wrap .item-slider .image-box {
    display: flex;
    width: max-content;
    height: 100%;
    animation: bannermove 40s linear infinite;
}

/* 이미지 공통 */
.sub .partner-box .wrap .item-slider .image-box img {
    height: 100%;
    margin-right: 80px;
}

/* 애니메이션 */
@keyframes bannermove {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
/* sub 슬라이딩 베너 */

@media (max-width: 1279px) {
    .main .partner-box .wrap .item-slider {
        width: 100%;
        height: 25px;
    }
    .main .partner-box .wrap .item-slider .image-box img {
        margin-right: 80px;
    }
    .sub .partner-box .wrap .item-slider {
        width: 100%;
        height: 25px;
    }
    .sub .partner-box .wrap .item-slider .image-box img {
        margin-right: 80px;
    }
}

@media (max-width: 767px) {
    .main .partner-box .wrap .item-slider {
        width: 100%;
        height: 20px;
    }
    .main .partner-box .wrap .item-slider .image-box img {
        margin-right: 50px;
    }
    .sub .partner-box .wrap .item-slider {
        width: 100%;
        height: 15px;
    } 
    .sub .partner-box .wrap .item-slider .image-box img {
        margin-right: 50px;
    }    
}