/* BASIC css start */ .headerTopBanner { text-align:center; position:relative; display:none; } .headerTopBanner .swiper-slide a { color:#fff; line-height:45px; font-size:13px; display:block; } .headerTopBanner .headerTopCloseArea { position:relative; margin:0 auto; width:100%; max-width:1500px; } .headerTopBanner .headerTopCloseArea .headerTopClose { width:17px; height:17px; position:absolute; right:10px; bottom:13px; cursor:pointer; z-index:3; } .headerTopBanner .headerTopCloseArea .headerTopClose:before { content:''; position:absolute; left:0; width:100%; top:8px; height:1px; background:#fff; transform:rotate(45deg); } .headerTopBanner .headerTopCloseArea .headerTopClose:after { content:''; position:absolute; left:0; width:100%; top:8px; height:1px; background:#fff; transform:rotate(-45deg); } .topBanner { text-align:center; line-height:40px; } .topBanner a { display:block; background:#efdec5; font-size:14px; } #hdWrap { background:#fff; } #hdWrap .headerTopOpenArea { position:relative; margin:0 auto; width:100%; max-width:1500px; visibility:hidden; transition:0.3s; } #hdWrap .headerTopOpenArea.open { visibility:visible; } #hdWrap .headerTopOpenArea .headerTopOpen { width:24px; height:24px; position:absolute; right:10px; top:0px; cursor:pointer; z-index:3; background:#f1f1f1; text-align:center; } #hdWrap .headerTopOpenArea .headerTopOpen img { width:12px; vertical-align:middle; margin:0 0 -7px; } #hdWrap #header { width:100%; max-width:1520px; margin:0 auto; box-sizing:border-box; padding:0 10px 10px; } #hdWrap #header:after { content:''; clear:both; display:table; } #hdWrap #header > .headerLeftArea { float:left; padding-top:32px; } #hdWrap #header > .headerLeftArea > .hd-logo { padding-bottom:15px; } #hdWrap #header > .headerLeftArea > .hd-logo a { display:inline-block; height:46px; position:relative; } #hdWrap #header > .headerLeftArea > .hd-logo a img { height:100%; } #hdWrap #header > .headerLeftArea > .hd-logo a .fixLogo { display:none; } #hdWrap #header > .headerLeftArea > .headerCateArea { font-size:0; } #hdWrap #header > .headerLeftArea > .headerCateArea:after { content:''; display:block; clear:both; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate { float:left; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul { } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li { height:58px; line-height:58px; display:inline-block; vertical-align:top; position:relative; margin:0 20px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.bar { position:relative; margin:21px 20px 0 0px; width:15px; height:15px; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.bar:before { content:''; position:absolute; left:7px; top:0; width:1px; height:100%; background:#000; transform:rotate(45deg); } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a { font-size:14px; position:relative; display:block; line-height:58px; font-weight:bold; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a.pink { color:#E59DA0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a:after { content:''; position:absolute; left:0px; width:100%; background:transparent; height:2px; bottom:17px; transition:0.2s; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > a:after { background:#000; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.ko a { } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink { margin:0 12px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink a { font-size:13px; padding:0 12px; border-radius:33px; line-height:33px; margin:12px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink a:after { height:0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink.pink a { background:#E59DA0; color:#fff; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink.beige a { background:#E8DECD; color:#171717; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink.blue a { background:#c1d9f4; color:#171717; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.subCateArea { margin:0 45px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.subCateArea > ul > li:last-child { margin:0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu { position:absolute; z-index:4; text-align:center; width:auto; left:50%; transform:translate(-50%,0); padding:5px 0; display:none; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu > p { line-height:25px; display:block; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu > p > a { color:#696969; font-size:11px; white-space: nowrap; transition:0.2s; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate:hover > ul > li > .subMenu { display:block; animation:fadeIn1 0.3s; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > .subMenu > p > a { color:#171717; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > .subMenu > p > a:hover { color:#E59DA0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.subCateArea:after { content:''; position:absolute; z-index:3; left:0; width:100%; height:270px; background:rgba(255,255,255,0.9); visibility:hidden; opacity:0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.subCateArea:hover:after { visibility:visible; opacity:1; animation:fadeIn1 0.3s; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate { margin:14px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li { margin:0 10px 0 0; height:30px; line-height:30px; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li:last-child { margin:0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li > a { font-size:10px; position:relative; display:block; line-height:30px; font-weight:normal; border-radius:30px; color:#fff; background:#000; padding:0 10px; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li > a:after { height:0; } #hdWrap #header > .headerRightArea { float:right; padding-top:50px; text-align:right; } #hdWrap #header > .headerRightArea > .headerRightTop { font-size:0; } #hdWrap #header > .headerRightArea > .headerRightTop > li { display:inline-block; vertical-align:middle; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu { margin:0 0 0 7px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu > div > a { width:22px; display:inline-block; padding:9px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu > div > a img { width:100%; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerCart > div > a { position:relative; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerCart > div > a .cartQty { line-height:1; color:#fff; background:#e87498; text-align:center; position:absolute; top:5px; right:4px; border-radius:15px; font-size:10px; padding:0 4px; line-height:15px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea { position:relative; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn { border-radius:40px; transition:0.3s; width:40px; position:relative; z-index:1; position:relative; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn:hover { } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open { background:#fff; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open img { opacity:0; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open:before { content:''; background:url(/design/monobarbie/PL/img/20_header_search_close_bk.png) center no-repeat; background-size:22px auto; width:40px; height:40px; position:absolute; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search { position:absolute; top:0; right:20px; height:40px; padding:9px; font-size:0; box-sizing:border-box; background:#fff; display:none; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open { display:block; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search form { padding:0 15px 0 15px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search > * { display:inline-block; vertical-align:middle; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search .headerSearchClose { width:22px; cursor:pointer; position:absolute; top:0; right:0; padding:9px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search .headerSearchClose img { width:100%; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset { border-bottom:1px solid #171717; width:200px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset:after { content:''; display:block; clear:both; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset > * { float:left; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset legend { display:none; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset input { border:0; background:none; width:calc(100% - 50px); height:22px; box-sizing:border-box; padding:0 10px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search fieldset a { font-size:11px; line-height:1; width:50px; text-align:center; line-height:22px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open .searchBest { position: absolute; z-index:2; left:25px; width:calc(100% - 10px); background: #fff; top: 32px; box-shadow:rgba(0,0,0,0.2) 0 2px 3px; text-align:left; box-sizing:border-box; padding:20px 10px 10px; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open .searchBest ul li { display:inline-block; vertical-align:top; margin:0 5px 10px 0; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open .searchBest ul li a { color:#585858; font-size:11px; background:#E8E8E8; height:26px; line-height:26px; border-radius:26px; padding:0 12px; display:block; } #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open .searchBest ul li a:before { content:'#'; } #hdWrap #header > .headerRightArea > .headerRightBottom { margin:0 9px 0 0; } #hdWrap #header > .headerRightArea > .headerRightBottom > li { height:58px; display:inline-block; vertical-align:top; } #hdWrap #header > .headerRightArea > .headerRightBottom > li > a { line-height:58px; font-size:15px; font-style: italic; margin:0 0 0 30px; } #hdWrap #header > .headerRightArea > .headerRightBottom > li > a:first-child { margin:0; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.headerRightBotomMenu a { position:relative; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.headerRightBotomMenu a:hover { color:#E59DA0; transition:0.2s; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea { margin:0 0 0 30px; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a { margin:17px 0 0; width:24px; height:24px; position:relative; display:inline-block; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a span { position:absolute; left:0; width:100%; top:11px; height:2px; background:#171717; transition:0.3s; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:before { content:''; position:absolute; top:4px; left:0; width:100%; height:2px; background:#171717; transition:0.3s; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:after { content:''; position:absolute; bottom:4px; left:0; width:100%; height:2px; background:#171717; transition:0.3s; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:hover span { transform:rotate(270deg); } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:hover:before { top:11px; } #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:hover:after { bottom:11px; } #hdWrap.asideOpen #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a span { opacity:0; } #hdWrap.asideOpen #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:before { top:11px; transform:rotate(135deg); } #hdWrap.asideOpen #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:after { bottom:11px; transform:rotate(225deg); } #hdWrap .headerAsideArea { position:absolute; z-index:2; left:0; width:100%; background:rgba(255,255,255,0.95); display:none; } #hdWrap .headerAsideArea .inner { width:100%; max-width:1380px; box-sizing:border-box; margin:0 auto; padding:50px 0; } #hdWrap .headerAsideArea .inner .topArea { margin:0 0 30px; } #hdWrap .headerAsideArea .inner > div ul { display:flex; } #hdWrap .headerAsideArea .inner > div ul li { flex:1; } #hdWrap .headerAsideArea .inner > div ul li h1 { font-size:17px; font-weight:bold; margin:0 0 12px; } #hdWrap .headerAsideArea .inner > div ul li h1 span { position:relative; } #hdWrap .headerAsideArea .inner > div ul li h1 span:after { content:''; position:absolute; left:-3px; width:calc(100% + 6px); background:transparent; height:3px; bottom:-3px; transition:0.2s; } #hdWrap .headerAsideArea .inner > div ul li h1 span a { vertical-align:top; } #hdWrap .headerAsideArea .inner > div ul li h1 span a:hover { color:#E59DA0; transition:0.2s; } #hdWrap .headerAsideArea .inner > div ul li:hover h1 span:after { background:#171717; } #hdWrap .headerAsideArea .inner > div ul li dd p { line-height:1.8; } #hdWrap .headerAsideArea .inner > div ul li dd p > a { font-size:14px; color:#888; transition:0.2s; } #hdWrap .headerAsideArea .inner > div ul li:hover dd p > a { color:#171717; } #hdWrap .headerAsideArea .inner > div ul li dd p > a:hover { color:#E59DA0; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu { flex:5; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd { font-size:0; width:100%; max-width:550px; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a { display:inline-block; vertical-align:top; width:35px; height:35px; margin:0 8px 8px 0; box-sizing:border-box; border:1px solid #D8D8D8; border-radius:50%; overflow:hidden; transition:0.2s; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a:hover { border-color:#E59DA0; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.white { background:#fff; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.black { background:#000; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.ivory { background:#F4F2EA; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.beige { background:#E2D5C0; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.skin { background:#EDE2D6; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.yellow { background:#FFE626; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.wine { background:#8B284A; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.brown { background:#984F35; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.navy { background:#352D6F; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.blue { background:#1B60BF; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.purple { background:#4D2095; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.red { background:#EA2121; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.pink { background:#FFA5AC; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.green { background:#22AF6E; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.orange { background:#FF8C19; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.gray { background:#A8A8A8; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.silver { background:#DBDBDB; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a.gold { background:#EBE2C3; } #hdWrap .headerAsideArea .inner .bottomArea ul li.colorMenu dd span a img { width:100%; } #hdWrap .headerAsideArea .inner .bottomArea ul li.asideBanner { flex:2; } #hdWrap .headerAsideArea .inner .bottomArea ul li.asideBanner dd { overflow:hidden; } #hdWrap .headerAsideArea .inner .bottomArea ul li.asideBanner dd a { display:block; } #hdWrap .headerAsideArea .inner .bottomArea ul li.asideBanner dd a img { width:100%; transition:0.5s; } #hdWrap .headerAsideArea .inner .bottomArea ul li.asideBanner dd a:hover img { transform:scale(1.08); } #hdWrap.asideOpen .headerAsideArea { display:block; animation:fadeIn1 0.3s; } #wrap.fix #contentWrapper { padding-top:144px; } #wrap.fix #hdWrap { background:#000; position:fixed; z-index:4; left:0; top:0; width:100%; animation:fadeIn1 0.5s; } #wrap.fix #hdWrap .headerTopOpenArea { display:none; } #wrap.fix #hdWrap #header { height:70px; min-width:1280px; } #wrap.fix #hdWrap #header > .headerLeftArea { padding:0; } #wrap.fix #hdWrap #header > .headerLeftArea > * { float:left; } #wrap.fix #hdWrap #header > .headerLeftArea > .hd-logo { padding:19px 30px 0 0; } #wrap.fix #hdWrap #header > .headerLeftArea > .hd-logo a { height:31px; vertical-align:top; } #wrap.fix #hdWrap #header > .headerLeftArea > .hd-logo a .normalLogo { display:none; } #wrap.fix #hdWrap #header > .headerLeftArea > .hd-logo a .fixLogo { display:block; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li { height:70px; line-height:70px; margin:0 20px 0 0; color:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a { font-size:14px; line-height:70px; color:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a:hover { } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a:after { height:2px; bottom:20px; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > a:after { background:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > a.pink { color:#E59DA0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink { margin:0 12px 0 0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink a { font-size:11px; padding:0 12px; border-radius:25px; line-height:25px; margin:21px 0 0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink a:after { height:0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink.pink a { color:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.boxLink.beige a { color:#171717; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:last-child { margin:0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.bar { margin:28px 20px 0 0; height:15px; display:none; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.bar:before { background:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu { } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu > p > a { font-size:11px; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > .subMenu > p > a { color:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li:hover > .subMenu > p > a:hover { color:#E59DA0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate:after { background:rgba(0,0,0,0.8); } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li > .subMenu > p > a { color:#fff; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li .newMenu { color:#e87498; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li .bestMenu { color:#7e87ed; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.subCateArea { margin:0 30px 0 0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate { margin:20px 0 0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li { margin:0 10px 0 0; height:30px; line-height:30px; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li:last-child { margin:0; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li > a { font-size:10px; position:relative; display:block; line-height:30px; font-weight:normal; border-radius:30px; color:#000 !important; background:#fff !important; padding:0 10px; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate.eventCate > ul > li > a:after { height:0; } #wrap.fix #hdWrap #header > .headerRightArea { padding:0; font-size:0; } #wrap.fix #hdWrap #header > .headerRightArea > * { float:left; } #wrap.fix #hdWrap #header > .headerRightArea .headerRightTop { margin-top:15px; } #wrap.fix #hdWrap #header > .headerRightArea .headerRightTop > li:first-child { margin:0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn a { position:relative; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn a img { opacity:0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn a:before { content:''; position:absolute; left:9px; top:9px; width:22px; height:22px; background:url(/design/monobarbie/PL/img/20_header_search_btn_wh.png) no-repeat; background-size:100% 100%; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn a:hover img { opacity:1; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn a:hover:before { } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open a:before { background:none; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open a:hover img { opacity:0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .headerSearchBtn.open a:hover:before { background:none; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search { top:55px; right:0; background:#fff; height:auto; box-shadow: rgb(0 0 0 / 20%) 0 2px 3px; padding:20px 9px 9px; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerSearchArea > .hd-search.open .searchBest { left:0; top:0; width:100%; position:relative; box-shadow: rgb(0 0 0 / 0) 0 2px 3px; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu a { position:relative; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerCart a img, #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerMy a img { opacity:0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerCart a:before { content:''; position:absolute; left:9px; top:9px; width:22px; height:22px; background:url(/design/monobarbie/PL/img/20_header_cart_btn_wh.png) no-repeat; background-size:100% 100%; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightTop > li.headerRightTopMenu.headerMy a:before { content:''; position:absolute; left:9px; top:9px; width:22px; height:22px; background:url(/design/monobarbie/PL/img/20_header_my_btn_wh.png) no-repeat; background-size:100% 100%; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom { margin:0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li { height:70px; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.headerRightBotomMenu { display:none; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea { margin:0 0 0 16px; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a { margin:23px 0 0; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a span { background:#fff; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:before { background:#fff; } #wrap.fix #hdWrap #header > .headerRightArea > .headerRightBottom > li.asideBtnArea a:after { background:#fff; } #wrap.fix #hdWrap .headerAsideArea { background:rgba(0,0,0,0.85); } #wrap.fix #hdWrap .headerAsideArea .inner > div ul li h1 span, #wrap.fix #hdWrap .headerAsideArea .inner > div ul li h1 span a { color:#fff; } #wrap.fix #hdWrap .headerAsideArea .inner > div ul li h1 span a:hover { color:#E59DA0; } #wrap.fix #hdWrap .headerAsideArea .inner > div ul li:hover h1 span:after { background:#fff; } #wrap.fix #hdWrap .headerAsideArea .inner > div ul li:hover dd p > a { color:#fff; } #wrap.fix #hdWrap .headerAsideArea .inner > div ul li:hover dd p > a:hover { color:#E59DA0; } @keyframes fadeIn1 { 0% { opacity:0; } 100% {opacity:1; } } @media all and (max-width:1440px) { #wrap.fix #hdWrap #header { padding: 0 30px 0 10px; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li { margin:0 20px 0 0; } #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li.bar { margin:0 15px 0 -5px; } #hdWrap #header > .headerRightArea > .headerRightBottom > li > a { margin:0 0 0 20px; } #hdWrap .headerAsideArea .inner { padding:50px 20px; } #wrap.fix #hdWrap #header > .headerLeftArea > .headerCateArea > .headerCate > ul > li { margin:0 20px 0 0; } } .fixBtnArea { position:fixed; z-index:4; right:30px; bottom:100px; display:none; } .fixBtnArea .fixBtnGo { width:52px; height:52px; border-radius:50%; position:relative; background:#fff; box-shadow:rgba(0,0,0,0.3) 0 3px 6px; box-sizing:border-box; padding:15px; cursor:pointer; } .fixBtnArea .fixBtnGo > * { } .fixBtnArea .fixBtnGo .fixBtnTop { margin:0 0; } .fixBtnArea .fixBtnGo .fixBtnTop img { width:100%; } /* BASIC css end */