@charset 'utf-8';
@import url('/style/fontNotosans.css');

div#dev932Loading { display:none; }
div#globalTnb { display:none; }


* { font-family:inherit; color:inherit; border:0; padding:0; margin:0; font-size:inherit; box-sizing: border-box; }
html { border:0; padding:0; margin:0; color:#333; background-color:#F5F5F5; }
body, form, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, fieldset, legend { padding:0; margin:0; }
ul, ol, li { list-style:none; margin:0;}
body { font-family: 'Noto Sans', Sans-Serif; font-weight:400; }
div, section, ul, li { position:relative; box-sizing: border-box; }

html, body, #wrap { min-width:320px; }
img { max-width: 100%; }

input, textarea { font-family: 'Noto Sans', Sans-Serif; }
button { vertical-align:middle; cursor:pointer; }
a { border:0; text-decoration:none; cursor:pointer; }
strong { color:inherit; }

#header { background-color: #FFF; box-shadow: 0 0 3px #DDD; border-bottom:1px solid #DDD; color:#FFF; margin-bottom:0.5em; }
#header div.tnb { background-color:#FFF; position:fixed; width:100%; top:0; z-index:90; box-shadow: 0 0 3px #DDD; }
#header::after { content:''; display: block; clear:both; }
#header h1 { line-height:50px; letter-spacing:-0.075em; font-size:20px; z-index:1; position:relative; padding:0 100px 0 1em; }
#header h1 a { display:block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right:5px; text-shadow:1px 1px 2px #666; }

#header #gnb { position:absolute; right:1em; top:0; height:50px; z-index:2; }
#header #gnb button.switch { display:block; position:absolute; right:0; top:0; width:2em; height:2em; margin-top:0.5em; z-index:4; transition: 0.3s; }
#header #gnb button.switch:focus { outline:none; }
#header #gnb button.switch::before { content:''; display:block; position:absolute; width:60%; height:2px; top:calc(25% - 1px); background-color:#FFF; left:50%; transform: translateX(-50%); box-shadow:1px 1px 2px #666; transition: 0.3s; }
#header #gnb button.switch::after { content:''; display:block; position:absolute; width:60%; height:2px; left:50%; background-color:#FFF; top:calc(75% - 1px); transform: translateX(-50%); box-shadow:1px 1px 2px #666; transition: 0.3s; }
#header #gnb button.switch span { display:block; position:absolute; opacity: 1; overflow:hidden; text-indent: -1000em; width:60%; height:2px; background-color:#FFF; left:50%; top:calc(50% - 1px); transform: translateX(-50%); box-shadow:1px 1px 2px #666; transition: 0.3s; }
#header #gnb div.panel { opacity:0; position:fixed; background-color:#FFF; color:#333; right:-100%; top:0; z-index:3; box-shadow: 0 0 3px #DDD; width:100%; height:100%; padding:calc(50px + 0.5em) 0 calc(70px + 0.5em); transition: 0.3s; overflow-y:scroll; }
#header #gnb div.panel > ul.navi { position: relative; z-index:1; padding:0 0.5em; }
#header #gnb div.panel li { font-weight:300; }
#header #gnb div.panel li a { display:block; line-height:1.25em; padding:0.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; }
#header #gnb div.panel > ul.navi > li { padding-bottom:0.5em; }
#header #gnb div.panel > ul.navi > li > a { font-weight:500; border-bottom:1px solid #AAA; }
#header #gnb div.panel div.child li a { padding-left:0.5em; font-size:0.9em; color:#333;  padding-right:50px; }
#header #gnb div.panel div.child li a span.count { display:block; position:absolute; right:0.5em; top:0.5em; }
#header #gnb div.panel div.cateChild li a { border:none; font-size:0.8em; padding-left:1em; color:#999;}
#header #gnb div.panel div.cateChild li a:before { content:'└'; padding-right:0.3em; }

@-webkit-keyframes loginOpen { from { opacity: 0; top:0; } to { opacity: 1; top:60px; } }
@keyframes loginOpen         { from { opacity: 0; top:0; } to { opacity: 1; top:60px; } }
#header #gnb div.panel div.mnb { position:fixed; top:0; width:100%; height:50px; padding:0 4em 0 1em; background-color: #FFF; box-shadow:-1px 0 3px #DDD; z-index:2; }
#header #gnb div.panel div.mnb span.user { display:block; letter-spacing:-0.075em; line-height:50px; }
#header #gnb div.panel div.mnb span.user span.infor { display:block; float:left; font-size:0.9em; }
#header #gnb div.panel div.mnb span.user span.infor span.name { font-weight:500; display:block; float:left; max-width:120px; margin-right:0.2em; font-size:1.2em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#header #gnb div.panel div.mnb span.user span.links { display:block; float:left; padding-left:0.5em; height:50px; }
#header #gnb div.panel div.mnb span.user span.links button { display:block; width:2em; height:100%; float:left; }
#header #gnb div.panel div.mnb span.user span.links button:focus { outline:none; }
#header #gnb div.panel div.mnb span.user span.links button span { display: none; }
#header #gnb div.panel div.mnb span.user span.links button.mypage { background:url('/images/blog/mobile/icoMember_666666.svg') no-repeat center / auto 20px; }
#header #gnb div.panel div.mnb span.user span.links button.logout { background:url('/images/blog/mobile/icoLogout_666666.svg') no-repeat center / auto 20px; }
#header #gnb div.panel div.mnb span.guest button.loginSwitch { display:block; height:30px; margin-top:10px; box-sizing: border-box; border:1px solid #DDD; padding:0 0.5em; border-radius: 3px; font-size:0.9em; }
#header #gnb div.panel div.mnb span.guest span.loginForm button.loginClose { position: absolute; right:0.5em; top:0.7em; width:1.5em; height:1.5em; }
#header #gnb div.panel div.mnb span.guest span.loginForm button.loginClose span { display: none; }
#header #gnb div.panel div.mnb span.guest span.loginForm button.loginClose::before { content:''; display:block; position:absolute; width:60%; height:2px; background-color: #333; transform:rotate(-45deg); left:20%; top:50%; box-shadow:none; transition: 0.5s; transition-delay: 0.2s; }
#header #gnb div.panel div.mnb span.guest span.loginForm button.loginClose::after { content:''; display:block; position:absolute; width:60%; height:2px; background-color: #333; transform:rotate(45deg); left:20%; top:50%; box-shadow:none; transition: 0.5s; transition-delay: 0.2s; }
#header #gnb div.panel div.mnb span.guest span.loginForm { display:none; position:absolute; width:300px; background-color: #F5F5F5; padding:0.5em; border-radius: 5px; box-shadow: 1px 1px 3px #999; box-sizing: border-box; top:60px; left:50%; transform: translateX(-50%); }
#header #gnb div.panel div.mnb span.guest.active span.loginForm { display:block; -webkit-animation: loginOpen 0.3s; animation: loginOpen 0.3s; }
#header #gnb div.panel div.mnb span.guest span.loginForm ul.input { margin-right:100px; }
#header #gnb div.panel div.mnb span.guest span.loginForm ul.input li { padding:0.2em 0; }
#header #gnb div.panel div.mnb span.guest span.loginForm label { display:none; }
#header #gnb div.panel div.mnb span.guest span.loginForm input { display:block; width:100%; height:2.5em; padding:0 0.5em; border:1px solid #DDD; }
#header #gnb div.panel div.mnb span.guest span.loginForm div.control { width:90px; position:absolute; right:0.5em; bottom:0.7em; }
#header #gnb div.panel div.mnb span.guest span.loginForm div.control button { border:1px solid #DDD; background-color: #FFF; height:2.5em; width:100%; display:block; padding:0; border-radius: 5px; }

#header #gnb div.panel div.contact { position:fixed; bottom:0; background-color:#FFF; box-shadow:1px 0 3px #DDD; width:100%; z-index:2; }
#header #gnb div.panel div.contact a { display:block; float:left; line-height:70px; letter-spacing: -0.05em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#header #gnb div.panel div.contact a.phone { font-size:1.75em; padding-left:50px; font-weight:600; color:#548cd9; width:calc(100% - 70px); background:url('/images/blog/mobile/blitPhone_548cd9.svg') no-repeat 0.5em 55% / 30px auto;  }
#header #gnb div.panel div.contact a.email { width:70px; height:70px; background:url('/images/blog/mobile/blitMail_548cd9.svg') no-repeat center / 40px auto;  }
#header #gnb div.panel div.contact a.email span { display: none; }
#header #gnb.active div.panel { opacity:1; right:0; transition: 0.3s; }
#header #gnb.active button.switch { transition: 0.5s; transition-delay: 0.2s; }
#header #gnb.active button.switch::before { background-color: #333; transform:rotate(-45deg); left:20%; top:50%; box-shadow:none; transition: 0.5s; transition-delay: 0.2s; }
#header #gnb.active button.switch::after { background-color: #333; transform:rotate(45deg); left:20%; top:50%; box-shadow:none; transition: 0.5s; transition-delay: 0.2s; }
#header #gnb.active button.switch span { opacity: 0; transition: 0.5s; transition-delay: 0.2s; }

#header #search { position:absolute; right:3em; height:50px; top:0; z-index:1; }
#header #search button.switch { display:block; width:2em; height:2em; margin-top:0.5em; position:relative; }
#header #search button.switch:focus { outline:none; }
#header #search button.switch::before { content:''; display:block; position:absolute; width:0.8em; height:0.8em; left:0.35em; top:0.35em; border:2px solid #FFF; border-radius:1em; box-shadow:1px 1px 2px #666; z-index:1; }
#header #search button.switch::after { content:''; display:block; position:absolute; width:0.5em; height:2px; left:1.15em; top:1.4em; background-color:#FFF; transform:rotate(45deg); box-shadow:1px 1px 2px #666; z-index:2; }
#header #search button.switch span { display:none; }
#header #search div.panel { position:fixed; background-color:rgba(0, 0, 0, 0.4); top:50px; left:0; width:100%; padding:0 1em; overflow:hidden; height:0; transition: 0.2s;}
#header #search.active div.panel { padding:0.5em 1em; height:3.5em; opacity:1; transition: 0.3s; }
#header #search div.panel div.searchForm::after { content:''; display: block; clear:both; }
#header #search div.panel div.searchKeyword { padding-right:3em; }
#header #search div.panel div.searchKeyword input { display: block; width:100%; height:2.5em; padding:0 1em; border:0; border-radius: 2em; box-shadow:1px 1px 3px #999 inset; color:#333; }
#header #search div.panel div.searchControl { position:absolute; right:0; top:0; }
#header #search div.panel div.searchControl button { height:2.5em; width:2.5em; }

#header.main { height:240px; }
#header.main div.tnb { background-color:rgba(0, 0, 0, 0.4); }
#header.main div.visual { position:absolute; width:100%; height:100%; left:0; top:0; z-index:1; }
#header.main div.visual a { display:block; height: 100%; background:no-repeat center / cover; }
#header.main div.visual a span { display:none; }
#header.main div.visual span.visual { display:block; height: 100%; background:url('/images/blog/common/visual.13.jpg') no-repeat center / cover; }
#header.main div.visual span.visual span { display: none; }
#blogMultiVisual, #header.main div.visual div.vList { height:100%; }
#header.main div.visual div.vControl { display:none; }
#header.main div.visual div.vPage { display:none; }

#header.sub { color:#333; height:50px; }
#header.sub h1 a { text-shadow:none; }
#header.sub #search div.panel { background-color:#FFF; box-shadow: 1px 1px 1px #DDD; }
#header.sub #search button.switch::before { border-color:#333; box-shadow: none; }
#header.sub #search button.switch::after { background-color:#333; box-shadow: none; }

#header.sub #gnb button.switch::before { background-color:#333; box-shadow: none; }
#header.sub #gnb button.switch::after { background-color:#333; box-shadow: none; }
#header.sub #gnb button.switch span { background-color:#333; box-shadow: none; }

#header div.shortcut { position:absolute; right:0.5em; bottom:0.5em; z-index:3; }
#header div.shortcut a { display:block; float:left; width:2.5em; height:2.5em; border:1px solid #FFF; margin-left:0.5em; }
#header div.shortcut a span { display:none; }
#header div.shortcut a.corpSite { background:rgba(255, 255, 255, 0.25) url('/images/blog/mobile/icoSite_FFFFFF.svg') no-repeat center / 60%; }
#header div.shortcut a.blogLocation { background:rgba(255, 255, 255, 0.25) url('/images/blog/mobile/icoLocation_FFFFFF.svg') no-repeat center / 60%; }

#blogCurrent { z-index:3; bottom:0; right:0; width:100%; padding:0.5em; background-color:#FFF; box-shadow: 1px 1px 1px #DDD; }
#blogCurrent div.title { display:none; }
#blogCurrent div.current ul { text-align:right; font-size:0.8em; font-weight:300; }
#blogCurrent div.current ul::after { content:''; display:block; clear:both; }
#blogCurrent div.current li.since { display:inline-block; float:left; }
#blogCurrent div.current li.today { display:inline-block; margin-right:1em; }
#blogCurrent div.current li.total { display:inline-block; }
#blogCurrent div.current li.product { display:inline-block; float:left; clear:both; }
#blogCurrent div.current li.bTotal { display:inline-block; float:right; }
#blogCurrent div.current li label::after { content:' : '; }

#footer { width:100%; margin-top:1em; padding:1em; background:#ddd; box-shadow: 0 0 3px #999 inset; font-size:0.8em; color:#666; font-weight:100; }
#footer div.copyright { border-top:1px solid #AAA; margin-top:0.5em; padding-top:0.5em; }
a.changeDvPc { display:block; margin:-3.5em 1em 0; padding:1em 0; float:right; font-size:0.8em; color:#666; font-weight:300; text-decoration: underline; position:relative; z-index:9; }

/* MAIN */
#main { }

#main div.section { margin-bottom:1em; }
#main div.section div.header { padding:0.5em 0.5em 1em; }
#main div.section div.header::after { content:''; display: block; clear: both; }
#main div.section div.header span.title { display:block; float:left; font-weight:500; font-size:1.2em; line-height:1em; }
#main div.section div.header a.more { display:block; float:right; width:1.2em; line-height: 1.2em; border:1px solid #DDD; border-radius: 3px; text-align:center; }
#main div.section div.header a.more::before { content:'+'; }
#main div.section div.header a.more span { display: none; }

div.profile { padding:0.5em 1em; }
div.profile.hasThumb { background:none; padding-right:1em; }
div.profile::after { content:''; display: block; clear: both; }
div.profile div.thumb { float:left; width: 5em; height:5em; background-color:#FFF; box-shadow:1px 1px 3px #999; border-radius:5em;  margin-right:1em; overflow:hidden; }
div.profile div.thumb span.profile { display:block; height:100%; overflow:hidden; text-indent:-1000em; background:no-repeat center / contain; }
div.profile div.contact a { display:block; text-align:center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
div.profile.hasThumb div.contact a { text-align:left; }
div.profile div.contact a span { display:inline-block; max-width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
div.profile div.contact a.phone { font-size:2em; font-weight:500; color:#F00; line-height:1em; letter-spacing: -0.05em; }
div.profile div.contact a.phone span { line-height:1.5em; }
div.profile div.contact a.email { line-height:1.5em; }

#main div.recom { display:none; }
#main div.recom div.content { overflow-y:scroll; height:16em; }
#main div.recom ul.prodList li { float:left; padding:0.5em; border-radius:10px; width:15em; background-color:#FFF; box-shadow: 0 0 3px #DDD; margin:0 0.5em; }
#main div.recom ul.prodList li a span.img { border-radius:6px 6px 0 0; overflow: hidden; }

#main div.products { padding:0.5em; background-color:#FFF; box-shadow: 0 0 3px #DDD;    }
#main div.products ul.prodList::after { content:''; display: block; clear:both; }
#main div.products ul.prodList li { float:left; width:50%; box-sizing: border-box; padding:0.5em 0.5em 1em; }
#main div.products ul.prodList li.empty { float:none; width:auto; text-align:center; font-weight:300; color:#999; background-color:#F5F5F5; padding:0; line-height:5em; }
#main ul.prodList li a { display:block; }
#main ul.prodList li a span.img { display:block; padding:0.5em; border:1px solid #EEE; margin-bottom:0.25em; }
#main ul.prodList li a span.thumb { display:block; overflow:hidden; height:10em; text-indent: -1000em; background:no-repeat center / contain; }
#main ul.prodList li a span.name { display:block; font-size:1em; line-height:1.5em; text-align:center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#main ul.prodList li a span.price { display:block; font-size:0.9em; line-height:1.5em; text-align:center; color:#F00; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

#main div.section.news { padding:0.5em; background-color:#FFF; box-shadow: 0 0 3px #DDD; }
#main div.section.news div.content::after { content:''; display: block; clear:both; }
#main div.section.news div.content li { line-height: 2em; border-bottom:1px solid #EEE; position:relative; padding:0 0.5em; }
#main div.section.news div.content li::after { content:''; display: block; clear:both; }
#main div.section.news div.content li span.thumb { display:none; }
#main div.section.news div.content li a { margin-right:5em; display:block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#main div.section.news div.content li span.date { position:absolute; right:0.5em; top:0; font-size:0.8em; color:#999; }

@media (max-width: 360px) {
    #main div.products ul.prodList li a span.thumb { height:8em; }

    #main div.section.news { font-size:0.9em; }
}
@media (max-width: 300px) {
    #main div.products ul.prodList li { float:none; width:auto;}
    #main div.products ul.prodList li a span.thumb { height:10em; }

    #main div.section.news div.content li a { margin-right:0; }
    #main div.section.news div.content li span.date { display:none; }
}
@media (min-width: 600px) {
    #main div.products ul.prodList li { width:33.33%; }
}



/* SUB 공통 */
#container { padding:0 0.5em; z-index:1; }
#location { margin-bottom:0.5em; }
#location h2 { font-size:1.25em; }

#content div.control { }
#content div.control a { display:block; width:auto; height:auto; line-height:2.5em; padding:0 1em; box-sizing: border-box; border:1px solid #DDD; background:#FFF !important; }
#content div.control a span { font-size:1em; font-weight:500; color:#666; }
#content div.control button { display:block; width:100%; height:auto; font-size:1em; line-height:2.5em; padding:0 1em; margin:0.5em 0; box-sizing: border-box; border:1px solid #DDD; background:#FFF; }
#content div.control button span { font-weight:500; color:#666; }

/* 인트로 */
#content div.section { background-color:#FFF; box-shadow: 0 0 3px #DDD; padding:0.5em; margin-bottom:1em; border-radius: 5px; clear:both; }
#content div.section div.title { border-bottom:1px solid #DDD; font-weight:600; padding-bottom: 0.5em; margin-bottom:0.5em; }
#content div.section div.infor li { border-bottom:1px solid #EEE; padding:0.5em; }
#content div.section div.infor li:last-child { border:0; }
#content div.section div.infor li span.label { display:block; color:#999; font-size:0.8em; line-height:1em; }
#content div.section div.infor li span.value { display: block; padding-top:0.2em; }
#content div.section iframe { max-width:100%; height: 250px; }

/* 포스팅, 공지사항 */
#content div.board { margin-bottom:1em; }
#content div.board div.list { margin-bottom:1em; }
#content div.board div.list div.item { background-color:#FFF; box-shadow: 0 0 3px #DDD; padding:0.5em; border-radius: 5px; margin-bottom:0.5em; }
#content div.board div.list div.item:last-child { border:none; }
#content div.board div.list div.item a { display:block; padding:0.5em; }
#content div.board div.list div.item span.thumb { display:none; }
#content div.board div.list div.item span.subject { display:block; line-height:1em; margin-bottom:0.5em; }
#content div.board div.list div.item span.date { display:block; font-size:0.8em; color:#999; }
#content div.board div.list div.item span.article { display:block; font-size:0.8em; color:#999; line-height:1.2em; max-height:2.4em; overflow:hidden; }
#content div.board div.list div.item a.hasThumb span.thumb { display:block; border-radius:5px; margin-bottom:0.5em; height:10em; background:no-repeat center / cover; }
#content div.board div.list div.item a.hasThumb span.article { display:none; }
#content div.board div.list div.empty { text-align:center; font-weight:300; color:#999; background-color:#F5F5F5; padding:0; line-height:5em; }

#content div.board div.detail { background-color:#FFF; box-shadow: 0 0 3px #DDD; padding:0.5em; border-radius: 5px; margin-bottom:0.5em; }
#content div.board div.detail div.header { border-bottom:1px solid #DDD; padding-bottom:0.5em; margin-bottom:0.5em; }
#content div.board div.detail div.header span.subject { display:block; font-size:1.2em; font-weight:500;  }
#content div.board div.detail div.header span.date { display:block; font-size:0.8em; color:#999; font-weight:300; }

/* 고객센터 */
#content div.customer ul#d932BlogCsForm > li { padding:0.5em 0; }
#content div.customer ul#d932BlogCsForm > li label { display:block; font-size:0.8em; color:#999; font-weight:300; padding-left:0.5em; }
#content div.customer ul#d932BlogCsForm > li input,
#content div.customer ul#d932BlogCsForm > li textarea { display:block; border:1px solid #DDD; line-height:2.5em; width:100%; box-sizing: border-box; padding:0 0.5em;  box-shadow:1px 1px 3px #EEE inset;}
#content div.customer ul#d932BlogCsForm > li textarea { height:200px; }
#content div.customer ul#d932BlogCsForm > li span.desc { display:block; font-size:0.8em; color:#999; line-height:1.25em; }
#content div.customer ul#d932BlogCsForm ul.d932File { margin:0; }
#content div.customer ul#d932BlogCsForm ul.d932File li { margin:0; }
#content div.customer div.control::after { content:''; display:block; clear:both; }
#content div.customer div.control button.submit { width:calc(70% - 0.5em); float:left; background-color:#2673bd; }
#content div.customer div.control button.submit span { color:#FFF; }
#content div.customer div.control button.cancel { width:calc(30% - 0.5em); float:right; }
#content div.customer div.control button.cancel span { color:#666; }

/* 제품 */
#content div.product.search div.header { text-align:center; padding:0.5em 0 1em; font-size:0.9em; color:#999; }
#content div.product.search div.header strong { font-size:1.1em; color:#333; }

#content div.product div.list { margin:0 -0.5em 1em; }
#content div.product div.list::after { content:''; display:block; clear:both; }
#content div.product div.list div.item { float:left; width:50%; margin-bottom:1em; padding:0 0.5em; }
#content div.product div.list div.item a { display:block; border-radius:10px; background-color:#FFF; box-shadow: 0 0 3px #DDD; overflow:hidden; padding-bottom:0.5em; }
#content div.product div.list div.item a span.thumb { display:block; overflow:hidden; height:10em; text-indent: -1000em; background:no-repeat center / contain; border-bottom:1px solid #DDD; margin-bottom:0.5em; }
#content div.product div.list div.item a span.name { display:block; font-size:1em; line-height:1.5em; text-align:center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding:0 0.5em; }
#content div.product div.list div.item a span.price { display:block; font-size:0.9em; line-height:1.5em; text-align:center; color:#F00; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;padding:0 0.5em; }
#content div.product div.list div.item a span.divide { display:none;  }
#content div.product div.list div.empty { text-align:center; font-weight:300; color:#999; background-color:#F5F5F5; padding:0; line-height:5em; }

@media (max-width: 360px) {
    #content div.product div.list div.item a span.thumb { height:8em; }
}
@media (max-width: 300px) {
    #content div.product div.list div.item { float:none; width:auto;}
    #content div.product div.list div.item a span.thumb { height:10em; }
}
@media (min-width: 600px) {
    #content div.product div.list div.item { width:33.33%; }
}
@media (min-width: 1024px) {
    #content div.product div.list div.item { width:25%; }
}


#content div.product div.detail div.pImages { margin:0 -0.5em 1em; background-color:#FFF; box-shadow: 0 0 3px #DDD; overflow:hidden; }
#content div.product div.detail div.pImages div.image { height:20em; overflow: hidden; }
#content div.product div.detail div.pImages div.image a { display:block; position:absolute; width:100%; height:100%; left:0; padding:0.5em; box-sizing: border-box; }
#content div.product div.detail div.pImages div.image a span.thumb { display:block; position:relative; height:100%; background:no-repeat center / contain; box-sizing: border-box; }
#content div.product div.detail div.pImages div.image a span.thumb span { display:none; }
#content div.product div.detail div.pImages div.pages { text-align:center; position:absolute; bottom:1em; left:50%; transform: translateX(-50%); }
#content div.product div.detail div.pImages div.pages p { display:block; float:left; width:10px; height:10px; border-radius: 5px; background-color: #FFF; box-shadow: 0 0 3px #999; margin:0 3px; transition:background-color 0.3s; }
#content div.product div.detail div.pImages div.pages p.selected { background-color:#548cd9; transition:background-color 0.3s;}
#content div.product div.detail div.pImages div.pages p span { display: none; }

#content div.product div.detail div.section.spec { padding:0; overflow:hidden;}
#content div.product div.detail div.section.spec ul { padding:0.5em; overflow:hidden; }
#content div.product div.detail div.section.spec li { line-height:1.2em; border-bottom:1px solid #EEE; overflow: hidden; padding:0.5em 0; }
#content div.product div.detail div.section.spec li:last-child { border:0; }
#content div.product div.detail div.section.spec li::after { content:''; display: block; clear:both; }
#content div.product div.detail div.section.spec li span.label { display:block; float:left; width:80px; font-size:0.8em; color:#999; text-align:right; }
#content div.product div.detail div.section.spec li span.value { display:block; float:right; width:calc(100% - 100px); font-size:0.9em; }
#content div.product div.detail div.section.spec li span.value span.cate::after { content:'>'; padding:0 10px; }
#content div.product div.detail div.section.spec li span.value span.cate:last-child::after { display:none; }
#content div.product div.detail div.section.spec div.more button { display:block; background-color:#AAA; width:100%; text-align:center; font-size:0.9em; color:#FFF; font-weight:300; line-height:3em; border-radius:}
#content div.product div.detail div.section.spec div.more button::before { content:'\f077'; font-family: 'Font Awesome 5 Free'; font-weight:600; display:inline-block; margin-right:10px; transition:0.3s; }
#content div.product div.detail div.section.spec div.more button.active::before { transform:rotate(180deg); transition:0.3s; }
#content div.product div.detail div.section img { height:auto !important; }


div.mPage span.devPage { display:block; text-align: center; }
div.mPage span.devPage a { display: inline-block; overflow:hidden; font-size:1.2em; padding:0.35em; height:2.6em; line-height:2em; font-weight:300; box-sizing: border-box; }
div.mPage span.devPage a.devNowPage { color:#F00; font-weight:500; }
div.mPage span.devPage span.devPageBlock { display:inline-block; color:#999; }
div.mPage span.devPage span.devPageBlock a span { display:none; }
div.mPage span.devPage span.devPageBlock a::before { font-family: 'Font Awesome 5 Free'; font-weight:600; }
div.mPage span.devPage span.devPageBlock a.disable { color:#DDD; }
div.mPage span.devPage span.devPageBlock a.devFirstPage::before { content:'\f100'; }
div.mPage span.devPage span.devPageBlock a.devPrevPage::before { content:'\f104'; }
div.mPage span.devPage span.devPageBlock a.devNextPage::before { content:'\f105'; }
div.mPage span.devPage span.devPageBlock a.devLastPage::before { content:'\f101'; }


#popup { display:none !important; }


@media (max-width: 752px) {
    .blogMogileInnerWrap {
        background-color: #0069b3;
        margin-top: 0;
        opacity: 1;
        transition-duration: 1s;
        transition-delay: 0.5s;
        display: flex;
        position: relative;
        margin: 0 auto;
        overflow: hidden;
        padding: 0 15px;
        gap: 10px;
    }

    .blogMogileInnerWrap .logoArea {
        display: flex;
        float: left;
        box-sizing: border-box;
        top: 0px;
        height: 55px;
        align-items: center;
        width: 15%;
    }

    .blogMogileInnerWrap .logoArea a.h1 {
        background: url(/images/blog/h1Yeogie.png) no-repeat center;
        width: 47px;
        background-size: contain;
    }

    .blogMogileInnerWrap .logoArea a {
        display: block;
        line-height: 37px;
        height: 37px;
    }

    .blogMogileInnerWrap .logoArea a span {
        display: none;
    }

    .blogMogileInnerWrap .logoArea a+a {
        padding-left: 10px;
    }

    .blogMogileInnerWrap .logoArea a.h2 {
        font-family: 'S-CoreDream-6Bold', 'Nanum Gothic', Sans-Serif;
        font-size: 15px;
        color: #FFF;
    }

    .blogMogileInnerWrap .searchKeyword {
        display: flex;
        width: 100%;
    }

    .blogMogileInnerWrap  .searchArea {
        align-items: center;
        display: flex;
        padding-left: 10px;
    }

    .blogMogileInnerWrap .searchArea .searchKeyword input {
        height: 35px;
        border: 1px solid #005eac;
        padding: 0 10px 0 10px;
        font-family: -apple-system, BlinkMacSystemFont, "Malgun Gothic", helvetica, "Apple SD Gothic Neo", sans-serif;
        font-weight: bold;
        font-size: 15px;
        flex: 1;
        width: 0;
    }
    
    
    .blogMogileInnerWrap .searchArea .searchControl button {
        width: 40px;
        height: 35px;
        background-color: #015691;
        border: 0;
        border: 0;
        border-left: 0;
        background-image: url(/images/blog/newskin29/search.png);
        background-repeat: no-repeat;
        background-position: center;
    }

    .blogMogileInnerWrap .searchArea .searchControl button span {
        display: none;
    }

    .blogMogileInnerWrap .searchArea {
        width: 85%;
        padding-left: 0px;
    }

    .blogMogileInnerWrap .searchArea .search {
        flex: 1;
    }

    #header #search.active div.panel {
        /*top: 105px;*/
    }

    #header #search div.panel {
        /*top: 105px;*/
    }
}