@charset "utf-8";
/* CSS Document */
.box0{ padding:0 2vw}
.box1{ width:1400px; margin:0 auto; max-width:94%}
.box1.Slide{ width: 1420px; margin: 0 auto; max-width: 94%;}
.box2{ width:1280px; margin:0 auto; max-width:94%}

.gnb li.m_hide{ display:none !important}
.gnb .mLink{ display:none; position:absolute; left:0; top:0; width:100%; height:100%; box-sizing:border-box; cursor:pointer}
body:not(.pop){ display:flex; flex-direction:column; min-height:100vh; min-height:calc(var(--vh, 1vh) * 100)}
.mobile{display: none;}


#header{ position: sticky; left:0; top:0; width:100%; z-index:1000; transition: transform 1s; background:#fff; border-bottom:1px solid transparent}
html:not(.main) #header{ border-color:#eee}
.headerT{ padding-top:calc(var(--headerH1) + var(--headerH2))}
#header .home_wrap{ background:var(--siteC)}
#header .home_wrap .wrapIn{ position:relative; display:flex; align-items:center; gap:2em; height:var(--headerH2)}
#header .home_wrap .link_wrap{ display:flex; align-items:center; gap:.5em;}
#header .home_wrap .link_wrap .st{ width:2em; height:2em; border-radius:2em; border:1px solid rgba(255,255,255,.5); display:flex; align-items:center; justify-content:center; color:#fff; gap:.5em}
#header .home_wrap .link_wrap .st .ico{ font-size:1.125em}
#header .home_wrap .link_wrap .st .tt{ font-size:.875em; font-weight:700}
#header .home_wrap .link_wrap .st .arrow{ font-size:1em}
#header .home_wrap .link_wrap .st.st1{ width:auto; padding:0 1.5em}
#header .home_wrap .link_wrap .st.c1{ background:#fff; color:var(--siteC)}
#header .home_wrap .mem_wrap{ display:flex; align-items:center; gap:2.5em; margin-left:auto}
#header .home_wrap .mem_wrap .st{ display:flex; align-items:center; gap:.5em; position:relative; color:#fff}
#header .home_wrap .mem_wrap .st .icoImg{ filter:brightness(0) invert(1); height:1.125em}
#header .home_wrap .mem_wrap .st .tt{ font-size:.875em; font-weight:800}
#header .home_wrap .mem_wrap .st .noW .no{ width:2.125em; height:2.125em; display:flex; align-items:center; justify-content:center; border-radius:50%; overflow:hidden; background:#fff; color:var(--siteC); font-size:.6875em; font-weight:800; letter-spacing:-1px; padding-right:1px; line-height:1}
#header .home_wrap .mem_wrap .moreW{ position:relative; z-index:1}
#header .home_wrap .mem_wrap .moreW .st:after{ content:"\e942"; font-family:xeicon}
#header .home_wrap .mem_wrap .moreW .listW{ position:absolute; left:50%; width:10em; padding:1em; transform:translate(-50%, 0); top:100%; background:#fff; border-radius:1em; box-shadow:0 0 1em rgba(0,0,0,.1); box-sizing:border-box; visibility:hidden; opacity:0; margin-top:1em; transition:.3s}
#header .home_wrap .mem_wrap .moreW.on .listW{visibility:visible; opacity:1; transition:.3s}
#header .home_wrap .mem_wrap .moreW .listW:before{ content:""; position:absolute; left:50%; top:0; width:1em; height:1em; background:#fff; transform:rotate(45deg) translate(-50%, 0); box-shadow:0 -.5em .5em rgba(0,0,0,.1)}
#header .home_wrap .mem_wrap .moreW .listW .list:not(:first-child){ border-top:1px solid #ddd; margin-top:.5em; padding-top:.25em}
#header .home_wrap .mem_wrap .moreW .listW .list > li > a{ font-weight:700; padding:.5em; text-align:center; display:block; font-size:.875em; opacity:.7; transition:.3s}
#header .home_wrap .mem_wrap .moreW .listW .list > li > a.point{ font-size:.938em; font-weight:800; opacity:1}
#header .home_wrap .mem_wrap .moreW .listW .list > li > a:hover{ opacity:1}

#header .top_wrap{ position:relative}
#header .top_wrap .wrapIn{ display:flex; align-items:center; gap:3em; height:var(--headerH1)}
#header .top_wrap .logo,
#header .top_wrap .logo a{ height:100%; display:flex; align-items:center}
#header .top_wrap .logo img{ height:45%; padding-bottom: 1em;}
#header .top_wrap .gnb_wrap{ flex:1 1 0; min-width:0; display:flex; align-items:center; gap:1em}
#header .top_wrap .all_wrap{ position:relative}
#header .top_wrap .all_wrap .allBtn{ width:2.875em; height:2.875em; border-radius:1em; display:flex; align-items:center; justify-content:center; box-shadow:0 0 1em rgba(0,0,0,.15); background:#fff}
#header .top_wrap .all_wrap .all{ visibility:hidden; opacity:0; position:absolute}
#header .top_wrap .menu_wrap{ flex:1 1 0; min-width:0;}
#header .top_wrap .menu_wrap .gnb{ justify-content:space-between}
#header .top_wrap .menu_wrap .gnb > li{ position:relative}
#header .top_wrap .menu_wrap .gnb > li a{ display:flex; align-items:center}
#header .top_wrap .menu_wrap .gnb > li .dp1{ height:var(--headerH1); padding:0 .5em}
#header .top_wrap .menu_wrap .gnb > li .dp1 .va{ font-size:1.125em; font-weight:700; position:relative}
html:not(.allOn) #header .top_wrap .menu_wrap .gnb > li:hover .dp1,
html:not(.allOn) #header .top_wrap .menu_wrap .gnb > li.on .dp1{ color:var(--siteC)}
html:not(.allOn) #header .top_wrap .menu_wrap .gnb > li.on .dp1 .va:after{ content:""; position:absolute; left:100%; bottom:100%; width:1em; height:1em; font-size:.375em; border-radius:50%; background:var(--siteC2)}
#header .top_wrap .menu_wrap .gnb > li .dp2{ box-sizing:border-box; flex-direction:column}
html:not(.allOn) #header .top_wrap .menu_wrap .gnb > li .dp2{ position:absolute; left:50%; top:100%; width:11em; transform:translate(-50%, -1px); border-top:3px solid #111; box-shadow:0 1em 1em rgba(0,0,0,.1); border-radius:0 0 1em 1em; padding:.5em 1.25em; background:#fff; visibility:hidden; opacity:0; margin-top:1em}
html:not(.allOn) #header .top_wrap .menu_wrap .gnb > li:hover .dp2{ visibility:visible; opacity:1; margin-top:0; transition:.3s}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li > a{ text-align:left; padding:.5em 0; color:#777; transition:.3s}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .va{ width:100%; box-sizing:border-box; font-size:.938em; display:flex; align-items:center; line-height:1.1}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .va .tt{ flex:1; min-width:0}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .va .arrow{ opacity:0; transform:translateX(.5em)}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .va .arrow:before{ content:"\e93f"}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li:hover > a{ color:#111}
#header .top_wrap .menu_wrap .gnb > li .dp2 > li:hover > a .va .arrow{ opacity:1}
#header .top_wrap .menu_wrap .gnb > li .dp3{ display:none}
#header .top_wrap .search_wrap{ width:14em; margin-left:auto}
#header .top_wrap .search_wrap .search{ border:1px solid transparent; background:#f5f5f5; overflow:hidden; display:flex; border-radius:3em}
#header .top_wrap .search_wrap .search .inp{border:none; box-sizing:border-box; background:none}
#header .top_wrap .search_wrap .search .inp.txt{ flex:1; min-width:0; font-size:.875em; padding:0 1.5em}
#header .top_wrap .search_wrap .search .inp.txt:-webkit-autofill {	-webkit-box-shadow: 0 0 0 1000px white inset; box-shadow: 0 0 0 1000px white inset; }
#header .top_wrap .search_wrap .search .inp.btn{ width:2.5em; height:2.5em; background:#222; color:#fff; border-radius:50%}

.m_search_wrap{ width:14em; margin-left:auto}
.m_search_wrap .search{ border:1px solid transparent; background:#f5f5f5; overflow:hidden; display:flex; border-radius:3em}
.m_search_wrap .search .inp{border:none; box-sizing:border-box; background:none}
.m_search_wrap .search .inp.txt{ flex:1; min-width:0; font-size:.875em; padding:0 1.5em}
.m_search_wrap .search .inp.txt:-webkit-autofill {	-webkit-box-shadow: 0 0 0 1000px white inset; box-shadow: 0 0 0 1000px white inset; }
.m_search_wrap .search .inp.btn{ width:2.5em; height:2.5em; background:#222; color:#fff; border-radius:50%}


.scroll #header{ box-shadow:0 0 1em rgba(0,0,0,.1)}

.allOn{ overflow:hidden}
.allOn #header{ height:90vh; position: fixed; box-shadow:0 0 10vh 10vh rgba(0,0,0,.9); box-sizing:border-box; padding-right:30%; border:none}
.allOn #header:before{ content:""; position:absolute; right:0; top:0; width:30%; height:100%; background:url(../images/inc/all_bg.jpg) no-repeat center; background-size:cover}
.allOn #header .home_wrap{ background:none; position:relative; z-index:1}
.allOn #header .home_wrap .wrapIn{ position:absolute; right:2em; top:2em; width:50%;}
.allOn #header .home_wrap .link_wrap{ display:none}
.allOn #header .home_wrap .mem_wrap{ justify-content:flex-end; gap:.5em }
.allOn #header .home_wrap .mem_wrap .st{ color:#111; flex-wrap:wrap; justify-content:center; gap:.5em .25em}
.allOn #header .home_wrap .mem_wrap .st .icoImg{ filter:none; width:100%; height:1.5em}
.allOn #header .home_wrap .mem_wrap .st .noW .no{ background:#f1f1f1; color:#111}
.allOn #header .top_wrap .logo{ height:12vh; display:flex; align-items:center}
.allOn #header .top_wrap .wrapIn{ flex-wrap:wrap}
.allOn #header .top_wrap .search_wrap{ flex:0 0 auto; width:80%; order:9; margin:0 auto; font-size:1.25em}
.allOn #header .top_wrap .gnb_wrap{ flex:0 0 auto; width:100%; order:10}
.allOn #header .top_wrap .gnb_wrap .menu_wrap{ width:100%}
.allOn #header .top_wrap .gnb_wrap .gnb{ gap:1em; background:#f5f5f5; padding:1em; border-radius:1em}
.allOn #header .top_wrap .gnb_wrap .gnb > li{ flex:1; box-sizing:border-box; padding:1.5em; background:#fff; border-radius:.5em}
.allOn #header .top_wrap .gnb_wrap .gnb > li .dp1{ padding:0; height:4em}
.allOn #header .top_wrap .etc_wrap{ margin-left:auto}
.allOn #header .top_wrap .all_wrap .allBtn{ position: fixed; right:1em; top:1em;}
.allOn #header .top_wrap .all_wrap .allBtn .ico:before{ content:"\e921"}

#footer{ background:#1c222a; color:#fff; padding:4em 0}
#footer .gotop{ position:fixed; right:1em; bottom:1em; width:3.5em; line-height:3.5em; background:#000; text-align:center; color:#fff; border-radius:50%; transition:.3s; transform:translateY(100%); opacity:0; visibility:hidden; border:1px solid rgba(255,255,255,.2); z-index:3;}
#footer .gotop .xi{ font-size:1.5em}
body.scroll #footer .gotop{ transform:translateY(0); opacity:1; visibility:visible}
#footer .logo_wrap{}
#footer .logo_wrap .wrapF{ display:flex; align-items:center }
#footer .logo_wrap .logo img{ display:block; height:3em}
#footer .logo_wrap .menu{ margin-left:auto; display:flex; align-items:center; overflow:hidden; gap:3em}
#footer .logo_wrap .menu > li > a{ position:relative; font-size:.938em}
#footer .logo_wrap .menu > li > a.point{ font-weight:700; font-size:1em}
#footer .logo_wrap .menu > li > a:after{ content:""; position:absolute; top:50%; right:-1.5em; transform:translate(0, -50%); width:.125em; height:.125em; border-radius:50%; background:#fff}
#footer .info_wrap{ padding-top:3em}
#footer .info_wrap .wrapF{ display:flex; align-items:flex-start}
#footer .info_wrap .info > li{ float:left; font-size:.938em; opacity:.8; margin:0 2em .625em 0}
#footer .info_wrap .info > li.br{ clear:left}
#footer .info_wrap .info > li.copyright{ font-size:.75em; opacity:.5; letter-spacing:.05em; margin-top:1em}
#footer .info_wrap .info:after{ content:""; display:block; clear:both}
#footer .info_wrap .cs_wrap{ margin-left:auto}
#footer .info_wrap .cs_wrap .cs .wrap_in{ margin-left:3em}
#footer .info_wrap .cs_wrap .cs .t1{ display:block; margin-bottom:.75em}
#footer .info_wrap .cs_wrap .cs .t2{ display:block; font-size:1.688em; letter-spacing:0}
#footer .site_wrap{ position:relative; margin-left:auto}
#footer .site_wrap .btn{ display:flex; align-items:center; height:3em; padding:0 1em; box-sizing:border-box; width:12em; position:relative; overflow:hidden}
#footer .site_wrap .btn .tt{ flex:1 1 0%; min-width:0; font-size:.938em}
#footer .site_wrap .btn .xi{ position:relative; font-size:1em; transition:.3s}
#footer .site_wrap .siteBtn{ border-radius:.5em; background:rgba(255,255,255,.1);}
#footer .site_wrap .list{ position:absolute; bottom:100%; width:100%; transition:.3s; opacity:0; visibility:hidden; background:#111; border-radius:.5em .5em 0 0; overflow:hidden; border:1px solid rgba(255,255,255,.2); border-bottom:none; box-sizing:border-box}
#footer .site_wrap .list > li:not(:last-child) .btn{ border-bottom:1px solid rgba(255,255,255,.1)}
#footer .site_wrap .list .btn .xi{ right:-2em}
#footer .site_wrap .list .btn:hover .xi{ right:0}
#footer .site_wrap.on .list{ opacity:1; visibility:visible}
#footer .site_wrap.on .siteBtn{ border-radius:0 0 .5em .5em}
#footer .site_wrap.on .siteBtn .xi{ transform:rotate(180deg)}

#quick{ position:fixed; right:0; bottom:8em; z-index:999; filter:drop-shadow(-.5em 0 1em rgba(0,0,0,.2)); display:flex; flex-direction:column; align-items:center; gap:1em}
#quick .wrapIn{ display:flex; align-items:flex-start;}
#quick .wrapTit{ width:var(--quickTitW); background:var(--siteC); color:#fff; border-radius:1em 0 0 1em; overflow:hidden}
#quick .wrapTit .tit{ writing-mode:vertical-rl; width:100%; box-sizing:border-box; padding:1em}
#quick .wrapTit .tit .t1{ font-size:.813em; font-weight:800; word-spacing:.125em; letter-spacing:.05em}
#quick .wrapTit .wrapClose{ height:var(--quickTitW); display:flex; align-items:center; justify-content:center; border-top:1px solid rgbA(255,255,255,.2)}
#quick .wrapTit .wrapClose:hover{ background:rgba(0,0,0,.2)}
#quick .wrapTit .wrapClose .arrow{ font-size:1em; transition:.3s}
#quick .wrapTit .wrapClose .arrow:before{content:"\e93e"}
#quick .wrapCon{ border-bottom-left-radius:1em; overflow:hidden}
#quick .goTop{ display:flex; width:3.5em; height:3.5em; margin-left:var(--quickTitW); align-items:center; justify-content:center; border-radius:50%; background:var(--siteC2); color:#fff; opacity:0; transition:.5s}
#quick .goTop .xi{ font-size:1.5em; transition:.3s}
#quick .goTop:hover .xi{ transform:translateY(-.25em)}
.scroll #quick .goTop{ opacity:1; transform:translateY(0)}

#quick .wrapCon{ background: #fff; width: 150px;}
#quick .wrapCon .productT{ padding: 1.5em 1em; box-sizing: border-box; border-bottom: 1px solid #ddd;}
#quick .wrapCon .productT > .recent{ text-align: center; font-size: .9em; font-weight: 800; margin-bottom: .75em;}
#quick .wrapCon .productT > .Pro_List{ display: flex; gap: .3em; flex-wrap: wrap;}
#quick .wrapCon .productT > .Pro_List > li{ width: calc(50% - .15em);}
#quick .wrapCon .productT > .Pro_List > li > .inner{ display: block; padding: .3em; box-sizing: border-box; border: 1px solid #ddd; border-radius: 1em; transition: .2s;}
#quick .wrapCon .productT > .Pro_List > li > .inner > .img_con{ width: 100%; height: 45px;}
#quick .wrapCon .productT > .Pro_List > li > .inner > .img_con > img{ width: 100%; height: 100%; object-fit: contain;}
#quick .wrapCon .productT > .Pro_List > li > .inner:hover{ border: 1px solid var(--siteC);}

#quick .more{ margin-top: .25em;}
#quick .more .quickMore{ padding: .6em .5em; width: 100%; border-radius: .4em; border: 1px solid #ddd; text-align: center; font-size: .65em; line-height: 1; transition: .2s;}
#quick .more .quickMore > span{ color: #444; font-weight: 800; margin-right: .5em; transition: .2s;}
#quick .more .quickMore > b{ font-weight: 800; color: #000; transition: .2s;}
#quick .more .quickMore > b > i{ padding-left: .2em;}
#quick .more .quickMore:hover{ background: var(--siteC);}
#quick .more .quickMore:hover > b,
#quick .more .quickMore:hover > span{ color: #fff;}

#quick .quick_link{}
#quick .quick_link > li{ border-bottom: 1px solid #ddd; padding: .85em; box-sizing: border-box;}
#quick .quick_link > li > .con{ display: flex; gap: 1em; justify-content: space-between; align-items: center;}
#quick .quick_link > li > .con > .menuCon{ display: flex; align-items: center; gap: .5em; font-size: .765em; font-weight: 800; color: #222; line-height: 1; transition: .2s;}
#quick .quick_link > li > .con > .arrow{ font-size: .8em; color: #222; transition: .2s;}
#quick .quick_link > li > .con > .arrow > .xi{}
#quick .quick_link > li > .con > .roundC{ width: 1.25em; height: 1.25em; background: var(--siteC2); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff;}
#quick .quick_link > li > .con > .roundC.gray{ background: #848484;}
#quick .quick_link > li > .con > .roundC > .count{ font-size: .6em; font-weight: 800; line-height: 1;}

#quick .quick_link > li > .con:hover > .arrow,
#quick .quick_link > li > .con:hover > .menuCon{ color: var(--siteC);}

#quick .Bqucik_link{ padding: 1.15em 1em; box-sizing: border-box;}
#quick .Bqucik_link > li{ margin-bottom: .2em;}
#quick .Bqucik_link > li:last-of-type{ margin-bottom: 0em;}
#quick .Bqucik_link > li > .B_btn{ padding: .2em .8em; box-sizing: border-box; background: #5b6571; color: #fff; width: 100%; border-radius: .5em; transition: .2s;}
#quick .Bqucik_link > li > .B_btn > .con{ display: flex; align-items: center; justify-content: space-between;}
#quick .Bqucik_link > li > .B_btn > .con > .tt{ font-size: .75em; font-weight: 700;}
#quick .Bqucik_link > li > .B_btn:hover{ background: #222;}

#quick{ opacity:0}
.load #quick{ opacity:1; transition:.5s}
.quickOff #quick{ transform:translateX(calc(100% - var(--quickTitW)))}
.quickOff #quick .wrapTit .wrapClose .arrow{ transform:rotate(180deg)}
.quickOff #quick .goTop{ margin-left:0; margin-right:auto; transform:translateX(-1em)}

#contents{ flex:1 1 0%; min-height:0}

#contents .sub_nav{ padding:1.75em 0 0 0}
.sub_nav_st > li{ color:#666; font-size:.938em}
.sub_nav_st > li:before{ content:"\e940"; font-family:xeicon; padding:0 .5em; vertical-align:middle; opacity:.5}
.sub_nav_st > li:first-child:before{ display:none}
.sub_nav_st > li.home{ color:#111}
.sub_nav_st > li.home .xi{ font-size:1.125em}
#contents .sub_tit{ text-align:center; padding:1.5em 0 3em 0}
#contents .sub_tit .t1{ font-size:1.25em; opacity:.3; text-transform:uppercase; font-weight:100; letter-spacing:.063em; word-spacing:.25em; margin-bottom:.25em}
#contents .sub_tit .t2{ font-size:2.625em; font-weight:700}
#contents .sub_tab{ padding:1.5em 0 0 0; background:#f5f5f5; border-bottom:1px solid #eee}
#contents .sub_tab .gnb > li{ width:100%}
#contents .sub_tab .gnb > li > .dp2{ justify-content:center}
#contents .sub_tab .gnb > li > .dp2 > li{ flex:1 1 12.5em; max-width:12.5em}
#contents .sub_tab .gnb > li > .dp2 > li > a{ display:flex; justify-content:center; align-items:center; height:4.25em; background:#fff; padding:.5em; color:#777; position:relative; box-sizing:border-box}
#contents .sub_tab .gnb > li > .dp2 > li > a .va{ font-weight:700; font-size:1.125em}
#contents .sub_tab .gnb > li > .dp2 > li.on > a{ background:var(--siteC3); color:#fff; padding-top:.25em}
#contents .sub_tab .gnb > li > .dp2 > li.on > a:before,
#contents .sub_tab .gnb > li > .dp2 > li.on > a:after{ content:""; position:absolute; background:var(--siteC3); bottom:100%; font-size:.5em}
#contents .sub_tab .gnb > li > .dp2 > li.on > a:before{ right:0; height:1em; width:1em; transform:rotate(-45deg); transform-origin:right bottom}
#contents .sub_tab .gnb > li > .dp2 > li.on > a:after{ left:0; height:.725em; width:calc(100% - .75em)}

#contents .sub_nav_control{ display:flex; align-items:center; margin-bottom:1em}
#contents .sub_nav_control .list,
#contents .sub_nav_control .list > li{ position:relative; display:flex; align-items:center}
#contents .sub_nav_control .list > li .navBtn{ display:flex; align-items:center; line-height:1.1; box-sizing:border-box; padding:.5em; position:relative; z-index:2; color:#666}
#contents .sub_nav_control .list > li:not(.home):before{ content:"\e93e"; font-family:xeicon; width:3em; text-align:center; color:#aaa}
#contents .sub_nav_control .list > li:not(.home) .navBtn{ width:12em}
#contents .sub_nav_control .list > li .navBtn .tt{ flex:1; min-width:0; font-size:.938em}
#contents .sub_nav_control .list > li .navBtn .arrow{ font-size:1em; width:1.25em; height:1.25em; border-radius:50%; background:#fff; border:1px solid #ddd; color:#aaa; display:flex; align-items:center; justify-content:center; line-height:1}
#contents .sub_nav_control .list > li .navBtn .arrow:before{content:"\e914"}
#contents .sub_nav_control .list > li.home .navBtn{ width:2em; height:2em; justify-content:center; padding:0; color:var(--siteC); border-radius:50%; border:none}
#contents .sub_nav_control .list > li.home .navBtn .xi{ font-size:1.125em}
#contents .sub_nav_control .list > li.home .navBtn .xi:before{content:"\e900"}
#contents .sub_nav_control .list > li .navBtn .tt{ font-weight:700}
#contents .sub_nav_control .list > li .navWrap{ position:absolute; right:0; top:100%; border-radius:1em; width:calc(100% - 3em); background:#fff; visibility:hidden; opacity:0; z-index:-1; box-sizing:border-box; box-shadow:0 0 1em rgba(0,0,0,.1)}
#contents .sub_nav_control .list > li .navWrap .flex{ flex-direction:column}
#contents .sub_nav_control .list > li .navWrap .gnb{ padding:1em}
#contents .sub_nav_control .list > li .navWrap .gnb a{ display:flex; align-items:center; padding:.5em 0; padding-right:1em; color:#777; position:relative; transition:.3s; overflow:hidden; font-weight:700; border-radius:.5em}
#contents .sub_nav_control .list > li .navWrap .gnb a .va{ font-size:.875em}
#contents .sub_nav_control .list > li .navWrap .gnb a .va .arrow{ position:absolute; right:-1em; width:1em; text-align:center; top:50%; transform:translateY(-50%); font-size:.875em; transition:.3s; }
#contents .sub_nav_control .list > li .navWrap .gnb a .va .arrow:before{content:"\e907"}
#contents .sub_nav_control .list > li .navWrap .gnb li:not(.on) > a:hover{ background:#f5f5f5; padding-left:.5em; color:var(--siteC)}
#contents .sub_nav_control .list > li .navWrap .gnb li:not(.on) > a:hover .va .arrow{ right:.5em}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a{ color:#111}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a .va .arrow{ right:0}
#contents .sub_nav_control .list > li .navWrap .gnb li.on > a .va .arrow:before{content:"\e928"}
#contents .sub_nav_control .list > li.on .navBtn .arrow{ background:#aaa; color:#fff; border-color:transparent}
#contents .sub_nav_control .list > li.on .navBtn .arrow:before{ content:"\e91b"}
#contents .sub_nav_control .list > li.on .navWrap{ visibility:visible; opacity:1; z-index:2;}

.dp1on .gnb .dp2{ display:none!important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1,
.dp2on .gnb > li .dp3{ display:none!important}
.dp2on .gnb > li.on{ display:block!important}
.dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a{ display:none!important}
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on{ display:block!important}

#contents .doc{ padding:3em 0 10em 0}
#contents .sub_tab + .doc{ padding-top:3em; }

/**/
.login_wrap .login{ width:32em; max-width:94%; margin:0 auto}
.login_wrap .login.w1{ width:38em}
.login_wrap .login .tabIdx{ margin-bottom:1em}

.login_wrap .link_wrap{ padding:0 .5em; margin:1em 0}
.login_wrap .link_wrap .link{ font-size:.938em; margin:0 1em; color:#666; font-weight:700}
.login_wrap .link_wrap .link .tt{ padding:0 .25em; display:inline-block}
.login_wrap .link_wrap .link:hover .tt{ text-decoration:underline; color:#111}

.login_wrap .check_wrap{ margin:.75em 0 0 0}
.login_wrap .btn_wrap{ margin-top:2em}
.login_wrap .btn_wrap + .btn_wrap{ margin-top:.5em}
.login_wrap .btn_wrap .btn{ padding:0 2em; height:3.5em; display:flex; align-items:center; justify-content:center; gap:.25em; box-shadow:1px 1px 2px rgba(0,0,0,.2); background:var(--siteC); color:#fff; border:none; width:100%; box-sizing:border-box; border:2px solid transparent; margin-bottom:.5em; font-size:1.063em; font-weight:700; border-radius:.25em}
.login_wrap .btn_wrap .btn.c1{ border-color:#333; color:#333; background:#fff}
.login_wrap .btn_wrap .btn.c2{ background:#fff; color:var(--siteC); border-color:var(--siteC)}
.login_wrap .btn_wrap .btn.s1{ font-size:1.25em}
.login_wrap .btn_wrap .btn.s2{ font-size:.875em}
.login_wrap .btn_wrap .btn.w1{ width:49%}

.login_wrap .btn_wrap .btn.sns_naver{background:#2db400;}
.login_wrap .btn_wrap .btn.sns_kakao{background:#ffe812; color:#000}

.login_wrap .tt_st{ color:var(--siteC)}
.login_wrap .tt_st .xi{ vertical-align:middle}

.form_wrap{ border:1px solid #ddd; border-radius:1em; padding:3em}
.form_wrap .tit_wrap{ float:left; width:20%}
.form_wrap .tit_wrap .in{ border-top:2px solid #333; padding:1.125em}
.form_wrap .con_wrap{ float:right; width:75%}

.form_st{}
.form_st > li{ margin-top:1em}
.form_st > li:first-child{ margin-top:0}
.form_st > li .in{ position:relative; padding:0 1em 0 4em; margin-top:.5em}
.form_st > li .in .icon{ position:absolute; left:0; top:50%; width:3em; line-height:3em; margin-top:-1.5em; text-align:center; color:#666}
.form_st > li .in .icon:before{ font-size:1.313em}
.form_st > li .in .lab{ position:absolute; left:4em; top:50%; line-height:1em; margin-top:-.5em; color:#999; background:#fff; padding:0 .25em}
.form_st > li .in .inp{ width:100%; box-sizing:border-box; padding:1em 0; height:4em; border:none; position:relative; z-index:1; background:none; font-weight:bold; color:#666}
.form_st > li .in .inp[type=file]{ padding:0 !important; height:3em}
.form_st > li .in .inp[readonly=readonly]{ background:#f5f5f5}
.form_st > li .in textarea.inp{ height:10em; padding:1em !important}
.form_st > li .in .line{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; box-sizing:border-box; transition:.3s; border-radius:.25em}
.form_st > li .in .inp:focus ~ .lab,
.form_st > li .in .inp.on ~ .lab{ transform:scale(.9,.9); top:0; color:var(--siteC); margin-left:-.5em; transition:.3s}
.form_st > li .in .inp:focus ~ .icon,
.form_st > li .in .inp.on ~ .icon{ color:#333}
.form_st > li .in .inp:focus ~ .line,
.form_st > li .in .inp.on ~ .line{ border-color:var(--siteC)}
.form_st > li .in .inp.c1{ background:#f1f1f1}

.form_st.st1 > li{ display:flex; flex-wrap:wrap; align-items:center}
.form_st.st1 > li:not(.btn_wrap){ margin-top:1.5em}
.form_st.st1 > li.line{ margin-top:1.25em; padding-top:1.25em; border-top:1px solid var(--siteC)}
.form_st.st1 > li.line > .label_st{ width:100%; margin-top:-1em}
.form_st.st1 > li.line2{ border-top:1px solid #ddd; padding-top:1em !important}
.form_st.st1 > li .in{ padding:0; flex:1 1 1%; min-width:0; word-break:break-all}
.form_st.st1 > li .in_sec{ width:1.5em; text-align:center; color:#999; display:inline-block}
.form_st.st1 > li .in_sec2{ width:.5em}
.form_st.st1 > li .in_br{ flex-basis:100%}
.form_st.st1 > li .in_tit{ font-weight:500; font-size:1.063em; color:#333; width:100%}
.form_st.st1 > li .in_tit .ess:before{ font-size:.875em; margin-left:.5em}
.form_st.st1 > li .in_tit.c1{ color:#777}
.form_st.st1 > li .in_tit.s1{ font-size:1.25em}
.form_st > li .in_tt{ width:100%; color:#777; font-size:.938em; margin-top:1em; line-height:1.5}
.form_st.st1 > li .in.fix{ flex:0 0 auto}
.form_st.st1 > li .in .inp{ padding:1em 1em; height:3.5em; font-size:.938em;font-weight:400}
.form_st.st1 > li .in .inp[type=file]{ height:3em}
.form_st.st1 > li .in .inp.s1{ font-size:1em}
.form_st.st1 > li .in .btn{ color:#fff}
.form_st.st1 > li .in .btn + .line{ background:#333; border-color:transparent}
.form_st.st1 > li .in .w100{ width:100%}
.form_st.st1 > li .in.w1{ max-width:26%}
.form_st.st1 > li .in.w50{ max-width:50%}
.form_st.st1 > li .in.w100{ flex-basis:100%}
.form_st.st1 > li .agree{ border:1px solid #ddd; width:100%; margin:.75em 0; border-radius:.25em}
.form_st.st1 > li .agree > li{ padding:.75em 1em; position:relative; transition:.3s}
.form_st.st1 > li .agree > li.all{ border-bottom:1px solid #ddd}
.form_st.st1 > li .agree > li .more{ background:#aaa; color:#fff; padding:.25em 1em; font-size:.875em}
.form_st.st1 > li .agree > li .more:before{ content:"보기"}
.form_st.st1 > li .agree > li .agree_box{ display:none}
.form_st.st1 > li .agree > li .on .more{ background:#333}
.form_st.st1 > li .agree > li .on .more:before{ content:"접기"}
.form_st.st1 > li .agree > li .on .agree_box{ display:block}
.form_st.st1 > li.flex{ padding:0 .5em}
.form_st.st1 > li.flex .in_tit{ flex-basis:8em; font-size:.938em; padding-left:0; height:4em; display:flex; align-items:center}
.form_st.st1 > li.flex .in{ margin-top:0}
.form_st.st1 > li.flex .in.w100{ margin-left:8em}
.form_st.st1 > li.flex .in .inp{ font-size:.938em}

.form_st.text{ border-bottom:1px solid #ddd}
.form_st.text > li{ border-top:1px solid #ddd; margin-top:0}
.form_st.text > li .in .t1{ font-size:.938em; color:#666}
.form_st.text > li .in a:hover{ text-decoration:underline}

.fin_wrap{ border:1px solid #ddd; padding:2em 4em 4em 4em; text-align:center; box-sizing:border-box}
.fin_wrap.w1{ width:70em; margin:0 auto; max-width:94%; padding:2em 2em 4em 2em;}
.fin_wrap .fin_icon{ opacity:.1; font-size:4em}
.fin_wrap .fin_tit{ font-weight:300; font-size:2em;}
.fin_wrap .fin_tit:after{ content:""; display:block; margin:.75em auto; width:1em; height:1px; background:#aaa}
.fin_wrap .fin_tt{ color:#888; line-height:1.6}
.fin_wrap .fin_tt.t1{ color:#666; font-size:1.188em}

.fin_wrap.st1{ border:none; padding:0}

.agree_box{ border:1px solid #ddd; box-shadow:1px 1px 1em rgba(0,0,0,.2); padding:2em}
.agree_box .tit{ font-size:1.188em; font-weight:500; color:#111; margin-bottom:1em; margin-top:2em}
.agree_box .tit:first-child{ margin-top:0}
.agree_box .con{ font-size:.938em; color:#666; line-height:1.8em}
.agree_box .con.h1{ height:10.8em; overflow-y:auto}
.agree_box .con *{ vertical-align: top}
.agree_box .check{ border-top:1px solid #ddd; margin-top:1.5em; padding-top:1em}
.agree_box .con h3,
.agree_box .con h4{ margin-top:1em; font-weight:700}
.agree_box.st1{ box-shadow:none; padding:1.5em; background:#f9f9f9}

label_st.agree_box ul{ margin-top:1em}
.agree_box table{ margin:1em 0; width:100%}
.agree_box table th,
.agree_box table td{ border:1px solid #ddd; padding:1em}
.agree_box table th{ background:#f5f5f5}
.agree_box p strong{ font-size:1.125em; color:#333}
.agree_box a{ vertical-align:top; color:#666; text-decoration:underline}
.agree_box a:hover{ opacity:.6}
.agree_box strong{ vertical-align:top; font-weight:500}

/**/
.mall_list_top{ padding:0 0 2.5em 0}
.mall_list_top .tit_wrap{ padding:1em 0; border-bottom:1px solid #222}
.mall_list_top .tit_wrap .tit{ font-size:2.25em; font-weight:700}
.mall_list_top .tit_wrap .sub_nav_st{ margin-left:auto}
.mall_list_top .gnb_wrap{ position:relative}
.mall_list_top .gnb_wrap:before{ content:""; position:absolute; right:0; bottom:0; width:100%; height:1px; background:#eee}
.mall_list_top .gnb_wrap:after{ content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:#fff}
.mall_list_top .gnb_wrap .gnb > li.on{ display:flex; flex-wrap:wrap; width:100%;}
.mall_list_top .gnb_wrap .all{ width:14.28%; position:absolute; left:0; top:0}
.mall_list_top .gnb_wrap .gnb > li .dp2{ flex-wrap:wrap}
.mall_list_top .gnb_wrap .gnb > li .dp2 > li{ width:14.28%}
.mall_list_top .gnb_wrap .gnb > li .dp2 > li:first-child{ margin-left:14.28%}
.mall_list_top .gnb_wrap a{ padding:.5em 1.5em; height:4em; border-bottom:1px solid #eee; box-sizing:border-box; display:flex; align-items:center; font-weight:300; color:#666; position:relative}
.mall_list_top .gnb_wrap a:after{ content:""; position:absolute; right:-1px; top:0; width:1px; height:100%; background:#eee}
.mall_list_top .gnb_wrap a.dp1{ font-weight:500; color:#111}
.mall_list_top .gnb_wrap .all.on,
.mall_list_top .gnb_wrap .dp2 > li.on a{ font-weight:500; color:#111}
.mall_list_top .gnb_wrap a .va:after{ content:"\e942"; font-family:xeicon; margin:0 .5em; vertical-align:middle}
.mall_list_top .gnb_wrap a .va{ font-size:1.063em}

.mall_list_total{ padding:0 0 1em 0}
.mall_list_total .total .t1{ font-size:.938em; color:#666}
.mall_list_total .total .t2{ font-size:1.5em; font-weight:700; margin-left:.25em}
.mall_list_total .etc{ margin-left:auto}

.mall_prod_wrap{}
.prod_list{ margin:-2em 0 0 -2em}
.prod_list > li{ width:25%}
.prod_list > li .wrap_in{ margin:2em 0 0 2em; cursor:pointer}
.prod_list > li .wrap_in .wrap_img{ border:1px solid #ddd; overflow:hidden; position:relative;}
.prd_icon_wrap{position:absolute; left:4px; bottom:4px; display:flex;}
.prd_icon_wrap .prd_icon{display:flex; justify-content:center; align-items:center; width:50px; height:24px; color:#fff; border-radius:12px; font-size:.875em; margin-right:8px;}
.prd_icon_wrap .prd_icon.icon_sold{background:#aaa;}
.prd_icon_wrap .prd_icon.icon_best{background:#46cd66;}
.prd_icon_wrap .prd_icon.icon_sale{background:#47b3d6;}
.prd_icon_wrap .prd_icon.icon_new{background:#d66c47;}
.prod_list > li .wrap_in .wrap_con{ padding:1em 0}
.prod_list.d1 > li{ width:20%}
.prod_list.d1 > li .wrap_in .wrap_con{ font-size:.813em}

.mall_view_top{ padding:5em 0}
.mall_view_top .prod_img,
.mall_view_top .prod_info{ width:calc(50% - 2.5em)}

.mall_view_top .prod_img .imgBig img{ display:block; width:100%}
.mall_view_top .prod_info{ padding:0 0}
.mall_view_top .prod_info .tit_wrap .tit{ font-weight:700; font-size:2.125em}
.mall_view_top .prod_info .tit_wrap .t1{ opacity:.4; font-size:1.125em; margin-top:1.5em}
.mall_view_top .prod_info .tit_wrap .t2{ font-size:1.5em; font-weight:300; margin-top:1em}
.mall_view_top .prod_info .prod_price{ margin-top:3.5em; font-size:1.25em}
.mall_view_top .prod_info .info_wrap{ margin:1em 0 2em 0}
.mall_view_top .prod_info .info_wrap .list{ border-top:1px solid #eee; padding:.5em 0}
.mall_view_top .prod_info .info_wrap .list > li{ padding:.75em 0}
.mall_view_top .prod_info .info_wrap .list .tit{ width:7em; margin-right:1em}
.mall_view_top .prod_info .info_wrap .list .tit .t1{ font-weight:500; font-size:1.063em}
.mall_view_top .prod_info .info_wrap .list .con .t1{ font-weight:300; color:#666}
.viewTopN .op_wrap > li .wrap_in{ padding:1.5em 2.5em; background:#f5f5f5; margin-bottom:1em}
.viewTopN .op_wrap > li .wrap_in .wrap1{ margin-bottom:.75em}
.viewTopN .op_wrap > li .wrap_in .tit{ font-size:1.125em}
.viewTopN .op_wrap > li .wrap_in .tt_price{ font-size:.938em; width:120px;}
.viewTopN .total_price .tt_price{ font-size:1.375em}
.viewTopN .buy_btn_wrap .btn{ display:flex; align-items:center; justify-content:center; box-sizing:border-box; height:4em; min-width:4em; text-align:center; width:100%; border:1px solid transparent; background:#fff; line-height:1}
.viewTopN .buy_btn_wrap .btn .tt{ font-weight:700; font-size:1.125em}
.viewTopN .buy_btn_wrap > li.btnWish{ margin-left:1em}
.viewTopN .buy_btn_wrap > li.btnCart .btn{ color:#fff; background:#111}
.viewTopN .buy_btn_wrap > li.btnBuy .btn{ color:#fff; background:var(--siteC2)}
.viewTopN .buy_btn_wrap > li.btnWish .btn{ border-color:#222}
.viewTopN .buy_btn_wrap.on{ position:fixed; left:50%; bottom:0; z-index:1; width:50em; max-width:100%; transform:translateX(-50%)}
.viewTopN .buy_btn_wrap.on > li.btnWish{ margin-left:0}
.mall_view_con .view_tab{ max-width:none}
.mall_view_con .view_tab.on{ position:fixed; top:0; z-index:1}
.mall_view_con .view_con{ padding:4em 0}

.vol_st{ padding-left:1px}
.vol_st .btn,
.vol_st .inp{ width:2.5em; line-height:2.5em; height:2.5em; text-align:center; border:1px solid #ddd; background:#fff; margin-left:-1px; font-weight:800}
.vol_st .inp{ width:3.5em; box-sizing:border-box}
.vol_st .btn .xi{ font-size:1em}
.vol_st .btn.down .xi:before{content:"\e91a"}
.vol_st .btn.up .xi:before{content:"\e913"}
.vol_st.st1{ font-size:.875em}
.vol_st.st1 .inp{ width:3em}

.zoomWrap{ position: relative}
.zoomWrap .magnifierWrap{ position:absolute; left:100%; margin-left:5em; top:0; width:100%; height:100%; overflow:hidden; z-index: 5; box-shadow:0 0 1em rgba(0,0,0,.2); display: none; background-color:#fff}
.zoomWrap .magnifierWrap .magnifier{ position:absolute; background-repeat:no-repeat; background-size:100% 100%}
.zoomWrap .pointer{ position:absolute; width:30%; height:30%; background:rgba(0,0,0,.1); transform:translate(-50%,-50%);display:none}
.zoomThumbWrap{ margin:1.5em 0}
.zoomThumbWrap > li{ width:20%}
.zoomThumbWrap > li .in{ border:1px solid transparent; margin:.5em}
.zoomThumbWrap > li.on .in{ border-color:#111}

.tooltipWrap{ position:relative}
.tooltipWrap .tooltip{ position:absolute; background:#fff; border:2px solid #333; bottom:calc(100% + 1em); padding:2em; min-width:18em; box-sizing:border-box; display:none; box-shadow:0 0 1em rgba(0,0,0,.1); z-index:3;}
.tooltipWrap.on .tooltip{ display:block}
.tooltipWrap .tooltip:after{ content:""; width:1em; height:1em; border:2px solid #333; position:absolute; left:2.5em; bottom:0; transform:rotate(45deg); transform-origin:left bottom; background:#fff; border-top:none; border-left:none; margin-bottom:-2px}
.tooltipWrap .tooltip .twrap{ margin-bottom:.75em}
.tooltipWrap .tooltip .closeBtn{ position:absolute; right:0; top:0; width:2.5em; line-height:2.5em; text-align:center}
.tooltipWrap .tooltip .closeBtn:before{ font-family:xeicon; content:"\e921"}

.mall_total_wrap{ padding:1em 2em; text-align:right; background:#f5f5f5; border-bottom:1px solid #ddd}

.mall_order_wrap{ position:relative; padding-right:24em}
.mall_order_wrap .mall_order_con{ position:relative; z-index:1}
.mall_order_wrap .mall_order_fix{ position:absolute; right:0; top:0; width:100%; display:flex}
.mall_order_wrap .mall_order_fix .fix_wrap{ width:20em; background:#fff; margin-left:auto; border:1px solid #ddd; box-sizing:border-box}
.mall_order_wrap .mall_order_fix.on{ position:fixed}
body.footerCheck .mall_order_wrap .mall_order_fix.on{ position:absolute; bottom:0; top:auto}
.mall_order_wrap .mall_order_fix .fix_wrap .add_wrap{ background:#f5f5f5; padding:1em 1.5em}
.mall_order_wrap .mall_order_fix .fix_wrap .con_wrap{ padding:1.5em}
.mall_order_wrap .mall_order_fix .fix_wrap .wrap_t1{ font-weight:500}
.mall_order_wrap .mall_order_fix .fix_wrap .wrap_t2{ font-size:.938em; color:#666}
.mall_order_wrap .mall_order_fix .fix_wrap .price_wrap > dl:not(:first-child){ margin-top:.5em}
.mall_order_wrap .mall_order_fix .fix_wrap .price_wrap > dl.line{ border-top:1px solid #ddd; margin-top:1em; padding-top:1em}
.mall_order_wrap .mall_order_fix .fix_wrap .payment_wrap{ border:2px solid #333; padding:.75em 1.5em; margin:1.5em 0}

.page_sec_list > li:not(:first-child){ margin-top:5em}

/**/
.tab_st1{ padding-bottom:1em}
.tab_st1 > li{ flex:1 1 1%}
.tab_st1 > li > a{ display:flex; justify-content:center; align-items:center; height:3.5em; border:2px solid transparent; background:#f5f5f5; position:relative; font-size:1.125em; font-weight:500; color:#666; box-sizing:border-box}
.tab_st1 > li:not(:first-child):not(.on) > a{ border-left:none; padding-left:2px}
.tab_st1 > li:not(:last-child):not(.on) > a{ border-right:none; padding-right:2px}
.tab_st1 > li:first-child > a{ border-radius:.25em 0 0 .25em}
.tab_st1 > li:last-child > a{ border-radius:0 .25em .25em 0}
.tab_st1 > li.on > a{ border-color:#333; color:#333; background:#fff; z-index:1; box-shadow:0 0 1em rgba(0,0,0,.2); z-index:1}
.tab_st1 > li > a:before{ content:""; position:absolute; left:-3px; top:50%; height:50%; width:1px; background:#ddd; transform:translateY(-50%)}
.tab_st1 > li:first-child > a:before,
.tab_st1 > li.on > a:before{ display:none}
.tab_st1.c1 > li > a{ background:#fff; border-color:var(--siteC); color:var(--siteC)}
.tab_st1.c1 > li.on > a{ background:var(--siteC); color:#fff}
.tab_st1.c2 > li > a{ background:#fff; font-weight:700; color:#888; border-top:2px solid #111; border-bottom:1px solid #ddd; border-radius:0; border-left:none; border-right:none; box-shadow:none}
.tab_st1.c2 > li.on > a{ color:var(--siteC); font-weight:800; border-bottom-color:var(--siteC)}
.tab_st1.arrow > li.on > a:after{ content:"\e935"; font-family:xeicon; position:absolute; left:50%; top:100%; transform:translate(-50%,-.313em); color:#333}
.tab_st1.arrow.c1 > li.on > a:after{ color:var(--siteC)}

/*main*/
.mainVisualWrap{height:630px; margin-bottom:70px; position:relative;}
.mainVisualWrap .slides{height:100%;}
.mainVisualWrap .slides .el{width:1400px; height:100%; cursor:pointer;}
.mainVisualWrap .slides .el:not(.swiper-slide-active){position:relative;}
.mainVisualWrap .slides .el:not(.swiper-slide-active):after{content:''; display:block; width:100%; height:100%; background:rgba(255,255,255,.5); position:absolute; left:0; top:0;}
.mainVisualWrap .slides .el .img{width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:cover;}
.mainVisualWrap .mV_button_wrap{position:absolute; left:50%; bottom:0; transform:translateX(-50%); margin-left:calc(-700px + 95px); background:#2f2e2d; z-index:3; display:flex;}
.mainVisualWrap .mV_button_wrap .mV_pagination{width:90px; height:50px; color:#fff; display:flex; justify-content:center; align-items:center; border-left:1px solid #666; border-right:1px solid #666; box-sizing:border-box;}
.mainVisualWrap .mV_button_wrap .mV_pagination .swiper-pagination-current{margin-right:.25em; font-weight:bold;}
.mainVisualWrap .mV_button_wrap .mV_pagination .swiper-pagination-total{margin-left:.25em;}
.mainVisualWrap .mV_button_wrap .btn_prev,
.mainVisualWrap .mV_button_wrap .btn_next{width:50px; height:50px; display:flex; justify-content:center; align-items:center; color:#fff; opacity:.7; background:rgba(255,255,255,0); cursor:pointer; transition:.3s;}
.mainVisualWrap .mV_button_wrap .btn_prev:hover,
.mainVisualWrap .mV_button_wrap .btn_next:hover{opacity:1; background:rgba(255,255,255,.2);}

.main_prod{margin-bottom:5.375rem;}
.main_prod .main_prod_title{font-size:2.25em; font-weight:bold; margin-bottom:.75rem;}
.main_prod .main_prod_title .fr{font-size:1rem; font-weight:bold; color:#888; transition:.3s;}
.main_prod .main_prod_title .fr:hover{color:var(--siteC);}
.main_prod .main_prod_title .fr .xi{margin-top:-2px; transition:.3s; colro:#888;}
.main_prod .main_prod_title .fr:hover .xi{margin-left:12px; transform:rotate(180deg); color:var(--siteC);}
.main_prod .prod_list_wrap{}
.main_prod .prod_list_wrap .prod_cover{width:25%; max-width:330px; margin-bottom:3.375rem; cursor:pointer; margin-right:26px;}
.main_prod .prod_list_wrap .prod_cover:nth-of-type(4n){margin-right:0;}
.main_prod .prod_list_wrap .prod_cover:nth-of-type(n+5){margin-bottom:0;}
.main_prod .prod_list_wrap .prod_cover .thumb_wrap{border:1px solid #ddd; box-sizing:border-box; width:100%; height:330px; margin-bottom:1rem; transition:.3s; overflow:hidden;}
.main_prod .prod_list_wrap .prod_cover:hover .thumb_wrap{border-color:var(--siteC); box-shadow:0 0 8px 3px rgba(0,0,0,.2);}
.main_prod .prod_list_wrap .prod_cover .thumb_wrap .thumb{width:270px; height:270px; margin:30px auto; background-position:center; background-size:cover; background-repeat:no-repeat; transition:.3s;}
.main_prod .prod_list_wrap .prod_cover:hover .thumb_wrap .thumb{transform:scale(1.1);}
.main_prod .prod_list_wrap .prod_cover .info_wrap{}
.main_prod .prod_list_wrap .prod_cover .info_wrap .prod_sum{font-size:.9375em; color:#888; margin-bottom:.25rem;}
.main_prod .prod_list_wrap .prod_cover .info_wrap .prod_name{font-size:1.125em; color:#111; margin-bottom:1.125em;}
.main_prod .prod_list_wrap .prod_cover .info_wrap .prod_price{}
.main_prod .prod_list_wrap .prod_cover .info_wrap .prod_price .price_num{font-weight:bold; font-size:1.125em;}

.main_mid_banner_wrap{width:100%; height:360px;}
.main_mid_banner_wrap .img{width:100%; height:100%; background-size:cover; background-position:center; background-repeat:no-repeat; cursor:pointer;}

.main_md_wrap{/*width:1760px; margin:0 auto;*/ margin-bottom:70px;}
.main_md_wrap .main_md_top{width:100%;/* margin-bottom:100px;*/}
.main_md_wrap .main_md_top .main_md_in{width:100%;}
.main_md_wrap .main_md_in{padding-top:86px;}
.main_md_wrap .main_md_in .main_md_img_wrap{width:660px;}
.main_md_wrap .main_md_in .main_md_img_wrap .img{width:100%; height:440px; background-size:cover; background-repeat:no-repeat; background-position:center;}
.main_md_wrap .main_md_in .main_md_img_wrap .main_md_title{font-size:2.25em; margin-bottom:.5rem;}
.main_md_wrap .main_md_in .main_md_list_wrap{width:calc(100% - 660px); padding-left:80px; padding-top:54px; box-sizing:border-box;}
.main_md_wrap .main_md_bottom .main_md_in .main_md_list_wrap{padding-left:0; padding-right:80px;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_hash{font-size:1.375em; color:#aaa; padding-top:.5rem; margin-bottom:1.25rem;}
.main_md_wrap .main_md_bottom .main_md_in .main_md_list_wrap .main_md_hash{display:flex; align-items:center; justify-content:flex-end;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_hash .hash{margin-right:1.75em; position:relative; padding-left:.875em; box-sizing:border-box; font-weight:bold;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_hash .hash:last-of-type{margin-right:0;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_hash .hash:before{content:'#'; font-size:1em; position:absolute; left:0; top:0;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap{width:calc(100% + 180px); overflow:hidden;}
.main_md_wrap .main_md_bottom .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap{margin-left:-180px;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .slides{width:100%;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .slides .el{width:260px; height:340px; border:1px solid #ddd; box-sizing:border-box; transition:.3s; cursor:pointer;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .slides .el:hover{border-color:var(--siteC); box-shadow:0 0 8px 3px rgba(0,0,0,.2);}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .slides .el .img{width:100%; height:260px; background-size:contain; background-position:center; background-repeat:no-repeat;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .slides .el .md_prod_name{font-size:1.0625em; font-weight:bold; text-align:center; margin-top:1rem;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap{display:flex; align-items:center; margin-top:.5rem;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap > div{cursor:pointer;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap > div.btn_play.off,
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap > div.btn_pause.off{display:none;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap .xi{font-size:1.5em; color:#555; transition:.3s; opacity:.7}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap > div:hover .xi{color:var(--siteC); opacity:1;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap .xi.xi-pause,
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap .xi.xi-play{padding-top:2px;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS1_button_wrap .xi:not(.xi-pause):not(.xi-play){font-size:1.75em;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap{display:flex; align-items:center; margin-top:.5rem; flex-direction:row-reverse;}
.main_md_wrap .main_md_bottom .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap{flex-direction:row;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap > div{cursor:pointer;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap > div.btn_play.off,
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap > div.btn_pause.off{display:none;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap .xi{font-size:1.5em; color:#555; transition:.3s; opacity:.7}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap > div:hover .xi{color:var(--siteC); opacity:1;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap .xi.xi-pause,
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap .xi.xi-play{padding-top:2px;}
.main_md_wrap .main_md_in .main_md_list_wrap .main_md_prod_slide_wrap .mdPS2_button_wrap .xi:not(.xi-pause):not(.xi-play){font-size:1.75em;}

.main_cate_tab_wrap{margin-bottom:35px;}
.main_cate_tab_wrap .main_cate_tab{padding:0 55px; height:60px; border-radius:4px; font-size:1.1875em; transition:.3s; background:#eeeeee; color:#adadad; cursor:pointer; margin-right:10px; font-weight:bold;}
.main_cate_tab_wrap .main_cate_tab:last-of-type{margin-right:0;}
.main_cate_tab_wrap .main_cate_tab:hover{background:#d6dded; color:#111;}
.main_cate_tab_wrap .main_cate_tab.on{background:#1e3b76; color:#fff; box-shadow:0 0 8px 2px rgba(0,0,0,.1);}

.main_brand_wrap{padding-top:85px; margin-bottom:160px;}
.main_brand_wrap .main_wrap_title{font-size:2.25em; text-align:center; margin-bottom:40px; font-weight:bold;}
.main_brand_wrap .brand_link_wrap{}
.main_brand_wrap .brand_link_wrap .brand_link{flex:1 1 25%; margin-right:26px; height:330px; background-position:center; background-size:cover; background-repeat:no-repeat; display:flex; justify-content:center; align-items:center; flex-direction:column; text-align:center; position:relative; color:#fff; cursor:pointer;}
.main_brand_wrap .brand_link_wrap .brand_link:before{content:''; display:block; width:100%; height:100%; background:#000; opacity:.3; position:absolute; left:0; top:0; z-index:0; transition:.3s;}
.main_brand_wrap .brand_link_wrap .brand_link:hover:before{opacity:.6;}
.main_brand_wrap .brand_link_wrap .brand_link:last-of-type{margin-right:0;}
.main_brand_wrap .brand_link_wrap .brand_link.n1{background-image:url('../images/main/main_brand_bg01.jpg');}
.main_brand_wrap .brand_link_wrap .brand_link.n2{background-image:url('../images/main/main_brand_bg02.jpg');}
.main_brand_wrap .brand_link_wrap .brand_link.n3{background-image:url('../images/main/main_brand_bg03.jpg');}
.main_brand_wrap .brand_link_wrap .brand_link.n4{background-image:url('../images/main/main_brand_bg04.jpg');}
.main_brand_wrap .brand_link_wrap .brand_link p{position:relative; z-index:1; transition:.45s;}
.main_brand_wrap .brand_link_wrap .brand_link p.bl_title{font-size:1.5em; margin-bottom:-3rem;}
.main_brand_wrap .brand_link_wrap .brand_link:hover p.bl_title{font-size:1em; margin-bottom:2.5rem;}
.main_brand_wrap .brand_link_wrap .brand_link p.bl_text{font-size:1.3125em; font-weight:bold; height:55px; padding-top:55px; box-sizing:border-box; overflow:hidden;}
.main_brand_wrap .brand_link_wrap .brand_link:hover p.bl_text{padding-top:0; margin-bottom:2rem;}
.main_brand_wrap .brand_link_wrap .brand_link p.more_btn{font-size:.8125em; font-weight:bold;}
.main_brand_wrap .brand_link_wrap .brand_link p.more_btn .xi{font-weight:400;}

.main_cs_wrap{height:300px; padding-top:60px; background:#f5f5f5; box-sizing:border-box;}
.main_cs_wrap .box1{display:flex;}
.main_cs_wrap .box1 .main_cs_title{font-size:1.375em; font-weight:bold; margin-bottom:30px;}
.main_cs_wrap .box1 .main_cs_info_wrap{width:450px;}
.main_cs_wrap .box1 .main_cs_info_wrap .cs_num{font-size:1.5em; font-weight:bold; margin-bottom:.875rem;}
.main_cs_wrap .box1 .main_cs_info_wrap .cs_time{font-size:.9375em; color:#777;}
.main_cs_wrap .box1 .main_cs_notice_wrap{width:400px;}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st{display:flex; flex-direction:column;}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st li{margin-bottom:.5rem; font-size:.875em; cursor:pointer;}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st li .notice_title{width:calc(100% - 80px); padding-left:8px; position:relative; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st li:hover .notice_title{text-decoration:underline;}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st li .notice_title:before{content:''; display:block; width:4px; height:1px; background:#111; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.main_cs_wrap .box1 .main_cs_notice_wrap .ul_board_st li .notice_date{width:80px; text-align:right; opacity:.5;}
.main_cs_wrap .box1 .main_cs_sns_wrap{width:calc(100% - 850px); display:flex; justify-content:flex-end; align-items:center;}
.main_cs_wrap .box1 .main_cs_sns_wrap .sns_wrap{}
.main_cs_wrap .box1 .main_cs_sns_wrap .sns_wrap li{margin-left:10px; cursor:pointer;}

/**/
.subscribe_wrap{}
.subscribe_wrap .subscribe_head .img_wrap{height:350px;}
.subscribe_wrap .subscribe_head .img_wrap .img{width:100%; height:100%;}
.subscribe_wrap .subscribe_head .text_wrap{width:1200px; padding:2em 3em; box-sizing:border-box; background:#fff; margin:-3rem auto 0; box-shadow:0px 4px 22px 2px rgba(0,0,0,.2);}
.subscribe_wrap .subscribe_head .text_wrap .tt{font-size:2.5em; width:300px; letter-spacing:-2.5px;}
.subscribe_wrap .subscribe_head .text_wrap .tt .first{vertical-align:baseline; letter-spacing:9px; font-weight:bold;}
.subscribe_wrap .subscribe_head .text_wrap .t1{width:calc(100% - 310px); font-size:1.25em; color:#777; line-height:1.6; padding-top:.25em;}
.subscribe_wrap .subscribe_body{margin-top:3rem;}
.subscribe_wrap .subscribe_body .subscribe_title{font-size:1.25em; margin-bottom:2rem;}
.subscribe_wrap .subscribe_body .subscribe_title i.xi{margin-right:6px; margin-top:-2px;}
.subscribe_wrap .subscribe_body .subscribe_sel_list{display:flex; justify-content:space-between;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li{width:30%; cursor:pointer;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap{border-radius:8px; position:relative; overflow:hidden;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap:before{content:''; display:block; width:30px; height:30px; border-radius:50%; background:#fff; position:absolute; left:-18px; top:50%; transform:translateY(-50%); z-index:5; border:2px solid #f69500; box-sizing:border-box;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap:before{border-color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap:before{border-color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap:before{border-color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap:after{content:''; display:block; width:30px; height:30px; border-radius:50%; background:#fff; position:absolute; right:-18px; top:50%; transform:translateY(-50%); z-index:5; border:2px solid #f69500; box-sizing:border-box;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap:after{border-color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap:after{border-color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap:after{border-color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .ssw_check{position:absolute; right:.5em; top:-1em; font-size:1.375em; color:#aaa; transition:.3s;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c1 .subscribe_sel_wrap .ssw_check{color:#f69500;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .ssw_check{color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .ssw_check{color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .ssw_check{color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li:hover .subscribe_sel_wrap .ssw_check,
.subscribe_wrap .subscribe_body .subscribe_sel_list li:not(.off) .subscribe_sel_wrap .ssw_check{top:.375em;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .ssw_shape{width:20px; height:20px; background:#fff; border:2px solid #f69500; box-sizing:border-box; position:absolute; transform:rotate(45deg); z-index:10;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .ssw_shape{border-color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .ssw_shape{border-color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .ssw_shape{border-color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .ssw_shape.s1{left:63px; top:-17px;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .ssw_shape.s2{left:63px; bottom:-17px;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in{border:2px solid #f69500; box-sizing:border-box; border-radius:8px; overflow:hidden;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .subscribe_sel_wrap_in{border-color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .subscribe_sel_wrap_in{border-color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .subscribe_sel_wrap_in{border-color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_l{width:70px; display:flex; justify-content:center; align-items:center; background:#f7c476; border-right:3px dotted #fff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_l{background:#ffafae;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_l{background:#a6bef7;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_l{background:#ddd;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_l img{transform:rotate(-90deg) scale(1.4);}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r{padding:2em; box-sizing:border-box; width:calc(100% - 70px); overflow:hidden; position:relative;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r:before{content:'\ea7d'; font-family:'xeicon'; font-size:6em; color:#ddd; position:absolute; left:0; bottom:-.375em; transform:rotate(-12deg);}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name{display:inline-flex; padding:.25em .75em; background:#f69500; color:#fff; justify-content:center; align-items:center; border-radius:18px; margin-bottom:1rem; font-size:1.125em; margin-top:-.5rem; position:relative;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name{background:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name{background:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name{background:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name:before{content:''; display:; width:80px; height:100%; background:#f69500; position:absolute; left:-50px; top:0; z-index:-1;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name:before{background:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name:before{background:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_name:before{background:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_ori_price{font-size:1.25em; color:#999; text-decoration:line-through; text-align:right;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price{text-align:right;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price span{vertical-align:baseline;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price .ssw_discount{display:inline-flex; width:55px; height:26px; justify-content:center; align-items:center; border:1px solid #f69500; color:#f69500; border-radius:15px; box-sizing:border-box; padding-top:2px; margin-right:12px;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c2 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price .ssw_discount{border-color:#ff4d4b; color:#ff4d4b;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.c3 .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price .ssw_discount{border-color:#2667ff; color:#2667ff;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li.off .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price .ssw_discount{border-color:#aaa; color:#aaa;}
.subscribe_wrap .subscribe_body .subscribe_sel_list li .subscribe_sel_wrap .subscribe_sel_wrap_in .ssw_r .ssw_price .tt{font-size:1.625em; font-weight:bold;}

.notice_wrap{height:140px; border: 1px solid #ddd; box-sizing:border-box; border-radius:12px;}
.notice_wrap .xi{font-size:1.5em; color:#999; margin-bottom:.5rem;}
.notice_wrap .notice_ctt{font-size:1.125em; color:#777;}

.subscribe_prod_list{display:flex; flex-direction:column;}
.subscribe_prod_list > li{width:100%; padding:1em 2em; border-radius:12px; border:1px solid #ddd; margin-bottom:.75rem; box-sizing:border-box; transition:.3s;}
.subscribe_prod_list:not(.noHover) > li:hover,
.subscribe_prod_list:not(.noHover) > li:focus-within{border-color:var(--siteC);}
.subscribe_prod_list > li .subscribe_prod_in{}
.subscribe_prod_list > li .subscribe_prod_in .spi_month{font-size:1.25em; color:var(--siteC);}
.subscribe_prod_list > li .subscribe_prod_in .spi_sel_box{}
.subscribe_prod_list > li .subscribe_prod_in .spi_sel_box > div{}
.subscribe_prod_list > li .subscribe_prod_in .spi_sel_box > div .tt{margin-right:1rem;}
.subscribe_prod_list > li .subscribe_prod_in .spi_sel_box > div.same_check{width:120px;}

.price_st{font-size:1.25em;}
.price_st .num{color:#f70847; vertical-align:baseline;}

/*txt_setting*/
.bg_gray{background:#f5f5f5;}
.txt_bold{font-weight:bold; vertical-align:baseline;}
.txt_small{font-size:.875em; vertical-align:baseline;}
.txt_light{font-weight:200; vertical-align:baseline;}

.vb{vertical-align:baseline;}

.about_index_wrap{}
.about_index_wrap .sub_page_bg_wrap{}
.about_index_wrap .sub_page_bg_wrap .img_wrap{height:580px;}
.about_index_wrap .sub_page_bg_wrap .img_wrap .img{width:100%; height:100%;}

.sub_page_wrap{padding-top:70px; padding-bottom:100px;}
.sub_page_wrap.st2{padding-bottom:150px;}
.sub_page_wrap.st3{padding:0;}
.sub_page_wrap.st4{padding:120px 0;}

.sub_page_wrap .sub_page_title_wrap{margin-bottom:40px;}
.sub_page_wrap .sub_page_title_wrap .title_sub{opacity:.5; font-size:.9375em; letter-spacing:.5px; margin-bottom:24px;}
.sub_page_wrap .sub_page_title_wrap .title{font-size:2.375em; margin-bottom:24px;}
.sub_page_wrap .sub_page_title_wrap .t1{font-size:1.375em; color:#555; line-height:1.6;}
.sub_page_wrap .sub_page_ctt_wrap{}
.sub_page_wrap .sub_page_ctt_wrap .box_st{background:#fff; box-shadow:0 0 15px 2px rgba(0,0,0,.1); padding:30px 0; width:300px; text-align:center; margin-bottom:2rem;}
.sub_page_wrap .sub_page_ctt_wrap .box_st .t1{font-size:1.0625em; color:var(--siteC); font-weight:bold; margin-bottom:1rem;}
.sub_page_wrap .sub_page_ctt_wrap .box_st .t2{font-size:1.1250em; color:#666;}
.sub_page_wrap .sub_page_ctt_wrap .box_st .t3{font-size:1.3750em; font-weight:bold;}
.sub_page_wrap .sub_page_ctt_wrap .t_caption{font-size:.875em; color:#777;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap{margin-top:4rem;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap .btn_st{cursor:pointer;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap .btn_st.st1{background:var(--siteC); color:#fff; width:240px; padding:18px 0;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap .btn_st.st1 .tt{font-size:1.1875em;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap .btn_st.st1 .xi{margin-left:1rem; transition:.3s;}
.sub_page_wrap .sub_page_ctt_wrap .btns_wrap .btn_st.st1:hover .xi{margin-left:2rem; margin-right:-1rem;}

.sp_brand{}
.sp_brand .brand_ctt_wrap{margin-top:60px;}
.sp_brand .brand_ctt_wrap > div{width:570px;}
.sp_brand .brand_ctt_wrap > div .img_wrap{height:380px;}
.sp_brand .brand_ctt_wrap > div .img_wrap .img{width:100%; height:100%;}
.sp_brand .brand_ctt_wrap > div .txt_wrap{margin-top:30px; text-align:center;}
.sp_brand .brand_ctt_wrap > div .txt_wrap .t1{opacity:.5; font-size:.9375em; letter-spacing:.5px; margin-bottom:1.125rem;}
.sp_brand .brand_ctt_wrap > div .txt_wrap .t2{font-size:1.0625em; letter-spacing:-.5px; color:#555; font-weight:200; margin-bottom:20px;}
.sp_brand .brand_ctt_wrap > div .txt_wrap .t3{font-size:1.5em; margin-bottom:24px;}

.sp_product{position:relative;}
.sp_product .sp_product_bg_wrap{height:400px;}
.sp_product .sp_product_bg_wrap > div{width:50%; height:100%;}
.sp_product .sp_product_bg_wrap > div .img{width:100%; height:100%;}
.sp_product .sp_product_ctt_wrap{position:absolute; left:0; top:0; height:400px; width:100%; color:#fff; transition:.3s; transition-delay:.3s;}
.sp_product .sp_product_ctt_wrap.on{background:rgba(0,0,0,.4);}
.sp_product .sp_product_ctt_wrap .box2{height:100%; position:relative;}
.sp_product .sp_product_ctt_wrap .box2 > div:not(.sp_product_in_wrap){width:50%; height:100%; padding-top:4rem; box-sizing:border-box;}
.sp_product .sp_product_ctt_wrap .box2 > div:not(.sp_product_in_wrap).off{transform:translateY(30px); opacity:0; transition-delay:0s;}
.sp_product .sp_product_ctt_wrap .box2 > div.product_ctt_r{padding-left:80px;}
.sp_product .sp_product_ctt_wrap .box2 > div .product_Q{font-weight:200; font-size:3.125em;}
.sp_product .sp_product_ctt_wrap .box2 > div .product_title{font-size:1.875em; margin-top:-.5rem; margin-bottom:46px;}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap{}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap .btn_st{cursor:pointer;}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap .btn_st.st2{background:#fff; color:#555; width:140px; padding:6px 0;}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap .btn_st.st2 .tt{}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap .btn_st.st2 .xi{margin-top:2px; margin-left:8px; transition:.3s;}
.sp_product .sp_product_ctt_wrap .box2 > div .btns_wrap .btn_st.st2:hover .xi{margin-left:14px; margin-right:-6px;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap{width:100%; height:100%; padding:0; transition:.3s; transition-delay:.9s; opacity:0; position:absolute; left:0; top:30px; z-index:-3;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap.on{display:flex; opacity:1; top:0; z-index:1; transition-delay:0;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .sp_product_in_close{position:absolute; right:0; top:2em; color:#ccc; font-size:1.5em; cursor:pointer; transition:.3s;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .sp_product_in_close:hover{color:#fff;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap > .flex{height:100%;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .title{font-size:1.5em; margin-bottom:1rem;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .t1{line-height:1.6; padding-right:3em; opacity:.8;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st{padding-left:80px;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap.n2 .gram_st{padding-left:30px;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st li:not(:nth-last-of-type(-n+2)){margin-bottom:1.5rem;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st .icon_wrap{width:80px; height:80px; background:rgba(31,59,119,.7); color:#ddd; font-family: Georgia, "Times New Roman", Times, serif; letter-spacing:0; font-size:2.5em; border-radius:50%; display:flex; justify-content:center; align-items:center; margin-right:1rem;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st .icon_wrap .num{padding-bottom:.25em; box-sizing:border-box;}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st .gram_txt{width:calc(calc(100% - 80px) - 1rem);}
.sp_product .sp_product_ctt_wrap .box2 .sp_product_in_wrap .gram_st .gram_txt .t1{padding-right:0; font-size:1.125em;}

.sp_contact{}
.sp_contact .btns_wrap{}
.sp_contact .btns_wrap .btn_st{cursor:pointer;}
.sp_contact .btns_wrap .btn_st.st1{background:var(--siteC); color:#fff; width:240px; padding:18px 0;}
.sp_contact .btns_wrap .btn_st.st1.c2{background:#333;}
.sp_contact .btns_wrap .btn_st.st1 .tt{font-size:1.1875em;}
.sp_contact .btns_wrap .btn_st.st1 .xi{margin-left:1rem; transition:.3s; margin-top:2px;}
.sp_contact .btns_wrap .btn_st.st1:hover .xi{margin-left:2rem; margin-right:-1rem;}

/*secAni*/
.conSection .ani{ opacity:0; transition:.5s;}
.conSection .ani.aniT{ transform:translateY(60px)}
.conSection .ani.aniB{ transform:translateY(-60px)}
.conSection .ani.aniL{ transform:translateX(30px)}
.conSection .ani.aniR{ transform:translateX(-30px)}
.conSection.secAni .ani{ opacity:1;}
.conSection.secAni .ani.aniT{ transform:translateY(0)}
.conSection.secAni .ani.aniB{ transform:translateY(0)}
.conSection.secAni .ani.aniL{ transform:translateX(0)}
.conSection.secAni .ani.aniR{ transform:translateX(0)}
.conSection.secAni .ani.delay1 { transition-delay:.3s;}
.conSection.secAni .ani.delay2 { transition-delay:.6s;}
.conSection.secAni .ani.delay3 { transition-delay:.9s;}
.conSection.secAni .ani.delay4 { transition-delay:1.2s;}
.conSection.secAni .ani.delay5 { transition-delay:1.5s;}
.conSection.secAni .ani.delay6 { transition-delay:1.8s;}
.conSection.secAni .ani.delay7 { transition-delay:2.1s;}
.conSection.secAni .ani.delay8 { transition-delay:2.4s;}
.conSection.secAni .ani.delay9 { transition-delay:2.7s;}
.conSection.secAni .ani.delay10{ transition-delay:3.0s;}

.flex.dv50{}
.flex.dv50 > *{width:50%;}

.location_wrap{}
.location_wrap .location_in{}
.location_wrap .location_in:not(:last-of-type){margin-bottom:4rem;}
.location_wrap .location_in .location_title{overflow:hidden; font-size:1.25em; position:relative; margin-bottom:1rem;}
.location_wrap .location_in .location_title:after{content:''; display:block; width:100%; height:3px; background:#ddd; position:absolute; right:0; top:50%; transform:translateY(-50%); z-index:-1;}
.location_wrap .location_in .location_title .xi{color:var(--siteC); padding-right:.125em; background:#fff;}
.location_wrap .location_in .location_title .tt{background:#fff; padding-right:1rem;}
.location_wrap .location_in .map_cv{box-shadow:0 0 12px 2px rgba(0,0,0,.2); border-radius:0 0 10px 10px; overflow:hidden;}
.location_wrap .location_in .map_box{padding:1.5em; box-sizing:border-box; border-top:2px solid var(--siteC);}
.location_wrap .location_in .map_box .root_daum_roughmap{width:100% !important;}
.location_wrap .location_in .map_info{padding:1.5em; box-sizing:border-box; border-top:1px solid #ddd;}
.location_wrap .location_in .map_info li:not(:last-of-type){margin-right:2rem;}
.location_wrap .location_in .map_info .map_icon{display:flex; justify-content:center; align-items:center; background:var(--siteC); color:#fff; width:36px; height:36px; border-radius:50%; margin-right:6px;}
.location_wrap .location_in .map_info .map_icon .xi{font-size:1.125em;}


.sub_page_head_img_wrap{position:relative; margin-bottom:3.5rem; max-height:320px; overflow:hidden;}
.sub_page_head_img_wrap img{margin-top:-4rem;}
.sub_page_head_img_wrap .img_cover{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.4); color:#fff;}
.sub_page_head_img_wrap .img_cover .sub_page_head_title{font-size:2.5em; font-weight:bold; position:relative;}
.sub_page_head_img_wrap .img_cover .sub_page_head_title:before{content:''; display:block; width:120px; height:4px; background:#fff; position:absolute; left:-150px; top:48%; transform:translateY(-50%);}
.sub_page_head_img_wrap .img_cover .sub_page_head_title:after{content:''; display:block; width:120px; height:4px; background:#fff; position:absolute; right:-150px; top:48%; transform:translateY(-50%);}

.sub_page_body_wrap{}
.sub_page_body_wrap > div:not(.info_wrap){width:50%;}
.sub_page_body_wrap > div.grt_box{padding-left:3rem; padding-right:3rem; box-sizing:border-box;}
.sub_page_body_wrap > div.grt_box .c_point{font-weight:bold; display:inline;}
.sub_page_body_wrap > div .tt{font-size:1.75em; margin-bottom:1.25rem;}
.sub_page_body_wrap > div.grt_box .t1{line-height:1.6; color:#777; margin-bottom:1.5rem;}
.sub_page_body_wrap > div.grt_box .t2{font-size:1.25em; font-weight:bold; margin-bottom:.875rem;}
.sub_page_body_wrap > div.grt_box .t3{color:#999; font-weight:bold;}
.sub_page_body_wrap > div.grt_box .t_centerline{display:inline-block; width:20px; height:1px; background:#333; margin:0 .5rem;}

.sub_page_body_wrap > div.graphic_wrap{padding-top:3rem;}
.sub_page_body_wrap > div.graphic_wrap .title{font-size:1.375em; colro:#555; line-height:1.6; text-align:center;}
.sub_page_body_wrap > div.graphic_wrap .box_st{background:#fff; box-shadow:0 0 15px 2px rgba(0,0,0,.1); padding:30px 0; width:80%; text-align:center; margin-bottom:2rem;}
.sub_page_body_wrap > div.graphic_wrap .box_st .t1{font-size:1.0625em; color:var(--siteC); font-weight:bold; margin-bottom:1rem;}
.sub_page_body_wrap > div.graphic_wrap .box_st .t2{font-size:1.1250em; color:#666;}
.sub_page_body_wrap > div.graphic_wrap .box_st .t3{font-size:1.3750em; font-weight:bold;}
.sub_page_body_wrap > div.graphic_wrap .t_caption{font-size:.875em; color:#777;}

.link_st{color:var(--siteC); font-size:1.125em; font-weight:bold;}
.link_st .xi{transition:.3s; font-weight:400;}
.link_st:hover .xi{transform:rotate(45deg);}

.mall_banner_wrap{}
.mall_banner_wrap > div{width:682px; max-width:48.5%; height:220px; background-size:100%; background-position:center; background-repeat:no-repeat; cursor:pointer; position:relative; transition:.3s;}
.mall_banner_wrap > div:before{content:''; display:block; width:100%; height:100%; background:#000; opacity:.3; position:absolute; left:0; top:0; z-index:1;}
.mall_banner_wrap > div:hover{background-size:110%;}
.mall_banner_wrap > div .mb_in{display:flex; justify-content:center; align-items:center; flex-direction:column; width:100%; height:100%; position:relative; color:#fff; z-index:2;}
.mall_banner_wrap > div .mb_in .mb_title{font-size:1.5em; font-weight:bold; letter-spacing:1px; margin-bottom:2rem;}
.mall_banner_wrap > div .mb_in .mb_ctt{text-align:center; line-height:1.6; font-size:1.125em;}

.option_prd_name{font-size:.9375em;/* padding-bottom:.75rem;*/ /*border-bottom:2px solid #777;*/ flex:1 1 auto; width:calc(100% - 332px);}
/*.option_prd_name > span:first-of-type{max-width:60%;}*/
/*.option_prd_name > span:nth-of-type(2){max-width:40%;}
.option_prd_name > span.prd_count{margin-left:auto;}*/
.option_prd_name span{/*margin-right:2em;*/ position:relative; line-height:1.6;}
/*.option_prd_name span:not(:last-of-type):after{content:'\e93f'; font-family:'xeicon'; font-size:.9375em; color:#333; position:absolute; right:-1.5em; top:50%; transform:translateY(-50%);}*/
.option_prd_name span:last-of-type{margin-right:0;}

.opt_cancle{font-size:1.25em; cursor:pointer; margin-left:10px;}
.opt_cancle:hover{color:#0b54bb;}

.mall_prod_cate_name{font-size:1.25em; font-weight:bold; position:relative; display:inline-block; margin-top:2em; margin-bottom:1em;}
.mall_prod_cate_name:before{content:''; display:block; width:calc(100% + 1em); height:100%; background:#fff; position:absolute; left:0; top:50%; transform:translateY(-50%); z-index:-1;}
.mall_prod_cate_name:after{content:''; display:block; width:100vw; height:4px; background:#a8a8a8; position:absolute; left:0; top:50%; transform:translateY(-50%); z-index:-2;}

.subscribe_history_wrap{}
.subscribe_history_wrap .subscribe_history{}
.subscribe_history_wrap .subscribe_history th{background:#f5f5f5; border-top:2px solid #666;}
.subscribe_history_wrap .subscribe_history td{text-align:center;}
.subscribe_history_wrap .subscribe_history td:not(:last-of-type){border-right:1px solid #ddd;}
.subscribe_history_wrap .subscribe_history td.viewDetail{cursor:pointer;}
.subscribe_history_wrap .subscribe_history td.viewDetail:hover{text-decoration:underline; color:var(--siteC);}

.coupon_list_pop .table_notice{display:none; font-size:.875em; color:#555; margin-bottom:.5rem;}

.order_notice{display:none; font-size:.875em; color:#555; margin-top:1rem; margin-bottom:-2rem;}

.board_tit ~ .table_notice{display:none; font-size:.875em; color:#555; margin:.5rem 0;}
.subscribe_title ~ .table_notice{display:none; font-size:.875em; color:#555; margin:.5rem 0;}


.sub #footer .info_wrap .cs_wrap .cs .wrap_in.sub_dn{display:none;}
#footer .info_wrap .cs_wrap .cs .wrap_in.main_dn{display:block;}
.main #footer .info_wrap .cs_wrap .cs .wrap_in.main_dn{display:none;}

.dp2_best .tt_price.before{display:none;}

/**/
.mall_cate_tab{ margin-bottom:1.5em}
.mall_cate_tab .gnb{ border:1px solid #ddd; border-radius:0 0 1em 1em; border-top:2px solid #111; flex-wrap:wrap; overflow:hidden; background:#f5f5f5}
.mall_cate_tab .gnb > li.on{ width:100%}
.mall_cate_tab .gnb > li .dp2{ flex-wrap:wrap}
.mall_cate_tab .gnb > li .dp2 > li{ flex:1; min-width:20%}
.mall_cate_tab .gnb > li .dp2 > li > a{ display:flex; align-items:center; justify-content:center; height:4em; box-sizing:border-box; position:relative; background:#fff}
.mall_cate_tab .gnb > li .dp2 > li > a:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:var(--siteC2); opacity:.1; visibility:hidden}
.mall_cate_tab .gnb > li .dp2 > li > a:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; border-left:none; border-top:none; z-index:1}
.mall_cate_tab .gnb > li .dp2 > li > a .va{ font-weight:700; font-size:1.063em; position:relative}
.mall_cate_tab .gnb > li .dp2 > li:nth-of-type(n+5){ max-width:20%}
.mall_cate_tab .gnb > li .dp2 > li.on > a:before{ visibility:visible}
.mall_cate_tab .gnb > li .dp2 > li.on > a .va{ font-weight:800}

.listFilter{ border-radius:1em; border:1px solid #9aa2ac; margin-bottom:3em}
.listFilter .wrap_tit{ padding:1em 2em}
.listFilter .wrap_tit .tit{ display:flex; align-items:center; gap:.25em; color:#333}
.listFilter .wrap_tit .tit .t1{ font-size:1.063em; font-weight:800}
.listFilter .moreW{ position:relative; padding-right:5em}
.listFilter .moreW .moreBtn{ position:absolute; right:0; top:0; width:6em; height:100%; background:#f5f5f5; display:flex; align-items:center; gap:.25em; box-sizing:border-box; justify-content:flex-end; padding-right:.75em; color:#666; font-size:.813em; font-weight:800}
.listFilter .moreW .moreBtn .ico{ font-size:1.313em}
.listFilter .moreW .moreBtn .ico:before{content:"\e917"}
.listFilter .moreW.on .moreBtn{ background:#9aa2ac; color:#fff}
.listFilter .moreW.on .moreBtn .ico:before{content:"\e91e"}
.listFilter .moreW.on .moreBtn:after{ content:"접기"}
.listFilter .moreW .moreBtn:not(.more),
.listFilter .moreW.on .moreBtn .no,
.listFilter .moreW:not(.on) li.off{ position:absolute; visibility:hidden}
.listFilter .cellBtn{ display:flex; align-items:center; height:3.125em; justify-content:center; color:#666; border:none; background:none; gap:.5em; box-sizing:border-box; width:100%}
.listFilter .cellBtn .tt{ font-weight:800}
.listFilter .cellBtn.search{ background:var(--siteC3); color:#fff; transform:translate(1px,1px); border-bottom-right-radius:1em}
.listFilter .filterCheck{ display:flex; gap:.5em}
.listFilter .filterCheck .check{ border-radius:.5em; border:1px solid #ddd; background:#fff; color:var(--siteC2); display:flex; align-items:center}
.listFilter .filterCheck .check .t1{ font-size:.875em; font-weight:700; padding:.5em 0 .5em 1em}
.listFilter .filterCheck .check .btnDel{ width:2em; height:2em; display:flex; align-items:center; justify-content:center}
.listFilter .filterCheck .check .btnDel .ico{ font-size:1.375em; color:#777}
.listFilter .filterCheck .check .btnDel .ico:before{content:"\e922"}
.listFilter .filterCheck .check .btnDel:hover .ico{ color:#111}

.listSummary{ padding-bottom:1.5em; border-bottom:1px solid #111}
.listSummary .listModeBtn.on{ border-color:transparent; background:#333; color:#fff}

.prodNW{ display:flex; flex-wrap:wrap; gap:2em 1.5em}
.prodNW .item{ width:calc(16.6666% - 1.25em)}
.prodN_st{ background:#fff; border-radius:1em; box-sizing:border-box; display:flex; flex-direction:column; position:relative; border:1px solid transparent}
.prodN_st .img_wrap{ padding:2em; border-radius:1em; border:1px solid #ddd; overflow:hidden; position:relative; background-color:#fff}
.prodN_st .img_wrap .label{ position:absolute}
.prodN_st .img_wrap .label.best{ left:1em; top:0; width:2.5em; height:2.5em; display:flex; align-items:center; justify-content:center; border-radius:0 0 .5em .5em; background:#111; color:#fff}
.prodN_st .img_wrap .label.best .t1{ font-weight:900}
.prodN_st .img_wrap .prd_iconW{ position:absolute; left:0; top:0; width:100%; box-sizing:border-box; padding:.5em}
.prodN_st .con_wrap{ display:flex; flex-direction:column; align-items:center; text-align:center; padding:.5em; gap:.125em; border-radius:0 0 1em 1em}
.prodN_st .con_wrap .tt1{ font-size:.875em; font-weight:800; color:#999}
.prodN_st .con_wrap .cPrice{ margin:.5em 0 0 0}
.prodNW[data-mode='']{ padding-top:1.5em}
.prodNW[data-mode=''] .prodN_st:hover{ border-color:#111; box-shadow:0 0 1em rgba(0,0,0,.1); transition:.3s}
.prodNW[data-mode=''] .prodN_st:hover .img_wrap{ border-color:transparent}
.prodNW[data-mode=''] .prodN_st:hover .con_wrap{ background:#f5f5f5}
.prodNW[data-mode='st1']{ gap:0}
.prodNW[data-mode='st1'] .item{ width:100%; border-bottom:1px solid #ddd}
.prodNW[data-mode='st1'] .prodN_st{ flex-direction:row; gap:2em; padding:1.5em; border-radius:0}
.prodNW[data-mode='st1'] .prodN_st .img_wrap{ width:8em}
.prodNW[data-mode='st1'] .prodN_st .con_wrap{ flex:1 1 0; min-width:0; flex-direction:row; gap:1em; font-size:1.125em}
.prodNW[data-mode='st1'] .prodN_st .con_wrap .cCate{ width:12em; text-align:left}
.prodNW[data-mode='st1'] .prodN_st .con_wrap .cTit{ flex:1 1 0; min-width:0; text-align:left}
.prodNW[data-mode='st1'] .prodN_st .con_wrap .cPrice{ margin:0; width:12em; justify-content:flex-end; display:flex}
.prodNW[data-mode='st1'] .prodN_st .con_wrap .cMemo{ width:12em}
.prodNW[data-mode='st1'] .prodN_st:hover{ background:#f5f5f5}
.prodNW[data-mode='st2']{ gap:0}
.prodNW[data-mode='st2'] .item{ width:100%; border-bottom:1px solid #ddd}
.prodNW[data-mode='st2'] .prodN_st{ flex-direction:row; gap:2em; padding:.5em 1em; border-radius:0}
.prodNW[data-mode='st2'] .prodN_st .img_wrap{ display:none}
.prodNW[data-mode='st2'] .prodN_st .con_wrap{ flex:1 1 0; min-width:0; flex-direction:row; gap:1em}
.prodNW[data-mode='st2'] .prodN_st .con_wrap .cCate{ width:12em; text-align:left}
.prodNW[data-mode='st2'] .prodN_st .con_wrap .cTit{ flex:1 1 0; min-width:0; text-align:left}
.prodNW[data-mode='st2'] .prodN_st .con_wrap .cPrice{ margin:0; width:12em; justify-content:flex-end; display:flex}
.prodNW[data-mode='st2'] .prodN_st .con_wrap .cMemo{ width:12em}
.prodNW[data-mode='st2'] .prodN_st:hover{ background:#f5f5f5}

.prodN_st .con_wrap .btnW{ display:flex; gap:1em; padding-top:1em}
.prodN_st .con_wrap .btnW .st{ background:#999; color:#fff; display:flex; gap:1em; align-items:center; padding:.5em 1.5em; border-radius:2em; font-size:.875em; font-weight:700}
.prodN_st .con_wrap .btnW .st:after{ content:"\e93f"; font-family:xeicon; transition:.3s}
.prodN_st .con_wrap .btnW .st:hover:after{ transform:translateX(.5em)}
.prodN_st .spec_wrap{ display:flex; flex-direction:column; gap:1em}
.prodN_st .spec_wrap .wrap_tit .t1{ font-weight:800}
.prodN_st .spec_wrap .wrap_list{ display:flex; flex-wrap:wrap; gap:.5em 1em; font-size:.813em; line-height:1.1}
.prodN_st .spec_wrap .wrap_list > li{ width:calc(50% - .5em); display:flex; gap:.5em}
.prodN_st .spec_wrap .wrap_list > li .tit{ width:8em; position:relative; padding-right:1em; box-sizing:border-box}
.prodN_st .spec_wrap .wrap_list > li .tit:after{ content:":"; position:absolute; right:0; top:50%; transform:translateY(-50%)}
.prodN_st .spec_wrap .wrap_list > li .tit .t1{ font-weight:800}
.prodN_st .spec_wrap .wrap_list > li .tt{ flex:1; min-width:0}
.prodN_st .spec_wrap .wrap_list > li .tt .t1{ font-weight:700; color:#555}

.prodN_tit .t1{ font-weight:800}
.prodN_img{ border:1px solid #ddd; padding:1em; border-radius:1em; box-sizing:border-box}
.prodN_img.p1{ padding:3em}
.prodN_price{ display:flex; flex-wrap:wrap; align-items:baseline; gap:.25em; font-size:.938em}
.prodN_price.s1{ font-size:1.25em}
.prodN_price.s2{ font-size:1.5em}
.prodN_price.group{ flex-direction:column; align-items:center; gap:0}
.prodN_price.group.row{ flex-direction:row}
.prodN_price.group .in{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:center; gap:.25em; box-sizing:border-box}
.prodN_price .tw{ font-size:.938em; font-weight:700; color:#777}
.prodN_price .tn{ font-size:1.063em; font-weight:900; letter-spacing:-1px}
.prodN_price .tn .ko{ font-weight:700}
.prodN_price .t1{ font-size:.875em}
.prodN_price .per{ margin:0 .5em; display:flex; align-items:center; gap:.25em}
.prodN_price .per:after{ content:"\e905"; font-family:xeicon; font-size:1.25em; color:var(--siteC2)}
.prodN_price .sale{ font-size:.875em; margin-left:auto; gap:.25em}
.prodN_price .line{ display:inline-flex; position:relative; gap:.25em}
.prodN_price .line:after{ content:""; position:absolute; left:0; top:50%; width:100%; height:1px; background:#999}
.prodN_price .line > *{ font-size:1em; color:#999; font-weight:700}

.prodN_priceW{ display:flex; flex-direction:column; gap:.5em}

.prodN_total{ border-bottom:1px solid #111; padding:1.25em 0; display:flex; justify-content:flex-end; gap:3em; align-items:center}
.prodN_total .prodN_price{ font-size:1.125em}

.viewTopN{ display:flex; gap:6em}
.viewTopN .wrapImg{ width:40%}
.viewTopN .wrapImg .thumb{ display:flex; gap:.5em; margin-top:1em}
.viewTopN .wrapImg .thumb > li{ width:calc(20% - .4em)}
.viewTopN .wrapImg .thumb > li .prodN_img:hover{ box-shadow:0 0 1em rgba(0,0,0,.1)}
.viewTopN .wrapImg .thumb > li.on .prodN_img{ border-color:#111; box-shadow:0 0 1em rgba(0,0,0,.1)}
.viewTopN .wrapCon{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2em}
.viewTopN .wrapCon .viewTitN{ padding:1em 0; gap:.5em; display:flex; flex-direction:column; border-bottom:1px solid #111}
.viewTopN .wrapCon .viewTitN .t1{ font-size:2em; font-weight:800}
.viewTopN .wrapCon .viewTitN .t2{ font-size:1.125em; font-weight:800; color:#555}
.viewTopN .wrapCon .viewBtnN{ margin-top:auto; display:flex; gap:1em}
.viewTopN .wrapCon .viewBtnN .st{ flex:1; height:4em; display:flex; align-items:center; justify-content:center; border-radius:2em; background:#999; color:#fff; border:none; box-sizing:border-box; position:relative; overflow:hidden; font-weight:700}
.viewTopN .wrapCon .viewBtnN .st > *{ position:relative}
.viewTopN .wrapCon .viewBtnN .st .t1{ font-size:1.25em}
.viewTopN .wrapCon .viewBtnN .st.hover:before{ content:""; position:absolute; left:0; top:0; width:0; height:100%; background:var(--siteC)}
.viewTopN .wrapCon .viewBtnN .st.hover.hover:after{ content:"\e93e"; font-family:xeicon; font-size:1.375em; position:absolute; right:0; top:50%; transform:translateY(-50%); opacity:0}
.viewTopN .wrapCon .viewBtnN .st.hover:hover{ padding-right:3em; transition:.3s}
.viewTopN .wrapCon .viewBtnN .st.hover:hover:before{ width:100%; transition:.3s}
.viewTopN .wrapCon .viewBtnN .st.hover:hover:after{ right:1.5em; opacity:1; transition:.3s}
.viewTopN .wrapCon .viewBtnN .st.w1{ width:4em; flex:0 0 auto}
.viewTopN .wrapCon .viewBtnN .st.icoSt{ background:none}
.viewTopN .wrapCon .viewBtnN .st.icoSt .ico{ width:100%; height:100%}
.viewTopN .wrapCon .viewBtnN .st.icoSt .ico:before{ font-size:1.875em}
.viewTopN .wrapCon .viewBtnN .qtyBtn{ width:10em; border-radius:5em}
.viewTopN .wrapCon .viewBtnN .qtyBtn > *{ height:100%; min-width:3em}

.viewTabN{ position:sticky; left:0; top:calc(var(--headerH1) + var(--headerH2)); box-shadow:0 0 1em rgba(0,0,0,.1); z-index:1; background:#fff}
.viewTabN .wrapF{ display:flex; align-items:center; padding:.5em 0; gap:1em; box-sizing:border-box; height:4em}
.tBannerOff .viewTabN{ top:var(--headerH1)}
.viewTabN .in{ flex:1; height:100%; box-sizing:border-box; display:flex; align-items:center; justify-content:center; border-radius:2em}
.viewTabN .in .t1{ font-weight:800; color:#777}
.viewTabN .in.on{ background:#eee}
.viewTabN .in:hover .t1,
.viewTabN .in.on .t1{ color:#111}
.viewConW{ display:flex; flex-direction:column; padding:4em 0}
.viewConW > *{ width:100%; box-sizing:border-box}
.viewConW .viewConTit{ padding-bottom:1em; margin-bottom:2em; border-bottom:1px solid #111}
.viewConW .viewConTit .t1{ font-weight:800; font-size:1.625em}
.viewConW .viewCon{ display:flex; flex-direction:column; gap:4em; overflow:hidden; position:relative; box-sizing:border-box}
.viewConW .viewCon > *{width:100%; box-sizing:border-box}
.viewConW .viewCon .viewConMore{ position:absolute; left:50%; bottom:0; transform:translate(-50%, 0); width:100%; display:none}
.viewConW .viewCon:not(.on) .viewConMore:after{ content:""; position:absolute; left:0; bottom:100%; height:8em; width:100%; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.viewConW .viewCon .viewConMore .more{ display:flex; align-items:center; justify-content:center; gap:.5em; background:#fff; box-sizing:border-box; border:1px solid #111; height:3em}
.viewConW .viewCon .viewConMore .more .ico:before{content:"\e936"}
.viewConW .viewCon .viewConMore .more .tt{ font-size:.938em}
.viewConW .viewCon .viewConMore .more .tt:before{ content: attr(data-tt)}
.viewConW .viewCon.re:not(.on){ max-height:80vh}
.viewConW .viewCon.re .viewConMore{ display:block}
.viewConW .viewCon.on{ padding-bottom:5em}
.viewConW .viewCon.on .viewConMore .more{ border-color:#ddd}
.viewConW .viewCon.on .viewConMore .more .ico{ transform:rotate(180deg); transition:.3s}
.viewConW .viewCon.on .viewConMore .more .tt:before{ content: attr(data-tt2)}

/**/
.radius{ border-radius:1em; overflow:hidden}
.shadow{ box-shadow:0 0 1em rgba(0,0,0,.2)}

.vod_wrap{ position:relative}
.vod_wrap .vod{ position:absolute; left:50%; transform:translateX(-50%); top:0; width:auto; height:100%; object-fit:cover}
.vod_wrap .layer{ position:absolute; left:0; top:0; width:100%; height:100%}
.visualSlide .el{ position: relative; overflow:hidden; background:#fff; height:560px}
.visualSlide .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%}
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg{ transition:7s; transform:scale(1) rotate(.001deg)}
.visualSlide{ opacity:0}
.load .visualSlide{ opacity:1; transition:.5s}

.visualSlide_wrap{ position:relative}
.visualSlide_control{ position:absolute; z-index:100; left: 50%; transform:translateX(-50%); bottom:1em; background:#fff; border-radius:3em; overflow:hidden; padding:.25em .5em}
.visualSlide_control .paging{ padding:0 1em}


/*page 공통*/
.main_con{ padding: 4em 0;}

.con_idx { position:relative } 
.con_idx > .idx { position:absolute; left:0; top:0; width:100%; visibility:hidden; filter:alpha(opacity=0); opacity:0; display: none; } 
.con_idx > .idx.on { position:relative; visibility: visible; filter:alpha(opacity=100); opacity:1; display: block; } 

/**/
.page_tit { margin-bottom:1.5em; gap:.5em } 
.page_tit .tit0 { font-weight:500; font-size:1.375em; color:var(--siteC2) } 
.page_tit .tit1 { font-weight:800; font-size:2.15em } 
.page_tit .tit2 { font-weight:700; font-size:2em } 
.page_tit .tit3 { font-size: 2.4em; font-weight: 800; } 
.page_tit .tt1 { font-weight:600; font-size:1.125em; color: #666; line-height:1.6; margin-top: 1em; } 
.page_tit .tt2 { font-weight:500; font-size:1.25em; opacity:.8; line-height:1.6 } 
.page_tit.white { color:#fff } 

/**/
.btn-con{ display: inline-block;}
.round-arrow { width:2.5em; height:2.5em; border-radius:50%; border:1px solid rgba(255,255,255,.5); display:flex; align-items:center; justify-content:center; transition: .25s;} 
.round-arrow .arrow:before { content:"\e907" } 
.round-arrow.s1 { font-size:.875em } 
.round-arrow.s2 { font-size:.675em } 
.round-arrow.c1 { background: #000; color:#fff; border-color:transparent } 
.round-arrow.c2 { background: #dddddd; color: #777; border-color:transparent;}

.round-arrow.c2:hover{ background: var(--siteC); color: #fff;}

/*flex box*/
.flex_box { } 
.flex_box.s1 { margin: 0 0 -1em -1em; } 
.flex_box.s2 { margin: 0 0 -2em -2em; } 
.flex_box.s3 { } 
.flex_box.s4 { } 
.flex_box.s5 { } 

.flex_box .fst1 > li { flex: 1 1 100%; max-width: 100%; } 
.flex_box .fst1 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst2 > li { flex: 1 1 50%; max-width: 50%; } 
.flex_box .fst2 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst3 > li { flex: 1 1 33.33%; max-width: 33.33%; } 
.flex_box .fst3 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst4 > li { flex: 1 1 25%; max-width: 25%; } 
.flex_box .fst4 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst5 > li { flex: 1 1 20%; max-width: 20%; } 
.flex_box .fst5 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst6 > li { flex: 1 1 16.66%; max-width: 16.66%; } 
.flex_box .fst6 > li > .in { margin: 0 0 1em 1em; } 
.flex_box .fst10 > li { flex: 1 1 10%; max-width: 10%; } 
.flex_box .fst10 > li > .in { margin: 0 0 1em 1em; } 

.flex_box li > a { display: block; } 

/***********메인***********/

/*메인 제품 quick*/
.main_qucik{ background: var(--siteBg1);}
.mainQuickList{}
.mainQuickList > li{}
.mainQuickList > li > .in{ position:relative; margin: 0 0 2em 2em !important; height: 17em; padding: 1.5em; box-sizing: border-box; box-shadow: 4px 0 12px  rgba(0,0,0, .1); border: 1px solid #ddd; overflow: hidden; background: #fff; border-radius: 1em; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer;}
.mainQuickList > li > .in > .infoW{}
.mainQuickList > li > .in > .infoW > .tit{ font-size: 1.215em; font-weight: 800; margin-bottom: 1em;}
.mainQuickList > li > .in > .infoW > .txt{ font-size: .875em; font-weight: 600; color: #666; line-height: 1.6;}
.mainQuickList > li > .in > .p-img{ position: absolute; bottom: -1em; right: 0; text-align: center;}
.mainQuickList > li > .in > .p-img.pr{ right: -2em;}
.mainQuickList > li > .in > .p-img.pr1{ right: -1em;}
.mainQuickList > li > .in > .p-img > img{ width: 90%; height: 100%; object-fit: contain;}

.mainQuickList > li > .in:hover .round-arrow{ background: var(--siteC); color: #fff;}

/*메인 인기상품*/
.mainProdSlide { position:relative; padding: 10px; box-sizing: border-box;} 
.Mprod_st { border: 1px solid #ddd; border-radius: .5em; overflow: hidden; cursor: pointer; box-shadow: 4px 0 12px  rgba(0,0,0, .15); transition: .2s;} 
.Mprod_st > .prod_img { position:relative; width: 100%; padding: 4em 1em; box-sizing: border-box; background: #fff; transition: .2s; } 
.Mprod_st > .prod_img > img { width: 100%; height: 100px; object-fit: contain;} 
.Mprod_st > .prod_img .best_num{ position: absolute; display: flex; align-items: center; justify-content: center; left: 1em; top: 0; width: 2.5em; padding: .65em 0; background: #000; color: #fff; border-radius: 0 0 .5em .5em; font-size: .9em; font-weight: 600;}

.Mprod_st > .prod_info{ padding: 1em; box-sizing: border-box; border-top: 1px solid #ddd; background: var(--siteBg2); }
.Mprod_st > .prod_info .topInfo{ text-align: left; margin-bottom: .75em;}
.Mprod_st > .prod_info .topInfo > .cate{ font-size: .8em; font-weight: 800; margin-bottom: .3em; color: #777;}
.Mprod_st > .prod_info .topInfo > .name{ font-size: 1.215em; font-weight: 600;}

.Mprod_st > .prod_info .btmInfo{ text-align: right;}
.Mprod_st > .prod_info .btmInfo > .price{ color: var(--siteC); font-weight: 800; margin-bottom: .2em;}
.Mprod_st > .prod_info .btmInfo > .price > i{ font-weight: normal;}
.Mprod_st > .prod_info .btmInfo > .delivery{ font-size: .8em; font-weight: 800; color: #777;}

.Mprod_st:hover{ border: 1px solid var(--siteC);}

.mainProdSlide_control .swiperPauseWrap{ display: flex; align-items: center; gap: .5em;}
.mainProdSlide_control { display: flex; align-items: center; gap: 1em; padding-top: 2em; padding-bottom: 4em; } 
.mainProdSlide_control { position: relative; } 
.mainProdSlide_control .paging_con{ position: relative; width: 100%;}
.mainProdSlide_control .paging_con .paging{ width: 100%; height: 2px;} 
.mainProdSlide_control .swiper-button-disabled{ pointer-events: auto !important;}
.mainProdSlide_control .paging_Slide .swiperPauseWrap { position: absolute; right: 1em; top: -1.5em; } 

/*메인 베스트*/
.main_category{ background: var(--siteBg2);}
.main_category .prod_tab { border: 1px solid #ddd; border-radius: .3em; margin-bottom: 3em;} 
.main_category .prod_tab > li { flex: 1; border-right: 1px solid #ddd; cursor: pointer; } 
.main_category .prod_tab > li:last-of-type { border-right: none; border-top-right-radius: .5em;} 
.main_category .prod_tab > li:first-of-type > .tabT{ border-top-left-radius: .5em; border-bottom-left-radius: .5em;}
.main_category .prod_tab > li:last-of-type > .tabT{ border-top-right-radius: .5em; border-bottom-right-radius: .5em;}
.main_category .prod_tab > li > .tabT { position:relative; display: flex; padding: 1.05em 0; justify-content: center; gap: .75em; align-items: center; color:var(--siteC); min-width: 9em; background: #fff; } 
.main_category .prod_tab > li > .tabT:before{ position: absolute; width: 103%; margin: 0 auto; height: 100%; top: 0; left: -1.5%; border-radius: .5em; background: var(--siteC); content: ''; opacity: 0; visibility: hidden; z-index: 1; transition: .3s;}
.main_category .prod_tab > li > .tabT:after{ position: absolute; font-size: 1.5em; bottom: -.95em; left: 50%; font-family: 'xeicon'; transform: translateX(-50%); opacity: 0; visibility: visible; content: '\e935';  transition: .3s;}
.main_category .prod_tab > li > .tabT > img { width: 1.15em; } 
.main_category .prod_tab > li > .tabT > .tt{ position:relative; font-size: 1.15em; font-weight: 800; color: #888; z-index: 2; transition: .3s;}

.main_category .prod_tab > li.on > .tabT:before { opacity: 1; visibility: visible;} 
.main_category .prod_tab > li.on > .tabT:after{ opacity: 1; visibility: visible;}
.main_category .prod_tab > li.on > .tabT > .tt { color: #fff;} 

/*메인 키워드*/
.keywordList{ display: flex; gap: 1em; justify-content: center; margin-bottom: 2.5em;}
.keywordList > li{ padding: .75em 1.5em; background: var(--siteBg2); border-radius: 100px;}
.keywordList > li > .tagCon{ display: flex; gap: .3em; align-items: center;}
.keywordList > li > .tagCon > span{ font-size: 1em; font-weight: 700;}

.keySlide_wrap{ margin-bottom: 2.5em;}
.keySlide_wrap .swiperControl{ margin-top: 2em;}
.keySlide{ position: relative; border-radius: 1em; overflow: hidden;}
.keySlide .el{}
.keySlide .el .wideCon{ position:relative; width: 100%; height: 20em;}
.keySlide .el .wideCon:before{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .25); content: ''; z-index: 1;}
.keySlide .el .wideCon > img{ width: 100%; height: 100%; object-fit: cover;}
.keySlide .el .wideCon .wideSlogan{ position: absolute; top: 50%; left: 4.5em; transform: translateY(-50%); width: 50%; color: #fff; z-index: 2;}
.keySlide .el .wideCon .wideSlogan > .title{ font-size: 2.515em; font-weight: 900; margin-bottom: .5em;}
.keySlide .el .wideCon .wideSlogan > .desc{ font-size: 1.063em; line-height: 1.4;}

/*메인 미디어*/
.media_room .media_wrap { display: flex; gap: 2em; } 
.media_room .media_wrap .notice_con { width: 70%; height: 100%;} 
.media_room .media_wrap .notice_con .notice_top { position:relative; margin-bottom: 1em; background: #5a6471; padding: 0em 2em; display: flex; gap: 1.5em; border-bottom: 1px solid #ddd; align-items: center; box-sizing: border-box; color: #fff; border-radius: .5em; overflow: hidden;} 
.media_room .media_wrap .notice_con .notice_top > .notice_L { display: flex; gap: 1em; align-items: center; } 
.media_room .media_wrap .notice_con .notice_top > .notice_L > .tt { font-size: 1.063em; font-weight: 700; } 
.media_room .media_wrap .notice_con .notice_top > .notice_Slide { width: 80%; } 

.media_room .media_wrap .data_con{ width: 30%; border: 1px solid #c8ced8; border-radius: 1em; overflow: hidden;}
.media_room .media_wrap .data_con > .data_inner{}
.media_room .media_wrap .data_con > .data_inner > .data_top{ display: flex; align-items: center; border-bottom: 1px solid #c8ced8; justify-content: space-between; padding: .95em 2em; box-sizing: border-box; background: #e7ebf3;}
.media_room .media_wrap .data_con > .data_inner > .data_top > .tit{ position:relative; font-size: 1.215em; font-weight: 800;}
.media_room .media_wrap .data_con > .data_inner > .data_top > .tit:before{ position: absolute; bottom: -.75em; width: 40px; left: 50%; transform: translateX(-50%); height: 3px; background: var(--siteC); content: ''; margin: 0 auto;}
.media_room .notice_Slide { position: relative; } 
.media_room .noticeSlide_control { } 
.media_room .noticeSlide_control .swiper-button-lock{ display: flex;}
.media_room .noticeSlide_control .prev {  } 
.media_room .noticeSlide_control .prev,
.media_room .noticeSlide_control .next { width: 2em; height: 1.5em; font-size: 1.1em; border: 1px solid rgba(255,255,255, .4);} 
.media_room .noticeSlide_control .next {  margin-bottom: -1px;} 
.media_room .noticeSlide_control .next:before { content: '\e930'; } 
.media_room .noticeSlide_control .prev:before { content: '\e936'; } 
.media_room .notice_Slide > .noticeSlide { height: 1.25em; } 
.media_room .notice_Slide > .noticeSlide .Inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5em; } 
.media_room .notice_Slide > .noticeSlide .Inner > .Tit_con { width: 80%; } 
.media_room .notice_Slide > .noticeSlide .Inner > .Tit_con > p { font-size: 1em; font-weight: 500; } 
.media_room .notice_Slide > .noticeSlide .Inner > .date { width: 20%; font-size: .9em; font-weight: 600; text-align: center; opacity: .8;} 

.media_room .notice_Slide > .noticeSlide .Inner:hover > .date,
.media_room .notice_Slide > .noticeSlide .Inner:hover > .Tit_con > p { text-decoration: underline; } 

.Plus_B { display: flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; background: #fff; color: #333; border-radius: 50%; transition: .2s; } 
.Plus_B:hover { background: var(--siteC); color: #fff; } 

.media_wrap .guide_wrap{ display: flex; gap: 1em;}
.media_wrap .guide_wrap .guide_box{ width: 35%; display: flex;}
.media_wrap .guide_wrap .guide_box .inner{ position:relative; padding: 2em;  overflow: hidden; box-sizing: border-box; flex: 1; border: 1px solid #ddd; border-radius: 1em; height: 100%;}
.media_wrap .guide_wrap .guide_box .inner > .titB{ display: flex; align-items: center; justify-content: space-between; gap: 1em; margin-bottom: 1em;}
.media_wrap .guide_wrap .guide_box .inner > .titB > .tt{ font-size: 1.15em; font-weight: 800;}
.media_wrap .guide_wrap .guide_box .tit{ font-size: 1.215em; font-weight: 700; color: #777; margin-bottom: 1em;}
.media_wrap .guide_wrap .guide_box.d1{ width: 30%;}
.media_wrap .guide_wrap .guide_box .info_wrap{ display: flex; gap: .5em;}
.media_wrap .guide_wrap .guide_box .info_wrap .iconR{ width: 2em; height: 2em; background: #000; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff;}
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt{}
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt .phNum{ font-size: 1.315em; font-weight: 900; color: #111;}
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt .infoList{ margin-top: .5em;} 
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt .infoList > li{ font-size: .9em; color: #666; line-height: 1.4; margin-bottom: .2em;}
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt .infoList > li:last-of-type{ margin-bottom: 0em;}
.media_wrap .guide_wrap .guide_box .info_wrap .infoTxt .infoList > li > b{ font-weight: 800; color: #111;}

.media_wrap .guide_wrap .guide_box.d1 .inner{ background: var(--siteBg2);}
.media_wrap .guide_wrap .guide_box .inner .img_con{ position: absolute; right: 0; bottom: 0;}
.media_wrap .guide_wrap .guide_box .inner .img_con > img{ width: 100%; height: 80px; object-fit: contain;}
.media_wrap .guide_wrap .guide_box .inner .txt{ font-size: .95em; line-height: 1.4; color: #444;}

/*small btn*/
.sm_btm .titB{ display: flex; align-items: center; gap: .5em; margin-bottom: 1em;}
.sm_btm .tt{ font-size: 1.15em; font-weight: 800; color: #111;}
.sm_btm  .xi{ width: 1em; height: 1em; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #000; color: #fff; transition: .2s;}
.sm_btm:hover .xi,
.media_wrap .guide_wrap .guide_box:hover .titB > .xi{ background: var(--siteC); transform: rotate(90deg);}

.media_room .media_wrap .data_con .data_inner{}
.media_room .media_wrap .data_con .data_inner .data_btn{ padding: 1.5em; box-sizing: border-box;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list{ padding-bottom: 1.5em; margin-bottom: 1.5em; border-bottom: 1px solid #ddd;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con{ display: flex; align-items: center; gap: 1em;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con > .date{ width: 25%;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con > .date > .month{ font-size: 1.15em; font-weight: 800; color: #111;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con > .date > .year{ font-size: .9em; color: #777; font-weight: 700;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con > .txt{ width: 75%;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con > .txt > .tt{ font-size: 1em; font-weight: 800; line-height: 1.4; color: #111;}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list{}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list > li{ margin-bottom: .65em;}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list > li:last-of-type{ margin-bottom: 0em;}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list > li > .tt{ position: relative; padding-left: 1em; line-height: 1; font-size: .95em; font-weight: 500;}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list > li > .tt:before{ position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); content: '';}
.media_room .media_wrap .data_con .data_inner .data_btn > .page_dot_list > li > .tt:hover{ text-decoration: underline;}
.media_room .media_wrap .data_con .data_inner .data_btn > .data_list > .con:hover > .txt{ text-decoration: underline;}

/*메인 빠른메뉴*/
.main_QuickList{ background: var(--siteBg1);}
.Quick_boxWrap{}
.Quick_boxWrap .Quick_boxList{ display: flex; align-items: center; gap: 1.5em;}
.Quick_boxWrap .Quick_boxList > li{ flex: 1;}
.Quick_boxWrap .Quick_boxList > li > .inner{ width: 100%;}
.Quick_boxWrap .Quick_boxList > li > .inner > .iconB{ height: 6em; border-radius: 1em; box-shadow: 4px 0 12px rgba(0,0,0, .1); background: #fff; display: flex; align-items: center; justify-content: center; transition: .3s;}
.Quick_boxWrap .Quick_boxList > li > .inner > .iconB > .xi{ font-size: 2em;}
.Quick_boxWrap .Quick_boxList > li > .inner > .iconB.gard{ background: linear-gradient(117deg, rgba(3,147,218,1) 0%, rgba(9,68,179, 1) 100%); color: #fff;}
.Quick_boxWrap .Quick_boxList > li > .inner > .ctit{ display: flex; margin-top: .5em; align-items: center; gap: .3em; justify-content: center; color: var(--siteC);}
.Quick_boxWrap .Quick_boxList > li > .inner > .ctit > .xi{ transform: rotate(90deg);}
.Quick_boxWrap .Quick_boxList > li > .inner > .ctit > .tt{ font-size: .9em; font-weight: 800; letter-spacing: -0.03em;}
.Quick_boxWrap .Quick_boxList > li > .inner > .tit{ text-align: center; margin-top: .5em;}
.Quick_boxWrap .Quick_boxList > li > .inner > .tit > .tt{ letter-spacing: -0.03em; font-size: .9em; font-weight: 800; color: #777;}

.Quick_boxWrap .Quick_boxList > li > .inner:hover > .iconB{ background: var(--siteC);}
.Quick_boxWrap .Quick_boxList > li > .inner:hover > .iconB > img{ filter: brightness(0) invert(1);}
.Quick_boxWrap .Quick_boxList > li > .inner:hover > .iconB.gard{ background: linear-gradient(117deg, rgba(3,147,218,1) 0%, rgba(9,68,179, 1) 100%); }


/****************sub****************/

/*인사말*/
.g_img_con { margin-bottom: 6em; } 
.g_img_con.wrapImg { width: 60%; transition: all 2s; } 
.g_img_con.wrapImg { background: url(../images/sub/greeting_img01.jpg) no-repeat center / cover; height: 420px; margin: 0 auto; } 
.g_img_con.in-view { width: 100%; } 
.g_img_con > img { width: 100%; height: 100%; } 
.gree_box { gap: 5em; padding: 0 5em;} 
.gree_box .profile_con { width: 50%; gap: 1.5em; } 
.gree_box .profile_con .info { } 
.gree_box .profile_con .info .name { font-size: 1.45em; font-weight: 600; padding: .65em 0; border-bottom: 1px solid #ddd; } 
.gree_box .profile_con .info > .tit{ font-size: 2.515em; line-height: 1.4; font-weight: 800;}
.gree_box .profile_con .profile_img { width: 16em; } 
.gree_box .profile_con .profile_img > img { width: 100%; } 
.gree_box .con { width: 50%; } 
.gree_box .con .tit { font-size: 23px; font-weight: 700; line-height: 1.6; } 
.gree_box .con .tt { font-size: 20px; line-height: 1.6; font-weight: 400; color: #444; margin-bottom: 1em;} 
.gree_box .con .tt > b{ display: contents;}
.gree_box .con .tt:last-of-type{ margin-bottom: 0em;}
.gree_box .con .from { margin-top: 1.5em; font-size: 1.35em; font-weight: 500; } 
.gree_box .con .from > b { font-weight: 800; margin-right: .3em;} 

/*도면 다운*/
.downloadBtn{ padding: 4em 0; }
.downloadBtn > .tit{ text-align: center; font-size: 1.515em; font-weight: 800; margin-bottom: 1.5em;}
.downloadBtn > .DownBtn{ display: flex; justify-content: center; flex-wrap: wrap; gap: 1em;}
.downloadBtn > .DownBtn > li{ }
.downloadBtn > .DownBtn > li > .Dbtn{ display: flex; gap: 1em; align-items: center; justify-content: space-between; padding: 1em 1.5em; box-sizing: border-box; background: var(--siteC2); color: #fff; border-radius: .5em; transition: .2s;}
.downloadBtn > .DownBtn > li > .Dbtn:hover{ background: var(--siteC);}

/*쇼핑몰 이용안내*/
.guide_Allwrap{}
.guide_Allwrap .guide_con{ margin-bottom: 2.5em;}
.guide_Allwrap .guide_con:last-of-type{ margin-bottom: 0em;}
.guide_Allwrap .guide_con > .tit{ position:relative; padding-left: .75em; font-size: 1.215em; font-weight: 800; margin-bottom: .75em;}
.guide_Allwrap .guide_con > .tit:before{ width: 5px; height: 17px; position: absolute; top: 50%; transform: translateY(-50%); left: 0; background: var(--siteC); content: '';}

/*메모*/
.memo_wrap{ border: 1px solid #111; width: 500px; border-radius: .5em; overflow: hidden;}
.memo_wrap .memoTit{ padding: .5em 1em; box-sizing: border-box; background: var(--siteBg2);}
.memo_wrap .memoTit > .tit{ font-size: 1.063em; font-weight: 800;}
.memo_wrap .innerCon{ display: flex; gap: 1em; background: #fff; padding: 1em; box-sizing: border-box;}
.memo_wrap .innerCon > .img_con{ width: 30%; max-height: 9em;}
.memo_wrap .innerCon > .img_con > img{ width: 100%; height: 100%; object-fit: contain;}
.memo_wrap .innerCon > .txtInner{ width: 70%; overflow-y: scroll; height: 9em;}
.memo_wrap .innerCon > .txtInner > .tt{ font-size: .95em; line-height: 1.4;}