@charset "utf-8";

/**** 1024px -  ****
iPad mini : Landscape
iPad Air  : Landscape
iPad Pro  : Portrait and Landscape
*/

/**** Grid ****/
body { padding:0; background:#ffffff; color:#4d4d4d; }

.contents { clear:both; width:980px; margin:0 auto 0 auto; padding:0 20px 0 20px; word-break:break-all; }
.contents:after { content:''; display:block; clear:both; }
.contents.full { width:auto; padding:0; }
.contents.cover-gray { width:auto; padding:0; background:#f7f7f7; }
.contents.border-top { border-top:1px solid #dbdbdb; }
.contents.border-bottom { border-bottom:1px solid #dbdbdb; }


.contents > .layout-main { margin:0 auto 0 auto; width:980px; }
.contents > .layout-half { margin:0 auto 0 auto; width:490px; }
.contents > .layout-full { margin:0 auto 0 auto; width:auto; }

.contents > .layout-two-columns { display:table; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-two-columns > .left { display:table-cell; width:50%; padding:0 10px 0 0; }
.contents > .layout-two-columns > .right { display:table-cell; width:50%; padding:0 0 0 10px; }
.contents > .layout-two-columns.no-padding > .left,
.contents > .layout-two-columns.no-padding > .right { padding:0; }

.contents > .layout-three-columns { display:table; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-three-columns > .left { display:table-cell; width:33%; padding:0 13px 0 0; }
.contents > .layout-three-columns > .center { display:table-cell; width:34%; padding:0 7px 0 7px; }
.contents > .layout-three-columns > .right { display:table-cell; width:33%; padding:0 0 0 13px; }
.contents > .layout-three-columns.no-padding > .left,
.contents > .layout-three-columns.no-padding > .center,
.contents > .layout-three-columns.no-padding > .right { padding:0; }

.contents > .layout-four-columns { display:table; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-four-columns > .col1 { display:table-cell; width:25%; padding:0 15px 0 0; }
.contents > .layout-four-columns > .col2 { display:table-cell; width:25%; padding:0 10px 0 5px; }
.contents > .layout-four-columns > .col3 { display:table-cell; width:25%; padding:0 5px 0 10px; }
.contents > .layout-four-columns > .col4 { display:table-cell; width:25%; padding:0 0 0 15px; }
.contents > .layout-four-columns.no-padding > .col1,
.contents > .layout-four-columns.no-padding > .col2,
.contents > .layout-four-columns.no-padding > .col3,
.contents > .layout-four-columns.no-padding > .col4 { padding:0; }

.contents > .layout-menu-right { display:table; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-menu-right > .main { display:table-cell; padding:0 20px 0 0; }
.contents > .layout-menu-right > .menu { display:table-cell; width:300px; padding:0; }
.contents > .layout-menu-right.no-padding > .main { padding:0; }

.contents > .layout-menu-left { display:table; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-menu-left > .menu { display:table-cell; width:300px; padding:0; }
.contents > .layout-menu-left > .main { display:table-cell; padding:0 0 0 20px; }
.contents > .layout-menu-left.no-padding > .main { padding:0; }

.contents > .layout-with-menu { display:block; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-with-menu > .main { display:block; float:right; width:720px; }
.contents > .layout-with-menu > .menu { display:block; float:left; width:200px; }
.contents > .layout-with-menu:after { content:''; display:block; clear:both; }
.contents > .layout-with-menu.no-padding > .main { width:780px; }

.contents > .layout-with-menu.narrow { display:block; width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; }
.contents > .layout-with-menu.narrow > .main { display:block; float:right; width:760px; }
.contents > .layout-with-menu.narrow > .menu { display:block; float:left; width:160px; }
.contents > .layout-with-menu.narrow:after { content:''; display:block; clear:both; }
.contents > .layout-with-menu.narrow.no-padding > .main { width:820px; }

.contents > .layout-grid-two-columns { width:1000px; margin:0 auto 0 auto; font-size:0; }
.contents > .layout-grid-two-columns > .inner { font-size:13px; display:inline-block; width:480px; margin:0 20px 20px 0; vertical-align:top; }
.contents > .layout-grid-two-columns.no-padding > .inner { width:490px; margin:0; }

.contents > .layout-grid-three-columns { width:1000px; margin:0 auto 0 auto; font-size:0; }
.contents > .layout-grid-three-columns > .inner { font-size:13px; display:inline-block; width:312px; margin:0 20px 20px 0; vertical-align:top; }
.contents > .layout-grid-three-columns.no-padding > .inner { width:326px; margin:0; }

.contents > .layout-grid-four-columns { width:1000px; margin:0 auto 0 auto; font-size:0; }
.contents > .layout-grid-four-columns > .inner { font-size:13px; display:inline-block; width:230px; margin:0 20px 20px 0; vertical-align:top; }
.contents > .layout-grid-four-columns.no-padding > .inner { width:245px; margin:0; }


.contents > .layout-one-to-two { width:980px; text-align:left; vertical-align:top; margin:0 auto 0 auto; font-size:0; }
.contents > .layout-one-to-two > .inner { display:inline-block; text-align:left; vertical-align:top; font-size:13px; width:315px; }
.contents > .layout-one-to-two > .inner + .inner { width:630px; margin-left:35px; }



.contents.sticky-bottom { position:sticky; bottom:0; width:auto; padding:0; z-index:10; }
.contents.sticky-bottom > .layout-buttons { width:auto; background:#f7f7f7; }
.contents.sticky-bottom > .layout-buttons > .inner { width:980px; margin:0 auto 0 auto; padding:20px; text-align:center; }



/**** Anchor ****/
a { color:#4d4d4d; }
a:hover { color:#232020; }
a.white { color:#e0e0e0; }
a.white:hover { color:#ffffff; opacity:1.0; transition-duration:0.3s; }
a.darkgray { color:#666666; }
a.darkgray:hover { color:#232020; transition-duration:0.3s; }
a.darkgreen { color:#4c5e31; }
a.darkgreen:hover { filter:brightness(135%); transition-duration:0.3s; }
a.gold { color:#a59141; }
a.gold:hover { filter:brightness(135%); transition-duration:0.3s; }
a.darkred { color:#ae2317; }
a.darkred:hover { filter:brightness(135%); transition-duration:0.3s; }
a.orange { color:#d94d38; }
a.orange:hover { filter:brightness(135%); transition-duration:0.3s; }



/**** Color ****/
/*
 * black : #333333 -> #232020
 * thinblack : #4d4d4d;
 *
 */
.text { color:#4d4d4d; }
.black { color:#232020; }
.underline-dotted-black { border-bottom:1px dotted #232020; }
.border-black{ border-color:#232020 !important; }
.bg-black { background:#232020 !important; }
.fill-black { background:#232020 !important; border-color:#232020 !important; color:#ffffff; }
.label.black { border-color:#232020; color:#232020; }
.tag.black { border-color:#232020; background:#232020; color:#ffffff; }
.circle.black { background:#232020; color:#ffffff; }
.btn.fill-black { border-radius:0px !important; background:#232020 !important; border:1px solid #232020 !important; color:#ffffff; }
.btn.label-black { border-radius:0px; background:transparent !important; border:1px solid #232020 !important; color:#232020; }
.btn.label-black:hover { background:#232020 !important; color:#ffffff; }
.btn.label-black.disabled:hover { background:transparent !important; border:1px solid #232020 !important; color:#232020; }
.btn.label-black.prev:after,.btn.label-black.next:after { border-color:#232020 !important; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }

.underline-dotted-thinblack { border-bottom:1px dotted #4d4d4d; }
.bg-thinblack { background:#4d4d4d !important; }
.fill-thinblack { background:#4d4d4d !important; border-color:#4d4d4d !important; color:#ffffff; }
.btn.label-thinblack { border-radius:0px; background:transparent !important; border:1px solid #4d4d4d !important; color:#4d4d4d; }
.btn.label-thinblack:hover { background:#232020 !important; color:#ffffff; transition-duration:0.3s; }


/**** Warnings ****/
input[type="text"].warning,input[type="password"].warning,input[type="email"].warning,input[type="number"].warning,input[type="tel"].warning,textarea.warning { border-color:#d94d38; }


/**** Box ****/
.box.warning { background:#ffeeee; border:none; border-radius:4px; color:#d94d38; padding:15px; margin-bottom:20px; }
.box.balloon.warning:before { border-top:14px solid transparent; }
.box.balloon.warning:after { border-top:14px solid #ffeeee; }
.box.balloon.border-black:before { border-top:14px solid #232020; }
.box.balloon.bg-black:after { border-top:14px solid #232020; }


/**** List ****/
ul.list.hover > li:hover { background:#f9f9f9; }
ul.list.no-line-height > li { line-height:1.5; padding:12px 8px 10px 8px; }

ul.list-with-check > li { padding-left:15px; position:relative; }
ul.list-with-check > li:after { content:"\e97e"; display:inline-block; font-family:"icon"; opacity: 0.75; position:absolute; top:-1px; left:0; }
ul.list-with-check > li.no-icon { padding-left:0; }
ul.list-with-check > li.no-icon:after { content:""; display:none; }

ul.list.x-menu { border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; }
ul.list.x-menu > li > a { display:block; }
ul.list.x-menu > li:hover { background:#f9f9f9; }

ul.list.x-menu-sub { border:none; padding:8px 0 8px 0; }
ul.list.x-menu-sub > li { padding:4px 8px 0px 8px; border:none; }
ul.list.x-menu-sub > li > a { display:block; font-size:12px; }
ul.list.x-menu-sub > li > a > span { display:inline-block; width:16px; color:#bbbbbb; }
ul.list.x-menu-sub > li.disabled > a { color:#bbbbbb; cursor:default;}
ul.list.x-menu-sub > li.disabled > a:hover { color:#bbbbbb; }
ul.list.x-menu-sub > li.divider { padding:0; border-top:1px solid #e1e1e1; margin:4px 0 4px 0; }

dl.selection { display:inline-block; vertical-align:middle; margin:0 25px 15px 0; font-size:0; }
dl.selection > dt { display:inline-block; vertical-align:middle; line-height:24px; font-size:12px; color:#999999; margin:0 6px 0 0; }
dl.selection > dd { display:inline-block; vertical-align:middle; line-height:24px; font-size:13px; }
dl.selection > dd + dd:before { content:"・"; display:inline-block; vertical-align:middle; line-height:24px; font-size:13px; color:#999999; margin:0 2px 0 2px; }





/**** Title ****/
.title { font-size:18px; color:#666666; }
.title.white { color:#e0e0e0; }

.subtitle { font-size:16px; color:#666666; }
.subtitle.white { color:#e0e0e0; }

ul.title {}
ul.title > li { display:inline-block; vertical-align:middle; font-size:0; }
ul.title > li { font-size:18px; }
ul.title > li > a, ul.title > li > span { display:inline-block; vertical-align:middle; color:#666666; }
ul.title > li > a:hover { color:#232020; }
ul.title > li:after { content:"\e92a"; font-family:"icon"; display:inline-block; color:#666666; font-size:14px; vertical-align:middle; margin:0 3px 0 10px; }
ul.title > li:last-child:after { display:none; }
ul.title.small > li { font-size:13px; }
ul.title.small > li:after { font-size:11px; color:#555555; margin:0 3px 0 9px; }
ul.title > li.back { float:right; }
ul.title > li.back > a { color:#a59141;  }
ul.title > li.back > a:hover { filter:brightness(135%); transition-duration:0.3s; }

.heading-with-symbol { display:inline-block; font-size:16px; line-height:18px; vertical-align:middle; }
.heading-with-symbol:before { content:""; display:inline-block; vertical-align:middle; height:18px; width:4px; background:#a59141; margin-right:6px; position:relative; top:-1px; }
.heading-with-symbol.normal { font-size:13px; line-height:15px; }
.heading-with-symbol.normal:before {height:15px; width:4px; margin-right:6px; position:relative; top:-1px; }

.heading-with-symbol.large { font-size:18px !important; line-height:20px; }
.heading-with-symbol.large:before {height:20px; width:4px; margin-right:8px; position:relative; top:-1px; }



/**** Label ****/
.label.square { width:14px; border-radius:0; text-align:center; white-space:nowrap; }


/**** Logo ***/
a.mottox { display:inline-block; width:100px; height:32px; text-indent:-9999px; outline:none; background:transparent url("../../images/common/mottox.svg") center center no-repeat; background-size:contain; }
a.mottox:hover { filter:brightness(120%); transition-duration:0.3s; }


/**** Bottle Image ****/
.image-bottle-large { display:inline-block; width:auto; height:auto; max-width:300px; max-height:300px; text-align:center; }
.image-bottle-large img { width:auto; height:auto; max-width:260px; max-height:300px; }
.image-bottle-large.none { background:#f9f9f9; }
.image-bottle-large.none:before { content:"\ec12"; font-family:"icon"; display:inline; font-size:100px; color:#dddddd; position:relative; top:70px; }




/**** Panel ****/
ul.panel { font-size:0; }
ul.panel > li { display:inline-block; font-size:13px; text-align:center; width:80px; }
ul.panel > li + li { margin-left:5px; }
ul.panel > li > a { display:inline-block; }
ul.panel > li > a > em { display:inline-block; width:44px; height:44px; vertical-align:middle; background:#f9f9f9; color:#777777; border:1px solid #eeeeee; border-radius:4px; }
ul.panel > li > a > em > i { font-size:15px; position:relative; top:10px; }
ul.panel > li > a > span,
ul.panel > li > a > strong { display:block; margin:5px 0 0 0; font-size:12px; color:#666666; }
ul.panel > li > a.bookmarked > em > i { color:#ee7777; }
ul.panel > li > a.requested > em > i { color:#ee7777; }
ul.panel > li > a.disabled { opacity:0.5; cursor:default; }
ul.panel > li > a.disabled > em > i { color:#999999; }
ul.panel > li:hover > a > em { background:#f0f0f0; color:#232020; transition-duration:0.3s; }
ul.panel > li:hover > a > span,
ul.panel > li:hover > a > strong { color:#232020; }
ul.panel > li:hover > a.disabled > em { background:#f9f9f9; color:#777777; }
ul.panel > li:hover > a.disabled > span,
ul.panel > li:hover > a.disabled > strong { color:#666666; }


ul.panel.large > li { width:105px; margin-bottom:20px; }
ul.panel.large > li > a > em { width:60px; height:60px; border:1px solid #cccccc; }
ul.panel.large > li > a > em > i { font-size:17px; position:relative; top:18px; }
ul.panel.large > li > a > strong { margin:10px 0 0 0; font-size:13px; color:#4d4d4d; }


/**** Item list > Slider  ****/
.item-slider { position:relative; }
.item-slider > ul { width:100%; font-size:0; white-space:nowrap; overflow-x:scroll; }
.item-slider > ul > li { display:inline-block; font-size:13px; white-space:normal; width:170px; vertical-align:top; }
.item-slider > ul > li + li { margin-left:15px; }
.item-slider > .prev { position:absolute; top:160px; left:-40px; }
.item-slider > .next { position:absolute; top:160px; right:-40px; }

/**** Item list > Box  ****/
.item-box-list.bg-dotted { padding:10px 0 0 10px; }
.item-box-list.bg-dotted > ul { font-size:0; }
.item-box-list.bg-dotted > ul > li { display:inline-block; font-size:13px; width:167px; vertical-align:top; margin:0 10px 15px 0; }

/**** Item > Tool palette  ****/
.item-tool-palette { position:absolute; top:4px; right:4px; }
.item-tool-palette > div + div { margin-top:4px; }
.item-tool-palette > div > a > span.tag { border-color:#cccccc; background:#cccccc; width:15px; text-align:center; }
.item-tool-palette > div > a:hover > span.tag { border-color:#a59141; background:#a59141; opacity:0.75; }
.item-tool-palette.small { position:absolute; top:2px; right:2px; }
.item-tool-palette.small > div + div { margin-top:2px; }
.item-tool-palette.small > div > a > span { width:12px; }
.item-tool-palette.block { position:relative; top:0; right:0; }
.item-tool-palette.block > div > a > span { display:block; width:auto; }
.item-tool-palette > div.bookmark > a.bookmarked > span.tag { border-color:#ee8888; background:#ee8888; color:#ffeeee; }
.item-tool-palette > div.bookmark > a.bookmarked:hover > span.tag { border-color:#ee6666; background:#ee6666; opacity:1.0; }
.item-tool-palette > div.item_arrival_alert > a.requested > span.tag { border-color:#ee8888; background:#ee8888; color:#ffeeee; }
.item-tool-palette > div.item_arrival_alert > a.requested:hover > span.tag { border-color:#ee6666; background:#ee6666; opacity:1.0; }
.item-tool-palette > div.item_arrival_alert > a.disabled > span.tag { border-color:#e3e3e3; background:#e3e3e3; color:#f9f9f9; cursor:default; }
.item-tool-palette > div.item_arrival_alert > a.disabled:hover > span.tag { border-color:#e3e3e3; background:#e3e3e3; color:#f9f9f9; opacity:1.0; }
.item-tool-palette > div.remove > a > span.tag { border-color:#ffffff; background:#ffffff; color:#aaaaaa; }
.item-tool-palette > div.remove > a:hover > span.tag { border-color:#f0f0f0; background:#f0f0f0; opacity:1.0; }


/**** Campaign list > Slider  ****/
.campaign-slider { position:relative; }
.campaign-slider > ul { width:100%; font-size:0; white-space:nowrap; overflow-x:scroll; }
.campaign-slider > ul > li { display:inline-block; font-size:13px; white-space:normal; width:316px; vertical-align:top; }
.campaign-slider > ul > li + li { margin-left:15px; }
.campaign-slider > .prev { position:absolute; top:160px; left:-40px; }
.campaign-slider > .next { position:absolute; top:160px; right:-40px; }


/**** Campaign > Pop list  ****/
ul.campaign-pop-download { background:#f9f9f9 url("../../images/common/bg.dotted.png") top left repeat; border-radius:4px; width:100%; white-space:nowrap; overflow-x:scroll; padding:0; text-align:center; }
ul.campaign-pop-download > li { display:inline-block; background:#ffffff; border:1px solid #cccccc; border-radius:4px; text-align:center; min-width:150px; height:210px; margin:20px 20px 20px 20px; padding:20px 15px 20px 15px; }
ul.campaign-pop-download > li > strong { display:block; color:#a59141; margin:0 0 15px 0; }
ul.campaign-pop-download > li > a > img { min-width:80px; max-width:160px; min-height:80px; max-height:160px; }
ul.campaign-pop-download > li > a { display:inline-block; transition:transform 0.2s; transform:scale(1.0); }
ul.campaign-pop-download > li > a:hover { transition:transform 0.2s; transform:scale(1.03); }


/**** Button ****/
.btn.default { border-radius:0px !important; background:#232020 !important; border:1px solid #232020 !important; color:#ffffff; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.submit  { border-radius:0px !important; background:#4c5e31 !important; border:1px solid #4c5e31 !important; color:#ffffff; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.alert   { border-radius:0px !important; background:#ae2317 !important; border:1px solid #ae2317 !important; color:#ffffff; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.default.disabled, .btn.default.disabled:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.submit.disabled, .btn.submit.disabled:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.alert.disabled, .btn.alert.disabled:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }

.btn.default:hover { filter:brightness(180%); transition-duration:0.3s; }
.btn.submit:hover  { filter:brightness(135%); transition-duration:0.3s; }
.btn.alert:hover   { filter:brightness(120%); transition-duration:0.3s; }

.btn.default.disabled:hover,
.btn.submit.disabled:hover,
.btn.alert.disabled:hover { filter:none; }

.btn.default.prev:after,
.btn.submit.prev:after,
.btn.alert.prev:after { border-right:1px solid #ffffff; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }

.btn.default.next:after,
.btn.submit.next:after,
.btn.alert.next:after { border-left:1px solid #ffffff; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }


/**** Navigation Tabs ****/
ul.navigation-tabs { display:block; border-bottom:1px solid #232020; margin:0 0 30px 0; font-size:0; vertical-align:bottom; position:relative; white-space:nowrap; }
ul.navigation-tabs > li { display:inline-block; }
ul.navigation-tabs > li > a { display:inline-block; min-width:80px; border-top:1px solid #232020; border-right:1px solid #232020; border-left:none; background:#ffffff; padding:1px 20px 0px 20px; line-height:22px; font-size:12px; color:#4d4d4d; text-align:center; vertical-align:middle; position:relative; }
ul.navigation-tabs > li:first-child > a { border-left:1px solid #232020; }
ul.navigation-tabs > li > a:hover { background-color:#232020; color:#ffffff; transition-duration:0.3s; }
ul.navigation-tabs > li.active > a { color:#ffffff; background:#232020; border-color:#232020; }
ul.navigation-tabs > li.active > a:hover { background-color:#111111; }
ul.navigation-tabs.reverse { border-bottom:none; border-top:1px solid #232020; margin:30px 0 30px 0; vertical-align:top; }
ul.navigation-tabs.reverse > li > a { border-top:none; border-bottom:1px solid #232020; }
ul.navigation-tabs.reverse > li.active > a { border-color:#232020; }

ul.navigation-tabs.darkgreen { border-color:#4c5e31; }
ul.navigation-tabs.darkgreen > li > a { border-color:#4c5e31; color:#4c5e31; }
ul.navigation-tabs.darkgreen > li:first-child > a { border-color:#4c5e31; }
ul.navigation-tabs.darkgreen > li > a:hover { background-color:#4c5e31; color:#ffffff; }
ul.navigation-tabs.darkgreen > li.active > a { color:#ffffff; background:#4c5e31; border-color:#4c5e31; }
ul.navigation-tabs.darkgreen.reverse { border-color:#4c5e31; }
ul.navigation-tabs.darkgreen.reverse > li > a { border-color:#4c5e31; }
ul.navigation-tabs.darkgreen.reverse > li.active > a { border-color:#4c5e31; }

ul.navigation-tabs.darkred { border-color:#ae2317; }
ul.navigation-tabs.darkred > li > a { border-color:#ae2317; color:#ae2317; }
ul.navigation-tabs.darkred > li:first-child > a { border-color:#ae2317; }
ul.navigation-tabs.darkred > li > a:hover { background-color:#ae2317; color:#ffffff; }
ul.navigation-tabs.darkred > li.active > a { color:#ffffff; background:#ae2317; border-color:#ae2317; }
ul.navigation-tabs.darkred.reverse { border-color:#ae2317; }
ul.navigation-tabs.darkred.reverse > li > a { border-color:#ae2317; }
ul.navigation-tabs.darkred.reverse > li.active > a { border-color:#ae2317; }


ul.navigation-tabs.gold { border-color:#cccccc; }
ul.navigation-tabs.gold > li > a { border-color:#cccccc; color:#4d4d4d; }
ul.navigation-tabs.gold > li:first-child > a { border-color:#cccccc; }
ul.navigation-tabs.gold > li > a:hover { background-color:#ede9c2; color:#4d4d4d; }
ul.navigation-tabs.gold > li.active > a { color:#4d4d4d; background:#ede9c2; border-color:#cccccc; }
ul.navigation-tabs.gold.reverse { border-color:#cccccc; }
ul.navigation-tabs.gold.reverse > li > a { border-color:#cccccc; }
ul.navigation-tabs.gold.reverse > li.active > a { border-color:#cccccc; }


/**** Pager ****/
.pager-total { display:inline-block; height:32px; line-height:32px; vertical-align:bottom; margin-right:20px; font-size:13px; }
.pager-total em { font-size:22px; position:relative; top:-3px; padding:0 5px 0 4px; }
ul.pager { display:inline-block; letter-spacing:-.40em; height:32px; line-height:32px; vertical-align:middle; }
ul.pager > li { display:inline-block; letter-spacing:normal; line-height:32px; vertical-align:middle; }
ul.pager > li + li { margin-left:8px; }
ul.pager > li > a,
ul.pager > li > span { display:inline-block; padding:0 3px 0 3px; height:32px; line-height:32px; text-align:center; vertical-align:middle; font-size:13px; color:#4d4d4d; }
ul.pager > li > a { color:#4d4d4d; }
ul.pager > li > a:hover { color:#a59141; }
ul.pager > li:first-child { margin-right:4px; }
ul.pager > li:last-child { margin-left:12px; }
ul.pager > li i.icon-pager-prev { margin-right:3px; }
ul.pager > li i.icon-pager-next { margin-left:3px; }

ul.pager > li.current > span, ul.pager > li.current > a { color:#a59141; }
ul.pager > li.disabled > a,
ul.pager > li.disabled > span { color:#999999; }


/**** Form Layout ****/
dl.form-field { display:table; width:100%; }
dl.form-field.border-top { border-top:1px solid #cccccc; }
dl.form-field.border-bottom { border-bottom:1px solid #cccccc; }
dl.form-field.border-left { border-left:1px solid #cccccc; }
dl.form-field.border-right { border-right:1px solid #cccccc; }
dl.form-field.border { border:1px solid #cccccc; }
dl.form-field.border-none { border:none; }
dl.form-field + dl.form-field { border-top:1px solid #cccccc; }
dl.form-field + dl.form-field.border-top-none { border-top:none; }
dl.form-field.border-top-double { border-top:3px double #cccccc !important; }
dl.form-field > dt { display:table-cell; width:160px; padding:8px 8px 8px 20px; background:#f9f9f9; text-align:left; vertical-align:middle; line-height:24px; font-size:12px; color:#4d4d4d; }
dl.form-field > dt.required:after { content:"＊"; display:inline; color:#888888; opacity:0.5; padding-left:5px; }
dl.form-field > dd { display:table-cell; padding:8px; text-align:left; vertical-align:middle; }
dl.form-field > dd + dt { border-left:1px solid #e1e1e1; }
dl.form-field > dd + dd { border-left:1px solid #e1e1e1; }
dl.form-field > dd + dd.no-border { border-left:none; }
dl.form-field > dd.min { width:1%; white-space:nowrap; }
dl.form-field > dd.list { padding:0; }
dl.form-field > dd.list > div.inner { padding:8px; }
dl.form-field > dd.list > div.inner + div.inner { border-top:1px solid #e1e1e1; }
dl.form-field > dd.list > dl.inner { display:table; width:100%; }
dl.form-field > dd.list > dl.inner + dl.inner { border-top:1px solid #e1e1e1; }
dl.form-field > dd.list > dl.inner > dt,
dl.form-field > dd.list > dl.inner > dd { display:table-cell; padding:8px; line-height:32px; vertical-align:middle; }
dl.form-field > dd.list > dl.inner > dd { border-left:1px solid #e1e1e1; }
dl.form-field > dd.list > dl.inner > dd.min { width:1%; white-space:nowrap; }
dl.form-field > dd.list.inverse > div.inner { border-bottom:1px solid #e1e1e1; }
dl.form-field > dd.list.inverse > div.inner + div.inner { border-top:none; }
dl.form-field > dd.list.inverse > div.inner:last-child { border-bottom:none; }
dl.form-field > dd.list.inverse > div.inner.border-bottom-none { border-bottom:none; }
dl.form-field > dd p.warning { color:#d94d38; margin-top:5px; }
dl.form-field.plain > dt { width:auto; background:transparent; padding:8px; line-height:inherit; font-size:inherit; color:inherit; }
dl.form-field.plain > dd + dd { border:none; }
dl.form-field.white > dt { background-color:transparent; color:#ffffff; }
dl.form-field.white + dl.form-field.white { border-color:#666666; }
dl.form-field.white.border-none { border:none; }
.form-buttons { border-top:1px solid #cccccc; padding:20px; }
.form-buttons.border-top { border-top:1px solid #cccccc; }
.form-buttons.border-bottom { border-bottom:1px solid #cccccc; }
.form-buttons.border-left { border-left:1px solid #cccccc; }
.form-buttons.border-right { border-right:1px solid #cccccc; }
.form-buttons.border { border:1px solid #cccccc; }
.form-buttons.border-none { border:none; }
.form-buttons.white { border-color:#666666; }
.form-buttons.left-side { padding:20px 0 20px 0; text-align:left; }
.form-buttons.right-side { padding:20px 0 20px 0; text-align:right; }

dl.form-vfield { display:inline-block; margin:0 40px 30px 0; }
dl.form-vfield > dt { display:block; margin:0 0 4px 0; }
dl.form-vfield > dt:before { content:""; display:inline-block; vertical-align:middle; width:1px; height:13px; line-height:13px; border-left:4px solid #a59141; margin-right:6px; position:relative; top:-1px; }
dl.form-vfield > dt.no-border:before { display:none; }
dl.form-vfield > dd { display:block; }
dl.form-vfield > dd + dt { margin-top:30px; }
dl.form-vfield > dd > ul > li.divider { height:1px; border-top:1px solid #e1e1e1; margin:3px 0 5px 0; }

div.form-field-wrap { display:table; width:auto; }
div.form-field-wrap > dl.form-field { display:table-cell; white-space:nowrap; font-size:0; }
div.form-field-wrap > dl.form-field > dt { display:inline-block; white-space:normal; }
div.form-field-wrap > dl.form-field > dd { display:inline-block; white-space:normal; font-size:13px; }
div.form-field-wrap > dl.form-field + dl.form-field { border-top:none; }
dl.form-field + div.form-field-wrap,
div.form-field-wrap + div.form-field-wrap,
div.form-field-wrap + dl.form-field { border-top:1px solid #cccccc; }


dl.form-field-plain { display:table; width:100%; }
dl.form-field-plain > dt { display:table-cell; width:100px; padding:0; text-align:right; vertical-align:top; }
dl.form-field-plain > dd { display:table-cell; padding:0 0 0 15px; text-align:left; vertical-align:middle; }
dl.form-field-plain + dl.form-field-plain { margin-top:8px; }




.search-fields { display:inline-block; vertical-align:top; }
.search-fields + .search-fields { margin-left:20px; }
table.search-fields { display:table; }
table.search-fields > tbody > tr > td { padding:10px 10px 10px 20px; }
table.search-fields > tbody > tr + tr.border-top > td { padding-top:10px; border-top:1px solid #e1e1e1; }
.search-fields + table.search-fields { margin-left:0; }
dl.search-field { display:table; }
dl.search-field > dt { display:table-cell; width:120px; padding:8px 20px 8px 0; text-align:left; vertical-align:top; line-height:32px; position:relative; color:#888888; font-size:12px; }
dl.search-field > dd { display:table-cell; padding:8px 8px 8px 0; text-align:left; vertical-align:top; position:relative; }
dl.search-field > dt:after { display:inline-block; content:":"; padding:8px 0 8px 0; text-align:left; vertical-align:top; line-height:32px; color:#bbbbbb; position:absolute; top:0; right:8px; }
table.search-field { display:table; }
table.search-field > tbody > tr > th { width:80px; padding:8px 20px 8px 0; text-align:left; vertical-align:top; line-height:32px; position:relative; white-space:nowrap; color:#888888; }
table.search-field > tbody > tr > td { padding:8px 8px 8px 0; text-align:left; vertical-align:top; position:relative; white-space:nowrap; }
table.search-field > tbody > tr > td.wrap { white-space:normal; }
table.search-field > tbody > tr > th:after { display:inline-block; content:":"; padding:8px 0 8px 0; text-align:left; vertical-align:top; line-height:32px; color:#bbbbbb; position:absolute; top:0; right:8px; }
.search-buttons { border-top:1px solid #e1e1e1; }
.search-buttons.border-top { border-top:1px solid #e1e1e1; }
.search-buttons.border-bottom { border-bottom:1px solid #e1e1e1; }
.search-buttons.border-left { border-left:1px solid #e1e1e1; }
.search-buttons.border-right { border-right:1px solid #e1e1e1; }
.search-buttons.border { border:1px solid #e1e1e1; }
.search-buttons.border-none { border:none; }


/**** Form > Remarks ****/

.form-remarks { display:inline-block; line-height:24px; padding:4px 0 4px 0; vertical-align:middle; }
.form-remarks.small { line-height:24px; }

.form-notes { display:block; background:#f9f9f9 url("../../images/common/bg.dotted.png") top left repeat; border-radius:4px; padding:12px 10px 8px 10px; }
.form-notes > ul {}
.form-notes > ul > li + li { margin-top:6px; }
.form-notes > ul > li { color:#555555; }
.form-notes > ul > li > strong { font-size:15px; vertical-align:bottom; border-bottom:1px dotted #555555; margin:0 3px 0 3px; }
.form-notes > ul > li.darkred { color:#ae2317; }
.form-notes > ul > li.darkred > strong { border-color:#ae2317; }
.form-notes > ul > li.orange { color:#d94d38; }
.form-notes > ul > li.orange > strong { border-color:#d94d38; }



/**** Form > Radio button ****/
.form-radio { padding:0 15px 0 0; }
.form-radio:before { position:absolute; top:7px; left:0; width:14px; height:14px; border:1px solid #4d4d4d; border-radius:8px; background:#ffffff; }
.form-radio.checked:after { position:absolute; top:11px; left:4px; width:8px; height:8px; background:#4d4d4d; border-radius:4px; }
.form-radio > label { padding:0 0 0 22px; }
.form-radio.emphasize:before { border-color:#cccccc; }
.form-radio.emphasize.checked:before { border-color:#232020; }
.form-radio.emphasize.checked:after { background:#232020; }
.form-radio.emphasize.checked > label { color:#4d4d4d; }
.form-radio.white:before { left:-2px; border-color:#ffffff; background:transparent; }
.form-radio.white.checked:after { top:12px; left:3px; width:6px; height:6px; background-color:#ffffff; border-radius:3px; }
.form-radio.white > label { color:#ffffff; }
.form-radio.warning:before { border-color:#d94d38; }
.form-radio.warning.checked:before { border-color:#d94d38; }
.form-radio.warning.checked:after { background-color:#d94d38; }
.form-radio.warning > label { color:#d94d38; }
.form-radio.warning.checked > label { color:#d94d38; }


/**** Form > Checkbox ****/
.form-checkbox { padding:0 15px 0 0; }
.form-checkbox:before { position:absolute; top:7px; left:0; width:14px; height:14px; border:1px solid #4d4d4d; background:#ffffff; }
.form-checkbox.checked:after { position:absolute; top:-1px; left:3px; font-size:10px; color:#4d4d4d; }
.form-checkbox > label { padding:0 0 0 22px; }
.form-checkbox.emphasize:before { border-color:#cccccc; }
.form-checkbox.emphasize.checked:before { border-color:#232020; }
.form-checkbox.emphasize.checked:after { color:#232020; }
.form-checkbox.emphasize.checked > label { color:#4d4d4d; }
.form-checkbox.white:before { top:9px; border-color:#ffffff; width:11px; height:11px; background:transparent; }
.form-checkbox.white.checked:after { top:0px; left:2px; color:#ffffff; }
.form-checkbox.white > label { color:#ffffff; }
.form-checkbox.white.emphasize:before { border-color:#e0e0e0; }
.form-checkbox.white.emphasize.checked:before { border-color:#ffffff; }
.form-checkbox.white.emphasize.checked:after { color:#ffffff; }
.form-checkbox.white.emphasize > label { color:#e0e0e0; }
.form-checkbox.white.emphasize.checked > label { color:#ffffff; }
.form-checkbox.warning:before { border-color:#d94d38; }
.form-checkbox.warning.checked:after { color:#d94d38; }
.form-checkbox.warning > label { color:#d94d38; }


/**** Form > Switch ****/
.form-switch.warning .container { border-color:#d94d38; background:#ffeeee; }
.form-switch.warning.on .container { background:#ffaaaa; }


/**** Form > Select ****/
.form-select > a.carret:hover:after { color:#000000; }
.form-select.white { border:1px solid #ffffff; background:#ffffff; }
.form-select.white > label { color:#4d4d4d; }
.form-select.white > div { background:#ffffff; border-bottom:1px solid #dddddd; }
.form-select.white > div > button { border:1px solid #dddddd; border-bottom:none; }
.form-select.white > div > button:hover,.form-select > div > button.selected { background-color:#f0f0f0; }
.form-select.white > div > button.disabled { background-color:#f0f0f0; color:#999999; }
.form-select.white > a.carret:after { content:"\ed3c"; color:#4d4d4d; background:#ffffff; border:1px solid #ffffff; }
.form-select.white > a.carret:hover:after { color:#000000; }
.form-select.r4 > a.carret:after { border-radius:0 4px 4px 0; }
.form-select.warning { border-color:#d94d38; }
.form-select.warning > label { color:#d94d38; }
.form-select.warning > a.carret:after { border-color:#d94d38; color:#d94d38; }


/**** Form > Suggest ****/
.form-suggest.warning { border-color:#d94d38; }
.form-suggest.warning > label { color:#d94d38; }
.form-suggest.warning > label.placeholder { color:#cccccc; }
.form-suggest.warning > input[type="text"].keyword { border-color:#d94d38; }
.form-suggest.warning > a.clear:after { border-color:#d94d38; color:#d94d38; }


/**** Form > Image-uploader ****/
.form-image-uploader.warning { border-color:#ee0000; }


/**** Form > Date ****/
.form-date { width:110px; }
.form-date.white { border-color:#ffffff; }
.form-date + button.Zebra_DatePicker_Icon:after { color:#4d4d4d; opacity:0.5; }
.form-date + button.Zebra_DatePicker_Icon:hover:after { color:#4d4d4d; opacity:1.0; }
.form-date.white + button.Zebra_DatePicker_Icon { background:#ffffff; border:1px solid #ffffff; border-left:none; }
.form-date + button.Zebra_DatePicker_Icon:after { opacity:0.75; }
.Zebra_DatePicker .dp_header .dp_next.dp_hover:after { color:#000000; }
.Zebra_DatePicker .dp_header .dp_caption { font-weight:normal; color:#555555; }
.Zebra_DatePicker .dp_header .dp_hover { color:#000000; }
.Zebra_DatePicker .dp_footer .dp_hover { color:#000000; }
.Zebra_DatePicker td.dp_selected { color:#ffffff; background-color:#232020; }
.Zebra_DatePicker td.dp_current { font-weight:normal; color:#ffffff; background-color:#888888; }
.Zebra_DatePicker td.dp_hover { color:#ffffff; background-color:#232020; }
.form-date.warning { color:#d94d38; }
.form-date.warning+button.Zebra_DatePicker_Icon { border-color:#d94d38; }
.form-date.warning+button.Zebra_DatePicker_Icon:after { color:#d94d38; }


/**** Form > Search ****/
.form-x-search { display:inline-block; position:relative; }
.form-x-search > input { width:100%; padding-left:30px; text-align:left; }
.form-x-search:before { content:"\ebdb"; font-family:"icon"; display:inline; font-size:12px; color:#4d4d4d; position:absolute; top:8px; left:10px; }
.form-x-search.white > input { border-color:#ffffff; color:#4d4d4d; }
.form-x-search.r4 > input { border-radius:4px; }

/**** Form > Price ****/
.form-x-price { display:inline-block; position:relative; }
.form-x-price > input { width:100%; padding-left:26px; text-align:right; }
.form-x-price:before { content:"￥"; display:inline; font-size:13px; color:#666666; position:absolute; top:8px; left:8px; }
.form-x-price.white > input { border-color:#ffffff; color:#4d4d4d; }
.form-x-price.r4 > input { border-radius:4px; }

/**** Form > Vintage ****/
.form-x-vintage { display:inline-block; position:relative; }
.form-x-vintage > input { width:100%; padding-right:26px; text-align:right; }
.form-x-vintage:after { content:"年"; display:inline; font-size:12px; color:#666666; position:absolute; top:8px; right:8px; }
.form-x-vintage.white > input { border-color:#ffffff; color:#4d4d4d; }
.form-x-vintage.r4 > input { border-radius:4px; }

/**** For Cart ****/
.x-cart-row-warning { position:absolute; bottom:-28px; left:8px; z-index:10; width:210px; background:rgba(240,200,200,0.75); color:#ee0000; font-size:12px; line-height:16px; text-align:left; padding:4px 8px 4px 8px; border-radius:3px; }
.x-cart-row-warning.for-panel { bottom:-45px; left:0; }
.x-cart-row-updated { position:absolute; bottom:-10px; left:8px; z-index:10; width:210px; background:rgba(200,230,180,0.75); color:#078d34; font-size:12px; line-height:16px; text-align:left; padding:4px 8px 4px 8px; border-radius:3px; }
.x-cart-row-updated.for-panel { bottom:-28px; left:0; }


/**** Concierge ****/
.concierge { position:fixed; bottom:-258px; right:20px; width:230px; /*height:280px;*/ padding:0 0 30px 0; background:#4d4d4d; color:#e0e0e0; }
.concierge > .header { height:22px; background:#232020; position:relative; margin:0 0 15px 0; cursor:pointer; }
.concierge > .header > a { color:#e0e0e0; font-size:20px; position:absolute; top:-6px; right:6px; }
.concierge > .header:hover > a { color:#ffffff; }
.concierge > .content {}


/**** Back to top ****/
.back_to_top { text-align:center; margin:60px 0 60px 0; }
.back_to_top.border-top { border-top:1px solid #dbdbdb; padding-top:60px; }
.back_to_top > a > i { font-size:18px; opacity:0.75; }
.back_to_top > a > span { display:block; }

/**** Message ****/
#message { position:fixed; top:0; left:0; z-index:20; width:100%; background:transparent; overflow:hidden; }
#message > .inner { position:relative; z-index:21; padding:25px; font-size:16px; font-weight:bold; color:#ffffff; text-align:center; vertical-align:middle; }
#message > .inner a.close { color:#ffffff; margin-left:10px; }
#message > .inner a.close > .icon-close { font-size:14px; font-weight:normal; margin-left:10px; }
#message > .inner a:hover > .icon-close { opacity:0.8; }
#message:before { content:""; position:absolute; top:0; left:0; z-index:20; width:100%; height:100%; background:#ced96c; opacity:0.9; }
#message.alert > .inner { color:#ee0000; }
#message.alert > .inner a.close { color:#ee0000; opacity:0.5; }
#message.alert:before { background:#ffcccc; }


/**** Ribbon ****/
.ribbon { position:fixed; top:0; left:0; z-index:998; width:100%; height:30px; background:#ae2317; display:none; }
.ribbon:hover { background:#bb3322; transition-duration:0.8s; }
.ribbon > .inner { width:980px; height:100%; margin:0 auto 0 auto; line-height:30px; vertical-align:middle; }
.ribbon > .inner a { display:inline-block; width:100%; color:#ffffff; text-align:center; }
.ribbon > a.close { position:absolute; top:0; right:20px; line-height:30px; color:#ffffff; opacity:0.75; }
.ribbon > a.close:hover { opacity:1.0; }
.ribbon > a.close:before { content:"\e98e"; font-family:"icon"; display:inline; color:#ffffff; font-size:18px; }


/**** Header ****/
header { width:100%; height:40px; background:#232020; position:fixed; top:0; left:0; z-index:1000; overflow:visible; }
header > .inner { width:980px; height:100%; margin:0 auto 0 auto; position:relative; }
header > .inner > .logo { display:inline-block; overflow:hidden; }
header > .inner > .logo > a { display:inline-block; width:230px; height:40px; text-indent:-9999px; outline:none; background:#232020 url("../../images/common/logo.2.png") top left no-repeat; background-size:cover; }
header > .inner > .logo > a:hover { filter:brightness(120%); transition:filter 0.8s; }
header > .inner > .navigation { display:inline-block; position:absolute; top:0; right:0; }
header > .inner > .navigation > ul { display:inline-block; font-size:0; }
header > .inner > .navigation > ul > li { display:inline-block; height:40px; border-left:1px solid transparent; border-right:1px solid transparent; font-size:13px; }
header > .inner > .navigation > ul > li.active { border-left:1px solid #666666; border-right:1px solid #666666; }
header > .inner > .navigation > ul > li.active:after { content:""; display:block; width:100%; height:0; line-height:0; border-bottom:1px solid #232020; }
header > .inner > .navigation > ul > li > a { display:inline-block; height:100%; line-height:40px; padding:0 12px 0 12px; color:#e0e0e0; vertical-align:middle; }
header > .inner > .navigation > ul > li > a:hover { transition-duration:0.5s; color:#ffffff; }
header > .inner > .navigation > ul > li.navigation-search > a { padding-right:15px; }
header > .inner > .navigation > ul > li.navigation-search > a:before { content:"\ebdb"; font-family:"icon"; display:inline; font-size:11px; padding-right:4px; }
header > .inner > .navigation > ul > li.navigation-cart > a { padding-left:14px; padding-right:14px; }
header > .inner > .navigation > ul > li.navigation-cart > a:before { content:"\eb50"; font-family:"icon"; display:inline; font-size:14px; position:relative; top:-1px; }
header > .inner > .navigation > ul > li.navigation-cart > a > span { display:none; }
header > .inner > .navigation > ul > li.navigation-cart > a > span > span.circle { position:relative; top:-3px; margin:0 0 0 6px; background:#e00000; _display:none; }
header > .inner > .navigation > ul > li.navigation-cart > a:hover > span > span.circle { background:#f00000; transition-duration:0.5s; }
header > .inner > .navigation > ul > li.navigation-list > a { padding-left:9px; padding-right:9px; }
header > .inner > .navigation > ul > li.navigation-list > a > span { display:inline-block; width:22px; height:18px; padding:4px 0 0 0; border-radius:2px; }
header > .inner > .navigation > ul > li.navigation-list > a:hover > span { background:#4d4d4d; transition-duration:0.5s; }
header > .inner > .navigation > ul > li.navigation-list > a > span > i { display:block; width:10px; height:1px; margin:2px auto 0 auto; border-top:1px #e0e0e0 solid; }
header + .contents { margin-top:40px; padding-top:50px; }
header + .contents.padding { padding-top:80px; }


/**** Footer ****/
footer { width:100%; padding:160px 0 0 0; background:#ffffff; }
footer.absolute-bottom { position:absolute; bottom:0; left:0; }
footer > .upper { border-top:1px solid #dbdbdb; padding:30px 0 30px 0; }
footer > .upper > a.logo { display:block; width:180px; height:50px; margin:0 auto 0 auto; text-indent:-9999px; outline:none; background:transparent url("../../images/common/mottox.svg") center center no-repeat; background-size:contain; }
footer > .upper > a.logo:hover { filter:brightness(120%); transition-duration:0.3s; }
footer > .upper > .copyright { display:block; width:200px; margin:20px auto 0 auto; font-size:11px; color:#999999; text-align:center; }
footer > .notes { background:#f7f7f7; padding:20px 0 20px 0; text-align:center; font-size:12px; color:#888888; }
footer > .notes > span { display:inline-block; }
.contents.cover-gray + footer { padding-top:0; }
.back_to_top + footer { padding-top:0; }

/**** Palette ****/
.palette-mask { width:100%; height:100%; background:rgba(0,0,0,0.5); border-top:1px solid #555555; position:fixed; top:40px; left:0; z-index:999; overflow-y:scroll; }
.palette-wrapper { width:100%; min-height:190px; background:#232020; position:relative; }
.palette-wrapper > a.close { position:absolute; bottom:15px; right:20px; }
.palette-wrapper > a.close:before { content:"\e98e"; font-family:"icon"; display:inline; color:#e0e0e0; font-size:18px; }
.palette-wrapper > a.close:hover:before { color:#ffffff; }

.palette { width:980px; margin:0 auto 0 auto; padding:40px 0 40px 0; position:relative; color:#e0e0e0;　}
.palette a { color:#e0e0e0; }
.palette a:hover { color:#ffffff; }

.palette.palette-indicator {}
.palette.palette-indicator > div span.indicator { padding:30px 0 0 0; }
.palette.palette-indicator > div > span.indicator { display:block; width:50px; margin:0 auto 0 auto; position:relative; }

.palette.palette-search { width:auto; padding:60px 0 0 0; }
.palette.palette-search > .forms {}
.palette.palette-search > .forms > .tab-targets { text-align:center; }
.palette.palette-search > .forms > .tab-targets > ul { display:inline-block; font-size:0; }
.palette.palette-search > .forms > .tab-targets > ul > li { display:inline-block; }
.palette.palette-search > .forms > .tab-targets > ul > li + li { margin-left:20px; }
.palette.palette-search > .forms > .tab-targets > ul > li > a { display:inline-block; padding:8px 12px 4px 12px; font-size:13px; line-height:25px; vertical-align:middle; background:transparent; border-radius:4px 4px 0 0; }
.palette.palette-search > .forms > .tab-targets > ul > li > a > span { font-size:10px; padding-left:1px; }
.palette.palette-search > .forms > .tab-targets > ul > li.active > a { background:#4d4d4d; }
.palette.palette-search > .forms > .tab-contents { padding:40px 0 0 0; background:#4d4d4d; }
.palette.palette-search > .forms > .tab-contents a { color:#ffffff; }
.palette.palette-search > .forms > .tab-contents > .form { width:980px; margin:0 auto 0 auto; white-space:nowrap; position:relative; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row { display:inline-block; max-width:450px; margin:0 60px 30px 0; text-align:left; vertical-align:top; white-space:normal; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row.block { display:block; max-width:auto; margin:0 0 50px 0; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field {}
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field  + .field { margin-top:30px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field > strong.heading { display:block; margin:0 0 15px 0; color:#ffffff; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field > strong.heading:before { content:""; display:inline-block; vertical-align:middle; height:13px; width:3px; background:#e0e0e0; margin-right:8px; position:relative; top:-1px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field > ul.selections { margin-top:-5px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field > ul.selections > li.divider { display:block; height:1px; border-top:1px solid #777777; margin-top:8px; margin-bottom:8px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field .form-select { min-width:150px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .row > .field .form-x-search { width:400px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons { position:sticky; background:#4d4d4d; bottom:30px; margin:0 0 30px 0; padding:30px 0 30px 0; text-align:center; border-top:1px solid #777777; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons > .inner { display:inline-block; position:relative; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons > .inner > .btn { width:200px; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons > .inner > a.more { display:inline-block; position:absolute; top:6px; right:-180px; font-size:11px; color:#e0e0e0; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons > .inner > a.more:hover { color:#ffffff; }
.palette.palette-search > .forms > .tab-contents > .form > form > .buttons > .inner > a.more:before { content:"\e92a"; font-family:"icon"; display:inline; font-size:9px; color:#aaaaaa; margin-right:3px; }
.palette.palette-search > .forms > .tab-contents > .form.form-wine > form > .row > .field.field-options { margin-top:40px; }
.palette.palette-search > .forms > .tab-contents > .form.form-sake > form > .row > .field.field-options { margin-top:40px; }
.palette.palette-search > .forms > .tab-contents > .form.form-food > form > .buttons { margin-top:50px; }
.palette.palette-search > .forms > .tab-contents > .form.form-water > form { padding-top:20px; }
.palette.palette-search > .forms > .tab-contents > .form.form-water > form > .buttons { margin-top:60px; }
.palette.palette-search > .forms > .tab-contents > .form.form-winery { white-space:normal; }
.palette.palette-search > .forms > .tab-contents > .form.form-winery > form > .row { width:400px; }
.palette.palette-search > .forms > .tab-contents > .form.form-winery > form > .row > .field > div.country { background:#404040; border-radius:4px 4px 0 0; padding:2px 15px 2px 15px; margin:0 0 5px 0; }
.palette.palette-search > .forms > .tab-contents > .form.form-winery > form > .row > .field > div.areas { padding:0 0 0 15px; }

.palette-campaign { width:1020px; position:relative; }
.palette-campaign > .heading { margin:0 25px 20px 20px; }
.palette-campaign > .heading > a.more { float:right; font-size:12px; opacity:0.8; }
.palette-campaign ul.list.border-top.border-bottom { border-color:#666666 !important; }
.palette-campaign ul.list.border-top.border-bottom > li { border-color:#666666 !important; }
.palette-campaign > ul.panel { font-size:0; margin:0 0 0 20px; }
.palette-campaign > ul.panel > li { display:inline-block; font-size:13px; width:312px; margin:0 20px 20px 0; vertical-align:top; }
.palette-campaign > ul.panel > li .box a { color:#4d4d4d; }
.palette-campaign > ul.panel > li .box a:hover { color:#232020; }
/*.palette-campaign > .buttons {  margin:10px 0 0 0; padding:30px 0 50px 0; text-align:center; border-top:1px solid #777777; }*/
.palette-campaign > .buttons { position:sticky; background:#232020; bottom:40px; margin:20px 0 0 0; padding:20px 0 20px 0; text-align:center; border-top:1px solid #777777; }
.palette-campaign > .buttons > .btn { border-radius:0px; background:transparent; border:1px solid #e0e0e0; color:#e0e0e0; width:150px; }
.palette-campaign > .buttons > .btn:hover {  border-color:#ffffff; color:#ffffff; }

.palette.palette-panel { text-align:center; }
.palette.palette-panel > ul {}
.palette.palette-panel > ul > li { display:inline-block; vertical-align:top; font-size:0; margin:0 7px 0 7px; }
.palette.palette-panel > ul > li > a { font-size:13px; display:inline-block; width:120px; height:105px; padding-top:15px; text-align:center; border-radius:3px; }
.palette.palette-panel > ul > li > a > i { font-size:26px; }
.palette.palette-panel > ul > li > a > strong { display:block; font-size:13px; margin-top:3px; }
.palette.palette-panel > ul > li > a > span { display:block; font-size:12px; opacity:0.75; }
.palette.palette-panel > ul > li > a:hover { background:#333333; transition-duration:0.3s; }
.palette.palette-panel > ul > li > a.search > i { font-size:22px; position:relative; top:3px; }
.palette.palette-panel > ul > li > a.search > strong { margin-top:10px; }

.palette.palette-list {}
.palette.palette-list > .upper { padding-bottom:30px; }
.palette.palette-list > .upper > .account { display:inline-block; }
.palette.palette-list > .upper > .account dl > dt img.thumb { transition-duration:0.3s; }
.palette.palette-list > .upper > .account dl:hover > dt img.thumb { transform:scale(1.1); transition-duration:0.3s; }
.palette.palette-list > .upper > .account dl > dd { padding-left:12px; }
.palette.palette-list > .upper > .account dl > dd > span { display:block; margin:0 0 3px 0; font-size:12px; opacity:0.75; }
.palette.palette-list > .upper > .account dl > dd > a { display:block; }
.palette.palette-list > .upper > .account dl > dd > a > strong { font-size:16px; vertical-align:middle; }
.palette.palette-list > .upper > .account dl > dd > a > em { opacity:0.75; font-size:12px; vertical-align:middle; padding-left:5px; position:relative; top:1px; }
.palette.palette-list > .upper > .account dl:hover > dd > a { color:#ffffff; }
.palette.palette-list > .upper > ul.links { display:inline-block; position:absolute; top:55px; right:0; }
.palette.palette-list > .upper > ul.links > li { display:inline-block; }
.palette.palette-list > .upper > ul.links > li + li { margin-left:15px; }
.palette.palette-list > .upper > ul.links > li a.settings:before { content:"\ebeb"; font-family:"icon"; display:inline; opacity:0.6; font-size:10px; padding-right:4px; position:relative; top:-1px; }
.palette.palette-list > .upper > ul.links > li a.logout:before { content:"\e9ac"; font-family:"icon"; display:inline; opacity:0.75; font-size:12px; padding-right:4px; }
.palette.palette-list > .lower { display:table; width:100%; padding:30px 0 10px 0; border-top:1px solid #555555; }
.palette.palette-list > .lower > .links { display:table-cell; width:1%; white-space:nowrap; padding:0 50px 0 0; text-align:left; vertical-align:top; }
.palette.palette-list > .lower > .links:last-child { width:auto; padding:0 0 0 10px; text-align:right; }
.palette.palette-list > .lower > .links > strong { display:block; margin:0 0 30px 0; }
.palette.palette-list > .lower > .links > strong > a { font-size:18px; }
.palette.palette-list > .lower > .links > ul > li { display:block; margin:0 0 12px 0; vertical-align:middle; }
.palette.palette-list > .lower > .links > ul > li > a { opacity:0.9; }
.palette.palette-list > .lower > .links > ul > li.sub > a { opacity:0.75; }
.palette.palette-list > .lower > .links > ul > li > a span.circle { position:relative; top:-1px; margin:0 0 0 6px; background:#e00000; }
.palette.palette-list > .lower > .links > ul > li > a:hover span.circle { background:#f00000; }
.palette.palette-list > .lower > .links > ul > li.divider { display:block; width:140px; height:1px; border-top:1px solid #444444; margin-bottom:13px; }
.palette.palette-list > .lower > .links > .tools { border:1px solid #999999; border-radius:4px; padding:15px 15px 5px 20px; text-align:left; }
.palette.palette-list > .lower > .links > .tools > strong { display:block; margin:0 0 15px 0; font-size:11px; color:#aaaaaa; text-align:center; }
.palette.palette-list > .lower > .links > .tools > ul > li { margin:0 0 15px 0; }
.palette.palette-list > .lower > .links > .logo { display:block; text-align:center; margin:25px 0 0 0; }
.palette.palette-list > .lower > .links > .logo > a { transition-duration:0.6s; display:inline-block; width:120px; height:30px; text-indent:-9999px; outline:none; background:transparent url("../../images/common/mottox.svg") center center no-repeat; background-size:contain; }
.palette.palette-list > .lower > .links > .logo > a:hover { transition:filter 0.3s linear; filter:brightness(120%); }
.palette.palette-list > .lower > .links > ul.media { margin:15px 0 0 0; text-align:center; }
.palette.palette-list > .lower > .links > ul.media > li { display:inline-block; }
.palette.palette-list > .lower > .links > ul.media > li + li { margin-left:5px; }
.palette.palette-list > .lower > .links > ul.media > li > a { font-size:14px; opacity:0.5; }
.palette.palette-list > .lower > .links > ul.media > li > a:hover { opacity:1.0; }








/**** Dialog ****/
.page-dialog-preview { background-color:#555555; padding:40px; }
.page-dialog-preview > .dialog { margin:0 auto 0 auto; }
.dialog { position:relative; background:#ffffff; box-shadow:0 0 2px 2px rgba(0,0,0,0.2); -moz-box-shadow:0 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 2px 2px rgba(0,0,0,0.2); }
.dialog > .close { cursor:pointer; position:absolute; top:-7px; right:-7px; z-index:10; width:18px; height:18px; border-radius:9px; background:#ffffff;  }
.dialog > .close:before { content:"\e97f"; font-family:"icon"; display:block; position:absolute; top:-2px; left:-2px; width:22px; height:22px; line-height:22px; font-size:22px; color:#232020; text-align:center; vertical-align:middle; }
.dialog > .close:hover:before { opacity:0.75; }
.dialog > .header { position:absolute; top:0; left:0; z-index:0; border-bottom:1px solid #e1e1e1; background:#f9f9f9; width:100%; height:55px;line-height:55px; color:#333333; text-align:center; vertical-align:middle; }
.dialog > .header > strong { position:relative; z-index:1; font-weight:normal; font-size:14px; }
.dialog > .footer { position:absolute; bottom:0; left:0; z-index:0; border-top:1px solid #e1e1e1; background:#f9f9f9; width:100%; height:55px;line-height:55px; color:#333333; text-align:center; vertical-align:middle; }
.dialog > .content { position:absolute; top:0; left:0; padding:55px 0 55px 0; width:100%; height:100%; overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.dialog > .content > .inner { padding:20px; width:100%; height:100%; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.dialog > .error { position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:rgba(0,0,0,0.2); }
.dialog > .error > .inner { display:inline-block; width:320px; background:#ffffff; color:#ee0000; padding:20px 30px 20px 30px; border:1px solid #ee0000; border-radius:4px; position:absolute; top:50%; left:50%; }
.dialog > .error > .inner > strong { display:block; font-weight:bold; }
.dialog > .error > .inner > div { font-size:11px; margin-top:4px; }
.dialog > .error > .inner > .close { cursor:pointer; position:absolute; top:-7px; right:-7px; width:18px; height:18px; border-radius:9px; background:#ffffff; }
.dialog > .error > .inner > .close:before { content:"\e97f"; font-family:"icon"; display:block; position:absolute; top:-2px; left:-2px; width:22px; height:22px; line-height:22px; font-size:22px; color:#ee0000; text-align:center; vertical-align:middle; }
.dialog > .error > .inner > .close:hover:before { opacity:0.75; }
.dialog.confirm > .header { display:none; }
.dialog.confirm > .content { padding-top:15px; }
.dialog.simple > .content { position:relative; padding-top:0; padding-bottom:45px; }
.dialog.simple > .content > .inner { padding:0; }
.dialog.simple > .footer { height:45px; line-height:45px; background:#f9f9f9 url("../../images/common/bg.dotted.png") top left repeat !important; }
.dialog.picture > .content { position:relative; padding-top:0; padding-bottom:0; }
.dialog.picture > .content > .inner { padding:0; }

.dialog > .prev { cursor:pointer; position:absolute; bottom:-40px; left:0; z-index:10; width:30px; height:30px; line-height:30px; border-radius:15px; background:#232020; color:#ffffff; font-size:16px; text-align:center; vertical-align:middle; }
.dialog > .prev:before { content:"\ed45"; font-family:"icon"; position:relative; left:-1px; }
.dialog > .prev.disabled { cursor:default; }
.dialog > .prev.disabled:before { opacity:0.5; }
.dialog > .next { cursor:pointer; position:absolute; bottom:-40px; right:0; z-index:10; width:30px; height:30px; line-height:30px; border-radius:15px; background:#232020; color:#ffffff; font-size:16px; text-align:center; vertical-align:middle; }
.dialog > .next:before { content:"\ed41"; font-family:"icon"; position:relative; left:1px; }
.dialog > .next.disabled { cursor:default; }
.dialog > .next.disabled:before { opacity:0.5; }


/**** Mobile ****/
.mobile-visible { display:none; }


/**** Page > Login ****/
#page-login { overflow:hidden; }
#page-login header { display:none; }
#page-login footer { display:none; }
#page-login .x-mask { background:#232020; position:absolute; top:0; left:0; z-index:10000; width:100%; height:100%; }
#page-login .x-splash { display:block; width:400px; height:80px; position:absolute; z-index:10001; background:transparent url("../../images/common/mottox.svg") center center no-repeat; background-size:contain; opacity:0; filter:brightness(60%) blur(5px); }
#page-login .x-splash.remove-effect { transition:filter 1.0s linear; filter:brightness(100%) blur(0); }
#page-login .x-skip { display:inline-block; position:absolute; bottom:40px; right:60px; color:#a59141; font-size:12px; vertical-align:middle; opacity:0; z-index:10001; }
#page-login .x-skip:before { content:"\e934"; display:inline; font-family:"icon"; position:relative; top:1px; margin-right:3px; }
#page-login .x-skip:hover { opacity:1.0; }
#page-login .contents.x-cover { width:auto; padding:140px 0 140px 0; position:relative; }
#page-login .contents.x-cover > div { position:relative; z-index:1; }
#page-login .contents.x-cover:after { content:""; display:block; position:fixed; top:0; z-index:0; left:0; width:100%; height:500px; background:#4d4d4d url("../../images/site/catch/top.png") top center no-repeat; background-size:cover; opacity:0.75; filter:grayscale(60%) saturate(70%); }
#page-login .contents { z-index:1; }
#page-login .contents + .contents { position:relative; z-index:2; background-color:#ffffff; }
#page-login footer { position:relative; z-index:2; background-color:#ffffff; }

/**** Page > Top ****/
#page-top {}
#page-top .x-cover { width:100%; margin:40px 0 50px 0; position:relative; background:#f7f7f7; }
#page-top .x-cover > ul.x-wrapper { width:100%; height:350px; margin:0 0 10px 0; position:relative; font-size:0; white-space:nowrap; overflow:hidden; }
#page-top .x-cover > ul.x-wrapper > li { display:inline-block; font-size:13px; white-space:normal; width:auto; height:100%; vertical-align:top; background:#333333; }
#page-top .x-cover > ul.x-wrapper > li img { width:auto; height:100%; opacity:0.4; }
#page-top .x-cover > ul.x-wrapper > li.active { background:#ffffff; }
#page-top .x-cover > ul.x-wrapper > li.active img { opacity:1.0; }
#page-top .x-cover > ul.x-wrapper > li:hover { transition:filter 0.2s; filter:opacity(85%); }
#page-top .x-cover > ul.x-pager { display:block; text-align:center; }
#page-top .x-cover > ul.x-pager > li { display:inline-block; }
#page-top .x-cover > ul.x-pager > li + li { margin-left:8px; }
#page-top .x-cover > ul.x-pager > li > a:before { content:"\e937"; font-family:"icon"; display:inline-block; color:#cccccc; font-size:10px; }
#page-top .x-cover > ul.x-pager > li > a.active:before { color:#4d4d4d; }
#page-top .x-cover > ul.x-pager > li > a:hover:before { color:#4d4d4d; }
#page-top .x-cover > ul.x-cursor { width:980px; margin:0 auto 0 auto; position:relative; }
#page-top .x-cover > ul.x-cursor > li { display:inline-block; position:absolute; top:-230px;}
#page-top .x-cover > ul.x-cursor > li > a:before { font-family:"icon"; display:inline-block; color:#ffffff; font-size:30px; transition:opacity 0.8s; opacity:0.75; }
#page-top .x-cover > ul.x-cursor > li > a:hover:before { transition:opacity 0.8s; opacity:1.0; }
#page-top .x-cover > ul.x-cursor > li.x-prev { left:-20px; }
#page-top .x-cover > ul.x-cursor > li.x-next { right:-20px; }
#page-top .x-cover > ul.x-cursor > li.x-prev > a:before { content:"\e922"; }
#page-top .x-cover > ul.x-cursor > li.x-next > a:before { content:"\e923"; }
#page-top .x-cover > .x-more { width:100%; margin:0 auto 0 auto; position:relative; }
#page-top .x-cover > .x-more > .inner { display:inline-block; position:absolute; bottom:50px; right:20px; }


#page-top .x-calendar-outer { width:390px; }
#page-top .x-calendar { display:table; width:100%; }
#page-top .x-calendar > .x-year-month { display:table-cell; width:80px; text-align:left; vertical-align:top; padding-right:10px; }
#page-top .x-calendar > .x-year-month > dl > dt { display:block; text-align:center; font-size:30px }
#page-top .x-calendar > .x-year-month > dl > dd { display:block; text-align:center; font-size:13px }
#page-top .x-calendar > .x-year-month > ul.x-cursor { text-align:center; margin-top:2px; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li { display:inline; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li + li { margin-left:10px; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li > a:before { font-family:"icon"; display:inline; color:#999999; font-size:13px; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li > a:hover:before { color:#232020; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li.x-prev > a:before { content:"\e951"; }
#page-top .x-calendar > .x-year-month > ul.x-cursor > li.x-next > a:before { content:"\e952"; }
#page-top .x-calendar > .x-days { display:table-cell; text-align:left; vertical-align:top; padding-top:6px; }
#page-top .x-calendar > .x-days > table { border-collapse:collapse; text-align:center; vertical-align:middle;  }
#page-top .x-calendar > .x-days > table > thead > tr > th { width:32px; height:28px; border-bottom:1px solid #c7c7c7; }
#page-top .x-calendar > .x-days > table > tbody > tr > td { width:32px; height:28px; line-height:28px; }
#page-top .x-calendar > .x-days > table > tbody > tr > td.x-invalid { color:#aaaaaa; }
#page-top .x-calendar > .x-days > table > tbody > tr:first-child > td { padding-top:5px; }
#page-top .x-calendar > .x-days > table .x-off-day { color:#ae2317; }
#page-top .x-calendar > .x-days > table > tbody > tr > td > span { display:inline-block; width:100%; line-height:22px; }
#page-top .x-calendar > .x-days > table > tbody > tr > td > span.x-delivery-load { border-bottom:1px solid #232020; }
#page-top .x-calendar > .x-days > table > tbody > tr > td > span.x-delivery-date { border-bottom:1px solid #232020; background-color:#232020; color:#ffffff; }

#page-top .x-news-outer { width:570px; }
#page-top .x-news { display:table; width:100%; }
#page-top .x-news > .x-title { display:table-cell; width:80px; text-align:left; vertical-align:top; font-size:18px; }
#page-top .x-news > ul.x-list { display:table-cell; text-align:left; vertical-align:top; padding-top:6px; }
#page-top .x-news > ul.x-list > li { display:table; width:100%; }
#page-top .x-news > ul.x-list > li + li { margin-top:8px; }
#page-top .x-news > ul.x-list > li > span { display:table-cell; width:85px; text-align:top; vertical-align:top; font-size:12px; color:#999999; margin-right:8px; }
#page-top .x-news > ul.x-list > li > div > a { display:table-cell; text-align:top; vertical-align:top; }
#page-top .x-news > ul.x-list > li > div > a:hover { color:#232020; }
#page-top .x-news > ul.x-list > li.x-fixed { background:#f9f9f9 url("../../images/common/bg.dotted.png") top left repeat; padding:10px 8px 8px 8px; border-radius:4px; position:relative; top:-10px; }
#page-top .x-news > ul.x-list > li.x-fixed > div > a { font-weight:bold; }




#page-top .xx-calendar-news-pickup2-outer { display:flex; justify-content:center; flex-wrap:nowrap; align-items:flex-start; column-gap:50px; }
#page-top .xx-calendar-news-pickup2-outer > .inner {}
#page-top .xx-calendar-news-pickup2-outer > .inner > .x-heading { height:50px; }

#page-top .xx-calendar > .x-year-month > ul { display:table; width:100%; }
#page-top .xx-calendar > .x-year-month > ul > li { display:table-cell; text-align:center; vertical-align:middle; }
#page-top .xx-calendar > .x-year-month > ul > li.x-prev { text-align:left: background:#ffeeee; }
#page-top .xx-calendar > .x-year-month > ul > li.x-next { text-align:right: background:#ffffee;  }
#page-top .xx-calendar > .x-year-month > ul > li.x-prev > a:before { font-family:"icon"; display:inline; color:#999999; font-size:15px; content:"\e951"; }
#page-top .xx-calendar > .x-year-month > ul > li.x-next > a:before { font-family:"icon"; display:inline; color:#999999; font-size:15px; content:"\e952"; }
#page-top .xx-calendar > .x-year-month > ul > li.x-prev > a:hover:before,
#page-top .xx-calendar > .x-year-month > ul > li.x-next > a:hover:before { color:#232020; }
#page-top .xx-calendar > .x-year-month > ul > li.x-heading { font-size:16px; }
#page-top .xx-calendar > .x-days { padding-top:12px; }
#page-top .xx-calendar > .x-days > table { border-collapse:collapse; text-align:center; vertical-align:middle; margin:0 auto 0 auto;  }
#page-top .xx-calendar > .x-days > table > thead > tr > th { width:32px; height:28px; border-bottom:1px solid #c7c7c7; }
#page-top .xx-calendar > .x-days > table > tbody > tr > td { width:32px; height:28px; line-height:28px; }
#page-top .xx-calendar > .x-days > table > tbody > tr > td.x-invalid { color:#aaaaaa; }
#page-top .xx-calendar > .x-days > table > tbody > tr:first-child > td { padding-top:5px; }
#page-top .xx-calendar > .x-days > table .x-off-day { color:#ae2317; }
#page-top .xx-calendar > .x-days > table > tbody > tr > td > span { display:inline-block; width:100%; line-height:22px; }
#page-top .xx-calendar > .x-days > table > tbody > tr > td > span.x-delivery-load { border-bottom:1px solid #232020; }
#page-top .xx-calendar > .x-days > table > tbody > tr > td > span.x-delivery-date { border-bottom:1px solid #232020; background-color:#232020; color:#ffffff; }

#page-top .xx-news > ul.x-list > li + li { margin-top:8px; }
#page-top .xx-news > ul.x-list > li > span { display:block; font-size:11px; color:#aaaaaa; margin-bottom:2px; }
#page-top .xx-news > ul.x-list > li > div > a:hover { color:#232020; }
#page-top .xx-news > ul.x-list > li.x-fixed { background:#f9f9f9 url("../../images/common/bg.dotted.png") top left repeat; padding:10px 8px 8px 8px; border-radius:4px; }
#page-top .xx-news > ul.x-list > li.x-fixed > div > a { font-weight:bold; }


#page-top .xx-pickup2 { width:200px; }





/**** Page > Item ****/
#page-item .x-spec dl.form-field > dt { width:130px; padding-right:0; }
#page-item .layout-main .x-spec dl.form-field > dt { width:200px; }
#page-item .layout-main .x-spec div.form-field-wrap > dl.form-field + dl.form-field > dd { width:250px; }


/**** Catalog ****/
#page-catalog-view .x-catalog-canvas { width:100%; height:1387px; background:#eeeeee; overflow-x:scroll; overflow-y:scroll; position:relative; }
#page-catalog-view .x-catalog-canvas > img { width:100%; }
#page-catalog-view .x-catalog-canvas > img.zoom-out { width:100%; cursor:zoom-in; }
#page-catalog-view .x-catalog-canvas > img.zoom-in { width:200%; cursor:zoom-out; }
#page-catalog-view .x-catalog-canvas > .x-page-navi { position:absolute; top:0; left:0; display:inline-block; line-height:24px; vertical-align:middle; font-size:12px; color:#ffffff; background:rgba(0,0,0,0.5); padding:0 4px 0 4px; }


/**** Wkwk ****/
#page-wkwk .x-wkwk-pink { color:#ff6786; }
#page-wkwk .x-wkwk-yellow { color:#fff358; }
#page-wkwk .x-wkwk-bg-pink { background:#ff6786; }
#page-wkwk .x-wkwk-description-heading { border-top:1px solid rgba(0,0,0,0.15); border-bottom:1px solid rgba(0,0,0,0.15); font-size:18px; color: gba(0,0,0,0.8); margin:0 0 15px 0; padding:15px; font-weight:400; position:relative; }
#page-wkwk .x-wkwk-description-heading:before { content:""; display:block; width:0; height:16px; border-left:4px solid #ff6786; position:absolute; left:0; top:calc(50% - 8px); }