@charset "utf-8";

	
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900);


/* CSS Document */
/*
a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, 
em, embed,
fieldset, figcaption, figure, font, footer, form, 
h1, h2, h3, h4, h5, h6, header, hgroup, html,
i, iframe, img, ins,
kbd, 
keygen,
label, legend, li, 
meter,
nav,
object, ol, output,
p, pre, progress,
q, 
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, 
var{ background: transparent; border: 0 none; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; }
html, body {height:100%; -webkit-text-adjust:none; }
*/
body { -webkit-text-adjust:none; min-width:960px; padding:0; margin:0;font-family:Montserrat, 'Noto Sans KR', SF Pro Display, Century Gothic, 'CenturyGothic', nanumSqure, 'KoPub Dotum', 나눔고딕, AppleSDGothicNeo, sans-serif; color:#444; text-align:center; font-size:16px; line-height:24px; overflow-x: hidden;}
img {display:block; border:none; }
/*
*::-moz-selection {background-color: #fff; color: #fff;}
*::selection {background-color: #fff; color: #fff;}
*/
a {text-decoration:none; }
a:active {/*border:none;*/ outline:none;}
.clear {clear:both;}
.float-right {float:right;}
.tc-fff {color:#fff;}
.ts-11 {font-size:11px;}


body, input, textarea, select, button, table, h1, h2, h3, h4 { font-family:Montserrat, 'Noto Sans KR', SF Pro Display, Century Gothic, 'CenturyGothic', nanumSqure, 'KoPub Dotum', 나눔고딕, AppleSDGothicNeo, sans-serif;}


.all-free {width:110px; height:120px; position:fixed; z-index:9999; top:0; right:0;}
.nav-wrap {
    width:100%;
    max-width: 1920px;
    margin: auto;
    height: 94px;
    padding:0;
    text-align:left;
    z-index:999;
    position:relative;
    top:0;
    /*border-bottom: 1px solid rgb(0,0,0,0.05);*/
    }
.nav-wrap {
            -webkit-animation-duration: 1.0s;
                    animation-duration: 1.0s;
            -webkit-animation-name: slide;
                    animation-name: slide; }

@keyframes slide {
  from {
    -webkit-transform: translate(0px, -120px);
            transform: translate(0px, -120px); }
  to {
    -webkit-transform: translate(0px, 0px);
            transform: translate(0px, 0px); } }

.nav_consumer { border-bottom:0; background-color: transparent }

.pre_header {background-color: #f5f5f5;font-size: 13px;display: none;}
.pre_header .brand { margin: 0 50px;}
.pre_header .brand a { display: block; color: #808080; padding: 5px 10px; }
.pre_header .brand ul, .pre_header .brand li { list-style: none; display: inline-block}
.pre_header .brand .desk_user { float: right }
.pre_header .brand .desk_user a {  }


.nav-wrap .nav {width: calc(100% - 100px);min-width: 1200px;margin: 0 auto;padding: 0 20px;opacity: 1;transition: all 0.3s;height: 94px;}
.nav-wrap .nav .logo a {width: 129px;height: 50px;float:left;padding:0;margin: 20px 0;background-image:url(../../2024/images/logo.png);background-size:100% 100%;background-repeat:no-repeat;text-indent:9999px;background-position:left top;}
.nav-wrap .nav .logo_customer {   width: 250px;
    height: 36px;
    padding: 0;
    margin: 20px auto; }
.nav-wrap .nav .logo_customer a {
    position: absolute;
    width: 193px;
    height: 36px;
    padding: 0;
    /* margin: 20px auto; */
    background-image: url(../../2024/images/logo_customer.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    text-indent: 9999px;
    background-position: left top;
}



.nav-wrap .nav ul.mainmenu {list-style: none;width: auto;text-align: center;margin: 0;padding: 13px 0 0 0;}
.nav-wrap .nav ul.mainmenu li {display: inline-block;padding: 0 40px;transition: all 0.3s;opacity: 0.80;}
.nav-wrap .nav ul.mainmenu li:hover { background-position: 0% -10%;  cursor:pointer; opacity: 1.00;  }
.nav-wrap .nav ul.mainmenu li a { display: inline-block; font-size: 18px;  font-weight: 400; color: #000;  margin: 0; line-height: 1.1em; }
.nav-wrap .nav ul.mainmenu li a { text-decoration: none; padding: 26px 0; display: block; position: relative;}
.nav-wrap .nav ul.mainmenu li a:after { content: ''; position: absolute; border-top: 1px solid #2f6215; top: 0; left: 0; right: 100%; transition: all 500ms;}
.nav-wrap .nav ul.mainmenu li a.checked { color:#2f6215; border-top: 1px solid #2f6215; }
.nav-wrap .nav ul.mainmenu li a:hover:after { right: 0; }
.nav-wrap .nav ul.mainmenu li a:active  { color:#2f6215; }


.nav-wrap .nav .smenu {float:right;position:relative;width: calc(100% - 1000px);max-width: 300px;margin-top: 28px;}
.nav-wrap .nav .smenu .search { width: calc(100% - 60px); height: 38px; color: #666; background-image:url(../../2024/images/ico_search.png); background-position: 95% 45%; background-repeat:no-repeat;   background-color:rgba(0,0,0,0.04); border:rgba(0,0,0,0.08) solid 1px; border-radius: 38px; letter-spacing: 0.03em; padding:0 24px; cursor: pointer;transition: all 0.3s ease; }
.nav-wrap .nav .smenu .search:hover {border-color:#a1a1a1 solid 1px; background-color:rgba(0,0,0,0.08); }



.nav-scroll { position:fixed; z-index:999; opacity: 1; transition: all 0.8s; background-color: rgba(255,255,255,1); box-shadow: 0px 3px 6px 0px rgb(0,0,0,0.10);}
.nav-scroll:hover { }

.nav-scroll .nav .logo_customer a { margin: 0px auto; }

.wing_customer { position: absolute;
    top: 45%;
    width: 150px;
    left: calc(50% + 650px); z-index: 101 }

.wing_customer a { display: block; margin: 60px 0 0}


.menu_all { position:fixed; background-color:#051036;  display:none;  list-style:none; width:100%; margin:0 auto; padding:0; border-top:#0d1c50 solid 1px; text-align: center   }
.menu_all ul { position: relative; width:1600px;  margin:0 auto; }
.menu_all li {display:inline-block;/* padding:15px 52px 15px 0; */text-align: left;vertical-align: top;}
.menu_all li:nth-child(1) {padding-top: 35px;}
.menu_all li:nth-child(2) {/* padding:15px 50px 15px 0; */}
.menu_all li:nth-child(3) {/* padding:15px 80px 15px 0; */}
.menu_all li:nth-child(4) {/* padding:15px 60px 15px 0; */}
.menu_all li:nth-child(5) {/* display: none; */}
.menu_all li h1  { display:none; color:#cccccc; font-size: 15px; padding: 10px 0 15px 3px }	
.menu_all li a { display:block; color:#cccccc; font-size:14px; font-weight:500; letter-spacing:0em; text-decoration:none; text-transform:uppercase;  padding:4px 3px 4px 10px;; margin:0; font-weight:400; line-height:2.0em;  border-bottom:1px #051036 solid; transition: all 0.3s; background:url(../../2024/images/board/arrow.gif) no-repeat 0 15px   }
.menu_all li a:visited {}
.menu_all li a:hover   { color:#fff; border-bottom:1px #144aac solid; transition: all 0.3s; background:url(../../2024/images/board/ico_arrow_w.gif) no-repeat 0 15px }
.menu_all li a:active  { color:#fff; }


.ico-top {position:fixed;right:50px;bottom:20px;width:56px;height:56px;box-sizing:border-box;background:rgba(0,0,0,0.3);border:solid 1px #b0b0b0;border-radius:100%;text-indent:-999em;overflow:hidden; z-index:999;display:none; transition: all 0.3s;}
.ico-top:before {content:"";width:20px;height:10px;background:url(../../2024/images/ico_top.png) center -20px no-repeat; position:absolute;left:50%;top:50%;margin:-5px 0 0 -10px;}
.ico-top:hover { border-color:#666; background:rgba(0,0,0,1); }
.ico-top:hover::before {background-position:center -20px;}


.nav_all { display:none }
.nav_smenu { display:none }


h1 {font-size:64px; color:#333; line-height:1.0em; padding:0; margin:80px auto 20px; font-weight:400; letter-spacing:0.01em}
h1 span { letter-spacing:-0.01em}
h2 {font-size: 30px;font-weight: 700;color:#333;line-height:1.3em;padding:0;margin:0;}
h2 span { display: block; font-size:16px; font-weight:400; color:#666;line-height:1.3em; padding-top: 30px   }
h2 i { font-weight: 100; font-size: 24px; font-style: normal; color: #666}
h2 font {display: block; font-size:14px;  font-weight:400;  } 
h3 {font-size:18px;color:#333;padding:0;margin:50px auto 30px;text-align:center;}
h4 {font-size:16px; color:#333; padding:0; margin:0; font-weight:600;}



.line_box { clear: both; display: block; width: 100%; height: 1px; background-color: #ebebeb; margin:1px 0}
.line_box2 {clear: both;display: block;width: 100%;height: 1px;background-color: #ebebeb;margin: 6rem 0;}
.line_box_w {clear: both;display: block;width: 100%;height: 1px;background-color: #fff;margin: 6rem 0;}
.line_box_w2 {clear: both;display: block;width: 100%;height: 1px;background-color: #fff;margin: 2rem 0;}




figcaption {position: absolute;margin: auto;top: 37%;width: 100%;}
figcaption img { margin: auto}

figcaption h1 {font-size: 64px;font-weight: normal;color: #fff;line-height:1.3em;padding:0;margin:0;text-transform: uppercase;}
figcaption h1 span {display: inline-block;font-size: 18px;font-weight: 300;/* color:#666; */line-height:1.3em;padding-top: 30px;text-align: left; }
figcaption h1 p { font-family: new york extra large; }
figcaption h1 .l_txt {margin-left: -500px;}
figcaption h1 .r_txt {margin-left: 260px;}
figcaption h3 {font-size:32px;color:#fff;padding:0;text-align:center;margin-left: -720px;font-weight: 600;}
figcaption h3 i {display: inline-block;font-size: 18px;font-weight: 300; line-height:1.3em;padding-top: 30px;text-align: left; font-weight: 100; font-size: 24px; font-style: normal;}


#contents {position: relative; z-index: 100; width: 100%; min-width: 1200px; max-width: calc(100% - 100px); margin:0 auto; padding-top: 40px; background-color:rgba(0,0,0,0.00) }
#contents_main {position: relative; z-index: 100; width: 100%; min-width: 1200px; max-width: calc(100% - 100px); margin:0 auto; padding-top: 40px; background-color:rgba(0,0,0,0.00) }

#contents h2 { text-align: left; font-size: 36px; text-align: left; }
#contents h2 span { font-weight: 100; padding-top: 10px;  }

.sub_nav { display:block; border-bottom:1px #e6e6e6 solid;  }
.sub_nav p { width: 1600px; margin:15px auto; text-align:left;  }
.sub_nav p span { padding: 0 10px 0 14px;  color: #1a1a1a; font-size: 14px; text-transform: uppercase; background:url(../../2024/images/ic_arr.png); background-repeat:no-repeat; background-position:0% 50% }
.sub_nav p span:first-child { background: none; padding-left: 8px }
.sub_nav p span:last-child { color:#2daac0;  }


/* full banner basic */
html, body {margin: 0 auto;height: 100%;} 

.company_banner .visual-text-wrap .visual-text h1, 
.patients_banner .visual-text-wrap .visual-text h1, 
.professionals_banner .visual-text-wrap .visual-text h1  { margin-top: 220px}


.figure {  }
.image-card {position: relative;/* margin: 0 50px; */}
.image-card .pc-only  {}
.image-card .pc-only h1 { display: none;}
.image-card .pc-only img { width: 100%;}

.u-full-width, .u-full-height, [class*=ncss-] * { box-sizing: border-box;}
.pc-only video { position: absolute; top: 0; left: 0; width: 100%;}
u-full-width, .u-full-height, [class*=ncss-] * { box-sizing: border-box;}


.image-card,
#contents {opacity: 0;
  animation: box 1.2s forwards;
  animation-delay: 0s;
  transition-timing-function: ease-in;	}

@keyframes box {
  from {   }
  to {  opacity: 1;}
}


#Permit {}

.image-card .mobile-only  { display: none; }


.introduce_main { display:block; width: 100%; height:auto; margin:0 auto;  padding:0 0 40px 0; background-color: #fff; }

/* 브랜드 추천 */
.main_step_01 {}
.main_step_01 h2 { font-size: 36px; text-align: left; font-weight: 600; letter-spacing: -0.03em; margin: 15px 0 ; }
.main_step_01 h2 span { display: inline-block; font-size: 16px; font-weight: 300; margin-left: 10px; color: #666 }
.main_step_01 h2 button { float: right; border: 0; background-color:transparent; font-size: 18px; color: #666; vertical-align: middle; margin-top: 30px; margin-right: 15px;}

.main_step_01 ul { width: 100%; margin: 0 auto; text-align: center; position: relative; }
.main_step_01 ul li {float: left;margin-right: 9px;width: calc(33.333% - 0px);overflow: hidden;margin-top: -30px;margin-left: -9px;margin-bottom: 60px;}
.main_step_01 ul li:last-child { margin-right:0 }
.main_step_01 ul li div {top: 0;left: 0;width: 100%;margin: 0;vertical-align: top;font-size: 18px;color: #fff;text-align: center;text-transform: uppercase;text-shadow: 0 0 4px rgba(0, 0, 0, 0.6);letter-spacing: -0.03em;transition: all 0.3s;background-position: 50% 0%;background-size: 96% auto;background-repeat: no-repeat;opacity: 0.9;}
.main_step_01 ul li div.img_company_01 { background-image: url(../../2024/images/main/img_01_01_bg_01w.jpg); }
.main_step_01 ul li div.img_company_02 { background-image: url(../../2024/images/main/img_01_02_bg_01w.jpg); }
.main_step_01 ul li div.img_company_03 { background-image: url(../../2024/images/main/img_01_03_bg_01w.jpg); }

.main_step_01 ul li div img {transition: all 0.6s;position: inherit;margin: 6% auto 0;width: 75%;}
.main_step_01 ul li div:hover { transition: all 0.6s; cursor: pointer; background-size: 103% auto; opacity: 1;  }
.main_step_01 ul li div:hover img { transition: all 0.6s; margin: 0 auto 0;   }

.main_step_01 ul li h3 {display:block;font-size: 45px;letter-spacing:-0.01em;line-height: 1.4em;padding-top: 30px;font-weight: 700;color: #fff;}
.main_step_01 ul li h3 font:after {content: '';border-bottom: 1px solid #fff;width: 80px;margin-top: -70px;float: left;margin-left: 43.3%;}
.main_step_01 ul li h3  span {display:block;font-size: 16px;letter-spacing:-0.01em;line-height: 1.4em;padding-top: 10px;font-weight: 300;text-transform: none;}
.main_step_01 ul li h3  font { display:block; font-size:16px;  letter-spacing:-0.01em; line-height: 1.4em;  padding-top: 40px; font-weight: 300;   }

.main_step_01 .main_step_view {display: inline-block;background-color: #f5f5f5;background-image: url(../../2024/images/main/img_product_all_type_02.png);background-repeat: no-repeat;width: calc(100% + 100px);background-position: calc(100% - 0px) 50%;background-size: calc(55% - 0px) auto;text-align: left;margin-left: -50px;position: relative;}
.main_step_01 .main_step_view h3 {width: 40%;margin: 100px 0 60px 50px;font-weight: 600;text-align: left;font-size: 36px;color: #444;line-height: 1.8em;}
.main_step_01 .main_step_view h3 span { display: block; font-size: 18px; font-weight: 400; line-height: 1.4em; margin-top: 15%; }
.main_step_01 .main_step_view h3 span:after { content: ''; border-bottom: 1px solid #857676; width: 70px; margin-top: -15%; float: left; }
.main_step_01 .main_step_view img {}



.introduce_main .item_list { display: flow-root; width: 1200px; margin:0 auto; text-align:center;  }
.introduce_main .item_list li { float: left; display:inline-block; width:300px; height: 300px;  margin:0; vertical-align:top;  color: #fff; text-align: center; letter-spacing:0.01em;  background-size: 100% auto}
.introduce_main .item_list li { display:table;  }
.introduce_main .item_list li p {  display:table-cell; vertical-align:middle; width: 240px; height: 300px; padding: 0 30px; font-size:28px; font-weight: 400; background-color: rgba(0,0,0,0); transition: all 0.3s; cursor:pointer; opacity: 0}
.introduce_main .item_list li p:hover { background-color: rgba(0,0,0,0.6); opacity: 1}
.introduce_main .item_list li p font { display: block; font-size: 14px;  font-weight: 300; color: #cccccc;  margin: 10px 20px 0; line-height: 1.1em}

.main_step_02 {  }
.main_step_02 h2 { margin-top: 80px }
.main_step_02 h3 { }
.main_step_02 ul { width: 100%; margin: 0 auto; text-align: center; position: relative; }
.main_step_02 ul li { float: left; text-align: left; width: calc(33.333% - 20px); overflow: hidden;  margin-right:30px; padding-bottom: 60px; }
.main_step_02 ul li:last-child { margin-right:0 }
.main_step_02 ul li div {  }




.product-image-wrapper {display: block;transition: all 0.6s;border:#f1f1f1 solid 1px;background-color: #f0f0f0;margin: 0 0 1rem 0;}

/*
.itemlist ul li:nth-child(1n) .product-image-wrapper { background-color: #ec647d }
.itemlist ul li:nth-child(2n) .product-image-wrapper { background-color: #b473c0 }
.itemlist ul li:nth-child(3n) .product-image-wrapper { background-color: #9260b9 }
.itemlist ul li:nth-child(4n) .product-image-wrapper { background-color: #52a177 }
.itemlist ul li:nth-child(5n) .product-image-wrapper { background-color: #86c594 }
.itemlist ul li:nth-child(6n) .product-image-wrapper { background-color: #f5c986 }
.itemlist ul li:nth-child(7n) .product-image-wrapper { background-color: #ec8e48 }
.itemlist ul li:nth-child(8n) .product-image-wrapper { background-color: #f1af7d }
.itemlist ul li:nth-child(9n) .product-image-wrapper { background-color: #e8cb55 }

.itemlist ul li:nth-child(1n) .product-image-wrapper:hover img { }
.itemlist ul li:nth-child(1n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #ec647d }
.itemlist ul li:nth-child(2n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #b473c0 }
.itemlist ul li:nth-child(3n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #9260b9 }
.itemlist ul li:nth-child(4n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #52a177 }
.itemlist ul li:nth-child(5n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #86c594 }
.itemlist ul li:nth-child(6n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #f5c986 }
.itemlist ul li:nth-child(7n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #ec8e48 }
.itemlist ul li:nth-child(8n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #f1af7d }
.itemlist ul li:nth-child(9n) .product-image-wrapper:hover { transition: all 0.6s; background-color: #e8cb55 }
*/

.product-image-wrapper img {transition: all 0.6s;position: inherit;margin: 5% auto;width: auto; max-height: 300px;}
.product-image-wrapper:hover { transition: all 0.6s; background-color: #fff; }


.main_step_03 { display: inline-block; width: 100%; margin: 80px 0; }
.mall_link { }
.mall_link a { float: left; width: 8%; padding: 2.25%; margin: auto;  font-size: 18px; color: #666}
.mall_link a img { width: 100%; max-width: 95px; margin:0 auto 10px }
.mall_link a:hover {}


.product_list {display: inline-block;width: calc(100% - 260px);padding: 0;margin: 0 auto 2rem;font-size: 16px;line-height: 1.6em;min-height: 100%;height: auto !important;}

.itemlist {}
.itemlist h2 {  }
.itemlist h3 { }
.itemlist ul { width: 100%; margin: 0 auto; text-align: center; position: relative; }
.itemlist ul li {float: left;text-align: left;width: calc(33.333% - 20px);overflow: hidden;margin-right:30px;padding-bottom: 2rem;}
.itemlist ul li:nth-child(3n) { margin-right:0 }
.itemlist ul li div {  }




/*.cunit_tag*/

.main_step_02 .cunit_tag {float: right;display: none;width: 39%;text-align: right;vertical-align: top}
.itemlist .cunit_tag {float: right;display:none;width: 45%;text-align: right;vertical-align: top}
.info-wrap_product .cunit_tag { display:none; width: 100%; text-align: left; vertical-align: top}
.cunit_tag a[href] { text-decoration: none; color: #333; background-color: #f1f5fb; padding: 1px 10px; border: 0;}  
.cunit_tag a {display: inline-block;position: relative;height: 22px;margin: 0 5px 5px 0;padding: 0 9px;border: 1px solid #f5f5f5;border-radius: 12px;font-size: 11px;font-weight: 400;line-height: 20px;color: #999;text-decoration: none;vertical-align: top;}


/*.product-display-name*/
.product-display-name {display:inline-block;/* width: 55%; */text-align: left;}
.product-display-name span { display: block; }
.product-display-name .item-title {font-size: 15px;color: rgba(0,0,0,0.75);}

.product-display-name .item-title strong {font-size: 21px;margin-right: 0.4rem;color: black;font-weight: 700;}
.product-display-name .item-title font { position: absolute; font-size: 13px; color: #fff; background-color: #ff6600; border-radius: 3px; padding: 0 5px; margin-left: 5px  }
.product-display-name .item-subtitle {font-size: 12px;color: rgba(0,0,0,0.5); text-transform: none;}
.product-display-name .item-subtitle strong {color: #333;}
.product-display-name .item-unit {font-size: 15px;color: rgba(0,0,0,0.25);display: none;}

.info-wrap_product .product-display-name { display:block; width: 100%;  text-align: left;}
.info-wrap_product .product-display-name span { display: block; }
.info-wrap_product .product-display-name .item-title {
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 15px 0;
    /* letter-spacing: -0.03em; */
    }

.info-wrap_product .product-display-name .item-title i { text-transform:none; font-style: normal}
.product-display-name .item-title font { position: absolute; font-size: 13px; color: #fff; background-color: #ff6600; border-radius: 3px; padding: 0 5px; margin-left: 5px  }
.info-wrap_product .product-display-name .item-subtitle {font-size: 15px;padding-bottom: 0rem;/* font-weight: 600; */text-transform: none;}

.info-wrap_product .description {padding: 0;}
.info-wrap_product .description font {  font-size: 14px; letter-spacing: -0.03em;  color: rgba(0,0,0,0.50) }
.info-wrap_product .description font strong {margin-bottom: 0.3rem}
.info-wrap_product .description .img-thumb {display: block;width: 100%;position: absolute;margin-left: -550px;margin-top: 525px;}
.info-wrap_product .description .img-thumb span {display: inline-block;width: 74px;height: 70px;line-height: 70px;text-align: center;vertical-align: bottom;background-color: rgba(0,0,0,0.04);border: #f1f1f1 solid 1px;padding: 0;margin: 0 auto;font-size: 12px;letter-spacing: -0.03em;background-image: url(../../2024/images/common/noimage.png);background-repeat: no-repeat;background-position: 50%;background-size: 100% auto;}
.info-wrap_product .description .img-thumb span:hover { transition: all 0.6s; background-color: #fff; border:#42c911 solid 1px; }
.info-wrap_product .description .img-thumb span img {max-width: 100%;max-height: 100%;margin: auto;}
.info-wrap_product .ingredient {display: block;border:rgba(0,0,0,0.10) solid 1px;border-left: 0;border-right: 0;margin: 2rem 0;}
.info-wrap_product .ingredient ul {display: block;margin: 1rem auto;text-align: center;/* flex-wrap: nowrap; *//* justify-content: space-between; */}
.info-wrap_product .ingredient ul li {display:inline-block;margin: .2rem 0.1rem;justify-content: space-between;flex-grow: 1;flex-basis: 0;align-content: space-around;}
.info-wrap_product .ingredient ul li img {display: block;margin: 0 auto 0.8rem;}
.info-wrap_product .ingredient ul li span {}
.info-wrap_product .ingredient ul li font {border: rgba(0,0,0,0.1) solid 1px;border-radius: 2rem;padding: 0.1rem 0.8rem;font-size: 12px;color: #666;text-align: center;margin: auto;}




/*** 제품 상세 정보 ***/
.product_view {display: block;width: 100%;padding: 0;margin: 30px auto 0;font-size: 16px;line-height: 1.6em;min-height: 100%;height: auto !important;}
.product-detail { position: relative; width: 100%; /*max-width: 1200px;*/ text-align: center; margin: auto;   display: flow-root;}
.img-detail_product {position: relative;display: inline-block;width: 580px;padding: 0;text-align: left;transition: all 0.6s;border:#f1f1f1 solid 1px;background-color: #f7f7f7;margin:0;margin-right: 60px;margin-bottom: 30px;}


.img-detail_product img {transition: all 0.6s;position: inherit;margin: 0% auto;max-width: 100%;max-height: 580px;}
.img-detail_product:hover { transition: all 0.6s; background-color: #fff; }

.info-wrap_product { display: inline-block; width: 400px; padding: 0; color: #606060; box-sizing: border-box; text-align: left; vertical-align: top; /*float: right;*/}

.prd-btns {max-width: 600px;margin: auto;padding-top: 0px;}
.product-option { display: block; font-size: 16px; margin-bottom: 1rem  }
.product-option h5 { font-size: 16px; padding-bottom: 0px;}
.product-option h5 span { float: right; font-size: 11px; color: rgba(0,0,0,0.30); }
.product-option a { display:inline-block; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 5px; background-color: rgb(255, 255, 255);  color: rgba(0,0,0,0.90); width: 68px; margin: 1px; line-height: 2.6em; text-align: center; }
.product-option a:hover, .product-option a:focus, .product-option a:checked { border-color: #42c911;  }
.product-option .soldout { background-color: rgba(0,0,0,0.10);  color: rgba(0,0,0,0.90); opacity: 0.5;  }

.ingredient-txt { display: block; font-size: 16px; margin-bottom: 2rem }
.ingredient-txt h5 { font-size: 16px; padding-bottom: 0px; color: }
.ingredient-txt h5 span { float: right; font-size: 11px; color: rgba(0,0,0,0.30); }


.prd-btns a { text-align: center; transition: all 0.3s ease;  }
.prd-btns a.btn_cart { display: block; width: 100%; color: #fff; background-color: #42c911; border-radius: 3px; line-height: 3em; font-size: 18px; margin: 15px auto;  }
.prd-btns a.btn_cart:hover { background-color: #008f00; transition: all 0.3s ease; }

.prd-btns a.btn_cart2 { display: block; width: 100%; color: #fff; background-color: #ca402e; border-radius: 3px; line-height: 3em; font-size: 18px; margin: 15px auto;  }
.prd-btns a.btn_cart3 { display: block; width: 100%; color: #fff; background-color: #333; border-radius: 3px; line-height: 3em; font-size: 18px; margin: 15px auto;  }
.prd-btns a.btn_cart4 { display: block; width: 100%; color: #fff; background-color: #9035ba; border-radius: 3px; line-height: 3em; font-size: 18px; margin: 15px auto;  }

.prd-btns a.btn_cart2:hover { background-color: #992715;transition: all 0.3s ease;   }
.prd-btns a.btn_cart3:hover { background-color: #000;transition: all 0.3s ease;   }
.prd-btns a.btn_cart4:hover { background-color: #000;transition: all 0.3s ease;   }


.prd-btns a.btn_wish { display: inline-block; width: 35%; margin-right: 4%; color: #666; background-color: #fff; border-radius: 3px; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 2.5em;  line-height: 2.5em;   }
.prd-btns a.btn_back { display: inline-block; width: 60%; color: #666; background-color: #fff; border-radius: 3px; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 2.5em;    line-height: 2.5em;  }
.prd-btns a.btn_wish:hover, .prd-btns a.btn_back:hover { border-color: #42c911; color: #000; transition: all 0.3s ease; }

.product-content { width: 100%; border-top:#d8dee2 solid 1px; margin: auto; text-align: center; margin: 80px auto 0; padding-bottom: 80px; }
.product-content h3 { margin:0 auto 50px; background-color: rgb(89, 89, 89); width: 390px; line-height: 48px; border-radius: 0 0 20px 20px; font-weight: 400; font-size: 21px; color: #fff;}
.product-content img { margin: auto; text-align: center; max-width: 860px;  }

.sub_menu { display: inline-block; position: relative; width: 220px; min-height: 500px; margin: 0 30px 0 0; padding: 0; list-style: none; vertical-align: top;}
.sub_menu ul { border-top: #c3c3c3 solid 1px;  border-bottom: #c3c3c3 solid 1px; padding: 30px 0; margin-top: 30px;  }
.sub_menu ul li {  text-align: left; list-style: none; }
.sub_menu ul li a { display: block; padding: 5px 0;  color: #666; font-weight: 400; font-size: 15px;   }
.sub_menu ul li a:hover, .sub_menu ul li .checked { font-weight: 600; background-image: url(../../2024/images/ico_arrow.png); background-position: 100% 50%; background-repeat: no-repeat }

/* 버튼 속성 */
.visual-text-w { display: block;  margin:40px auto; }
.visual-text-w .btn {
    display: inline-block;
    min-width: 100px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 2em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-color: #fff;
    /* border: #605656 solid 1px; */
    }
.visual-text-w .btn > a {width: 100%;height: 48px;line-height: 48px;padding: 0 30px;color: #333;font-weight: 400;font-size: 16px;position: relative;z-index: 1;transition: all 0.2s ease;}
.visual-text-w .btn:before {content: "";width: 100%;height: 100%;background-color: #b2fffc;position: absolute;transition: all 0.2s ease;}

.visual-text-w .btn-1 {display: inline-block;min-width: 100px;position: relative;cursor: pointer;transition: all 0.3s ease;overflow: hidden;border-radius: 2em;margin: 0 auto;padding: 0;text-align: center;background-color: #16aba6;}
.visual-text-w .btn-1 > a {width: 100%;height: 48px;line-height: 48px;padding: 0 90px;color: #fff;font-weight: 400;font-size: 16px;position: relative;z-index: 1;transition: all 0.2s ease;}
.visual-text-w .btn-1:before {content: "";width: 100%;height: 100%;background-color: #027874;position: absolute;transition: all 0.2s ease;}

.visual-text-w .btn-long { display: inline-block; min-width: 100px; position: relative; cursor: pointer; transition: all 0.3s ease; overflow: hidden; border-radius: 2em; margin: 0 auto; padding: 0; text-align: center; background-color: #605656;}
.visual-text-w .btn-long > a {  width: 100%; height: 48px; line-height: 48px; padding: 0 100px; color: #fff; font-weight: 400; font-size: 16px; position: relative; z-index: 1; transition: all 0.2s ease;}
.visual-text-w .btn-long:before { content: ""; width: 100%; height: 100%; background-color: #000; position: absolute; transition: all 0.2s ease;}

.visual-text-w .btn-2:before{top: 0;left: -100%;}
.visual-text-w .btn-2:hover:before { left: 0; }
.visual-text-w .btn:hover a{   }

/*****/

.btn-circle {
    display: block;
    margin: 40px auto;
    height: auto;
}

/* 바탕 브라운 */
.btn-circle .btn {
    display: inline-block;
    min-width: 100px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 10em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-color: #605656;
    border: #605656 solid 1px;
    margin-right: 20px;
}

.btn-circle .btn > a {
    display: table-cell;
    width: 130px;
    height: 130px;
    border-radius: 65px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    position: relative;
    z-index: 1;
    transition: all 0.2s ease;
}

.btn-circle .btn:before {
    content: "";
    width: 130px;
    height: 130px;
    background-color: #000;
    position: absolute;
    transition: all 0.2s ease;
}

/* 바탕 화이트 */
.btn-circle .btn-1 {
    display: inline-block;
    min-width: 100px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 10em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-color: #fff;
    border: #605656 solid 1px;
}

.btn-circle .btn-1 > a {
    display: table-cell;
    width: 130px;
    height: 130px;
    border-radius: 65px;
    text-align: center;
    vertical-align: middle;
    color: #605656;
    font-weight: 400;
    font-size: 16px;
    position: relative;
    z-index: 1;
    transition: all 0.2s ease;
}

.btn-circle .btn-1:before {
    content: "";
    width: 130px;
    height: 130px;
    background-color: #605656;
    position: absolute;
    transition: all 0.2s ease;
}

.btn-circle .btn-2:before{ top: 0; left: -130px; }
.btn-circle .btn-2:hover:before { left: 0; }
.btn-circle .btn:hover a{   }
.btn-circle .btn-1:hover a{ color: #fff;   }


/* 원형 버튼 센터 */
.tab_box li { position: relative; display: inline-block; cursor: pointer; width: 130px; height: 130px; text-align: center; line-height: 1.0em; font-size: 16px; color: #000; margin: 20px; }
.tab_box li p { display: table-cell; width: 130px; height: 130px; border-radius: 65px; text-align: center; font-size: 16px; line-height: 24px; vertical-align: middle; border: 1px solid #e3e3e3; background-color: #fff; }
.tab_box li p:hover { border: 1px solid #605656; color: #000; }    
.tab_box li.active p { background-color: #605656; color: #fff; }


.ml_50 { margin-left: 50px }


/* 이메일 */
.email_box { position:fixed; bottom:50px; right:50px;  float:right; width:96px;  z-index:100 }
.email_box img {  width:96px; }

.popup_tel { position:fixed; top:100px; width:100%;  text-align:center; margin:0 auto;  z-index:1000; display:none;  }
.popup_tel_box { width:640px; text-align:center; margin:0 auto;  background-color:#fff; box-shadow:2px 2px 9px rgba(68,68,68,0.6); border-radius:15px;  }
.popup_tel_box h3 { font-size:40px; color:#000000; font-weight:400; padding:0; margin:0 auto }
.popup_tel_box h3 span { display:block; font-size:16px; color:#666; line-height:18px;  font-weight:400 ; margin:20px auto 20px;}
.popup_tel_box .btn_tel  {  display:block;  text-align:center; margin:10px auto; }
.popup_tel_box .btn_tel a {  display:block; text-align:center; margin:0 auto; font-size:24px; color:#fff; width:calc(100% - 60px); line-height:60px; height:60px; background-color:#674c1c }
.popup_tel_box .btn_close { display:block;  width:640px;  text-align:right;  height:88px;  float:right }
.popup_tel_box .btn_close a { float:right; text-align:right; margin:10px 10px 0 0}


/*****  푸터 *****/
.footer { display:block; width:100%; margin:0 auto 0; clear:both; padding:0; background-color:#222222; }
.footer .sns {display: inline-block;width: 100%;text-align: left;}
.footer .sns h3 {text-align: left;margin: 0;color: #fff;font-weight: 400;display: inline-block;line-height: 4rem;}
.footer .sns img {display: block; padding-top: 20%; margin: auto; text-align: center; vertical-align: middle; }
.footer .sns a:link, 
.footer .sns a:active, 
.footer .sns a:visited {float: right;background-color: #222;border-radius: 20px;width: 35px;height: 36px;padding: 0 1px 0 0;margin: 13px 5px;vertical-align: middle;border: #666 solid 1px;transition: all 0.3s ease;opacity: 0.8;}
.footer .sns a:hover { background-color:#000; border: #fff solid 1px; opacity: 1.0;  }

.footer .footer_info { width: calc(100% - 100px); max-width: 1080px; margin: auto; }

.menu_bottom { position:relative;  list-style:none; width:100%; margin:0 auto; text-align:left}
.menu_bottom ul { position: relative; display:inline-block; margin-bottom: 10px; }
.menu_bottom li {display:inline-block; padding:15px 60px 15px 0; text-align: left; vertical-align: top;  }
.menu_bottom li h1  { color:#fff; font-size: 12px; margin: 20px 0; font-weight:600;  }	
.menu_bottom li a { display:block; color:#808080; font-size:12px; font-weight:500; letter-spacing:0em; text-decoration:none; text-transform:uppercase;  padding:0px 3px 4px 0; margin:0; font-weight:400; line-height:1.6em;  border-bottom:1px #222222 solid; transition: all 0.3s;  }
.menu_bottom li a:visited {}
.menu_bottom li a:hover   { color:#fff; border-bottom:1px #808080 solid; transition: all 0.3s;  }
.menu_bottom li a:active  { color:#fff; }

.footer .box {display:block;margin: 0 auto 25px;text-align:left;padding: 40px 0;font-size: 12px;line-height: 1.6em;color:#999;border-top: #333333 solid 1px;border-bottom: #333333 solid 1px;}
.footer .box h4 {color: #fff;font-size: 14px;letter-spacing: 0.03rem;}
.footer .box span {font-weight:100;color:#666;font-family:돋움;}
.footer .box a:link, 
.footer .box a:active,     
.footer .box a:visited {color:#444;  }
.footer .box a:hover {color:#000; }
.footer .box .footer_logo { display:inline-block; width:250px; margin-top:40px; vertical-align:top; color: #999999 }
.footer .box .footer_logo img  { height: 30px; margin-bottom: 30px;  }
.footer .box font { display: inline-block; margin-right: 5px;}

.footer .box .privacy_box { float:right; margin-top:-70px; }
.footer .box .privacy_box a { color:#919090; font-size:13px; text-decoration:none    }
.footer .box .privacy_box .line { font-weight:100; color:#bdbdbd; padding:0 5px; font-family:돋움 }

.footer .box .customer {display: inline-block;}
.footer .box .customer p {}
.footer .box .customer p span {display: inline-block;font-size: 30px;font-weight: 600;color: #fff;font-family:Montserrat;margin: 1rem 0;}
.footer .box .customer .email {font-size: 16px;margin-left: 1.5rem;}

.footer .box .customer a.btn_subscribe { }
.footer .box .customer a.btn_subscribe:link, 
.footer .box .customer a.btn_subscribe:active,     
.footer .box .customer a.btn_subscribe:visited { display: inline-block; width: 60%; color: #fff; background-color: rgba(65,65,65,0.4); border-style: solid; border-width: 1px; border-color: rgba(255,255,255,0.4); border-radius: 0.5em; line-height: 2.4rem; font-size: 14px; text-align: center; transition: all 0.3s;}
.footer .box .customer a.btn_subscribe:hover {background-color: rgba(65,65,65,0.0); transition: all 0.3s; }


.footer .box .info_corp {max-width: 400px;/* margin: auto; */float: right;letter-spacing: -0.03rem;/* display: inline-block; */}
.footer .box .info_corp ul{font-size:0}
.footer .box .info_corp li{display:inline-block;margin-right:3rem;vertical-align:top}
.footer .box .info_corp li:last-child{margin-right:0}
.footer .box .info_corp li a{display:block;color: #fff;font-weight: 600;font-size: 14px;line-height:2.5rem}


.footer .copy { margin: 0 auto;  color:#808080; line-height:1em; font-size:11px; text-align: left; padding-bottom: 25px; }
.footer .copy a { margin: 0; color: #808080; }
.footer .copy a:first-child {  }
.footer_main { margin-top:0; }


.admin_tit { display: block; padding: 0; width: 1200px; text-align: left; margin: auto;}
.admin_tit h1 { color: #000; font-size: 18px; margin: 60px 0;}



.customer_box { max-width: 1200px; min-height: 450px; /*border:#e5e5e5 solid 1px;*/ padding: 0 100px; margin:0 auto 60px  }
.customer_box h4 {padding: 35px 0;font-weight: 400;text-align: left;border-bottom: #a1a1a1 solid 1px;}




.sub_banner { min-width: 1200px; max-width: calc(100% - 100px); margin: 0 auto; }
.sub_banner img { width: 100%; max-width: 1900px; margin: auto;}
.sub_banner h1 { position: absolute; width: calc(100% - 100px); margin: 10% auto 0; font-size: 24px; font-weight: 400; color: 333; font-family: 'Arita-buri'; font-family: "Arita-buri(OTF)"; font-weight: 500; line-height: 1.4em; font-size: 64px; font-family: "SF Pro Display"; font-weight: 100; color: #fff; line-height: 1.2; text-align: center; text-shadow: 0px 3px 7px rgba(44, 95, 172, 0.24); -moz-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); -webkit-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); -ms-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); display: none;}
.sub_banner h1 img { display: inline-block; width: auto; height: 38px; text-align: center; padding:0; margin: auto; vertical-align: middle;}
.sub_banner h1 span { display: inline-block; font-size: 18px; font-weight: 400; color: #333; font-family: 'Arita-buri';  font-family: "Arita-buri(OTF)"; font-weight: 500; line-height: 1.4em; text-align: left; padding-left: 15px;  text-shadow:none; vertical-align: middle;}



.tab3_nav {margin: 70px auto 0;text-align: center;text-transform: uppercase;min-width: 1200px;max-width: calc(100% - 100px);}
.tab3_nav a {display: inline-block;width: 350px;margin: 0 15px;background-color: #fff;border:#cccccc solid 1px;color: #808080;font-size: 16px;padding: 12px 0;border-radius: 2rem;transition: all 0.3s;letter-spacing: 0.09rem;}
.tab3_nav a:first-child {}
.tab3_nav a:last-child {border:#cccccc solid 1px;  }
.tab3_nav a:hover, 
.tab3_nav a.select {background-color: #4975bd;color: #fff;transition: all 0.3s;text-decoration:none;border-color: #4975bd;}
.tab3_nav p.click { position:relative; display: block; padding: 0; margin: 0; width: 178px; height: 76px; line-height: 76px;  background:#fff; border-radius: 6px; text-align:center; border-radius: 10px; }
.tab3_nav p.click > img { position:absolute; max-width:100%; max-height:100%; width:auto; height:auto; margin:auto; top:0; bottom:0; left:0; right:0;}

.tab3_nav a br{display:block}
.tab3_nav a br.mo{display:none}

.tab3_nav a.select:before {
    border-top: 14px solid transparent;
    /* 사각박스의 border 오른쪽 테두리만 투명으로 만들어 삼각형으로 만든다. */
    border-bottom: 14px solid #4975bd;
    border-right: 14px solid transparent;
    border-bottom: 14px solid #4975bd;
    transform: rotate(315deg);
    /* 삼각형 회전 */
    width: 0px;
    height: 0px;
    content: "";
    position: fixed;
    margin-top: 12px; margin-left: 4.5%;
}


.tab5_nav { margin: 50px auto;  text-align: center;  }
.tab5_nav a {  display: inline-block; width: 238px; padding: 0; margin: 0; background-color: #f6f7fb; border:#cccccc solid 1px; color:#050f33; font-size: 15px; text-align: center;  padding: 7px 0; border-right: 0 ;  transition: all 0.3s;}
.tab5_nav a:first-child { border-radius: 3px 0 0 3px}
.tab5_nav a:last-child {border:#cccccc solid 1px; border-radius: 0 3px 3px 0  }
.tab5_nav a:hover, 
.tab5_nav a.select { background-color: #050f33; color: #fff;  transition: all 0.3s;  text-decoration:none; border-color:#050f33 }

.tab6_nav {margin: 15px auto 65px;text-align: center;text-transform: uppercase;min-width: 1200px;max-width: calc(100% - 100px);}
.tab6_nav a {display: inline-block;padding: 0;margin: 0 1rem;background-color: #f1f1f1;border:none;/*border:#cccccc solid 1px;*/color:#050f33;font-size: 16px;padding: 12px 0;border-right: 0;border-radius: 2rem;transition: all 0.3s;width: calc(20% - 2px);max-width: 270px;}
.tab6_nav a:first-child {/* width:calc(16.666% + 0px); */}
/*.tab6_nav a:last-child {border:#cccccc solid 1px;  }*/
.tab6_nav a:hover, 
.tab6_nav a.select {background-color: #5fa432;color: #fff;transition: all 0.3s;text-decoration:none;border-color:#050f33;border-color: #5fa432;}
.tab6_nav p.click { position:relative; display: block; padding: 0; margin: 0; width: 178px; height: 76px; line-height: 76px;  background:#fff; border-radius: 6px; text-align:center; border-radius: 10px; }
.tab6_nav p.click > img { position:absolute; max-width:100%; max-height:100%; width:auto; height:auto; margin:auto; top:0; bottom:0; left:0; right:0;}

.tab6_nav a br{display:block}
.tab6_nav a br.mo{display:none}


/* 타이틀 */
.info_title { /*padding-top: 50px; */ }
.info_title h3 {font-size: 48px;vertical-align: middle;margin:30px auto;letter-spacing: -0.00em;}
.info_title h3 i { display: inline-block;font-weight: 100; font-size: 24px; font-style: normal; color: #666; margin-left: 0.5rem}
.info_title h3 span {display: block;font-weight: 300;color: #666;font-size: 18px;margin: 3rem 0;}
.info_title h3 font {font-weight: 400; display: inline-block; color: #666; font-size: 36px; padding-left: 10px; }
.info_title h3 p {font-size: 24px;color: #333;font-weight: 500;margin: 140px auto 0; line-height: 1.3;}
.info_title h3 p img { display: block; margin: auto; text-align: center; margin-top: 30px; padding-bottom: 30px; }
.info_title h3 p:before {content: '';border-top: 1px solid #857676;width: 120px;margin-top: -60px;left: calc(50% - 50px);position: absolute;}

#brand {margin-bottom: 5rem;}
#brand img {margin: auto;text-align: center; margin-bottom: 5rem}
#brand .resize { width: 450px; max-width: 80%;}

#company {margin-bottom: 5rem;}
#company img {margin: auto;text-align: center; margin-bottom: 3rem}
#company .resize { max-width: 80%; margin:5rem auto}

.btn_r_link { display: inline-block; float: right; margin: 20px}



/* 게시판 메뉴 서브 4개 탭 */
.tab4_nav ul { list-style: none; width: auto; text-align: center; margin: 0; padding: 0 0 0 0; border-bottom: #808080 solid 1px;}
.tab4_nav ul li { display: inline-block; padding: 0 30px; transition: all 0.3s; opacity: 0.80; }
.tab4_nav ul li:hover { background-position: 0% -10%;  cursor:pointer; opacity: 1.00;  }
.tab4_nav ul li a { display: inline-block; font-size: 16px;  font-weight: 400; color: #333;  margin: 0; line-height: 1.1em; }
.tab4_nav ul li a { text-decoration: none; padding: 36px 0; display: block; position: relative;}
.tab4_nav ul li a:after { content: ''; position: absolute; border-top: 1px solid #2f6215; top: 0; left: 0; right: 100%; transition: all 500ms;}
.tab4_nav ul li a.checked { color:#000; border-top: 1px solid #2f6215; padding-top: 35px; }
.tab4_nav ul li a:hover:after { right: 0; }
.tab4_nav ul li a:active  { color:#000; }


/* 공지사항 게시판 */
.news_list { width: 100%; margin:0 auto}
.news_list li { list-style: none; font-size: 15px; transform: rotate(0.1deg); text-align: left; line-height: 58px; border-bottom:#e6e6e6 solid 1px;  cursor:pointer; color: #808080   }
.news_list li span { display: inline-block; margin-right: 12px; width: 54px; line-height: 21px; background-color: #8cb4dd; color: #fff; font-size: 14px; transform: rotate(0.1deg); font-weight: 600; text-align: center }
.news_list li font {  float: right; font-size: 13px; color: #808080; font-weight: 100}

.list_more { display: block; text-align: left; margin-bottom: 40px; }
.list_more a { display: inline-block; font-size: 14px; padding: 40px 0; background-image: url(../../2024/images/board/ico_arrow_more.png); background-position: 100% 50%; background-repeat:no-repeat;  padding-right: 30px; color: #000;}
.list_more a:hover { opacity: 0.6}



/* faq page */
.section_qa {overflow:hidden;width:100%;height:100%;margin:0 auto; }
.h_txt{float:left;width:196px; height:42px;background:url(../../2024/images/board/sp.png) 0 -380px no-repeat}
.con{font-size:12px;line-height:18px}
.section_qa .con{height:100%; margin-bottom:50px}
.section_qa .faq_area{border-bottom:1px solid #575757}
.section_qa .faq_area ul { margin: 0}
.section_qa .faq_area li{position:relative;overflow:hidden;height:100%;border-top:1px solid #d2d2d2;vertical-align:top; text-align:left}
.section_qa .faq_area li:first-child { border-top:2px solid #575757; border-top:0;  }
.section_qa .faq_area .notice_link_box{width:95%;padding:20px 0 20px 30px;font-size:14px;font-weight:bold;background:url(../../2024/images/board/ico_about3_q.png) 3px 24px no-repeat; line-height:1.6em; }
.section_qa .faq_area .notice_link_box a{color:#222}
.section_qa .faq_area .notice_link_box.answer{width:100%; font-weight:normal;  border-top:1px solid #ebebeb;color:#666;background:url(../../2024/images/board/ico_about3_a.png) 3px 28px no-repeat; padding-top:25px}
.section_qa .faq_area .notice_link_box .answer_con{width:94%; vertical-align:1.3em; padding:0;}
.section_qa .faq_area .notice_link_box .answer_con div { padding:0; margin:0}
.section_qa .faq_area .btn_answer{position:absolute;top:20px;right:6px;width:20px;height:11px;background:url(../../2024/images/board/sp.png) -210px -380px no-repeat;}
.section_qa .faq_area .btn_answer.open{background:url(../../2024/images/board/sp.png) -210px -410px no-repeat}
.section_qa .faq_area .operating_hour{overflow:hidden}
.section_qa .faq_area .operating_hour dt{float:left;clear:both}
.section_qa .faq_area .operating_hour dd{float:left;margin-left:3px;width:80%}
.blind,legend{overflow:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0}




/****** 기본 테이블 구성 *********/


.admin_ico { float:right; margin-top:20px; margin-right:0px; }



.admin_ico img { display:inline-block;  margin:0 0 0 8px; width:36px; height:36px; background-color:#909090; border-radius:23px; padding:3px }
.admin_ico img:hover { background-color:#e60000; }

.bottom_ico { margin:20px 30px 20px 0; text-align:right }
.bottom_ico img { display:inline-block;  margin:0 0 0 8px; width:36px; height:36px; background-color:#909090; border-radius:23px; padding:3px }
.bottom_ico img:hover { background-color:#e60000; }

/****** 쓰기 *********/
.write {  width:100%; border-bottom:#b7b7b7 solid 1px; margin:0 auto; }
.write .none { border:none; }
.write th { width:150px; background-color:#fafafa; font-size:16px; font-weight:600; color:#7b7b7b; border-top:#e1e1e1 solid 1px; text-align:left; padding:5px 0 5px 25px }
.write td { font-size:12px; color:#e5e5e5; border-top:#d8d8d8 solid 1px; text-align:left; padding:7px 0 7px 15px; } 
.write td input.i_box { width:calc(100% - 20px); border:#c6c6c6 solid 1px; padding-left:5px; color:#666; font-size:16px; line-height:24px; height:24px }
.write td textarea.t_box { width:calc(100% - 24px); height:100px; border:#c6c6c6 solid 1px; padding-left:5px; color:#666; font-size:16px; line-height:24px; }
.write td select.s_box { font-size:16px; line-height:24px;}
.write td.check { font:normal 12px/18px 나눔고딕, 돋움; color:#999999; letter-spacing:-0.05em; }
.write td.smtit{color:#7b7b7b;  font-weight:bold; font-size:16px;  }


.contact .select_type_radio { margin: 0 0 20px; padding-bottom: 10px; text-align: left; border: 0; border-bottom: 1px #e6e6e6 solid; }
.contact .select_type_radio input { display: inline-block; width: auto; height: auto; vertical-align: middle;  padding: 0; margin: 0 0 0 50px}
.contact .select_type_radio input:first-child { margin-left: 0 }
.contact .select_radio{ vertical-align: middle; font-size: 21px;     margin-bottom: 18px;  display: inline-block; margin-right: 5px }  
.contact .radio_label  { display: inline-block; vertical-align: middle; font-size: 15px; transform: rotate(0.1deg); letter-spacing: 0; font-weight: 400  }
.contact .radio_label strong { font-size: 15px; transform: rotate(0.1deg); }

.contact .select_type_radio checkbox {display: inline-block; width: auto; height: auto; vertical-align: middle;  padding: 0; margin: 0 0 0 50px}


/* 문의하기 */
.contact { width:100%; margin-bottom: 50px  }
.contact input {width:calc(100% - 0px); border:0; border-bottom:1px #e6e6e6 solid; background-color:#fff; line-height:38px; font-size:15px; padding:0; margin-bottom:12px; outline:none;}
.contact input:focus,
.contact textarea:focus { border-bottom:1px #42b7c8 solid;  }

.contact textarea   {width:calc(100% - 0px); height:100px; border:0; border-bottom:1px #e6e6e6 solid; background-color:#fff; line-height:21px; font-size:15px; padding:10px 0; margin-bottom:12px; outline:none;}
.contact button  { width:100%; height: 48px;  background-color: #42b7c8; font-size: 21px; cursor:pointer; border-radius: 3px; color: #fff; border:0; }

.add_text { background-color: #eaf1f9; border-radius: 10px; color:#4c4c4c; padding: 30px; font-size: 14px}
.add_text strong { display: block; font-size: 18px; margin-bottom: 10px }

.add_box { width: 100%; background-color: #f5f5f5; font-size: 14px; line-height: 1.4em; transform: rotate(0.1deg); padding: 24px 0; margin:20px auto 0; text-align: center; font-weight: 400;}


/* 설정 관련 팝업*/ 
.popup_wrap {width:530px; margin:0 auto; padding:0; } /* 너비 조정시 보더값 주의! */

.popup_wrap h3 { color:#FFFFFF; font-size:15px; letter-spacing:-0.05em; margin-top:30px; padding-left:5px }

.popup_wrap table { padding:20px 0; }

.popup_wrap .join  { border:#262626 solid 1px; background-color:#3b3e40; *padding:20px 0; }
.popup_wrap .join th { width:120px; color:#ffffff; text-align:right; border:0; padding-right:10px; }
.popup_wrap .join td { color:#808080; border:0; margin:0; padding:3px 10px}
.popup_wrap .join td input { width:220px }
.popup_wrap .join td textarea {  }


.login_wrap {width:530px; margin:0 auto; padding:0; font-family:Verdana }
.login_wrap .login_tit { text-align:center; padding:180px 0 30px 0; color:#333 ; font-size:36px; font-family:NanumSquare; font-weight:bold; letter-spacing:-0.02em /*background-image:url(../../2024/images/logo_login.png); background-repeat:no-repeat; background-position:50% 80px;*/}
.login_wrap .login_tit span { font-size:21px; font-weight:normal; color:#666}
.login_wrap .login_bottom {text-align:center; margin:30px 0 30px 0; color:#666; font-size:12px; }
.login_wrap .login_bottom strong {  }
.login_wrap .login_bottom a { color:#39F }

.login_wrap .login  { width:420px; border:#e5e5e5 solid 1px; border-radius:10px;  background-color:#fafafa; margin:0 auto;}
.login_wrap .login table { width:320px; padding:20px 0 20px 0; margin:0 auto;}
.login_wrap .login th { color:#ffffff; border:0; }
.login_wrap .login td { color:#ffffff; border:0; margin:0; padding:0}
.login_wrap .login td input { width:220px; color:#999999; padding:6px 10px; border:#d3d3d3 solid 1px;   }
.login_wrap .login td textarea {  }
.login_wrap .login .save { padding:10px 8px 3px 3px; margin:0; font-weight:normal;  }
.login_wrap .login .save input { width:16px; border:0; padding:0; margin:0 }
.login_wrap .login .save a { color:#999999 }
.login_wrap .login .save a:hover { text-decoration:underline }


.btn_login { padding: 22px 30px; font-weight: 400; border-radius: 3px; font-size: 16px; border: 0; color: #fff; background-color: #333;}
.btn_login:hover { background-color: #000}

.popup_bottom { text-align:center; margin-top:25px; }
.center_bottom {display:block; text-align:center; margin-top:25px; margin-bottom:25px;  }
.right_bottom {display:block; text-align:right; margin-top:10px; margin-bottom:25px;  }
.footer_popup { width:100%; font-size:10px; line-height:16px; clear:both; color:#777c84; text-align:center;  }





.table_board_view { width:calc(100% - 0px); border-bottom:#e6e6e6 solid 1px; margin:0 auto;}
.table_board_view img { vertical-align:middle;  }
.table_board_view a:link,
.table_board_view a:active, 
.table_board_view a:visited { color:#4c4c4c; text-decoration:none;}
.table_board_view th { padding:20px 0; font-weight:600; color:#333;  text-align:left; font-size:21px; border-bottom:#e3e3e3 solid 1px; }
.table_board_view th img { max-width:24px; display:inline-block}
.table_board_view th strong { font-size:16px; margin-right:10px  }
.table_board_view th:last-child { text-align:right; font-size:13px; font-weight:400; color:#777 } 
.table_board_view th font { margin:0 15px 0 5px; }
.table_board_view td { vertical-align:middle; padding:30px 0; border-bottom:1px #ddd solid; text-align:left; font-size:14px; }
.table_board_view td:nth-of-type(odd) { }
.table_board_view td img { display:block; max-width:100%; margin:30px 0; }


.table_system { width:860px; border: 1px solid #cccccc; border-collapse: separate; border-spacing: 0; border-radius: 0px; overflow: hidden; margin: auto}
.table_system th,
.table_system th,
.table_system td { color:#666; font-size: 13px;  transform: rotate(0.1deg); padding: 0.9em 1.6em; border-bottom: 1px solid #cccccc; text-align: left; background-color: #fff; font-weight: 400; line-height: 1.3em;   }
.table_system th { width: 150px;  }
.table_system th { color:#666; font-size: 13px; transform: rotate(0.1deg); background-color:#f6f7fb; text-transform: uppercase;}
.table_system th + th,
.table_system td { border-left: 1px solid #cccccc;}
.table_system tr:last-child th,
.table_system tr:last-child td { border-bottom: none;}



.table_system_write { width:860px; border: 1px solid #cccccc; border-collapse: separate; border-spacing: 0; border-radius: 0px; overflow: hidden; margin: auto}
.table_system_write th,
.table_system_write th,
.table_system_write td { color:#666; font-size: 13px; padding: 0.9em 1.6em; border-bottom: 1px solid #cccccc; text-align: left; background-color: #fff; font-weight: 400; line-height: 1.3em;   }
.table_system_write th { width: 150px; vertical-align: middle  }
.table_system_write th { color:#666; font-size: 13px; background-color:#f6f7fb; text-transform: uppercase;}
.table_system_write th + th,
.table_system_write td { border-left: 1px solid #cccccc;}
.table_system_write tr:last-child th,
.table_system_write tr:last-child td { border-bottom: none;}

/*.table_system_write input { width: auto; border: none; border-bottom: none; background-color:transparent; line-height: 38px; font-size: 15px; padding: 0; margin-bottom: 0; outline: none; vertical-align: middle;}*/

.table_system_write input[type=text]:focus{border-color:#000;}
.table_system_write input[type=checkbox]{  vertical-align: middle;}
.table_system_write input[type=radio]{  vertical-align: middle;}
.table_system_write input.url_r { width: calc(100% - 140px); border: 1px solid #d7d7d7; height: 28px; line-height: 28px; padding: 0 10px; margin-right: 6px; float: right;}
.table_system_write select {border:1px solid #d7d7d7; height:28px; line-height:28px; padding:0 10px; margin: 2px 0}
 
.table_system_write .img-thumb { display: block; width: 100%; padding: 25px 0  }
.table_system_write .img-thumb span { display: inline-block; width: 70px; height: 70px; line-height: 70px; text-align: center; vertical-align: bottom; background-color: rgba(0,0,0,0.04); border: #f1f1f1 solid 1px; padding: 0; margin: 2px; font-size: 12px; letter-spacing: -0.03em; background-image: url(../../2024/images/common/noimage.png); background-repeat: no-repeat; background-position: 50%; background-size: 100% auto; }
.table_system_write .img-thumb span:hover { transition: all 0.6s; border:#42c911 solid 1px; }
.table_system_write .img-thumb span img { width: 100%; }

.table_system_write .img-thumb .img_add { background-image: none; font-size: 36px; color: #fff; background-color: #333  }


.table_system_write label, .table_system_write button {cursor:pointer;  vertical-align: middle; padding-right: 10px; margin: 3px}
.table_system_write input[type=text]{ width: calc(100% - 40px);  border:1px solid #d7d7d7; height:28px; line-height:28px; padding:0 10px; margin-right: 6px}
.table_system_write textarea{ width: calc(100% - 40px);  border:1px solid #d7d7d7; line-height:28px; padding:0 10px; margin-right: 6px}


.table_system_write input[type=text]:focus{border-color:#000;}
.table_system_write input[type=checkbox]{  vertical-align: middle;}


.table_system_write input.url_r { width: calc(100% - 140px); border: 1px solid #d7d7d7; height: 28px; line-height: 28px; padding: 0 10px; margin-right: 6px; float: right;}


.table_system_write select {border:1px solid #d7d7d7; height:28px; line-height:28px; padding:0 10px; margin: 2px 0; font-size: 1.3rem;}
#contents .product_w2 { border-bottom:1px solid #d7d7d7; padding: 10px 0; }

.product_w { width: 860px;  font-size:18px; color:#333; padding:0; margin:40px auto 10px; text-align:left;}
.product_w span { float: right; font-size:14px; color:#333; font-weight: 400;  }


#contents #info_box { max-width: 1000px;  padding: 0 100px; margin:0 auto 60px  }
#contents #info_box h3 { margin: 0 auto 0; padding-top: 36px; line-height: 1em; letter-spacing: -0.01em; text-align: left; font-size: 32px; line-height: 3.0em; font-weight: 600; letter-spacing: -0.01em; }


/* about */
.about {margin: 0 auto 5rem;}
.about h3 {margin: 0 auto 0;/* padding-top: 36px; */line-height: 1em;letter-spacing: -0.01em;text-align: left;font-size: 36px;display: inline-block;text-align: center;}
.about h3 span {display: block;font-size: 18px;color: #666;font-weight: 300;text-transform: uppercase;margin-top: 1rem;margin-bottom: 4rem;}
.about .greeting { display: block; width: 900px; margin: auto; margin: 0 auto 0; color: #808080; font-size: 16px; transform: rotate(0.1deg); line-height: 1.4em; font-weight: 400; text-align: justify }
.about .ceo { display: block; padding-bottom: 54px; text-align: right}
.about .ceo strong {display: block; margin:30px 0 5px 0; color: #30a3bf; font-size: 20px; line-height: normal; font-weight: 600}
.about .ceo em {display: block; margin:0; color: #000; font-size: 24px; line-height: normal; font-weight:400; font-style: italic}
.about .ci { display: block; width: 900px; margin: auto; padding-bottom: 80px; }
.about .ci img { width: 100%; }

.about .about_img { display: block; margin: auto}
.about .about_img2 { display: block; margin: auto; padding-left: 3rem}

.about_wonders { width: 900px; margin:40px auto 40px; text-align: left; }
.about_wonders li { display: inline-block; font-size: 24px; font-weight: 600; text-align: left; color: #333; margin-bottom: 50px; padding-left: 110px;  }
.about_wonders li font { display: block; font-size: 16px; transform: rotate(0.1deg); font-weight: 400; margin-top: 12px; line-height: 1.4em; color: #808080; }
.about_wonders li span { position: absolute; width: 100px; padding: 0; margin-left: -110px }
.about_wonders li span img { width: 90px; margin:0 0 0 0; vertical-align: middle }
.about_wonders li strong { color: #999; font-weight: 400; padding-left: 10px; font-size: 16px; transform: rotate(0.1deg);  }


.history { display: block; width: 900px; margin:40px auto 40px; text-align: left; background-image:url(../../2024/images/img_history.png); background-repeat: no-repeat; background-position: 0% 3%; }
.history li { display: inherit; padding-left: 60px; height: 90px;  color: #000; font-weight: 400; font-size: 18px; text-align: left }
.history li strong { display: block;  color: #30a3bf; font-weight: 600; font-size: 20px   }



.address_box { /*background-color: #616161; color: #fff;*/ text-align: center; margin: 0; padding: 10px 0; line-height: 1.8em; font-size: 14px; letter-spacing: 0.03em}
.address_box strong { font-weight: 400; font-size: 16px;}

.address_tip { color: #b44d4d; text-align: center;  padding: 30px 0; line-height: 1.8em; font-size: 14px;   }
.organization { padding:40px 0; margin-top: 10px; }
.ci { padding:60px 0; margin-top: 10px; }
.ci img { width: 300px; }
.address_print { width:100%; margin:0 auto; text-align: center }
.address_print button { width: 180px; height: 40px; border:#a1a1a1 solid 1px; background-color: #fff; font-size: 16px; cursor:pointer; }
.address_print img { display: inline-block; padding-right: 5px;  vertical-align: middle}


.address_table {  padding:0; margin:50px auto 0; border-spacing:0; letter-spacing: -0.03em; border-top:none; text-transform: uppercase; letter-spacing:0.06em   }
.address_table th { font-size:16px; padding:0; color:#000; vertical-align:top; line-height: 2em; text-align: left  }
.address_table td {font-size:13px;padding: 0 0 20px 0;color:#4c4c4c;line-height: 2em;vertical-align:top;text-align: left}
.address_table td img {padding: 0 20px 0 20px;margin: 0;}
.address_table td span { border:0; border-radius: 20px; color: #fff; margin:0 2px; padding: 0 5px 1px 5px; }

@media (max-width: 900px) {
.address_box {/*background-color: #616161; color: #fff;*/text-align: center;margin: 1rem;padding: 0;line-height: 1.8em;font-size: 12px;letter-spacing: normal;}
.address_box strong {font-weight: 400;font-size: 0.8rem;}

.address_tip { color: #b44d4d; text-align: center;  padding: 30px 0; line-height: 1.8em; font-size: 14px;   }
.organization { padding:40px 0; margin-top: 10px; }
.ci { padding:60px 0; margin-top: 10px; }
.ci img { width: 300px; }
.address_print { width:100%; margin:0 auto; text-align: center }
.address_print button { width: 180px; height: 40px; border:#a1a1a1 solid 1px; background-color: #fff; font-size: 16px; cursor:pointer; }
.address_print img { display: inline-block; padding-right: 5px;  vertical-align: middle}


.address_table {padding:0;margin: 1rem;border-spacing:0;letter-spacing: -0.03em;border-top:none;text-transform: uppercase;letter-spacing: normal;}
.address_table th {font-size: 11px;padding:0;color:#000;vertical-align:top;line-height: 2em;text-align: left}
.address_table td {font-size:13px;padding: 0 0 20px 0;color:#4c4c4c;line-height: normal;vertical-align:top;text-align: left}
.address_table td img {padding: 0 20px 0 5px;margin: 0;width: 2rem;}
.address_table td span { border:0; border-radius: 20px; color: #fff; margin:0 2px; padding: 0 5px 1px 5px; } 
    
}


/* work */
.work_3rd ul {margin:0 auto;text-align:center;}
.work_3rd ul li {display: inline-block;width: 320px;margin: 0 15px;vertical-align: top;font-size: 21px;font-weight: 600;color: #1a1a1a;text-align: center;cursor: pointer;transition: all 0.3s ease;background-color: #fff;}
.work_3rd ul li:hover { cursor:pointer; transition: all 0.3s ease;  margin-top:-10px;  }
.work_3rd ul li p {display:block;margin:10px auto;height: 100px;vertical-align: middle;}
.work_3rd ul li p img {margin:auto;vertical-align: middle;padding-left: 15px;}
.work_3rd ul li font {display:block;font-size: 16px;font-weight: 400;color:#666;letter-spacing:-0.05em;padding-top: 25px;}
.work_3rd ul li:after { content: ''; position: absolute; border-top: 94px solid #d9d9d9; width: 1px; margin-top: -86px; display: block; }
.work_3rd ul li:nth-child(1):after { display: none }

@media (max-width: 900px) {
/* work */
.work_3rd ul {margin:0 auto;text-align:center;}
.work_3rd ul li {display: inline-block;width: 100%;margin: 1.4rem auto;vertical-align: top;font-size: 21px;font-weight: 600;color: #1a1a1a;text-align: center;cursor: pointer;transition: all 0.3s ease;background-color: #fff;}
.work_3rd ul li:hover { cursor:pointer; transition: all 0.3s ease;  margin-top:-10px;  }
.work_3rd ul li p {display:block;margin: 1.0rem auto 1.8rem;height: auto;vertical-align: middle;}
.work_3rd ul li p img {margin:auto;vertical-align: middle;padding-left: 15px;width: 25%;max-width: 100px;}
.work_3rd ul li font {display:block;font-size: 15px;font-weight: 400;color:#666;letter-spacing:-0.05em;padding-top: 25px;}
.work_3rd ul li:after {content: '';position: absolute;border-top: 94px solid #d9d9d9;width: 0;margin-top: -86px;display: block;}
.work_3rd ul li:nth-child(1):after { display: none }
}
    
    
    

/* 이미지 세로 중앙 정렬 Vertical align - position 을 이용한 방법 */
.work_3rd p.click { position:relative; width:280px; height: 100px;}
.work_3rd p.click > img { position:absolute; max-width:60%; max-height:60px; width:auto; height:auto; margin:auto; top:0; bottom:0; left:0; right:0;}
/* 이미지 세로 중앙 정렬 Vertical align - line-height 를 이용한 방법 */
.work_3rd p.click2 { width:180px; height: 180px; line-height:180px; text-align:center;}
.work_3rd p.click2 > img { max-width:100%; max-height:100%; vertical-align:middle;}





.privacy { display: inline-block; max-width:800px; text-align: left;padding: 20px 40px;}
.privacy .title {}
.privacy .title h2 { font-size: 24px; margin: 30px 0; }
.privacy .title h2 .ver { font-size: 14px; color: #333; letter-spacing: 0; padding-left: 1rem; }
.privacy .title p { font-size: 13px; color: #808080; letter-spacing: -0.03em }
.privacy .title .link { position: absolute; right: 0; bottom: 33px; font-size: 12px; }
.privacy .section { padding: 18px 0; border-top: 1px solid #e5e5e5; line-height: 1.8em; font-size: 11px;}
.privacy .section h3,
.privacy .section h4 { margin: 0px 0 15px; color: #333; letter-spacing: -0.03em; font-size: 15px; }


.service { display: inline-block; max-width:800px; text-align: left;  padding: 20px 40px;}
.service .title {}
.service .title h2 { font-size: 24px; margin: 30px 0; }
.service .title h2 .ver { font-size: 14px; color: #333; letter-spacing: 0; padding-left: 1rem; }
.service .title p { font-size: 13px; color: #808080; letter-spacing: -0.03em }
.service .title .link { position: absolute; right: 0; bottom: 33px; font-size: 12px; }
.service .section { padding:0 0 18px 0; border-top: 1px solid #e5e5e5 }
.service .section h3,
.service .section h4 { margin: 25px 0 15px; color: #333; letter-spacing: -0.03em; font-size: 15px; }
.service .section p { display: block; margin: 2px 0; line-height: 1.8em; font-size: 11px; }
.service .section span { display: block; margin: 0 0 0 20px; line-height: 1.8em; font-size: 13px; }








.hide-web { display: none !important }
.hide-mobile { display:block !important }

@media all and (max-width:900px){ 
    
.hide-web { display:block !important } 
.hide-mobile { display:none !important }

    
    
body {-webkit-text-adjust:none;min-width:320px;padding:0;margin:0;/* font-family:AppleSDGothicNeo, 'Noto Sans KR', SF Pro Display, Century Gothic, 'CenturyGothic', nanumSqure, 'KoPub Dotum', 나눔고딕, sans-serif; */color:#444;text-align:center;font-size:16px;line-height:24px;overflow-x: hidden;}
img {display:block; border:none;   max-width: 100%; }
/*
*::-moz-selection {background-color: #fff; color: #fff;}
*::selection {background-color: #fff; color: #fff;}
*/
a {text-decoration:none; }
a:active {border:none; outline:none;}
.clear {clear:both;}
.float-right {float:right;}
.tc-fff {color:#fff;}
.ts-11 {font-size:11px;}


body, input, textarea, select, button, table, h1, h2, h3, h4 {/* font-family:AppleSDGothicNeo, 'Noto Sans KR', SF Pro Display, Century Gothic, 'CenturyGothic', nanumSqure, 'KoPub Dotum', 나눔고딕, sans-serif; */}
    
    
    
    
    
    
    

/* 간격, 폰트 */
.mt5m{margin-top:5px}
.mt10m{margin-top:10px}
.mt15m{margin-top:15px}
.mt20m{margin-top:20px}
.mt25m{margin-top:25px}
.mt30m{margin-top:30px}
.mt35m{margin-top:35px}
.mt40m{margin-top:40px}
.mt45m{margin-top:45px}
.mt50m{margin-top:50px}
.mt55m{margin-top:55px}
.mt60m{margin-top:60px}
.mt75m{margin-top:75px}
    

.mobile_none {  display:contents; }  
    
    
.ico-top {
    position:absolute;
    bottom: 20px;
    height: 60px;
    line-height: 60px;
    width: 200px;
    border-radius: 60px;
    font-size: 16px;
    text-align: center;
    color: #391b1b;
    font-weight: 600;
    overflow: hidden;
    z-index: 100;
    transition: all 0.3s;
    box-shadow: 1px 1.732px 8px 0px rgba(0, 0, 0, 0.3);
    color: #fff;
    letter-spacing: -0.05em
}
    
.ico-top {
  width: 0px; 
  right: 100%; 
  padding:0;
  animation: mymove 1.5s forwards;
  animation-delay: 2s;
  transition-timing-function: ease-in;	}


    
.ico-top { position:fixed;  
  width: 0px; 
  right: -100px; 
  animation: mymove 1.0s forwards;
  animation-delay: 0s;
  transition-timing-function: ease-in;	}


input[type=text]{border:1px solid #999; border-radius: 0.4em; height: 30px; line-height: 30px; padding: 0 5px; margin-right: 6px; font-size: 12px}   
input[type=text]:focus{border-color:#000;}
input[type=checkbox]{margin-top:-2px;}
select {border: 1px solid #999; height:32px; line-height:30px; padding:0; margin: 2px 0; border-radius: 0.4em}
button{margin:0; padding:0;}
a{color:#000;text-decoration:none; outline:none;}
a:hover{color:#000; text-decoration:none;}
button *{position:relative;}
button img{left:-3px; *left:auto;}
option {padding-right:0;}
hr{display:none}
table{ /*border-collapse:collapse;*/ border-spacing:0; padding:0;}  
option, select { font-size: 12px;}

body { width:100%; }
    
    
    


.nav-wrap { height:70px; transition: all 0.8s; background-color: rgba(255,255,255,1); }
.nav_consumer { border-bottom:0; background-color: transparent }
.pre_header {  display: none; }

.nav-wrap .nav {width: calc(100% - 40px);min-width: calc(100% - 40px);height:70px;}
.nav-wrap .nav .logo a {width: 123px;height: 50px;padding:0;margin:14px 0 0 0;}  
.nav-wrap .nav .logo_customer { width: 250px; height:36px; float:left; padding:0; margin:20px 0 0 0; }  
.nav-wrap .nav .logo_customer a { position: absolute; width: 250px; height: 36px; padding: 0; margin: 0px auto; background-image: url(../../2024/images/logo_customer.png); background-size: 100% 100%; background-repeat: no-repeat; text-indent: 9999px; background-position: left top;}
.nav_all { position: fixed; float: right; right: 0px; top: 0px; width: 55px; margin: 10px 10px 0 0; z-index: 1000; list-style: none; display: inline; overflow: hidden;}
.nav_all a { float: right; padding: 55px 0 0 0; overflow: hidden; height: 0px !important; height/**/ : 32px; /* IE5 */ margin: 0; border: 0; background-image: url(../../2024/images/common/ico_nav.png); background-position: 50% 50%; background-repeat: no-repeat; background-size: 30px 30px;}

.nav_all a:hover { border: 0;}
.nav_all a:active,#nav a.selected { border: 0;}
.nav_all a:before { content: ""; display: inline-block; vertical-align: top; width: 28px; height: 28px; background-image: url(../../2024/images/ico_nav.png); transition: all 0.3s;}
.nav_all a:hover:before { transition: all 0.3s; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3);}
 
.menu_all { background-color:rgba(255,255,255,0.8); display:none; list-style:none; float:right; width:100%; margin:0 0 0 0; padding:0 0 30px 20px; right:0; top:0; height: 100%; z-index: 1001; position: fixed; overflow: hidden; }
.menu_all ul { float: right; max-width:80%; margin:0 auto; text-align: left; padding-left: 20px; padding-bottom: 20px; background-color: #fff; box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%); overflow: hidden; overflow-y: scroll; position: fixed; height: 100%; right:0; }
.menu_all li {float: none;display: block;width: 100%;padding: 5px 20px;text-align: left;vertical-align: top;}

/*
.menu_all li:nth-child(1) { padding:5px 0 20px;}
.menu_all li:nth-child(2) { padding:5px 0 0px;}
.menu_all li:nth-child(3) { padding:5px 0 60px;}
.menu_all li:nth-child(4) { display: none}
*/
.menu_all li h1  { display:block; color:#999999; font-size: 12px; padding: 20px 0 15px 3px; margin: 0; font-weight: 400 }	
.menu_all li a { display:block; color:#333; font-size:18px; font-weight:400; letter-spacing:-0.03em; text-decoration:none; text-transform:none; padding:0 3px 0 14px; margin:0; line-height:2.4em;  border-bottom:0; background:none}
.menu_all li a:visited {}
.menu_all li a:hover   {color:#008aff;border-bottom: none;}
.menu_all li a:active  {color:#008aff;}
.menu_all li a.ico_right { background: url(../../2024/images/common/ico_right.png) no-repeat 90% 50%; background-size: 15px; }
    
.menu_all li.etc_btns a { color:#666; font-size:15px; padding:0 3px 0 14px; line-height:2.0em;  }
.nav-wrap .nav .smenu { float: right; position: relative; width: calc(100% - 210px); max-width: 300px; margin-top: 18px; margin-right: 40px;}
.nav-wrap .nav .smenu .search { width: calc(100% - 50px); height: 38px; color: #666; background-image: url(../../2024/images/ico_search.png); background-position: 96% 48%; background-repeat: no-repeat; background-size: 24px; background-repeat: no-repeat; background-color: rgba(0, 0, 0, 0.0); border: rgba(0, 0, 0, 0.0) solid 1px; border-radius: 19px; letter-spacing: -0.03em; padding: 0 24px 0 12px; cursor: pointer; transition: all 0.3s ease;}
.nav-wrap .nav .smenu .search:hover { border-color: #a1a1a1 solid 1px; background-color: rgba(0, 0, 0, 0.08); background-image:none}
 
.nav-scroll { position:fixed; z-index:999; opacity: 1; transition: all 0.8s; background-color: rgba(255,255,255,1); box-shadow: 0px 3px 6px 0px rgb(0,0,0,0.10);}
.nav-scroll:hover { }
.nav-scroll .nav .logo_customer a { margin: 0px auto; }
    
    
.nav-wrap .mainmenu { display:none }
.nav-sub .mainmenu { display:none }

    
    
    h1, h2, h3, h4 { letter-spacing:-0.05em }
    
h1 {font-size:32px; color:#333; line-height:1.0em; padding:0; margin:80px auto 20px; font-weight:400;}
h1 span { letter-spacing:-0.03em}
h2 {font-size:28px;/* font-weight:600; */color:#333;line-height:1.3em;padding:0;margin:0;text-align: left}
h2 span { display: block; font-size:16px; font-weight:400; color:#666; line-height:1.3em; padding-top: 20px   }
h2 font {display: block; font-size:14px;  font-weight:400;  } 
h3 {font-size:18px; color:#333; padding:0; margin:50px auto 30px; text-align:center;}
h4 {font-size:16px; color:#333; padding:0; margin:0; font-weight:600;}


    

.line_box { clear: both; display: block; width: 100%; height: 1px; background-color: #ebebeb; margin:1px 0}
.line_box2 {clear: both;display: block;width: 100%;height: 1px;background-color: #ebebeb;margin: 80px 0;}

 
    
    
    
    
    
    
    

#contents {position: relative;z-index: 100;width: 100%;min-width: 100%;max-width: calc(100% - 100px);margin:0 auto;padding-top: 20px;background-color:rgba(0,0,0,0.00)}
#contents_main {position: relative; z-index: 100; width: 100%; min-width: 100%; max-width: calc(100% - 100px); margin:0 auto; padding-top: 40px; background-color:rgba(0,0,0,0.00) }

#contents h2 { text-align: left; font-size: 28px; text-align: left; margin: 0 20px  }
#contents h2 span { font-weight: 300; padding: 10px 0;  font-size: 14px; }

.sub_nav { display:block; border-bottom:1px #e6e6e6 solid;  }
.sub_nav p { width: 100%; margin:15px auto; text-align:left;  }
.sub_nav p span { padding: 0 10px 0 14px;  color: #1a1a1a; font-size: 14px; text-transform: uppercase; background:url(../../2024/images/ic_arr.png); background-repeat:no-repeat; background-position:0% 50% }
.sub_nav p span:first-child { background: none; padding-left: 8px }
.sub_nav p span:last-child { color:#2daac0;  }


/* full banner basic */
html, body { margin: 0; height: 100%; min-width: 100%;} 

.company_banner .visual-text-wrap .visual-text h1, 
.patients_banner .visual-text-wrap .visual-text h1, 
.professionals_banner .visual-text-wrap .visual-text h1  { margin-top: 220px}


.figure {  }
.image-card { position: relative; margin: 0;}
.image-card .mobile-only  {}
.image-card .mobile-only h1 { display: none;}
.image-card .mobile-only img { width: 100%;}

.u-full-width, .u-full-height, [class*=ncss-] * { box-sizing: border-box;}
.mobile-only video { position: absolute; top: 0; left: 0; width: 100%;}
u-full-width, .u-full-height, [class*=ncss-] * { box-sizing: border-box;}

.image-card,
#contents {opacity: 0;
  animation: box 1.2s forwards;
  animation-delay: 0s;
  transition-timing-function: ease-in;	}

@keyframes box {
  from {   }
  to {  opacity: 1;}
}

figcaption { margin: 30px auto; top: 60% }
    figcaption img { width: 100%; margin: auto}
figcaption h2 { text-align: center}    
figcaption h2 span {  }    
    
    
/*
figcaption {position: absolute;margin: auto;top: 37%;width: 100%;}
figcaption img { margin: auto}

figcaption h1 {font-size: 64px;font-weight: normal;color: #fff;line-height:1.3em;padding:0;margin:0;text-transform: uppercase;}
figcaption h1 span {display: inline-block;font-size: 18px;font-weight: 300; color:#666; line-height:1.3em;padding-top: 30px;text-align: left; }
figcaption h1 p { font-family: new york extra large; }
figcaption h1 .l_txt {margin-left: -500px;}
figcaption h1 .r_txt {margin-left: 260px;}
figcaption h3 {font-size:32px;color:#fff;padding:0;text-align:center;margin-left: -720px;font-weight: 600;}
figcaption h3 i {display: inline-block;font-size: 18px;font-weight: 300; line-height:1.3em;padding-top: 30px;text-align: left; font-weight: 100; font-size: 24px; font-style: normal;}
*/
    
    
.line_box { clear: both; display: block; width: 100%; height: 1px; background-color: #ebebeb; margin:1px 0}
.line_box2 {clear: both;display: block;width: 100%;height: 1px;background-color: #ebebeb;margin: 3rem 0;}
.line_box_w {clear: both;display: block;width: 100%;height: 1px;background-color: #fff;margin: 2rem 0;}
.line_box_w2 {clear: both;display: block;width: 100%;height: 1px;background-color: #fff;margin: 2rem 0;}
    
    
#Permit {}

    
.nav-wrap .mainmenu { display:none }
.nav-sub .mainmenu { display:none }
    

.image-card .pc-only  { display: none; }
.image-card .mobile-only  { display: block; }
    
    

.introduce_main { display:block; width: 100%; height:auto; margin:0 auto;  padding:0 0 40px 0; background-color: #fff; }

/* 브랜드 추천 */
.main_step_01 {}
.main_step_01 h2 {
    font-size: 32px;
    text-align: left;
    font-weight: 600;
    margin: 30px 0 30px 30px;
}

.main_step_01 h2 span {
    display: block;
    font-size: 16px;
    font-weight: 400;
    margin-left: 0px;
    color: #666
}

.main_step_01 h2 button {
    float: none;
    border: 0;
    background-color: #333;
    font-size: 16px;
    color: #fff;
    vertical-align: middle;
    height: 42px;
    line-height: 42px;
    padding: 0 30px;
    border-radius: 2em;
    font-weight: 300;
}
.main_step_01 ul { width: calc(100% - 30px); padding:0 15px; margin: 0 auto; text-align: center; position: relative; }
.main_step_01 ul li { float: left; margin-right: 9px; width:100%; overflow: hidden; margin-top: -30px; margin-left: 0; margin-bottom: 40px; }
.main_step_01 ul li:last-child { margin-right:0 }
.main_step_01 ul li div { top: 0; left: 0; width: 100%; margin: 0; vertical-align: top; font-size: 18px; color: #fff; text-align: center; text-transform: uppercase; text-shadow: 0 0 4px rgba(0, 0, 0, 0.9); letter-spacing: -0.03em; transition: all 0.3s; background-position: 50% 0%; background-size: 100% auto; background-repeat: no-repeat; opacity: 0.9; }
.main_step_01 ul li div.img_company_01 { background-image: url(../../2024/images/main/img_01_01_bg_01w.jpg); }
.main_step_01 ul li div.img_company_02 { background-image: url(../../2024/images/main/img_01_02_bg_01w.jpg); }
.main_step_01 ul li div.img_company_03 { background-image: url(../../2024/images/main/img_01_03_bg_01w.jpg); }

.main_step_01 ul li div img { transition: all 0.6s; position: inherit; margin: 6% auto 0; width: 23%;  }
.main_step_01 ul li div:hover { transition: all 0.6s; cursor: pointer; background-size: 103% auto; opacity: 1;  }
.main_step_01 ul li div:hover img { transition: all 0.6s; margin: 0 auto 0;   }

.main_step_01 ul li h3 {display:block;font-size: 38px;letter-spacing:-0.01em;line-height: 1.4em;padding-top: 30px;/* font-weight: 600; */color: #fff;}
.main_step_01 ul li h3 font:after { content: ''; border-bottom: 1px solid #fff; width: 80px; margin-top: -70px; float: left; margin-left: 39.3%; }
.main_step_01 ul li h3  span {display:block;font-size: 18px;letter-spacing:-0.01em;line-height: 1.4em;padding-top: 10px;font-weight: 300;}
.main_step_01 ul li h3  font { display:block; font-size:14px;  letter-spacing:-0.01em; line-height: 1.4em;  padding-top: 20px; font-weight: 300;   }

.main_step_01 .main_step_view {display: inline-block;background-color: #f5f5f5;background-repeat: no-repeat;width: 100%;background-position: 50% calc(100% - 60px);background-size: calc(100% - 0px) auto;text-align: left;margin-left: 0px;position: relative;}
.main_step_01 .main_step_view h3 { width: auto; margin: 70px 30px 30px 30px; font-weight: 600; text-align: left; font-size: 28px; color: #444; line-height: 1.8em;}
.main_step_01 .main_step_view h3 span { display: block; font-size: 15px; font-weight: 300; line-height: 1.8em; margin-top: 60px; }
.main_step_01 .main_step_view h3 span:after { content: ''; border-bottom: 1px solid #857676; width: 70px; margin-top: -52%; float: left; }
.main_step_01 .main_step_view img {}



.introduce_main .item_list { display: flow-root; width: 100%; margin:0 auto; text-align:center;  }
.introduce_main .item_list li { float: left; display:inline-block; width:300px; height: 300px;  margin:0; vertical-align:top;  color: #fff; text-align: center; letter-spacing:0.01em;  background-size: 100% auto}
.introduce_main .item_list li { display:table;  }
.introduce_main .item_list li p {  display:table-cell; vertical-align:middle; width: 240px; height: 300px; padding: 0 30px; font-size:28px; font-weight: 400; background-color: rgba(0,0,0,0); transition: all 0.3s; cursor:pointer; opacity: 0}
.introduce_main .item_list li p:hover { background-color: rgba(0,0,0,0.6); opacity: 1}
.introduce_main .item_list li p font { display: block; font-size: 14px;  font-weight: 300; color: #cccccc;  margin: 10px 20px 0; line-height: 1.1em}

.main_step_02 {  }
.main_step_02 h2 {
    font-size: 28px;
    text-align: left;
    font-weight: 600;
    margin: 80px 30px 0 30px;
    }
    
    .main_step_02 h2 span { display: block;
    font-size: 16px;
    font-weight: 300;
    margin-left: 0px;
    color: #666;
    }
    
.main_step_02 h3 { }
.main_step_02 ul { width: calc(100% - 30px); padding:0 15px; margin: 0 auto; text-align: center; position: relative; }
.main_step_02 ul li { float: left; text-align: left; width: 100%; overflow: hidden;  margin-right:0px; padding-bottom: 60px; }
.main_step_02 ul li:last-child { margin-right:0 }
.main_step_02 ul li div {  }


.product-image-wrapper { display: block; transition: all 0.6s; border:#f1f1f1 solid 1px; background-color: #f0f0f0; margin: 20px 5px}
.product-image-wrapper img {transition: all 0.6s;position: inherit;margin: 15% auto;width: auto;height: 160px;}
.product-image-wrapper:hover { transition: all 0.6s; background-color: #fff; }


.main_step_03 { display: inline-block; width: 100%; margin: 0; }
.main_step_03 h2 { font-size: 32px;
    text-align: left;
    font-weight: 600;
    letter-spacing: -0.03em;
    margin: 80px 30px 0 30px; }
    
    .main_step_03 h2 span { display: block;
    font-size: 16px;
    font-weight: 300;
    margin-left: 0px;
    color: #666;
    }
    
    
    
.mall_link { margin-top: 30px }
.mall_link a { float: none;
    display: inline-block;
    width: 12%;
    padding: 0 5%;
    margin: auto;
    font-size: 0;
    }
.mall_link a img { width: 100%; max-width: 95px; margin:0 auto 10px }
.mall_link a:hover {}


.product_list { display: inline-block; width: calc(100% - 30px); padding: 0 15px; margin: 0 auto; font-size: 16px; line-height: 1.6em; min-height: 100%; height: auto !important;}

.itemlist {}
.itemlist h2 {  }
.itemlist h3 { }
.itemlist ul { width: 100%; margin: 0 auto; text-align: center; position: relative; }
.itemlist ul li {float: left;text-align: left;width: 50%;overflow: hidden;margin-right:0px;padding-bottom: 10px;}
.itemlist ul li:nth-child(3n) { margin-right:0 }
.itemlist ul li div {  }


/*.cunit_tag*/
.main_step_02 .cunit_tag {float: right;display: none;width: 39%;text-align: right;vertical-align: top}
.itemlist .cunit_tag { float: none; display:none; width: 100%; text-align: center; vertical-align: top; margin-top: 10px;}
.info-wrap_product .cunit_tag { width: 100%; text-align: left; vertical-align: top}
.cunit_tag a[href] {text-decoration: none;color: #333;background-color: #f1f5fb;padding: 1px 10px;border: 0;font-size: 10px;}  
.cunit_tag a { display: inline-block; position: relative; height: 22px; margin: 0 5px 5px 0; padding: 0 6px; border: 1px solid #f5f5f5; border-radius: 12px; font-size: 11px; font-weight: 400; line-height: 20px; color: #999; text-decoration: none; vertical-align: top; }


/*.product-display-name*/
.product-display-name { display:inline-block; width: 90%; padding-left: 5%; text-align: left; }
.product-display-name span { display: block; }
.product-display-name .item-title {font-size: 15px;/* color: rgba(0,0,0,1.0); *//* font-weight: 600; */}
.product-display-name .item-subtitle {font-size: 12px;color: rgba(0,0,0,0.5);line-height: 1.3em;padding-top: 5px;display: inline-block;height: 3.0em;overflow-y: hidden;}
.product-display-name .item-unit { font-size: 12px; color: rgba(0,0,0,0.25); line-height: 1.3em; padding-top: 5px }

.info-wrap_product .product-display-name { display:block; width: 100%;  text-align: left; margin-top: 15px; padding-left: 0;}
.info-wrap_product .product-display-name span { display: block; }
.info-wrap_product .product-display-name .item-title {font-size: 26px;font-weight: 700;padding: 15px 0;}
.info-wrap_product .product-display-name .item-subtitle {font-size: 16px;padding: 0 0 1.2rem 0;height: auto;}

.info-wrap_product .description {padding: 0;}
.info-wrap_product .description font {  font-size: 15px; letter-spacing: -0.03em;  color: rgba(0,0,0,0.50) }

.info-wrap_product .description .img-thumb {display: flex;/* width: 100%; */position: relative;margin: auto;}
.info-wrap_product .description .img-thumb span {display: inline-block;width: 20%;line-height: unset;margin: 0 2px;}
.info-wrap_product .description .img-thumb span:hover { transition: all 0.6s; background-color: #fff; border:#42c911 solid 1px; }
.info-wrap_product .description .img-thumb span img {
    /* min-height: 100%; */
    /* width: 100%; */
    /* height: 100%; */
    object-fit: cover;
    object-position: top;
}
    
    
.info-wrap_product .ingredient {display: block;border:rgba(0,0,0,0.10) solid 1px;border-left: 0;border-right: 0;margin: 2rem 0;}
.info-wrap_product .ingredient ul {display: block;margin: 1rem auto;text-align: center;/* flex-wrap: nowrap; *//* justify-content: space-between; */}
.info-wrap_product .ingredient ul li {display: inline-block;margin: .2rem 0.1rem;justify-content: space-between;flex-grow: 1;flex-basis: 0;align-content: space-around;}
.info-wrap_product .ingredient ul li img {display: block;margin: 0 auto 0.15rem;width: 40px;}
.info-wrap_product .ingredient ul li span {}
.info-wrap_product .ingredient ul li font {border: rgba(0,0,0,0.1) solid 1px;border-radius: 2rem;padding: 0.1rem 0.5rem;font-size: 12px;color: #666;text-align: center;margin: auto;}
    
    
    
.sub_menu { display: none }
    
  
    
.main_step_02 {  }
.main_step_02 .product-display-name { display:inline-block; width: 54%;  text-align: left; }
.main_step_02 .product-display-name span {/* display: block; */}
.main_step_02 .product-display-name .item-title {/* font-size: 21px; *//* color: rgba(0,0,0,1.0); */}
.main_step_02 .product-display-name .item-subtitle { font-size: 15px; color: rgba(0,0,0,0.5) }
.main_step_02 .product-display-name .item-unit { font-size: 15px; color: rgba(0,0,0,0.25) }
    
    
/*** 제품 상세 정보 ***/
.product_view { display: block; width: 100%; padding: 0; margin: 0 auto; font-size: 16px; line-height: 1.6em; min-height: 100%; height: auto !important;}
.product-detail {position: relative;width: calc(100% - 40px);max-width: 100%;text-align: left;margin: auto;}
.img-detail_product {position: relative;display: block;width: 100%;padding: 0;text-align: left;transition: all 0.6s;border:#f1f1f1 solid 1px;/* background-color: #f0f0f0;*/margin:0}


.img-detail_product img {transition: all 0.6s;position: inherit; /*margin: 5% auto;max-width: 90%;max-height: 300px;*/}
.img-detail_product:hover { transition: all 0.6s; background-color: #fff; }

.info-wrap_product { display: block; width: 100%; padding: 0; color: #606060; box-sizing: border-box; text-align: left; vertical-align: top; float: none;}

.prd-btns {max-width: 100%;}
.product-option { display: block; font-size: 15px; }
.product-option h5 {font-size: 13px;}
.product-option h5 span { float: right; font-size: 11px; color: rgba(0,0,0,0.30); }

.product-option a { display:inline-block; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 5px; background-color: rgb(255, 255, 255);  color: rgba(0,0,0,0.90); width: 68px; margin: 1px; line-height: 2.6em; text-align: center; }

.product-option a:hover, .product-option a:focus, .product-option a:checked { border-color: #42c911;  }

.product-option .soldout { background-color: rgba(0,0,0,0.10);  color: rgba(0,0,0,0.90); opacity: 0.5;  }

.ingredient-txt { display: block; font-size: 16px; margin-bottom: 2rem }
.ingredient-txt h5 { font-size: 16px; padding-bottom: 0px; color: }
.ingredient-txt h5 span { float: right; font-size: 11px; color: rgba(0,0,0,0.30); }


    
    
.prd-btns a { text-align: center; transition: all 0.3s ease;  }
.prd-btns a.btn_cart { display: block; width: 100%; color: #fff; background-color: #42c911; border-radius: 3px; line-height: 3em; font-size: 18px; margin: 15px auto;  }
.prd-btns a.btn_cart:hover { background-color: #008f00; transition: all 0.3s ease; }

.prd-btns a.btn_wish { display: inline-block; width: 40%; margin-right: 4%; color: #666; background-color: #fff; border-radius: 3px; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 2.5em;  line-height: 2.5em;   }
.prd-btns a.btn_back { display: inline-block; width: 50%; color: #666; background-color: #fff; border-radius: 3px; border-style: solid; border-width: 1px; border-color: rgb(229, 229, 229); border-radius: 2.5em;    line-height: 2.5em;  }
.prd-btns a.btn_wish:hover, .prd-btns a.btn_back:hover { border-color: #42c911; color: #000; transition: all 0.3s ease; }

.product-content {width: calc(100% - 0px);/* border-top:#d8dee2 solid 1px; */margin: auto;text-align: center;margin: 4rem auto 0;padding-bottom: 80px;}
.product-content h3 {margin: 0 auto -30px;background-color: rgb(89, 89, 89);width: 50%;line-height: 30px;border-radius: 0 0 10px 10px;font-weight: 400;font-size: 16px;color: #fff;position: relative;}
.product-content img {width: 100%;margin: auto;text-align: center;}
    
    
    .product-content .prd-btns { max-width: calc(100% - 40px)}
    
    
.tab6_nav {margin: 15px auto;text-align: center;text-transform: uppercase;min-width: auto;max-width: calc(100% - 20px);display: flex;align-items: center;align-content: center;flex-wrap: nowrap;}
.tab6_nav a {display: inline-block;padding: 0;margin: 0 0.5rem;background-color: #f6f7fb;border:none;/* border:#cccccc solid 1px; */color:#050f33;font-size: 14px;padding: 5px 0;border-right: 0;border-radius: 5rem;transition: all 0.3s;width: 100%;max-width: 300px;letter-spacing: -0.1rem;background-color: #f0f0f0;}
.tab6_nav a:first-child {/* width:calc(16.666% + 0px); */}
.tab6_nav a:last-child {/* border:#cccccc solid 1px; */}
.tab6_nav a:hover, 
.tab6_nav a.select {background-color: #5fa432;color: #fff;transition: all 0.3s;text-decoration:none;border-color:#050f33;border-color: #5fa432;}
.tab6_nav p.click { position:relative; display: block; padding: 0; margin: 0; width: 178px; height: 76px; line-height: 76px;  background:#fff; border-radius: 6px; text-align:center; border-radius: 10px; }
.tab6_nav p.click > img { position:absolute; max-width:100%; max-height:100%; width:auto; height:auto; margin:auto; top:0; bottom:0; left:0; right:0;}

.tab6_nav a br{display:block}
.tab6_nav a br.mo{display:none}
    
    
    
/* 타이틀 */
.info_title {padding-top: 5px;width: calc(100% - 120px);margin: auto;}
.info_title h3 {font-size: 30px;vertical-align: middle;margin:30px auto;letter-spacing: -0.00em;}
.info_title h3 i { display: inline-block;font-weight: 100; font-size: 24px; font-style: normal; color: #666; margin-left: 0.5rem}
.info_title h3 span {display: block;font-weight: 300;color: #666;font-size: 14px;margin: 1rem 0;}
    .info_title h3 span br { display: none;}
.info_title h3 font {font-weight: 400; display: inline-block; color: #666; font-size: 36px; padding-left: 10px; }
.info_title h3 p {font-size: 18px;color: #333;font-weight: 500;margin: 80px auto 0;letter-spacing: -0.03rem;}
.info_title h3 p img { display: block; margin: auto; text-align: center; margin-top: 30px; padding-bottom: 30px; }
.info_title h3 p:before {content: '';border-top: 1px solid #857676;width: 120px;margin-top: -40px;left: calc(50% - 50px);position: absolute;}

#brand {margin: 0 0 5rem;}
#brand img {margin: auto;text-align: center;margin-bottom: 2rem;max-width: 100%;}
#brand .resize { width: 450px; max-width: 80%;}

#company {margin: 0 2rem 5rem;}
#company img {margin: auto;text-align: center; margin-bottom: 3rem}
#company .resize {max-width: 50%;margin: 2.5rem auto;}

.btn_r_link { display: inline-block; float: right; margin: 20px}
    
    


/* 버튼 속성 */
.visual-text-w { display: block;  margin:40px auto; }
.visual-text-w .btn {display: inline-block;min-width: 100px;position: relative;cursor: pointer;transition: all 0.3s ease;overflow: hidden;border-radius: 2em;margin: 0 auto;padding: 0;text-align: center;/* background-color: #605656; */}
.visual-text-w .btn > a {width: 100%;height: 42px;line-height: 42px;padding: 0 30px;/* color: #fff; */font-weight: 300;font-size: 16px;position: relative;z-index: 1;transition: all 0.2s ease;}
.visual-text-w .btn:before { content: ""; width: 100%; height: 100%; background-color: #000; position: absolute; transition: all 0.2s ease;}

.visual-text-w .btn-1 {display: inline-block;min-width: 100px;position: relative;cursor: pointer;transition: all 0.3s ease;overflow: hidden;border-radius: 2em;margin: 0 auto;padding: 0;text-align: center;/* background-color: #1a1a1a; */}
.visual-text-w .btn-1 > a {width: 100%;height: 42px;line-height: 42px;padding: 0 30px;color: #fff;font-weight: 300;font-size: 16px;position: relative;z-index: 1;transition: all 0.2s ease;}
.visual-text-w .btn-1:before { content: ""; width: 100%; height: 100%; background-color: #666; position: absolute; transition: all 0.2s ease;}

.visual-text-w .btn-long { display: inline-block; min-width: 100px; position: relative; cursor: pointer; transition: all 0.3s ease; overflow: hidden; border-radius: 2em; margin: 0 auto; padding: 0; text-align: center; background-color: #605656;}
.visual-text-w .btn-long > a {  width: 100%; height: 42px; line-height: 42px; padding: 0 100px; color: #fff; font-weight: 300; font-size: 16px; position: relative; z-index: 1; transition: all 0.2s ease;}
.visual-text-w .btn-long:before { content: ""; width: 100%; height: 100%; background-color: #000; position: absolute; transition: all 0.2s ease;}

.visual-text-w .btn-2:before{ top: 0; left: -100%; }
.visual-text-w .btn-2:hover:before { left: 0; }
.visual-text-w .btn:hover a{   }

    
    /*****/

.btn-circle {
    display: block;
    margin: 40px auto 330px;
    height: auto;
    text-align: center;
}
    

/* 바탕 브라운 */
.btn-circle .btn {
    display: inline-block;
    min-width: 100px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 10em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-color: #605656;
    border: #605656 solid 1px;
    margin-right: 20px;
}

.btn-circle .btn > a {
    display: table-cell;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    position: relative;
    z-index: 1;
    transition: all 0.2s ease;
}

.btn-circle .btn:before {
    content: "";
    width: 100px;
    height: 100px;
    background-color: #000;
    position: absolute;
    transition: all 0.2s ease;
}

/* 바탕 화이트 */
.btn-circle .btn-1 {
    display: inline-block;
    min-width: 100px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 10em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-color: #fff;
    border: #605656 solid 1px;
}

.btn-circle .btn-1 > a {
    display: table-cell;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    text-align: center;
    vertical-align: middle;
    color: #605656;
    font-weight: 400;
    font-size: 16px;
    position: relative;
    z-index: 1;
    transition: all 0.2s ease;
}

.btn-circle .btn-1:before {
    content: "";
    width: 100px;
    height: 100px;
    background-color: #605656;
    position: absolute;
    transition: all 0.2s ease;
}

.btn-circle .btn-2:before{ top: 0; left: -100px; }
.btn-circle .btn-2:hover:before { left: 0; }
.btn-circle .btn:hover a{   }
.btn-circle .btn-1:hover a{ color: #fff;   }


/* 원형 버튼 센터 */
.tab_box li { position: relative; display: inline-block; cursor: pointer; width: 100px; height: 100px; text-align: center; line-height: 1.0em; font-size: 16px; color: #000; margin: 20px; }
.tab_box li p { display: table-cell; width: 100px; height: 100px; border-radius: 50px; text-align: center; font-size: 16px; line-height: 24px; vertical-align: middle; border: 1px solid #e3e3e3; background-color: #fff; }
.tab_box li p:hover { border: 1px solid #605656; color: #000; }    
.tab_box li.active p { background-color: #605656; color: #fff; }


.ml_50 { margin-left: 0px }


/* 이메일 */
    
    
    

/*****  푸터 *****/
.footer { }
    .footer .box { font-size: 11px;}
    .footer .footer_info {
    width: calc(100% - 60px);
    max-width: 100%;
    margin: auto;
}
    .footer .sns h3 { font-size:1rem}
    
    
    .footer .box .privacy_box { float:right; margin-top:-70px; }
.footer .box .privacy_box a { color:#919090; font-size:13px; text-decoration:none    }
.footer .box .privacy_box .line { font-weight:100; color:#bdbdbd; padding:0 5px; font-family:돋움 }

.footer .box .customer {display: block;}
.footer .box .customer p {}
.footer .box .customer p span {display: inline-block;font-size: 30px;font-weight: 600;color: #fff;font-family:Montserrat;margin: 1rem 0;}
.footer .box .customer .email {font-size: 14px;margin: 0 0 0.5rem 0;}

.footer .box .customer a.btn_subscribe { }
.footer .box .customer a.btn_subscribe:link, 
.footer .box .customer a.btn_subscribe:active,     
.footer .box .customer a.btn_subscribe:visited { display: inline-block; width: 60%; color: #fff; background-color: rgba(65,65,65,0.4); border-style: solid; border-width: 1px; border-color: rgba(255,255,255,0.4); border-radius: 0.5em; line-height: 2.4rem; font-size: 14px; text-align: center; transition: all 0.3s;}
.footer .box .customer a.btn_subscribe:hover {background-color: rgba(65,65,65,0.0); transition: all 0.3s; }


.footer .box .info_corp {max-width: 100%;/* margin: auto; */float: none;letter-spacing: -0.03rem;/* display: inline-block; */}
.footer .box .info_corp ul{
    margin-top: 1rem;
}
.footer .box .info_corp li{display:inline-block;margin-right: 1.5rem;vertical-align:top;}
.footer .box .info_corp li:last-child{margin-right:0}
.footer .box .info_corp li a{display:block;color: #fff;font-weight: 600;font-size: 12px;}


    
    

.customer_box {width: calc(100% - 40px);border:#e5e5e5 solid 1px;padding: 0;margin:0 auto 30px}
.customer_box h4 {padding: 25px 0 10px;font-weight: 400;text-align: center;}

.wing_customer { display: none }    
    
    
    
.sub_banner { min-width: 100%; max-width: 100%; margin: 0 auto; }
.sub_banner img { width: 100%;}
.sub_banner h1 { position: absolute; width: calc(100% - 100px); margin: 10% auto 0; font-size: 24px; font-weight: 400; color: 333; font-family: 'Arita-buri'; font-family: "Arita-buri(OTF)"; font-weight: 500; line-height: 1.4em; font-size: 64px; font-family: "SF Pro Display"; font-weight: 100; color: #fff; line-height: 1.2; text-align: center; text-shadow: 0px 3px 7px rgba(44, 95, 172, 0.24); -moz-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); -webkit-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); -ms-transform: matrix(1.40377635019489, 0, 0, 1.40377635019488, 0, 0); display: none;}
.sub_banner h1 img { display: inline-block; width: auto; height: 38px; text-align: center; padding:0; margin: auto; vertical-align: middle;}
.sub_banner h1 span { display: inline-block; font-size: 18px; font-weight: 400; color: #333; font-family: 'Arita-buri';  font-family: "Arita-buri(OTF)"; font-weight: 500; line-height: 1.4em; text-align: left; padding-left: 15px;  text-shadow:none; vertical-align: middle;}
    
    
    
/* 서브 4개 탭 */
.tab4_nav ul { list-style: none; width: auto; text-align: center; margin: 0; padding: 0 0 0 0; border-bottom: #808080 solid 1px;}
.tab4_nav ul li { display: inline-block; padding: 0 8px; transition: all 0.3s; opacity: 0.80; }
.tab4_nav ul li:hover { background-position: 0% -10%;  cursor:pointer; opacity: 1.00;  }
.tab4_nav ul li a {display: inline-block;font-size: 15px;font-weight: 600;color: #333;margin: 0;line-height: 1.1em;letter-spacing: -0.03em;}
.tab4_nav ul li a { text-decoration: none; padding: 36px 0; display: block; position: relative;}
.tab4_nav ul li a:after { content: ''; position: absolute; border-top: 1px solid #2f6215; top: 0; left: 0; right: 100%; transition: all 500ms;}
.tab4_nav ul li a.checked { color:#000; border-top: 1px solid #2f6215; padding-top: 35px; }
.tab4_nav ul li a:hover:after { right: 0; }
.tab4_nav ul li a:active  { color:#000; }


/* 공지사항 게시판 */
.news_list {width: calc(100% - 40px);margin:0 auto}
.news_list li { list-style: none; font-size: 14px; transform:none ; text-align: left; line-height: 1.6em; border-bottom:#e6e6e6 solid 1px;  cursor:pointer; color: #808080; padding: 15px 0; letter-spacing: -0.03em;   }
.news_list li span { display: inline-block; margin-right: 12px; width: 54px; line-height: 21px; background-color: #8cb4dd; color: #fff; font-size: 14px; transform: rotate(0.1deg); font-weight: 600; text-align: center }
.news_list li font {  float: none; display: block; font-size: 13px; color: #808080; font-weight: 100}

.list_more { display: block; text-align: left; margin-bottom: 40px; }
.list_more a { display: inline-block; font-size: 14px; padding: 40px 0; background-image: url(../../2024/images/board/ico_arrow_more.png); background-position: 100% 50%; background-repeat:no-repeat;  padding-right: 30px; color: #000;}
.list_more a:hover { opacity: 0.6}



/* faq page */
.section_qa {overflow:hidden;width:calc(100% - 40px);height:100%;margin:0 auto; }
.h_txt{float:left;width:196px; height:42px;background:url(../../2024/images/board/sp.png) 0 -380px no-repeat}
.con{font-size:12px;line-height:18px}
.section_qa .con{height:100%; margin-bottom:50px}
.section_qa .faq_area{border-bottom:1px solid #575757}
.section_qa .faq_area ul { margin: 0}
.section_qa .faq_area li{position:relative;overflow:hidden;height:100%;border-top:1px solid #d2d2d2;vertical-align:top; text-align:left}
.section_qa .faq_area li:first-child { border-top:2px solid #575757; border-top:0;  }
.section_qa .faq_area .notice_link_box{width: fit-content;padding: 20px 40px 20px 30px;font-size:14px;font-weight:bold;background:url(../../2024/images/board/ico_about3_q.png) 3px 24px no-repeat;line-height:1.6em;}
.section_qa .faq_area .notice_link_box a{color:#222}
.section_qa .faq_area .notice_link_box.answer{width: 96%;font-weight:normal;border-top:1px solid #ebebeb;color:#666;background:url(../../2024/images/board/ico_about3_a.png) 3px 28px no-repeat;}
.section_qa .faq_area .notice_link_box .answer_con{width: 94%;vertical-align:1.3em;padding:0;}
.section_qa .faq_area .notice_link_box .answer_con div { padding:0; margin:0}
.section_qa .faq_area .btn_answer{position:absolute;top:25px;right:6px;width:20px;height:11px;background:url(../../2024/images/board/sp.png) -210px -380px no-repeat;}
.section_qa .faq_area .btn_answer.open{background:url(../../2024/images/board/sp.png) -210px -410px no-repeat}
.section_qa .faq_area .operating_hour{overflow:hidden}
.section_qa .faq_area .operating_hour dt{float:left;clear:both}
.section_qa .faq_area .operating_hour dd{float:left;margin-left:3px;width:80%}
.blind,legend{overflow:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0}






    
    
    
    
    
    
    

/****** 기본 테이블 구성 *********/


.admin_ico { display: none}

/*


.admin_ico img { display:inline-block;  margin:0 0 0 8px; width:36px; height:36px; background-color:#909090; border-radius:23px; padding:3px }
.admin_ico img:hover { background-color:#e60000; }
*/
.bottom_ico { margin:20px auto; text-align:center }
.bottom_ico img { display:inline-block;  margin:0 0 0 8px; width:36px; height:36px; background-color:#909090; border-radius:23px; padding:3px }
.bottom_ico img:hover { background-color:#e60000; }


/****** 쓰기 *********/
/*
.write {  width:100%; border-bottom:#b7b7b7 solid 1px; margin:0 auto; }
.write .none { border:none; }
.write th { width:150px; background-color:#fafafa; font-size:16px; font-weight:600; color:#7b7b7b; border-top:#e1e1e1 solid 1px; text-align:left; padding:5px 0 5px 25px }
.write td { font-size:12px; color:#e5e5e5; border-top:#d8d8d8 solid 1px; text-align:left; padding:7px 0 7px 15px; } 
.write td input.i_box { width:calc(100% - 20px); border:#c6c6c6 solid 1px; padding-left:5px; color:#555555; font-size:16px; line-height:24px; height:24px }
.write td textarea.t_box { width:calc(100% - 24px); height:100px; border:#c6c6c6 solid 1px; padding-left:5px; color:#555555; font-size:16px; line-height:24px; }
.write td select.s_box { font-size:16px; line-height:24px;}
.write td.check { font:normal 12px/18px 나눔고딕, 돋움; color:#999999; letter-spacing:-0.05em; }
.write td.smtit{color:#7b7b7b;  font-weight:bold; font-size:16px;  }


.contact .select_type_radio { margin: 0 0 20px; padding-bottom: 10px; text-align: left; border: 0;
    border-bottom: 1px #e6e6e6 solid; }
.contact .select_type_radio input { display: inline-block; width: auto; height: auto; vertical-align: middle;  padding: 0; margin: 0 0 0 50px}
.contact .select_type_radio input:first-child { margin-left: 0 }
.contact .select_radio{ vertical-align: middle; font-size: 21px;     margin-bottom: 18px;  display: inline-block; margin-right: 5px }  
.contact .radio_label  { display: inline-block; vertical-align: middle; font-size: 15px; transform: rotate(0.1deg); letter-spacing: 0; font-weight: 400  }
.contact .radio_label strong { font-size: 15px; transform: rotate(0.1deg); }
*/



/* 문의하기 */
.contact { width:calc(100% - 40px); margin:0 auto  }
.contact input {width:calc(100% - 0px); border:0; border-bottom:1px #e6e6e6 solid; background-color:#fff; line-height:38px; font-size:15px; padding:0; margin-bottom:12px; outline:none;}
.contact input:focus,
.contact textarea:focus { border-bottom:1px #42b7c8 solid;  }

.contact textarea   {width:calc(100% - 0px);height:100px;border:0;border-bottom:1px #e6e6e6 solid;background-color:#fff;line-height:21px;font-size:15px;padding: 10px 0 0;margin-bottom:12px;outline:none;}
.contact button  { width:100%; height: 48px;  background-color: #42b7c8; font-size: 21px; cursor:pointer; border-radius: 3px; color: #fff; border:0; }

.add_text { background-color: #eaf1f9; border-radius: 10px; color:#4c4c4c; padding: 30px; font-size: 14px}
.add_text strong { display: block; font-size: 18px; margin-bottom: 10px }
.add_box { width: auto; background-color: #f5f5f5; font-size: 12px; line-height: 1.4em; transform: rotate(0.1deg); padding: 18px; margin:0px auto 0; text-align: center; font-weight: 400;}

.table_board_view { width:calc(100% - 40px); border-bottom:#e6e6e6 solid 1px; margin:0 auto;}
.table_board_view img { vertical-align:middle;  }
.table_board_view a:link,
.table_board_view a:active, 
.table_board_view a:visited { color:#4c4c4c; text-decoration:none;}
.table_board_view th { padding:20px 0 0; font-weight:600; color:#333;  text-align:left; font-size:18px; border-bottom:#e3e3e3 solid 1px; display: block; border-bottom:0;  }
.table_board_view th img { max-width:24px; display:inline-block}
.table_board_view th strong { font-size:11px; margin-right:10px  }
.table_board_view th:last-child { text-align:right; font-size:11px; font-weight:400; color:#666; padding: 5px 0 } 
.table_board_view th font { margin:0 15px 0 5px; }
.table_board_view td { vertical-align:middle; padding:30px 0; border-bottom:1px #ddd solid; text-align:left; font-size:14px;     letter-spacing: -0.03em;
    line-height: 1.6em;  color:#666;  }
.table_board_view td:nth-of-type(odd) { }
.table_board_view td img { display:block; max-width:100%; margin:30px 0; }
    
    
.table_system {width: calc(100% - 40px);border: 1px solid #e5e5e5;border-collapse: separate;border-spacing: 0;border-radius: 0px;overflow: hidden;margin:30px auto 0}
.table_system th,
.table_system th,
.table_system td { color:#666; font-size: 13px;  transform: rotate(0.1deg); padding: 0.9em; border-bottom: 1px solid #e5e5e5; text-align: left; background-color: #fff; font-weight: 400; line-height: 1.3em; letter-spacing: -0.03em;   }
.table_system th { width: 50px;  }
.table_system th { color:#666; transform:none; background-color:#f6f7fb; text-transform: uppercase;}
.table_system th + th,
.table_system td { border-left: 1px solid #e5e5e5;}
.table_system tr:last-child th,
.table_system tr:last-child td { border-bottom: none;}
    
    
    
/* about */
.about {margin: 0rem auto 5rem;}
.about h3 {margin: 0 auto 0;/* padding-top: 36px; */line-height: 1em;letter-spacing: -0.01em;text-align: left;font-size: 30px;display: inline-block;text-align: center;}
.about h3 span {display: block;font-size: 14px;color: #666;font-weight: 300;text-transform: uppercase;margin-top: .5rem;margin-bottom: 2rem;}
.about .greeting { display: block; width: 900px; margin: auto; margin: 0 auto 0; color: #808080; font-size: 16px; transform: rotate(0.1deg); line-height: 1.4em; font-weight: 400; text-align: justify }
.about .ceo { display: block; padding-bottom: 54px; text-align: right}
.about .ceo strong {display: block; margin:30px 0 5px 0; color: #30a3bf; font-size: 20px; line-height: normal; font-weight: 600}
.about .ceo em {display: block; margin:0; color: #000; font-size: 24px; line-height: normal; font-weight:400; font-style: italic}
.about .ci { display: block; width: 900px; margin: auto; padding-bottom: 80px; }
.about .ci img { width: 100%; }

.about .about_img { display: block; margin: auto;  max-width: 60%}
.about .about_img2 {display: block;margin: 2rem auto;padding-left: 0;width: 75%;max-width: 400px;}

.about_wonders { width: 900px; margin:40px auto 40px; text-align: left; }
.about_wonders li { display: inline-block; font-size: 24px; font-weight: 600; text-align: left; color: #333; margin-bottom: 50px; padding-left: 110px;  }
.about_wonders li font { display: block; font-size: 16px; transform: rotate(0.1deg); font-weight: 400; margin-top: 12px; line-height: 1.4em; color: #808080; }
.about_wonders li span { position: absolute; width: 100px; padding: 0; margin-left: -110px }
.about_wonders li span img { width: 90px; margin:0 0 0 0; vertical-align: middle }
.about_wonders li strong { color: #999; font-weight: 400; padding-left: 10px; font-size: 16px; transform: rotate(0.1deg);  }