/*
.mbskin .bpn{background-color: transparent;}
.input_info{float: left;width: 130px;}
.member_info_table{line-height: 2em;}
.member_info_table input{
    float: left;
    margin-top: 9px;
    margin-right: 10px;
}
.addr_info_table{}
.addr_info_table input{
    padding: 4px 0;
    float: left;
}
.addr_info_table label{
    float: left;
    margin: 9px 0px;
    width: 80px;
}
.addr_info_table .btn_frmline{
    padding: 8px 24px;
    float: left;
    height: inherit;
    margin-right: 20px;
    border-radius: 5px;
    margin: 10px 0;
    width: 100px;
    text-align: center;
}
.addr_info_table #reg_mb_zip{ float: left; padding: 18px;}
.member_info_table .sex{float: left;margin-right: 40px;}
.effect_c{position: absolute;width: 18px;height: 18px;background-color:#8bbc08;border-radius: 20px;opacity: 1;margin-left: 249px;margin-top: 43px; cursor: pointer;}
.effect_c:hover{width: 200px; height: 200px; opacity: 0; transition: 2s ease; border-radius: 400px; margin-top: -50px; margin-left: 160px; background-color:#8bbc08}

.effect_d{position: absolute;width: 18px;height: 18px;background-color:#8bbc08;border-radius: 20px;opacity: 1;margin-left: 283px;margin-top: 249px;cursor: pointer;}
.effect_d:hover{width: 200px; height: 200px; opacity: 0; transition: 2s ease; border-radius: 400px; margin-top: 159px; margin-left: 193px; background-color:#8bbc08}


.effect_e{position: absolute;width: 18px;height: 18px;background-color:#8bbc08;border-radius: 20px;opacity: 1;margin-left: 354px;margin-top: 249px;cursor: pointer;}
.effect_e:hover{width: 200px; height: 200px; opacity: 0; transition: 2s ease; border-radius: 400px; margin-top: 159px; margin-left: 264px; background-color:#8bbc08}

.effect_f{position: absolute;width: 18px;height: 18px;background-color:#8bbc08;border-radius: 20px;opacity: 1;margin-left: 435px;margin-top: 238px;cursor: pointer;}
.effect_f:hover{width: 200px; height: 200px; opacity: 0; transition: 2s ease; border-radius: 400px; margin-top: 148px; margin-left: 345px; background-color:#8bbc08}

.effect_g{position: absolute;width: 18px;height: 18px;background-color:#8bbc08;border-radius: 20px;opacity: 1;margin-left: 731px;margin-top: 161px;cursor: pointer;}
.effect_g:hover{width: 200px; height: 200px; opacity: 0; transition: 2s ease; border-radius: 400px; margin-top: 71px; margin-left: 641px; background-color:#8bbc08}
.input_info_txt{
    font-size: 0.9em;
    color: #999;
}
.ms_box1{height:170px;}
.ms_box2{height:159px}
.c15{width: 15%}
.list_menu .c85{width: 80%;padding-left: 5%;min-height:890px;}

.company{margin-bottom: 160px;}
.com_box1 img{ float: left}
.com_box1 .right{margin-bottom: 50px;}
.com_box1 .right h6{margin: 20px 0;}

.sonova_logo{margin-top: 230px;float: left;width: 50%;}
.big_num{float: left;font-size: 4em;line-height: 1em;text-align: center;width: 20%;}
.p_img{display: table; width: 100%; min-height: 400px; background: transparent;}
.swiss{margin-right: 20px;}
.no_num{color: #ccc;float: right;margin: 0 30px 0 4px;}
.sp_num{color: #8bbc07;font-size: 2.4em;float: right;line-height: 1em;}
.history{}
.history .c40 img{float: right}
.his_tit{margin-top: 76px;width: 55%;}
.s_img{width: 100%;float: left;padding: 140px 0;background-position: center center;background-size: cover;background-image:url(img/sol/ps-back.png);}
.s_img h4{margin: 0 0 600px;}
.s_img a{color: #8bbc07;}
.sol_wrap{text-align: center;position: relative;}
.img_holder{height: 200px;}
.sol_tit{width: 100%;background-color: #fff;padding: 24px 0;cursor: pointer;}
.sol_tit:hover{background-color: #8bbc07;color: #fff}
.sol-tt {margin: 80px 0 30px}
.sol h4{margin: 0 0 30px}
.sol1_p1{
    width: 84%;
    margin-top: 80px;
}
.sol1_p2{
    float: right;
    width: 84%;
    margin-top: 100px;
}
.sol1_p3{
    margin-top: 80px;
    width: 84%;
}
.sol1_gif{width: 400px;}
.sol2_img1{
    margin: 32px 0;
}
.sol2_img2{
    margin: 9px 0;
}
.sol2_img3{}
.sol5_p1{margin-top: 100px;}
.sol5_img1{}
.sol5_img2{
    margin-top: 31px;
}
.sol5_img3{
    margin-top: 50px;
}
.sol3_if{margin-left: 100px;}
.sol .sol3_p1{ margin: 50px 0 20px}
.sol .sol3_p2{ margin-top:70px;}
.why_p1{width: 424px;}



.main ul{list-style: none}
.main p{line-height: 1.5em}
.main .bord{border: 1px solid #ddd; border-radius: 3px;}
.main .l_bord{border-left: 1px solid #ddd; margin-left: -1px}
.main .bx-pager{
    right: 0;
    top: 90%;
    color: rgba(255,255,255,0) !important;
}
.list_thum a{color: #666}
 .main .sp_height{height: 223px;}
.main b{margin-right: 10px;}
.main input[type=text]{width: 90%; padding: 3% 5%; font-size: 1em}
.main textarea{width: 90%; padding: 5%; font-size: 1em}
.bord_pn{border: 1px solid #8bbc07; border-radius: 3px;}
.main label{margin-left: 10px;
    font-size: 0.8em;
    color: #999;} */




/* Ã¬Å“Â Ã¬â€ Å’Ã¬â€¢â€ž Ã«â€šÅ“Ã¬Â²Â­ */
.child_nan{}
.child_nav{}
.child_nav ul{width: 100%; text-align: center}
.child_nav li{display: inline-block !important;float: none !important;padding: 0 20px !important;}
.child_nav li a{border: none !important;}
.child_nav .z-content-inner{border: none;padding: 0 !important;}
.child_nav .z-container{border: none;}


/*Ã«Â¦Â¬Ã¬Å Â¤Ã­Å Â¸*/ 

.list-box {border: 1px solid #ddd;}
.list_menu{}
.list_menu dl{float: left;width: 100%;/* padding: 32px 15%; */margin: 0;border-top: 1px solid rgba(255,255,255,0.2);transition: 0.2s ease;}
.list_menu dt{float: left;width: 100%;padding: 20px 26px;font-size: 1.1em;cursor: pointer;}
.list_menu dd{float: left; width: 100%}

/*.list_menu dl:hover{background-color: #8bbc07; transition: 0.2s ease; }*/
.list_menu dd:hover{color: rgba(255,255,255,1);cursor: pointer; font-weight: 400;}
.list_menu dd{list-style-type: none;font-weight: 200;float: left;padding: 3px 26px;margin: 0;color: rgba(255,255,255,0.7);}
div.list_menu a.pnlink{color:#8bbc07;}
div.list_menu a.pnlink:hover {color:#666; transition: 0.2s ease; font-weight: 600;}
.list_menu li:hover {border: 1px solid #8BBC07;}
.list_menu li{list-style-type: none;width: 25%;padding: 3%;float: left;border: 1px solid #ddd; height: 377px;text-align: center;}
.list_menu li span{width: 40%;float: left;text-align: center;color: #fff; background: #8bbc07;padding: 1% 0;} 
.list_menu li h5{margin: 14px 0}
.ric span{font-weight: 500;cursor: pointer;}
.in_ear_slide{display: none; float: right;}
.list_menu .c15 dt a{color: #fff} 
.list_menu .c15 dd a{color:rgba(255,255,255,0.7);}
.list_menu .c85 a{color: #000;}
.list_menu .c85 a:hover{color: #8bbc07;}
.list_menu h5{margin-bottom: 14px;} 
.list_item img{
    height: 150px;
}  
.ric{min-height: 724px;} 
.acc_list{float: left;width: 100%;min-height: 700px;}
.acc_list a:hover{color: #8BBC07; transition: 0.2s ease;}
.acc_thum{float: left;width: 230px;margin-top: 30px;margin-bottom: 30px;background-color: #eee;text-align: center;line-height: 3em;}
.acc_thum img{width: 100%;float: left;} 
.acc_thum:hover{background-color: #8bbc07; color: #fff;}
.acc_gap{margin-left: 40px;margin-right: 40px;}
.acc_thum p{float: left;width: 100%;text-align: center;line-height: 3em;}
.acc_thum2:hover{color: #8bbc07;}
.acc_thum2{float: left;width: 186px;margin-top: 0px;margin-bottom: 30px;text-align: center;line-height: 1.6em;}
.acc_thum2 img{height: 150px;}
.acc_gap2{margin-left: 32px;}
.list_item a:hover {color: #8BBC07; transition: 0.2s ease;}
.list_menu b{color: #222;}
.total li.list_item{width: 25%}
 
.ropen-size {min-height: 150px; }
.ropen-size img {padding-top:15px}


.aid-check {background: #8BBC07; color: #fff; padding: 1%; width: 140px; border: 1px solid #8BBC07; cursor: pointer}
.aid-check:hover {background: #fff; border: 1px solid #ddd; color: #8BBC07; transition: 0.2s ease;}

.ft {list-style-type: none;width: auto;padding: 0;float: left;border: none; min-height: 0;text-align: center;}



.company {
    margin-bottom: 0px;
}

.com_box1 img {
    float: left
}

.com_box1 .right {
    margin-bottom: 50px;
}

.com_box1 .right h6 {
    margin: 20px 0;
}

.sonova_logo {
    margin-top: 230px;
    float: left;
    width: 50%;
}

.big_num {
    float: left;
    font-size: 4em;
    line-height: 1em;
    text-align: center;
    width: 20%;
}

.p_img {
    display: table;
    width: 100%;
    min-height: 400px;
    background: transparent;
}

.swiss {
    margin-right: 20px;
}

.no_num {
    color: #ccc;
    float: right;
    margin: 0 30px 0 4px;
}

.sp_num {
    color: #8bbc07;
    font-size: 2.4em;
    float: right;
    line-height: 1em;
}

.history {}

.history .c40 img {
    float: right
}

.his_tit {
    margin-top: 76px;
    width: 55%;
}

.s_img {
    width: 100%;
    float: left;
    padding: 140px 0;
    background-position: center center;
    background-size: cover;
    background-image: url(img/sol/ps-back.png);
}

.s_img h4 {
    margin: 0 0 600px;
}

.s_img a {
    color: #8bbc07;
}

.sol_wrap {
    text-align: center;
    position: relative;
}

.img_holder {
    height: 200px;
}

.sol_tit {
    width: 100%;
    background-color: #fff;
    padding: 24px 0;
    cursor: pointer;
}

.sol_tit:hover {
    background-color: #8bbc07;
    color: #fff
}

.sol-tt {
    margin: 80px 0 30px
}

.sol h4 {
    margin: 0 0 30px
}

.sol1_p1 {
    width: 84%;
    margin-top: 80px;
}

.sol1_p2 {
    float: right;
    width: 84%;
    margin-top: 100px;
}

.sol1_p3 {
    margin-top: 80px;
    width: 84%;
}

.sol1_gif {
    width: 400px;
}

.sol2_img1 {
    margin: 32px 0;
}

.sol2_img2 {
    margin: 9px 0;
}

.sol2_img3 {}

.sol5_p1 {
    margin-top: 100px;
}

.sol5_img1 {}

.sol5_img2 {
    margin-top: 31px;
}

.sol5_img3 {
    margin-top: 50px;
}

.sol3_if {
    margin-left: 100px;
}

.sol .sol3_p1 {
    margin: 50px 0 20px
}

.sol .sol3_p2 {
    margin-top: 70px;
}

.why_p1 {
    width: 424px;
}


.menu-swiss {padding: 32px 15%; } 
.menu-swiss p {font-size: 0.91em;}
.ear-slide {margin-left:3%;}
.ric p.open-slide3 {width:156px;}
.ric p.open-slide5 {width:170px;}
.total dl dd:hover {background:#8BBC07; cursor: pointer;}
/*.list_menu dd.menusel {padding: 5% 26px;}*/
 


.rosersol {
    margin: 80px 0
}

.rosersol .c33 {
    margin: 40px 0
}

.rs-07 {
    background: url(/img/ro-sol/rs-07.jpg);
    width: 100%;
    float: left;
    padding: 0px 0;
    background-position: center top;
    background-size: cover;
}

.rs-08 {
    background: url(/img/ro-sol/rs-08.jpg);
    width: 100%;
    float: left;
    padding: 0px 0;
    background-position: center top;
    background-size: cover;
}

.rs-09 {
    background: url(/img/ro-sol/rs-09.jpg);
    width: 100%;
    float: left;
    padding: 0px 0;
    background-position: center top;
    background-size: cover;
}

.sr-tabel table {
    border: 1px solid #fafafa;
}

.sr-tabel th {
    padding-top: 10px;
    padding-bottom: 40px;
}

.sr-tabel td {
    padding: 2%;
    width: 370px
}


/*ì§€ì›ì„œë¹„ìŠ¤ì•±*/

.app_p1 {
    margin: 60px 0 20px
}

.app_center_1 {
    margin: 0px 140px;
}

.app_center_2 {
    margin: 0px 200px;
}


/*ë¹„ë¥´í†  Q*/

.vq_p1 {
    margin: 130px 0 0
}


/*ì˜¤ë°ì˜¤ Q*/

.au_p1 {
    margin: 75px 0 0
}


/*ì˜¤ë°ì˜¤ v*/

.ra-head {
    background: #8BBC07;
    padding: 10px;
    border-radius: 20px;
    width: 411px;
    color: #fff;
}


/*ì´ì§€ì½œ*/

.ec_p1 {
    margin: 30px 0 20px
}

.po_p1 {
    margin: 70px 0 0
}


/*ë¡œì €íŽœ*/

.roger-c01 {
    width: 42px;
    height: 42px;
    background-color: #b12212;
    border-radius: 100%;
}

.roger-c02 {
    width: 42px;
    height: 42px;
    background-color: #dddddd;
    border-radius: 100%;
}

.roger-c03 {
    width: 42px;
    height: 42px;
    background-color: #626b73;
    border-radius: 100%;
}


/*ì»´íŒŒì¼ëŸ¿*/

.compa-c01 {
    width: 42px;
    height: 42px;
    background-color: #888888;
}

.compa-c02 {
    width: 42px;
    height: 42px;
    background-color: #b7b19b;
}


/*ëŸ­ì…”ë¦¬íŒ¨í‚¤ì§€*/

.lp-bg {
    background: url(../img/lp-bg.jpg);
    background-size: cover;
    background-position: center;
}

.lp-head {
    letter-spacing: 0.8em;
}

.lp-big {
    font-size: 4em;
    font-weight: 500;
}

.acc a div:hover {
    background: #fff;
    color: #8BBC07;
    border: 1px solid #8BBC07;
    transition: 0.2s ease;
}

 
/*ì œí’ˆ ì»¬ëŸ¬*/ 
.color-chip {width: 35px; height: 35px; border-radius: 100%; cursor: pointer; display: table; text-align: center;}
.color-chip :active {}
.c-m {margin-right: 3%;}
.p1 {background: #a48478;}
.p2 {background: #9b725f;}
.p3 {background: #6f5851;}
.p4 {background: #372324;}
.p5 {background: #a6968f;}
.p6 {background: #a8a0a2;}
.p7 {background: #554d50;}
.p8 {background: #282226;}
.p9 {background-color: #a81e13;}
.q1 {background-color: #1b1e29;}
.b01 {background-color: #e8c5a6;}
.b38 {background: rgb(112,41,143);}
.b13 {background: rgb(151,156,162);}
.b37 {background: rgb(37,77,140);}
.b14 {background: #dbaa85;}
.b22 {background: #bc8867;}
.b26 {background: #f6bb94;}
.b28 {background: #976047;}
.b19 {background: #ededed;}
.b21 {background: #c1c1c1;}
.od1 {background: #b1aaac;}
.od2 {background: #ad8f83;}
.od3 {background: #7a635b;}
.od4 {background: #afa09a;}
.od5 {background: #f4f5f6;}
.od6 {background: #c5ab9a;}
.od7 {background: #2d262b;}
.od8 {background: #60575a;}
.od9 {background: #3f2728;}
 
.s-q2 {
    width: 65px;
    height: 65px;
    background-color: #8cbc8f;
    border-radius: 100%;
    display: table;
}

.s-q3 {
    width: 65px;
    height: 65px;
    background-color: #5c949f;
    border-radius: 100%;
    display: table;
}

.s-q4 {
    width: 65px;
    height: 65px;
    background-color: #903f1f;
    border-radius: 100%;
    display: table;
}

.s-q5 {
    width: 65px;
    height: 65px;
    background-color: #8a1734;
    border-radius: 100%;
    display: table;
}

.s-q6 {
    width: 65px;
    height: 65px;
    background-color: #2c99d4;
    border-radius: 100%;
    display: table;
}

.s-q7 {
    width: 65px;
    height: 65px;
    background-color: #363483;
    border-radius: 100%;
    display: table;
}

.s-p1 {
    width: 65px;
    height: 65px;
    background-color: #a29280;
    border-radius: 100%;
    display: table
}

.s-p2 {
    width: 65px;
    height: 65px;
    background-color: #a28871;
    border-radius: 100%;
    display: table
}

.s-p3 {
    width: 65px;
    height: 65px;
    background-color: #756659;
    border-radius: 100%;
    display: table
}

.s-p4 {
    width: 65px;
    height: 65px;
    background-color: #382829;
    border-radius: 100%;
    display: table
}

.s-p5 {
    width: 65px;
    height: 65px;
    background-color: #a59c90;
    border-radius: 100%;
    display: table
}

.s-p6 {
    width: 65px;
    height: 65px;
    background-color: #acada8;
    border-radius: 100%;
    display: table
}

.s-p8 {
    width: 65px;
    height: 65px;
    background-color: #2a2a2d;
    border-radius: 100%;
    display: table
}

.s-p9 {
    width: 65px;
    height: 65px;
    background-color: #670c1e;
    border-radius: 100%;
    display: table
}

.s-q1 {
    width: 65px;
    height: 65px;
    background-color: #3e4952;
    border-radius: 100%;
    display: table
}

.s-t3 {
    width: 65px;
    height: 65px;
    background-color: #d28fac;
    border-radius: 100%;
    display: table
}

.s-b13 {
    width: 65px;
    height: 65px;
    background-color: #9e9ea1;
    border-radius: 100%;
    display: table
}

.s-b01 {
    width: 65px;
    height: 65px;
    background-color: #c7ae90;
    border-radius: 100%;
    display: table
}

.s-t7 {
    width: 65px;
    height: 65px;
    background-color: #f4f6f5;
    border-radius: 100%;
    display: table
}

.s-t7 p {
    color: #999!important;
}

.s-m6 {
    width: 65px;
    height: 65px;
    background-color: #951e21;
    border-radius: 100%;
    display: table
}

.s-m7 {
    width: 65px;
    height: 65px;
    background-color: #174a8e;
    border-radius: 100%;
    display: table
}

.s-m8 {
    width: 65px;
    height: 65px;
    background-color: #482f70;
    border-radius: 100%;
    display: table
}

.p4-h {
    width: 65px;
    height: 65px;
    background-color: #7f9796;
    border-radius: 100%;
    display: table
}

.p6-h {
    width: 65px;
    height: 65px;
    background-color: #1aa166;
    border-radius: 100%;
    display: table
}

.p8-h {
    width: 65px;
    height: 65px;
    background-color: #e6e51c;
    border-radius: 100%;
    display: table
}

.p9-h {
    width: 65px;
    height: 65px;
    background-color: #52c6d9;
    border-radius: 100%;
    display: table
}

.q1-h {
    width: 65px;
    height: 65px;
    background-color: #92288c;
    border-radius: 100%;
    display: table
}

.t3-h {
    width: 65px;
    height: 65px;
    background-color: #3853a4;
    border-radius: 100%;
    display: table
}

.b13-h {
    width: 65px;
    height: 65px;
    background-color: #ed2328;
    border-radius: 100%;
    display: table
}

.s-r1-h {
    width: 65px;
    height: 65px;
    background-color: #0c7771;
    border-radius: 100%;
    display: table
}

.s-r2-h {
    width: 65px;
    height: 65px;
    background-color: #f0d21d;
    border-radius: 100%;
    display: table
}

.s-r3-h {
    width: 65px;
    height: 65px;
    background-color: #8c1951;
    border-radius: 100%;
    display: table
}

.s-q6-h {
    width: 65px;
    height: 65px;
    background-color: #1e86b7;
    border-radius: 100%;
    display: table
}

.s-b13-2-h {
    width: 65px;
    height: 65px;
    background-color: #878988;
    border-radius: 100%;
    display: table
}

.s-q7-h {
    width: 65px;
    height: 65px;
    background-color: #1f3086;
    border-radius: 100%;
    display: table
}

.s-r4-h {
    width: 65px;
    height: 65px;
    background-color: #ce3827;
    border-radius: 100%;
    display: table
}
.sqc p {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    font-weight: 500;
}
.sqc {
    cursor: pointer;}

.ch a:hover {
    color: #8BBC07;
    transition: 0.2s ease;
}
 

/*ìŠ¤ì¹´ì´ ì»¬ëŸ¬ë³€ê²½*/
.sky-hook {}
.sky-main {position:absolute; top:0; left:0;}
.skyv-img {width: 100%; max-width: 400px; margin: 0 auto; position: relative;}
.skyv-hook {position:absolute; top:0; left:0; width: 100%;}

/*í‹°ë‚˜ì´í„°ìŠ¤ ë°¸ëŸ°ìŠ¤ ì•±*/

.tt-bg {
    background: url(/img/ttapp-bg.jpg);
    background-size: cover;
    background-position: center;
}


/*ì•¡ì„¸ì„œë¦¬ ìƒì„¸*/

.bar02 {
    width: 20%;
    float: left;
    height: 3px;
}


/*ìŠ¤ë§ˆíŠ¸ì¼€ì–´*/

.smart-bg {
    width: 100%;
    background: url(../img/smartcare/smart-07.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bar03 {
    width: 15px;
    float: left;
    height: 3px;
}


/*ì˜¤ì‹œëŠ”ê¸¸*/
#map {
    filter: grayscale(100%);
    width:100%;height:568px;
}
 
.map-box {
    width: 350px;
    height: 568px;
    z-index: 1;
    position: absolute;
    left: 50%;
    margin-left: -590px;
    background: url(../img/map-box.png);
}

.map-marker {
    position: absolute;
    z-index: 1;
    margin-top: 182px;
    margin-left: 555px;
}
 
.mapBtn {
    width: 80px;
    text-align: center;
    padding: 10px;
    background: #626b73;
    border-radius: 5px;
    color: #fff;
}

.mapBtn:hover {
    transition: 0.4s ease;
    background: #fff;
    color: #666;
}



/*ëŒ€ë¦¬ì ì°¾ê¸°*/
.distributor {width: 100%;}
.distributors-box {
    /*float: left;*/
    width: 100%;
    border-top: 1px solid #ddd;
    display: table;
    margin-top: -1px;
}

.distributors-box2 {
    width: 100%;
}
.distributors-box3 {
    width: 530px;
    height: 100%;
    background: #f2f2f2;
    padding: 20px 0;
}
button {
    background: #fff;
    border: 1px solid #f2f2f2;
    float: left;
    padding: 10px 0;
}
button:focus, button:active {background: #f2f2f2;}


.distributors-box a:hover,
.distributors-box a:active {
    color: #8BBC07;
}

.dbs .find-box {width: 280px; height: 42px; border: 2px solid #626B73; padding-left: 10px;}
.dts-box {background-color: #fff;border-radius: 5px;}
.dts-box dt, .dts-box dd, .dts-box span {color: #999999; line-height: 1.8em;}
.dts-map-box {width: 530px; background: #f2f2f2;}

.diBtn:focus {color:#8BBC07; text-decoration: none;}
.findBtn {margin-left: -35px;}
.naverBtn {background: #8bbc07; color: #fff; border: 1px solid #8bbc07; text-align: center; font-weight: 300; width: 50%; margin: 0 auto; border-radius: 5px;}
.fastBtn {background:#626b73; color: #fff; border: 1px solid #626b73; text-align: center; font-weight: 300; }
.naverBtn:hover, .fastBtn:hover {background:#ddd; border: 1px solid #ddd; transition: 0.2s ease;}


/*ì²­ë ¥ ìžê°€ì§„ë‹¨*/
.test-box {width: 20px;
	height: 20px;
	border-radius: 3px;
	background-color: #d8d8d8;
    cursor: pointer;
}
.test-box.green { background-color: #8BBC07; }
.st-02 span {color: #888888;}

/*ì „ì„¸ê³„ì§€ì‚¬*/
ul.tabs {
    margin: 0 auto;
    padding: 0;
    float: left;
    list-style: none;
    height: 46px;
    color: #888;
}
ul.tabs li {
    float: left;
    text-align:center;
    cursor: pointer;
    width:187px;
    height: 46px;
    line-height: 46px;
    background: #ffff;
    overflow: hidden;
    position: relative;
    border: 1px solid #ddd;
    margin-left: -1px;
}
ul.tabs li.active {
    background: #8BBC07;
    color: #fff;
}
.tab_container {
    /* border: 1px solid #eee; */
    border-top: none;
    clear: both;
    float: left;
    background: #FFFFFF;
    width: 100%;
}
.tab_content {
    padding: 5px;
    display: none;
}
.tab_container .tab_content ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    padding:5px;
    list-style:none
}


 
/*ìš°ë¦¬ì˜ ë¯¸ì…˜*/
figure {width: 285px; height: 192px;  overflow: hidden; position: relative; display: inline-block; vertical-align: top; margin: 10px;}
figcaption{ position: absolute;
  left: 0; right: 0;
  top: 0; bottom: 0;
  text-align: center;
  width: 100%;
  height: 100%;
  display: table;
}
figcaption div{
  display: table-cell;
  vertical-align: middle;  
    opacity: 0;
/*
  position: relative;
  top: 20px;

  color: #2c3e50;
  text-transform: uppercase;
*/
}


figure img{
          transition: all 0.5s linear;
          transform: scale3d(1, 1, 1);
}

figure:hover figcaption{
 background: rgba(0,0,0,0.6);
}

figcaption:hover div{
  opacity: 1;
  top: 0;
}

figcaption:hover div:after{
  width: 50%;
}

figure:hover img{
          transform: scale3d(1.2, 1.2, 1);
}


/*ë°°í„°ë¦¬*/
.moreBtn {
    padding: 10px 20px;
	text-align: center;
	color:#fff;
	border-radius: 3px;
	margin-top: 15px;
	background-color: #8bbc07;
	border: solid 1px #8bbc07;
    transition: 0.2s ease;
	}
.moreBtn:hover{background-color:#fff; color:#8bbc07;transition: 0.2s ease;}
 
/*í™ë³´ì˜ìƒ*/
.vid-cursor {cursor:pointer;}
 
/*ë‚˜ì´ë‹¤Q*/
.morecfff:hover {font-weight: 600; transition: 0.2s ease; cursor: pointer}

/*ë©”ì¸ ë°°ë„ˆ*/ 
.banner {position: absolute;margin-top: 20px;margin-left: -865px;left: 50%; cursor: pointer;} 

/*ì „ë¬¸ì„¼í„° ì°¾ê¸°*/
.loc_nav_wrap{width: 100%; float: left; border: 1px solid #ccc;}
.loc_nav li{display: inline-block; float: left;text-align: center; width: 50%;border-left: 1px solid #ccc; margin-left: -1px;padding: 8px 0;}
.loc_nav .active{background-color: #222;}
.loc_nav{width: 100%; }
.location input[type=text]{
    border: 4px solid #222;
    padding: 10px;
    width: 288px;
}
.addr_search{
    margin-top: 30px;
    display: none;
}
.close_sub_loc{}
.addr_search ul{
    margin-left: 2px;
}
.addr_search li{
    width: 23.3%;
    float: left;
    border: 1px solid #eee;
    margin-left: -2px;
    padding: 3% 5%;
    text-align: center;
}
.addr_search li a{color: #222;}
.addr_search li a:hover{color: #8bbc07}
.addr_search dl{
	display: none;
	position: absolute;
	margin: -32px -17px;
	width: 320px;
	background-color: #fff;
	z-index: 900;
	}
.addr_search dt{
    width: 90%;
    background-color: #8bbc07;
    color: #fff;
    padding: 3% 5%;
    font-size: 1.1em;
    word-spacing: 1em;
    text-align: left;
}
.addr_search dd{
    margin: 0;
    border: 1px solid #eee;
    width: 23.2%;
    float: left;
    margin-left: -2px;
    margin-top: -1px;
    padding: 2% 5%;
	text-align: center;
}
.addr_search dd:hover{color: #8bbc07;}
#google_map {width: 100%;height: 100%;}
.map-inner {width:495px;height:263px;}
.distributors-box dt{color: #000;font-size: 1.05em;font-weight: 600;cursor: pointer;}
.loc_list_wrap{position: absolute;z-index: 2;left: 0;height: 85%;width: 320px;overflow-y: auto;padding: 40px;background-color: #fff;box-shadow: 5px 0px 10px 0 rgba(0,0,0,0.2);}

    .loc_list_wrap form {position: relative;}
ul.loc_info{color: #222;font-size: 0.88em;}
.loc_info li{margin: 4px 0;}
.loc_dec{
    font-size: 0.9em;
    padding: 10px 0 30px;
}
.loc_map{width: 100%;height: 90%;position: absolute;right: 0;background-color: #222;}
.diBtn{position: absolute;right: 40px;margin-top: 16px;font-size: 0.9em;}
.loc_click_info{max-width: 300px;padding: 10px;float: left;}
.loc_click_info dl{margin: 10px 0;float: left;width: 100%;}
.loc_click_info dt{float: left;width: 15%;margin-top: 10px;font-weight: bold;}
.loc_click_info dd{float: left;margin: 0;width: 85%;margin-top: 10px;}
.loc_click_info .btn_wrap{width: 100%;float: left;margin-top: 20px;}
.btn_wrap div{width: 50%;float: left;text-align: center;line-height: 3em;}
.btn_wrap .btn1{background-color: #222; color: #fff}
.btn_wrap .btn2{background-color: #8bbc07; color: #fff;}
.loc_list .location input[type=text]{padding: 2% 9%; width: 80%}
.loc_list .findBtn{
    position: absolute;
    right: 22px; 
    top: 13px;
    }
.loc_pop{width: 220px;padding: 24px 70px;background: #fff;top: 50%;position: absolute;left: 50%;margin-left: -180px;z-index: 30000;border: 10px;margin-top: -78px;display: none;}
.loc_pop h4{
    font-size: 1em;
    font-weight: normal;
    text-align: center;
    float: left;
    width: 100%;
    margin-bottom: 20px;
}
.loc_popup .mo-dBtn{float: left;}
.loc_popup .fastBtn{width: 40%;float: right;border-radius: 0 5px 5px 0;}
.loc_popup .naverBtn{
    width: 90%;
    float: left;
    padding: 8%;
}

.addr_search p{width: 100%;float: left;font-size: 0.9em;margin: 40px 0;border-top: 2px solid #222;padding-top: 20px;}
/*ëª¨ë°”ì¼*/
.display_on {display: none;}
.product {display: block;} 

.acc_thum2 img.list4-img {height: 106px;} 



/* sky-b color */
.sky-b-c101{background-color:#e8c5a7;}
.sky-b-c102{background-color:#a5857a;}
.sky-b-c103{background-color:#6f5852;}
.sky-b-c104{background-color:#372324;}
.sky-b-c105{background-color:#a7968f;}
.sky-b-c106{background-color:#a89fa0;}
.sky-b-c107{background-color:#282226;}
.sky-b-c108{background-color:#1d8c72;}
.sky-b-c109{background-color:#4d8995;}
.sky-b-c110{background-color:#e18dbf;}
.sky-b-c111{background-color:#ededed;}
.sky-b-c112{background-color:#91141a;}
.sky-b-c113{background-color:#0c57a8;}
.sky-b-c114{background-color:#531c9a;}


.sky-b-c201{background-color:#008181;}
.sky-b-c202{background-color:#f6e10c;}
.sky-b-c203{background-color:#a4005d;}
.sky-b-c204{background-color:#009bcb;}
.sky-b-c205{background-color:#f5f6f6;}
.sky-b-c206{background-color:#263c9a;}
.sky-b-c207{background-color:#e73e26;}


/* vitus color */
.vitus-c101{background-color:#e8c5a7;}
.vitus-c102{background-color:#a8aaab;}
.vitus-c201{background-color:#a08c7c;}
.vitus-c202{background-color:#79675b;}
.vitus-c203{background-color:#a29b92;}
.vitus-c204{background-color:#a7a5a3;}
.vitus-c205{background-color:#5e5e5c;}

.vitus-ite-c101{background-color:#d4947b;}
.vitus-ite-c201{background-color:#d3947b;}
.vitus-ite-c202{background-color:#ab1827;}
.vitus-ite-c203{background-color:#1a5b92;}

/* cross-b color */
.cross-b-c101{background-color:#2d272b;}
.cross-b-c102{background-color:#ad8f84;}
.cross-b-c103{background-color:#3f2629;}
.cross-b-c104{background-color:#ebccaf;}
.cross-b-c105{background-color:#afa09b;}
.cross-b-c106{background-color:#60575a;}
.cross-b-c107{background-color:#f4f5f7;}
.cross-b-c108{background-color:#b0aaac;}
.cross-b-c109{background-color:#7a635b;}


/* 01-22 리스트 페이지 스타일 */
.total li.list_item {
    width: 25%;
}
.total .h4_heading {font-size: 22px; letter-spacing: -0.03em; margin-bottom: 25px; color:#333;  text-align: left;}

.list-box {border: 1px solid #ddd;}
.list_menu{}
.list_menu dl{float: left;width: 100%;/* padding: 32px 15%; */margin: 0;border-top: 1px solid rgba(255,255,255,0.2);transition: 0.2s ease;}
.list_menu dt{float: left;width: 100%;padding: 20px 26px;font-size: 1.1em;cursor: pointer;}
.list_menu dd{float: left; width: 100%}

.list_menu dd:hover{color: rgba(255,255,255,1);cursor: pointer; font-weight: 400;}
.list_menu dd{list-style-type: none;font-weight: 200;float: left;padding: 3px 26px;margin: 0;color: rgba(255,255,255,0.7);}
div.list_menu a.pnlink{color:#8bbc07;}
div.list_menu a.pnlink:hover {color:#666; transition: 0.2s ease; font-weight: 600;}
.list_menu li:hover {border: 1px solid #8BBC07;}
.list_menu li{list-style-type: none;
    padding:2%;float: left;border: 1px solid #ddd; height: auto;text-align: center; min-height: 350px;
    position: relative;
    margin-right: 3%;
    margin-bottom: 3%;
}
.list_menu ul > a:nth-child(3n) li {
    margin-right: 0;
}


.list-category {
    position: absolute;
    width: 40%;
    background: #8bbc07;
    left:10px;
    top:10px;
}

.list_menu li .list-category span {
    width: 100%;
    display: block;
    float: none;
    text-align: center;
    color: #fff;
    background: #8bbc07;
    padding: 1% 5px;
}
.ric span{font-weight: 500;cursor: pointer;}
.in_ear_slide{display: none; float: right;}
.list_menu .c15 dt a{color: #fff} 
.list_menu .c15 dd a{color:rgba(255,255,255,0.7);}
.list_menu .c85 a{color: #000;}
.list_menu .c85 a:hover{color: #8bbc07;}
.list_menu a h5{margin: 14px 0;
     font-size: 18px;
    line-height: 22px;
    color:#333;
    letter-spacing: -0.05em;
} 
.lr2 {
    margin: 0 2%;
}
.list_item img{
    height: 150px;
}  
.total ul > a:hover h5 {color: #8BBC07;  transition: 0.2s ease;}
.ric{min-height: 724px;} 
.acc_list{float: left;width: 100%;min-height: 700px;}
.acc_list a:hover{color: #8BBC07; transition: 0.2s ease;}
.acc_thum{float: left;width: 230px;margin-top: 30px;margin-bottom: 30px;background-color: #eee;text-align: center;line-height: 3em;}
.acc_thum img{width: 100%;float: left;} 
.acc_thum:hover{background-color: #8bbc07; color: #fff;}
.acc_gap{margin-left: 40px;margin-right: 40px;}
.acc_thum p{float: left;width: 100%;text-align: center;line-height: 3em;}
.acc_thum2:hover{color: #8bbc07;}
.acc_thum2{float: left;width: 186px;margin-top: 0px;margin-bottom: 30px;text-align: center;line-height: 1.6em;}
.acc_thum2 img{height: 150px;}
.acc_gap2{margin-left: 32px;}

.list_menu b{color: #222;}
.total li.list_item{width: 27%}
 
.ropen-size {min-height: 150px; }
.ropen-size img {padding-top:15px}
.gap20 {
    width: 100%;
    height: 20px;
}

.total .beee {
    background-color: #eee;
}
.total .ud10 {
    margin: 12% 0;
}
.total .t_left {
    text-align: left;
}
.total .bar {
    width: 100%;
    height: 1px;
}
.list_menu p {
    color: #888 !important;
    font-weight: 300;
    padding: 0;
    margin: 0;
    line-height:24px;
    word-break: keep-all;
    font-size: 15px;
    letter-spacing: -0.06em;
}