@charset "UTF-8";
/*  File Path
-----------------------------------------------*/
/*  Color
-----------------------------------------------*/
/*  Size
-----------------------------------------------*/
/*  Bourbon Settings
-----------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

/*=== Spritesmith for Retina
==============================================================================================*/
/*
SCSS variables are information about icon's compiled state, stored under its original file name

.icon-home {
  width: $icon-home-width;
}

The large array-like variables contain all information about a single icon
$icon-home: x y offset_x offset_y width height total_width total_height image_path;

At the bottom of this section, we provide information about the spritesheet itself
$spritesheet: width height image $spritesheet-sprites;
*/
/* The provided mixins are intended to be used with the array-like variables .icon-home { @include sprite-width($icon-home); } .icon-email { @include sprite($icon-email); } */
/*
The `sprites` mixin generates identical output to the CSS template
  but can be overridden inside of SCSS

@include sprites($spritesheet-sprites);
*/
html { background: #F8F8F8; }

body { position: relative; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 12px; -webkit-text-size-adjust: 100%; color: #4A4A4A; max-width: 680px; margin: 0 auto; }

* { box-sizing: border-box; }

a { color: #1AA0E9; text-decoration: underline; }

img { vertical-align: top; max-width: 100%; height: auto; }

input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], input:not([type]), textarea { -webkit-appearance: none; -moz-appearance: none; outline: none; background: #FFF; border: solid 1px #D2D2D2; border-radius: 4px; padding: 7px 10px; width: 100%; line-height: 2; font-size: 13px; max-width: 100%; }

input, select { -webkit-appearance: none; -moz-appearance: none; background: none; outline: none; border: none; }

strong { font-weight: bold; }

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }

.slick-track:before, .slick-track:after { content: ""; display: table; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

[dir="rtl"] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

.l-header { position: relative; z-index: 9999; width: 100%; z-index: 999; background: #FFF; color: #787878; }

.is-fixed .l-header { position: fixed; top: 0; left: 0; min-width: 100%; }

.l-header__inner { position: relative; height: 42px; min-width: 320px; max-width: 680px; margin: 0 auto; border-bottom: solid 1px #D8D8D8; }

.l-header__logo { background: url("/sp/assets/img/logo.png?renewal") 50% 50% no-repeat; background-size: auto 41px; height: 100%; width: 58px; overflow: hidden; text-indent: 101%; white-space: nowrap; }

.l-header__logo a { display: block; height: 100%; width: 100%; }

.l-header__nav { position: absolute; top: 0; right: 0; }

.l-header__nav li { float: left; text-align: center; padding: 2px 0; }

.l-header__nav li .ico-notice { position: absolute; top: 3px; right: 3px; }

.l-header__nav a { color: inherit; text-decoration: none; position: relative; display: block; height: 38px; padding: 4px 0 0; border-left: solid 1px #EAEAEA; width: 50px; font-weight: bold; }

.l-header__nav a span { display: block; margin: 0 -5px; font-size: 10px; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -webkit-transform-origin: center center; -moz-transform-origin: center center; }

.l-header__totop { position: absolute; top: 7px; right: 4px; display: block; font-size: 9px; padding: 8px 8px; font-weight: bold; color: inherit; text-decoration: none; background: #FFF; border: solid 1px #1AA0E9; border-radius: 4px; color: #1AA0E9; }

.l-footer { @iclude clearfix; padding: 10px 0; margin: 0 auto; max-width: 680px; }

.l-footer__nav { text-align: center; padding: 5px 0; }

.l-footer__nav ul { display: inline-block; overflow: hidden; font-size: 0; }

.l-footer__nav li { float: left; padding: 3px 0; font-size: 10px; overflow: hidden; width: 50%; margin: 0 0 0 -1px; text-align: left; }

.l-footer__nav li:nth-child(odd) { text-align: right; }

.l-footer__nav a { color: inherit; text-decoration: none; display: block; border-left: solid 1px #9B9B9B; padding: 2px 15px 1px; color: #9B9B9B; }

#l-container { margin: 0 auto; }

.l-row { margin: 0 0 10px; }

.l-row:after { clear: both; content: ""; display: table; }

.l-row:last-child { margin-bottom: 0; }

.l-row__left { float: left; }

.l-row__right { float: right; }

.l-fixed--top { position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; }

.l-fixed--bottom { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9999; }

.l-flex { display: -webkit-box; display: -ms-flexbox; display: flex; }

.l-compact { max-width: 440px; margin: 0 auto; }

.l-main { background: #FFF; }

.btn { color: inherit; text-decoration: none; position: relative; display: inline-block; background: #FFF; border: solid 1px #D2D2D2; border-radius: 2px; font-size: 11px; color: #4A4A4A; line-height: 1; padding: 8px 12px; white-space: nowrap; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }

.btn--block { display: block; text-align: center; padding-left: 0; padding-right: 0; width: 100%; }

.btn--medium { display: block; font-size: 12px; text-align: center; padding: 12px 0; }

.btn--large { display: block; border-radius: 4px; font-size: 13px; text-align: center; font-weight: bold; border-width: 2px; padding: 15px 0; width: 100%; }

.btn--highlight { color: #1AA0E9 !important; border-color: #1AA0E9 !important; }

.btn--alert { color: #FF001F !important; border-color: #FF001F !important; }

.btn--primary { background: #1AA0E9; color: #FFF !important; border-color: #1AA0E9 !important; font-weight: bold; }

.btn--attention { border-color: #FFB600 !important; background: #FFB600; color: #FFF !important; font-weight: bold; }

.btn--circle { position: relative; background: #1AA0E9; color: #FFF; border-radius: 10px; font-size: 11px; border: none; padding: 5px 20px 4px 10px; }

.btn--circle:before { content: ""; background: url("/sp/assets/img/ico_arrow_03.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 9px; margin: -5px 0 0; }

.btn--recommend { background: #ff9d1e; color: #FFF !important; border-color: #ff9d1e; font-weight: bold; }

.btn--amazon { background: url("/sp/assets/img/label_amazon.png") 50% 50% no-repeat #231916; background-size: auto 38px; height: 54px; border: none; border-radius: 4px; font-size: 13px; text-align: center; font-weight: bold; padding: 12px 16px; text-indent: 101%; overflow: hidden; }

.btnLogin { color: inherit; text-decoration: none; position: relative; display: block; background: #ccc; font-size: 13px; font-weight: bold; border: none; border-radius: 4px; color: #FFF; text-align: center; padding: 17px 0 17px 30px; margin-bottom: 8px; }

.btnLogin:before { content: ""; position: absolute; top: 50%; left: 0; margin: -18px 0 0; height: 36px; width: 40px; border-right: solid 1px rgba(255, 255, 255, 0.5); background-position: 50% 50%; background-repeat: no-repeat; }

.btnLogin--docomo { background: #CC0B33; }

.btnLogin--docomo:before { background-image: url("/sp/assets/img/ico_docomo.png"); background-size: 16px auto; }

.btnLogin--twitter { background: #5EA9DD; }

.btnLogin--twitter:before { background-image: url("/sp/assets/img/ico_twitter.png"); background-size: 24px auto; }

.btnLogin--line { background: #00C300; }

.btnLogin--line:before { background-image: url("/sp/assets/img/ico_line.png"); background-size: 26px auto; }

.btnLogin--google { background: #3E82F7; }

.btnLogin--google:before { background-image: url("/sp/assets/img/ico_google.png"); background-size: 15px auto; }

.btnText { color: inherit; text-decoration: none; display: inline-block; position: relative; font-size: 12px; padding: 12px 18px 12px 8px; }

.btnText:after { clear: both; content: ""; display: table; }

.btnText:before { content: ""; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; display: block; background: url("/sp/assets/img/ico_arrow_02.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; }

.btnText--gray { color: #9B9B9B; }

.btnText--gray:before { background-image: url("/sp/assets/img/ico_arrow_01.png"); background-size: auto 100%; }

.m-btnHorizontal { display: -webkit-box; display: -moz-box; display: box; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-flex-pack: center; margin: 0 -4px; }

.m-btnHorizontal--inline { display: inline-block; }

.m-btnHorizontal .btn { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin: 0 4px; text-align: center; }

.m-btnField { background: rgba(0, 0, 0, 0.5); padding: 16px 8px; text-align: center; }

.m-btnField__trigger { color: inherit; text-decoration: none; background: #FFF; display: block; width: 100%; padding: 10px 0; border: solid 2px #D2D2D2; border-radius: 2px; font-weight: bold; }

.m-btnField--primary .m-btnField__trigger { background: #1AA0E9; border-color: #1AA0E9; color: #FFF; }

.m-btnField--alert .m-btnField__trigger { background: #FFF; border-color: #FF001F; color: #FF001F; }

.m-btnPagenation { font-size: 0; text-align: center; }

.m-btnPagenation a { color: inherit; text-decoration: none; display: inline-block; width: 30px; margin: 0 3px; border: solid 1px #1AA0E9; font-size: 10px; color: #1AA0E9; padding: 9px 0; border-radius: 4px; }

.m-btnPagenation a.is-active { color: #9B9B9B; border-color: #D2D2D2; }

.m-carousel { background: #F6F6F6; }

.m-carousel__item img { width: 100%; }

.m-carousel__dots { font-size: 0; text-align: center; }

.m-carousel__dots li { position: relative; display: inline-block; height: 7px; width: 30px; }

.m-carousel__dots li:before { content: ""; position: absolute; bottom: 0; left: 50%; margin: 0 0 0 -13px; width: 26px; height: 3px; background: #FFF; border-radius: 1px; }

.m-carousel__dots li.slick-active:before { background-color: #1AA0E9; border-color: #1AA0E9; }

.m-carousel__dots li button { display: none; }

.js-carouselWrapper.is-prepare { position: relative; overflow: hidden; }

.js-carouselWrapper.is-prepare:before { content: ""; display: block; width: 100%; padding: 27% 0; z-index: 2; }

.js-carouselWrapper.is-prepare .js-carousel { position: absolute; top: 0; left: 0; width: 100%; z-index: 1; }

.m-commentList { border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; }

.m-commentList__item { border-bottom: solid 1px #F0F0F0; }

.m-commentList__item:last-child { border-bottom: none; }

.m-comment { background: #FFF; padding: 8px; }

.m-comment.is-highlight { background: #FFFEED; }

.m-comment > a { color: inherit; text-decoration: none; display: block; position: relative; padding: 8px 21px 8px 8px; margin: -8px; }

.m-comment > a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-comment__data { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.m-comment__avator { width: 40px; margin: 0 8px 0 0; -ms-flex-item-align: start; align-self: flex-start; }

.m-comment__info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }

.m-comment__meta { font-size: 10px; }

.m-comment__author { font-weight: bold; }

.m-comment__time { color: #9B9B9B; margin: 8px 0 0; }

.m-comment__body { margin: 8px 0 0; font-size: 13px; line-height: 1.8; }

.m-simpleComment { position: relative; border-bottom: solid 1px #F0F0F0; padding: 8px; font-size: 13px; line-height: 1.8; }

.m-simpleComment > * { margin: 4px 0 0; }

.m-simpleComment > *:first-child { margin-top: 0; }

.m-simpleComment__time { font-size: 10px; }

.m-simpleComment__time a { text-decoration: none; }

.m-simpleComment__author { font-size: 10px; margin-bottom: 6px; }

.m-simpleComment__delete { display: block; position: absolute; top: 0; right: 0; margin: 0; padding: 8px; }

.m-commentAction { border-top: solid 1px #D2D2D2; width: 100%; font-size: 10px; color: #9B9B9B; text-align: center; margin: 8px 0 -8px; font-weight: bold; clear: both; }

.m-commentAction a { color: inherit; text-decoration: none; }

.m-commentAction > * { position: relative; display: inline-block; padding: 10px 6px 10px 16px; margin: 0 10px; }

.m-commentAction > * .ico { position: absolute; top: 50%; left: 0; margin: -8px 0 0; }

.m-reviewComment { background: #F0F0F0; border-radius: 4px; padding: 8px; margin: 8px 0 0; }

.m-reviewComment > a { display: block !important; }

.m-reviewComment:first-child { margin-top: 0; }

.m-reviewComment a { color: inherit; text-decoration: none; }

.m-reviewComment__data { display: -webkit-box; display: -ms-flexbox; display: flex; }

.m-reviewComment__avator { width: 40px; margin: 0 8px 0 0; }

.m-reviewComment__info { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; }

.m-reviewComment__author { font-size: 10px; font-weight: bold; margin: 0 0 6px; }

.m-reviewComment__meta { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 6px 0 0; }

.m-reviewComment__body { margin: 4px 0 0; font-size: 12px; line-height: 1.8; overflow: hidden; }

.m-reviewComment__time { position: absolute; top: 0; right: 0; font-size: 10px; color: #9B9B9B; }

.is-pc.is-editor { padding-top: 54px; }

.is-pc.is-editor #l-wrap { padding: 0; }

.is-pc.is-editor .l-main { padding: 0; }

.is-pc.is-editor .m-editorMode { top: 54px; }

.is-pc.is-editor .m-editorHeader { height: 54px; }

.is-pc.is-editor .m-editorHeader__inner { padding-top: 12px; }

.m-editor { padding: 0 0 60px; }

.m-editor input[readonly], .m-editor textarea[readonly] { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }

.m-editor__page { position: relative; border-top: solid 4px #EFEFEF; padding: 32px 5%; }

.m-editor__page.is-private { background: #E5E5E5; }

.m-editor__chapter { position: relative; text-align: center; padding: 0 34px; line-height: 1.6; font-size: 120%; font-weight: bold; }

.m-editor__chapter * { text-align: center; color: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; width: 100%; }

.m-editor__body { line-height: 1.7; font-size: 110%; }

.m-editor__body textarea { background: transparent; border: none; padding: 0; color: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; resize: none; padding: 32px 5%; margin: -32px -5%; width: 100%; box-sizing: content-box; }

.m-editor__image { position: relative; }

.m-editor__image__delete { position: absolute; top: 0; left: 0; background: #fff; border: solid 1px #D4D4D4; padding: 12px; }

.m-editor__publishLine { position: absolute; bottom: 0; left: 0; z-index: 10; margin: 0 0 -18px; background: #F18593; color: #fff; text-align: center; font-weight: bold; padding: 4px 0; width: 100%; font-size: 12px; line-height: 1.4; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }

.m-editor__contentButton { background-color: transparent; background-image: url("/sp/assets/img/editor/btn.png"); color: #4A4A4A; background-size: auto 100%; position: absolute; right: 0px; z-index: 10; border: none; padding: 10px 0 10px 3px; height: 30px; width: 97px; font-size: 10px; font-weight: bold; line-height: 1; text-align: center; cursor: pointer; outline: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }

.m-editor__contentButton--publish { background-image: url("/sp/assets/img/editor/btn_primary.png"); bottom: -17px; color: #FFF; }

.m-editor__contentButton--delete { top: -18px; padding-left: 5px; }

.m-editor__contentButton--delete i { position: relative; z-index: 2; margin: 0 6px 0 0; }

.m-editor__contentButton__text { position: relative; z-index: 2; }

.m-editorBox { padding: 12px 8px; margin: 0; background: #F6F6F6; line-height: 1.6; }

.m-editorBox + .m-editorBox { margin: 8px 0 0; }

.m-editorBox--text { line-height: 1.6; }

.m-editorMode { position: fixed; top: 42px; left: 0; z-index: 9999; width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }

.m-editorMode__inner { margin: 0 auto; min-width: 320px; background: #F0F0F0; border-bottom: solid 1px #D4D4D4; padding: 4px 0; }

.m-editorMode__label { text-align: center; font-size: 10px; font-weight: bold; }

.m-editorHeader { position: fixed; top: 0; left: 0; min-height: 42px; width: 100%; z-index: 10000; background: #FFF; border-bottom: solid 1px #D8D8D8; }

.m-editorHeader__inner { margin: 0 auto; min-width: 320px; max-width: 680px; padding: 6px 8px 0; height: 100%; }

.m-editorHeader ul { float: right; }

.m-editorHeader li { margin: 0 0 0 6px; float: left; }

.m-editorHeader__close { display: block; float: left; text-align: center; color: inherit; text-decoration: none; padding: 10px 12px 0; height: 42px; margin: -8px; }

.m-editorHeader__close span { display: block; margin: 3px 0 0; font-size: 8px; }

.m-editorMenu { position: fixed; bottom: 38px; left: 0; z-index: 100; width: 100%; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -webkit-transition-timing-function: cubic-bezier(0.14, 0.55, 0.18, 0.97); -moz-transition-timing-function: cubic-bezier(0.14, 0.55, 0.18, 0.97); -webkit-transition-delay: 0.5s; -moz-transition-delay: 0.5s; }

.is-focus .m-editorMenu { -webkit-transform: translateY(38px); -moz-transform: translateY(38px); }

.m-editorMenu__inner { margin: 0 auto; min-width: 320px; max-width: 680px; padding: 8px; }

.m-editorMenu__inner:after { clear: both; content: ""; display: table; }

.m-editorMenu ul { float: right; }

.m-editorMenu li { float: left; margin: 0 0 0 8px; }

.m-editorMenu i { margin: 0 6px 0 0; }

.m-editorNavigation { position: fixed; left: 0; bottom: 0; z-index: 100; width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -webkit-transition-timing-function: cubic-bezier(0.14, 0.55, 0.18, 0.97); -moz-transition-timing-function: cubic-bezier(0.14, 0.55, 0.18, 0.97); -webkit-transition-delay: 0.5s; -moz-transition-delay: 0.5s; }

.is-focus .m-editorNavigation { -webkit-transform: translateY(38px); -moz-transform: translateY(38px); }

.m-editorNavigation__inner { display: -webkit-box; display: -ms-flexbox; display: flex; min-width: 320px; max-width: 680px; margin: 0 auto; background: #FFF; border-top: solid 1px #D8D8D8; padding: 3px 0; }

.m-editorNavigation a { color: inherit; text-decoration: none; display: block; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 10px 0; font-size: 10px; text-align: center; border-left: solid 1px #D8D8D8; cursor: pointer; font-weight: bold; }

.m-editorNavigation a:first-child { border: none; }

.m-editorNavigation a i { margin: 0 4px 0 0; }

.m-editorNavigationForPC { position: fixed; top: 50%; margin: 0 0 0 710px; z-index: 100; width: 60px; background: #FFF; border: solid 1px #D8D8D8; }

.m-editorNavigationForPC a { color: inherit; text-decoration: none; display: block; padding: 12px 0 14px; font-size: 10px; text-align: center; border-top: solid 1px #D8D8D8; cursor: pointer; font-weight: bold; }

.m-editorNavigationForPC a:first-child { border: none; }

.m-editorNavigationForPC a span { display: block; margin: 6px  0 0; }

.icoEditor { display: inline-block; }

.icoEditor--delete { display: inline-block; background: url("/sp/assets/img/editor/ico_delete.png") 0 0 no-repeat; background-size: 10px auto; height: 10px; width: 10px; vertical-align: middle; }

.icoEditor--image { display: inline-block; background: url("/sp/assets/img/editor/ico_image.png") 0 0 no-repeat; background-size: 14px auto; height: 14px; width: 14px; vertical-align: middle; }

.icoEditor--separator { display: inline-block; background: url("/sp/assets/img/editor/ico_separator.png") 0 0 no-repeat; background-size: 14px auto; height: 14px; width: 14px; vertical-align: middle; }

.icoEditor--top { display: inline-block; background: url("/sp/assets/img/editor/ico_up_double.png") 0 0 no-repeat; background-size: 8px auto; height: 12px; width: 10px; vertical-align: middle; background-position: 50% 50%; }

.icoEditor--bottom { display: inline-block; background: url("/sp/assets/img/editor/ico_down_double.png") 0 0 no-repeat; background-size: 8px auto; height: 12px; width: 10px; vertical-align: middle; background-position: 50% 50%; }

.icoEditor--up { display: inline-block; background: url("/sp/assets/img/editor/ico_up.png") 0 0 no-repeat; background-size: 8px auto; height: 12px; width: 10px; vertical-align: middle; background-position: 50% 50%; }

.icoEditor--down { display: inline-block; background: url("/sp/assets/img/editor/ico_down.png") 0 0 no-repeat; background-size: 8px auto; height: 12px; width: 10px; vertical-align: middle; background-position: 50% 50%; }

.m-eventCard { margin: 8px; border: 1px solid #D2D2D2; }

.m-eventCard a { color: inherit; text-decoration: none; }

.m-eventCard__info { display: table; width: 100%; }

.m-eventCard__status { display: table-cell; width: 110px; text-align: center; padding: 8px; font-weight: bold; }

.m-eventCard__status.is-incoming { background: #6c6c6c; color: #fff; }

.m-eventCard__status.is-open { background: #fee200; }

.m-eventCard__status.is-selection { background: #6c6c6c; color: #fff; }

.m-eventCard__status.is-closed { background: #de243b; color: #fff; }

.m-eventCard__period { background: #f0f0f0; display: table-cell; text-align: right; padding: 8px; }

input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], input:not([type]), textarea { -webkit-appearance: none; -moz-appearance: none; outline: none; background: #FFF; border: solid 1px #D2D2D2; border-radius: 4px; padding: 8px 10px 7px; width: 100%; line-height: 1; margin: 0; }

textarea { font-size: 13px; line-height: 1.6; }

input, select { -webkit-appearance: none; -moz-appearance: none; background: none; outline: none; border: none; }

.m-select { display: inline-block; position: relative; border: 1px solid #D2D2D2; box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.2); border-radius: 4px; overflow: hidden; vertical-align: middle; }

.m-select:before { content: ""; display: block; position: absolute; top: 50%; right: 8px; z-index: 9; margin: -3px 0 0; height: 0; width: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 7px solid #787878; }

.m-select select { background: #FFF; padding: 0 20px 0 8px; height: 32px; font-size: 10px; width: 145%; }

.m-search { position: relative; }

.m-search input[type="text"] { padding-right: 50px; }

.m-search__ico { position: absolute; top: 50%; left: 8px; margin: -10px 0 0; }

.m-search__submit { -webkit-appearance: none; -moz-appearance: none; background: #D2D2D2; border: none; border-radius: 0 4px 4px 0; position: absolute; top: 0; right: 0; height: 100%; width: 50px; }

.m-sendBox { display: table; width: 100%; }

.m-sendBox__field { display: table-cell; vertical-align: top; }

.m-sendBox__btn { display: table-cell; padding-left: 8px; width: 60px; vertical-align: top; }

.m-checkbox { display: inline-block; font-size: 14px; }

.m-checkbox--block { display: block; }

.m-checkbox label { vertical-align: middle; display: inline-block; }

.m-checkbox input[type="checkbox"] { width: 16px; height: 16px; background: #FFF; border: solid 1px #D2D2D2; border-radius: 2px; margin: -2px 3px 0 0px; vertical-align: middle; }

.m-checkbox input[type="checkbox"]:checked { background: url("/sp/assets/img/ico_checkbox_01.png") 50% 50% no-repeat #1AA0E9; background-size: 12px auto; border-color: #1AA0E9; }

input[type="radio"] { background: url("/sp/assets/img/ico_radio_off.png") 0 0 no-repeat; background-size: 18px auto; width: 18px; height: 18px; margin: -2px 3px 0 0px; vertical-align: middle; }

input[type="radio"]:checked { background: url("/sp/assets/img/ico_radio_on.png") 0 0 no-repeat; background-size: 18px auto; }

.m-formBox { background: #F0F0F0; padding: 12px; line-height: 1.6; }

.m-formBox--separator { margin-top: 1px; }

.m-formBox__annotation { font-size: 85%; color: #9B9B9B; margin: 4px 0 0; }

.m-formBox__support { text-align: right; font-size: 90%; margin: 4px 0 0; }

.m-formBox__more { color: inherit; text-decoration: none; background: #F0F0F0; text-align: center; display: block; padding: 16px 0; margin-top: 1px; cursor: pointer; }

.m-errorBox { line-height: 1.6; color: #D0021B; }

.m-formHeading { margin: 0 0 4px; }

.m-formHeading:after { clear: both; content: ""; display: table; }

.m-formHeading__label { font-size: 13px; font-weight: bold; float: left; }

.m-formHeading__label .label { vertical-align: middle; }

.m-formHeading__caption { float: right; font-size: 11px; padding: 1px 0 0; }

.m-edit--inline { display: inline; }

.m-complete { padding: 32px 0; }

.m-complete__label { font-size: 14px; line-height: 1.4; text-align: center; }

.m-complete__text { line-height: 1.6; }

.m-heading { position: relative; display: table; background: #F0F0F0; border-top: solid 1px #D2D2D2; border-bottom: solid 1px #D2D2D2; width: 100%; padding: 6px 8px; line-height: 1.4; }

.m-heading:after { clear: both; content: ""; display: table; }

.m-heading__label { display: table-cell; vertical-align: middle; font-size: 11px; font-weight: bold; }

.m-heading__btn { float: right; margin: -2px 0; }

.m-heading__btn a { color: inherit; text-decoration: none; font-size: 10px; font-weight: bold; display: block; background: #FFF; border: solid 1px #D2D2D2; border-radius: 2px; padding: 8px 12px; line-height: 1; }

.m-heading__btn i { font-size: 14px; }

.m-heading--info { background: #FFB600; color: #FFF; font-size: 12px; font-weight: bold; padding: 12px 12px; text-align: center; border: none; }

.m-heading--alert { background: #f6e7e7; color: #D0021B; font-size: 12px; font-weight: bold; padding: 12px 12px; text-align: center; border: none; }

.m-heading--reverse { background: #BCBCBC; border-color: #BCBCBC; color: #FFF; }

.m-headingWithBtn { display: table; width: 100%; height: 46px; padding: 0 8px; }

.m-headingWithBtn__label { display: table-cell; font-size: 14px; font-weight: bold; vertical-align: middle; }

.m-headingWithBtn__btn { display: table-cell; vertical-align: middle; text-align: right; }

.m-planeHeading { margin: 6px; padding: 12px 0; border-bottom: solid 1px #F0F0F0; line-height: 1.4; }

.m-planeHeading__label { font-size: 14px; font-weight: bold; }

.m-simpleHeading { padding: 9px 8px; line-height: 1.4; }

.m-simpleHeading__label { font-size: 14px; font-weight: bold; }

.m-accentHeading { padding: 10px 6px; font-size: 14px; font-weight: bold; color: #4A4A4A; border-left: solid 4px #1AA0E9; border-bottom: solid 1px #1AA0E9; line-height: 1.4; }

.m-stepHeading { font-weight: bold; font-size: 14px; color: #1AA0E9; margin: 0 0 24px; }

.ico { display: inline-block; }

.ico-whatis { display: inline-block; background: url("/sp/assets/img/ico_whatis.png") 0 0 no-repeat; background-size: 100% auto; height: 17px; width: 17px; vertical-align: middle; vertical-align: top; }

.ico-postFloating { display: inline-block; background: url("/sp/assets/img/ico_post.png") 0 0 no-repeat; background-size: 100% auto; height: 56px; width: 56px; vertical-align: middle; }

.ico-close { display: inline-block; background: url("/sp/assets/img/ico_close.png") 0 0 no-repeat; background-size: 100% auto; height: 15px; width: 15px; vertical-align: middle; }

.ico-loading { display: inline-block; background: url("/sp/assets/img/ico_loading.gif") 0 0 no-repeat; background-size: 100% auto; height: 20px; width: 20px; vertical-align: middle; }

.ico-notice { display: inline-block; background: #FF001F; width: 8px; height: 8px; border-radius: 100%; }

.ico-bookmark, .ico-bookmark--done, .is-bookmarked .icoViewer-bookmark { display: inline-block; background: url("/sp/assets/img/ico_bookmark.png") 0 0 no-repeat; background-size: 48px auto; height: 30px; width: 16px; vertical-align: middle; }

.ico-bookmark--done { background-position: 0 -30px; }

.ico-favorite, .ico-favorite--done { display: inline-block; background: url("/sp/assets/img/ico_favorite.png") 0 0 no-repeat; background-size: 100% auto; height: 13px; width: 14px; vertical-align: middle; }

.ico-favorite--done { background-position: 0 -13px; }

.ico-star, .ico-star--half, .ico-star--full { display: inline-block; background: url("/sp/assets/img/ico_rating.png") 0 0 no-repeat; background-size: 100% auto; height: 10px; width: 10px; vertical-align: middle; }

.ico-star--half { background-position: 0 -10px; }

.ico-star--full { background-position: 0 -20px; }

.ico-delete { display: inline-block; background: url("/sp/assets/img/ico_delete.png") 0 0 no-repeat; background-size: 100% auto; height: 16px; width: 16px; vertical-align: middle; }

.ico-ticket { display: inline-block; background: url("/sp/assets/img/ico_ticket.png") 0 0 no-repeat; background-size: 100% auto; height: 15px; width: 24px; vertical-align: middle; }

.ico-like { display: inline-block; background: url("/sp/assets/img/ico_like.png") 0 0 no-repeat; background-size: 100% auto; height: 15px; width: 13px; vertical-align: middle; }

.ico-comment { display: inline-block; background: url("/sp/assets/img/ico_comment.png") 0 0 no-repeat; background-size: 100% auto; height: 15px; width: 14px; vertical-align: middle; }

.ico-search { display: inline-block; background: url("/sp/assets/img/ico_search_01.png") 0 0 no-repeat; background-size: 100% auto; height: 20px; width: 20px; vertical-align: middle; }

.ico-arrow { display: inline-block; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: 100% auto; height: 9px; width: 5px; vertical-align: middle; vertical-align: top; margin: 0 0 0 4px; }

.ico-arrow--white { display: inline-block; background: url("/sp/assets/img/ico_arrow_03.png") 0 0 no-repeat; background-size: 100% auto; height: 9px; width: 5px; vertical-align: middle; vertical-align: top; margin: 0 0 0 4px; }

.ico-arrow--down { display: inline-block; background: url("/sp/assets/img/ico_arrow_04.png") 0 0 no-repeat; background-size: 100% auto; height: 5px; width: 9px; vertical-align: middle; margin: 0 8px 0 0; }

.ico-twitter { display: inline-block; background: url("/sp/assets/img/ico_twitter_aqua.png") 0 0 no-repeat; background-size: 100% auto; height: 16px; width: 20px; vertical-align: middle; margin: 0 2px 0 4px; }

.ico-twitter--white { display: inline-block; background: url("/sp/assets/img/ico_twitter.png") 0 0 no-repeat; background-size: 100% auto; height: 16px; width: 20px; vertical-align: middle; margin: 0 2px 0 4px; }

.ico-slider-next { display: inline-block; background: url("/sp/assets/img/for_pc/ico_slider_next.png") 0 0 no-repeat; background-size: 100% auto; height: 32px; width: 32px; vertical-align: middle; }

.ico-slider-prev { display: inline-block; background: url("/sp/assets/img/for_pc/ico_slider_prev.png") 0 0 no-repeat; background-size: 100% auto; height: 32px; width: 32px; vertical-align: middle; }

.ico-tab { display: block; width: 100%; height: 25px; background-position: 50% 0; background-repeat: no-repeat; background-size: auto 50px; }

.is-active .ico-tab { background-position: 50% -25px; }

.ico-tab--info { background-image: url("/sp/assets/img/ico_tab_info.png"); }

.ico-tab--comment { background-image: url("/sp/assets/img/ico_tab_comment.png"); }

.ico-tab--community { background-image: url("/sp/assets/img/ico_tab_community.png"); }

.ico-tab--worklist { background-image: url("/sp/assets/img/ico_tab_worklist.png"); }

.ico-tab--bookmark { background-image: url("/sp/assets/img/ico_tab_bookmark.png"); }

.ico-tab--history { background-image: url("/sp/assets/img/ico_tab_history.png"); }

.ico-tab--mylist { background-image: url("/sp/assets/img/ico_tab_mylist.png"); }

.ico-tab--favorite { background-image: url("/sp/assets/img/ico_tab_favorite.png"); }

.ico.sprite-ico_menu_book { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -42px 0px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_bookstand { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -84px -126px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_circle { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: 0px -42px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_comment { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -42px -42px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_community { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -84px 0px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_event { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -84px -42px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_feature { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: 0px -84px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_genre { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -42px -84px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_guide { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -84px -84px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_help { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -126px 0px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_history { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -126px -42px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_info { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -126px -84px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_label { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: 0px -126px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_mylist { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -42px -126px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_mypage { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: 0px 0px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_new { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -126px -126px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_ranking { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -168px 0px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_setting { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -168px -42px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_star { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -168px -84px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_tag { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -168px -126px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_ticket { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: 0px -168px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_menu_worklist { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -42px -168px; width: 32px; height: 32px; background-size: 228px 200px; }

.ico.sprite-ico_nav_bookshelf { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -84px -168px; width: 18px; height: 19px; background-size: 228px 200px; }

.ico.sprite-ico_nav_login { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -112px -168px; width: 18px; height: 19px; background-size: 228px 200px; }

.ico.sprite-ico_nav_menu { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -140px -168px; width: 18px; height: 19px; background-size: 228px 200px; }

.ico.sprite-ico_nav_mypage { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -210px -29px; width: 18px; height: 19px; background-size: 228px 200px; }

.ico.sprite-ico_nav_post { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -168px -168px; width: 18px; height: 19px; background-size: 228px 200px; }

.ico.sprite-ico_nav_setting { background-image: url(/sp/assets/img/sprite/sprite.png?v=2); background-position: -210px 0px; width: 18px; height: 19px; background-size: 228px 200px; }

@font-face { font-family: 'icons'; src: url("/sp/assets/fonts/icons.ttf?v2") format("truetype"), url("/sp/assets/fonts/icons.woff?v2") format("woff"), url("/sp/assets/fonts/icons.svg?v2#icons") format("svg"); font-weight: normal; font-style: normal; }

[class^="ico-nav__"], [class*=" ico-nav__"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icons' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; font-size: 20px; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.ico-nav__bookstand:before { content: "\e900"; }

.ico-nav__login:before { content: "\e901"; }

.ico-nav__menu:before { content: "\e902"; }

.ico-nav__mypage:before { content: "\e903"; }

.ico-nav__post:before { content: "\e904"; }

.ico-nav__setting:before { content: "\e905"; }

.ico-nav__index:before { content: "\e906"; }

.ico-nav__question:before { content: "\e907"; }

.label { background: #ccc; display: inline-block; padding: 3px 8px; color: #FFF; font-size: 9px; border-radius: 2px; line-height: 1; font-weight: bold; }

.label--blue { background-color: #1AA0E9; }

.label--red { background-color: #D0021B; }

.label--pink { background-color: #F8697A; }

.label--green { background-color: #7DC52E; }

.label--yellow { background-color: #F2B229; }

.label--beige { background-color: #CBA75D; }

.m-list--borderTop { border-top: 1px solid #F0F0F0; }

.m-list--borderBottom { border-bottom: 1px solid #F0F0F0; }

.m-list--arrow li a { padding-right: 21px; }

.m-list--arrow li a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-list li { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-flex-align: center; width: 100%; border-bottom: 1px solid #F0F0F0; padding: 8px; }

.m-list li:last-child { border-bottom: none; }

.m-list li.is-highlight { background: #FFFEED; }

.m-list li > a { color: inherit; text-decoration: none; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-flex-align: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 8px; margin: -8px; box-sizing: content-box; }

.m-list__image { width: 40px; margin: 0 8px 0 0; }

.m-list__image img { border: solid 1px #D2D2D2; }

.m-list__image--large { width: 90px; }

.m-list__info { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; font-size: 10px; line-height: 1.4; }

.m-list__info > * { margin: 4px 0 0; }

.m-list__info > *:first-child { margin-top: 0; }

.m-list__info > *:last-child { margin-bottom: 0; }

.m-list__label { font-size: 14px; font-weight: bold; margin: 2px 0 4px; }

.m-list__text { font-size: 12px; line-height: 1.5; }

.m-list__text--small { font-size: 10px; line-height: 1.5; }

.m-list__meta:after { clear: both; content: ""; display: table; }

.m-list__time { color: #9B9B9B; position: absolute; bottom: 1px; right: 0; }

.m-list__ticket { color: #FF9F00; font-size: 12px; font-weight: bold; }

.m-list__ticket i { margin: 0 6px 0 0; }

.m-list__rightTop { position: absolute; top: 8px; right: 8px; }

.m-list__rightBottom { position: absolute; bottom: 8px; right: 8px; }

.m-list__checkbox { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

.m-list__review { background: #F0F0F0; padding: 8px; border-radius: 2px; font-size: 12px; margin: 6px 0; line-height: 1.5; }

.m-list__right { float: right; white-space: nowrap; }

.m-list__action { white-space: nowrap; }

.m-menuList { background: #FFF; border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; }

.m-menuList--plane a:before { display: none; }

.m-menuList--right { text-align: right; }

.m-menuList li { position: relative; border-bottom: solid 1px #F0F0F0; font-size: 14px; }

.m-menuList li:last-child { border-bottom: none; }

.m-menuList li a { color: inherit; text-decoration: none; display: block; padding: 12px 24px 12px 8px; }

.m-menuList li a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-menuList__pages { float: right; }

.m-pageList li { border-top: solid 1px #F0F0F0; position: relative; }

.m-pageList a { color: inherit; text-decoration: none; display: block; padding: 8px 60px 8px 8px; }

.m-pageList__title { font-weight: bold; font-size: 14px; line-height: 1.6; }

.m-pageList__page { position: absolute; top: 50%; right: 8px; margin: -6px 0 0; font-size: 12px; }

.m-categoryList { border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; overflow: hidden; }

.m-categoryList ul { margin: 0 -1px -1px 0; overflow: hidden; }

.m-categoryList .m-categoryList__item { background: #FFF; width: 50%; position: relative; float: left; border-bottom: solid 1px #F0F0F0; border-right: 1px solid #F0F0F0; font-size: 12px; }

.m-categoryList .m-categoryList__item--wide { width: 100%; float: none; }

.m-categoryList .m-categoryList__item a { color: inherit; text-decoration: none; display: block; position: relative; padding: 12px 21px 12px 8px; }

.m-categoryList .m-categoryList__item a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-categoryList__label { font-size: 12px; font-weight: bold; margin: 0 0 6px; }

.m-categoryList__text { font-size: 10px; line-height: 1.3; color: #9B9B9B; }

.m-slideList { position: relative; }

.m-slideList__scroller { overflow: scroll; -webkit-overflow-scrolling: touch; }

.m-slideList__body { padding: 12px 8px 8px; min-width: 100%; }

.m-slideList__body:after { clear: both; content: ""; display: table; }

.m-slideList__body li { float: left; width: 90px; margin: 0 8px 0 0; }

.m-slideList__body li:last-child { margin-left: 0; }

.m-slideList__body a { color: inherit; text-decoration: none; }

.m-slideList__genre { margin: 0 0 6px; color: #9B9B9B; font-size: 10px; }

.m-slideList__title { font-size: 12px; font-weight: bold; margin: 6px 0 0; line-height: 1.4; }

.m-slideList__image { background: #ccc; height: 127px; overflow: hidden; border: solid 1px #D2D2D2; }

.m-slideList__image--flexible { height: auto; }

.m-slideList__image img { width: 100%; }

.m-slideList__btn { position: absolute; top: 42%; z-index: 2; margin-top: -36px; cursor: pointer; padding: 20px 0; }

.m-slideList__btn--prev { left: 0; padding-right: 10px; }

.m-slideList__btn--next { right: 0; padding-left: 10px; }

.m-adList { background: #eee; padding: 8px; }

.m-adList__item { background: #FFF; box-shadow: 0 0 4px rgba(0, 0, 0, 0.3); margin: 12px 0 0; }

.m-adList__item:first-child { margin-top: 0; }

.m-adList__item a { color: inherit; text-decoration: none; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; padding: 8px 21px 8px 8px; }

.m-adList__item a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-adList__image { width: 60px; margin: 0 8px 0 0; }

.m-adList__image img { border: solid 1px #D2D2D2; }

.m-adList__info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }

.m-adList__title { font-size: 12px; font-weight: bold; line-height: 1.4; margin: 0 0 6px; }

.m-adList__lead { font-size: 12px; font-weight: bold; line-height: 1.4; }

.m-adList__text { color: #9B9B9B; font-size: 10px; margin: 0 0 6px; line-height: 1.5; }

.m-featureList__item { border-bottom: 1px solid #F0F0F0; }

.m-featureList__item--recommend { margin: 8px; border: 1px solid #ff9d1e; border-top: none; position: relative; }

.m-featureList__item--recommend .m-heading { width: auto; display: block; position: relative; margin-left: -4px; margin-right: -4px; border: none; background: #ff9d1e; text-align: center; }

.m-featureList__item--recommend .m-heading .m-heading__label { display: block; font-size: 12px; color: #fff; }

.m-featureList__item--recommend .m-heading:before { content: ''; display: block; width: 0; height: 0; border-top: 4px solid transparent; border-right: 4px solid #d39543; position: absolute; left: 0; bottom: -4px; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }

.m-featureList__item--recommend .m-heading:after { content: ''; width: 0; height: 0; border-top: 4px solid transparent; border-left: 4px solid #d39543; position: absolute; right: 0; bottom: -4px; -webkit-transform: rotate(90deg); transform: rotate(90deg); }

.m-featureList__info { text-align: center; line-height: 1.5; }

.m-featureList__title { font-size: 14px; font-weight: bold; }

.m-featureList__thumb { max-width: 100%; margin: 8px 0; }

.m-featureList__thumb img { max-width: 200px; }

.m-featureList__comment { padding: 8px; background: #f6f6f6; border-radius: 4px; line-height: 1.5; }

.m-more { position: relative; border-top: solid 1px #F0F0F0; text-align: right; }

.m-more a { display: block; }

.m-gallery { padding: 4px; }

.m-gallery:after { clear: both; content: ""; display: table; }

.m-gallery__item { float: left; width: 50%; padding: 4px; }

.m-gallery__item:nth-child(2n+1) { clear: both; }

.m-panelList { overflow: hidden; padding: 4px 8px 12px; }

.m-panelList__item { float: left; width: 33.333%; padding: 0 0 8px; text-align: center; }

.m-panelList__item:nth-child(3n+1) { clear: both; }

.m-panelList__itemBody { display: block; width: 100px; margin: 0 auto; }

.m-panelList__itemBody > a { color: inherit; text-decoration: none; }

.m-panelList__genre { position: relative; font-size: 12px; font-weight: bold; margin: 0 -12px; }

.m-panelList__genre a { display: block; padding: 12px 0 32px; margin: 0 0 -20px; text-decoration: none; }

.m-panelList__genre b { padding: 0 0 2px; border-bottom: solid 1px #1AA0E9; }

.m-panelList__title { font-size: 11px; font-weight: bold; margin: 6px 0 0; line-height: 1.4; }

.m-panelList__image { background: #ccc; background-size: cover; background-position: center top; height: 138px; overflow: hidden; border: solid 1px #D2D2D2; }

.m-panelList__image img { visibility: hidden; width: 100%; }

.m-menu { position: absolute; top: 40px; right: 0; z-index: 10000; width: 100%; height: 100%; display: none; }

.m-menu.is-show { display: block; }

.m-menu__filter { position: absolute; top: 2px; left: 0; background: rgba(255, 255, 255, 0.75); width: 100%; height: 100%; }

.m-menu__body { background: #FFF; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5); width: 95%; float: right; margin: 0 3px 0 0; }

.m-menu__label { background: #F0F0F0; border-top: solid 1px #D2D2D2; border-bottom: solid 1px #D2D2D2; padding: 5px 8px; font-size: 10px; color: #787878; }

.m-menu__label:first-child { border-top: none; }

.m-menu__nav { color: #585858; overflow: hidden; }

.m-menu__nav ul { margin: 0 -1px -1px 0; }

.m-menu__nav ul:after { clear: both; content: ""; display: table; }

.m-menu__nav li { position: relative; float: left; width: 50%; border-right: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; }

.m-menu__nav li .ico { position: absolute; top: 50%; left: 5px; margin: -16px 0 0; }

.m-menu__nav a { color: inherit; text-decoration: none; display: block; padding: 13px 0 13px 40px; }

.m-menuNavigation__list { border-radius: 4px; border: solid 1px #D2D2D2; overflow: hidden; }

.m-menuNavigation__list ul { overflow: hidden; margin: -1px 0 0 -1px; }

.m-menuNavigation__list li { background: #FFF; float: left; width: 50%; border-left: solid 1px #D2D2D2; border-top: solid 1px #D2D2D2; }

.m-menuNavigation__list li a { color: inherit; text-decoration: none; display: block; padding: 10px 0px; vertical-align: middle; }

.m-menuNavigation__list li span { display: inline-block; position: relative; padding: 0 0 0 34px; }

.m-menuNavigation__list li span i { position: absolute; top: 50%; left: 0; margin: -16px 0 0; }

.m-menuNavigation__more { background: #FFF; text-align: right; }

.m-box { margin: 8px 0; padding: 0 8px; }

.m-box--gray { padding: 12px 8px; margin: 0; background: #F0F0F0; }

.m-box--text { line-height: 1.6; }

.m-box--inside { margin: 0; padding: 0 5%; }

.m-adBox { background: #F0F0F0; padding: 8px 0; text-align: center; }

.m-adBox__inner { display: inline-block; }

.m-annotation { color: #787878; line-height: 1.4; font-size: 10px; margin: 12px 0; }

.m-annotation--gray { background: #F6F6F6; padding: 8px; }

.m-noData { border: solid 1px #F0F0F0; padding: 14px 8px; text-align: center; line-height: 1.4; }

.m-share { padding: 0 8px; text-align: center; }

.m-share .m-share__item { display: inline-block; vertical-align: top; margin: 0 2px; }

.m-follow { padding: 12px 8px 0; text-align: center; }

.m-follow .m-follow__item { position: relative; display: inline-block; vertical-align: top; margin: 0 2px; }

.m-follow .m-follow__item--line:before { position: absolute; top: -12px; left: -15px; content: ""; height: 26px; width: 16px; background: url("/sp/assets/img//follow_deco_line.png") 0 0 no-repeat; background-size: 100% auto; }

.m-follow .m-follow__item--twitter:before { position: absolute; top: -12px; right: -15px; content: ""; height: 26px; width: 16px; background: url("/sp/assets/img//follow_deco_twitter.png") 0 0 no-repeat; background-size: 100% auto; }

.m-stepArrow { display: inline-block; background: url("/sp/assets/img/ico_step_arrow.png") 0 0 no-repeat; background-size: 100% auto; height: 14px; width: 25px; vertical-align: middle; display: block; margin: 32px auto; border: none; }

.m-breadcrumb { padding: 1px 0; font-size: 9px; line-height: 28px; }

.m-breadcrumb ol { background: #F0F0F0; display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; }

.m-breadcrumb li { position: relative; }

.m-breadcrumb li:not(:last-child):after { content: ""; position: absolute; top: 0; right: 0; height: 28px; width: 6px; background: url("/sp/assets/img//breadcrumb_arrow.png") 0 0 no-repeat; background-size: 100% auto; }

.m-breadcrumb li > a, .m-breadcrumb li > span { display: block; color: inherit; padding: 0 16px 0 12px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.m-pickup { padding: 8px 0 0; border-bottom: solid 1px #F0F0F0; }

.m-pickup__heading { position: relative; padding: 6px 8px; }

.m-pickup__label { font-size: 12px; font-weight: bold; }

.m-pickup__label a { color: inherit; text-decoration: none; }

.m-pickup__more { position: absolute; top: 50%; right: 8px; margin: -10px 0 0; }

.m-pickupList { position: relative; }

.m-pickupList__scroller { overflow: scroll; -webkit-overflow-scrolling: touch; padding: 8px 0 8px 8px; }

.m-pickupList__body { padding: 0 8px 0 0; box-sizing: content-box; }

.m-pickupList__body:after { clear: both; content: ""; display: table; }

.m-pickupList__body li { float: left; width: 90px; margin: 0 8px 0 0; }

.m-pickupList__body li:last-child { margin-right: 0; }

.m-pickupList__body li:nth-child(1) .m-pickupList__ranking { background: #C5BD5D; }

.m-pickupList__body li:nth-child(2) .m-pickupList__ranking { background: #BCB2BF; }

.m-pickupList__body li:nth-child(3) .m-pickupList__ranking { background: #D29966; }

.m-pickupList__body a { color: inherit; text-decoration: none; position: relative; display: block; }

.m-pickupList__ranking { position: absolute; top: 0; left: 0; z-index: 10; width: 20px; height: 20px; background: #ccc; text-align: center; color: #FFF; font-size: 10px; padding: 5px 0; }

.m-pickupList__title { z-index: 10; padding: 4px 0; font-size: 11px; font-weight: bold; line-height: 1.3; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

.m-pickupList__image { position: relative; height: 127px; overflow: hidden; }

.m-pickupList__image img { width: 100%; }

.m-pickupList__image__frame { max-height: 100%; border: solid 1px #D2D2D2; }

.m-pickupList__btn { position: absolute; top: 50%; z-index: 2; margin-top: -36px; cursor: pointer; padding: 20px 0; }

.m-pickupList__btn--prev { left: 0; padding-right: 10px; }

.m-pickupList__btn--next { right: 0; padding-left: 10px; }

.m-genreLink__label { font-weight: bold; margin: 0 0 8px; }

.m-genreLink__list ul { overflow: hidden; border-top: solid 1px #F0F0F0; border-right: solid 1px #F0F0F0; }

.m-genreLink__list li { background: #FFF; float: left; width: 50%; border-bottom: solid 1px #F0F0F0; border-left: solid 1px #F0F0F0; }

.m-genreLink__list li a { color: inherit; text-decoration: none; display: block; padding: 12px 10px; border-left: solid 4px #D2D2D2; }

.m-genreLink__more { background: #FFF; text-align: right; }

.m-btnPagenation { font-size: 0; text-align: center; }

.m-btnPagenation a { color: inherit; text-decoration: none; display: inline-block; width: 30px; margin: 0 3px; border: solid 1px #1AA0E9; font-size: 10px; color: #1AA0E9; padding: 9px 0; border-radius: 4px; }

.m-btnPagenation a.is-active { color: #9B9B9B; border-color: #D2D2D2; }

.m-pager { position: relative; background: #EDEDED; border-top: solid 1px #C7C7C7; border-bottom: solid 1px #C7C7C7; height: 50px; color: #7B7B7B; font-size: 8px; }

.m-pager .ico { display: block; margin: 0 auto 4px; }

.m-pager__btn { color: inherit; text-decoration: none; position: absolute; top: 0; display: block; height: 100%; width: 64px; padding: 7px 0 0; text-align: center; }

.m-pager__btn:before { content: ""; display: inline-block; height: 34px; width: 32px; }

.m-pager__btn.is-disable:before { background-position: 50% -34px; }

.m-pager__btn--next { right: 0; }

.m-pager__btn--next:before { background: url("/sp/assets/img/ico_pager_next.png") 50% 0 no-repeat; background-size: 100% auto; }

.m-pager__btn--prev { left: 0; }

.m-pager__btn--prev:before { background: url("/sp/assets/img/ico_pager_prev.png") 50% 0 no-repeat; background-size: 100% auto; }

.m-loading { position: relative; padding: 20px 0; text-align: center; }

.m-loading__text { margin: 0 0 10px; }

.m-popup { position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; z-index: 9999; padding: 30px 8px; color: #4A4A4A; }

.m-popup * { -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }

.m-popup *:hover { -webkit-tap-highlight-color: transparent; }

.m-popup__filter { position: fixed; top: -50%; left: 0; width: 100%; height: 200%; background: rgba(0, 0, 0, 0.5); }

.m-popup__body { position: relative; z-index: 2; padding: 8px 0; max-width: 664px; margin: 0 auto; border-radius: 4px; background: #FFF; -webkit-transition-property: top; transition-property: top; -webkit-transition-duration: 0.25s; -moz-transition-duration: 0.25s; -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -moz-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }

.m-popup__body > *:last-child { margin-bottom: 0; }

.m-popup__title { text-align: center; font-weight: bold; padding: 8px 0 16px; margin: 0 8px; border-bottom: solid 1px #D8D8D8; }

.m-popup__close { position: absolute; top: 0; right: 0; padding: 14px 16px; }

.m-popup__box { position: relative; padding: 0 8px; margin: 8px 0; }

.m-popup__box:last-child { margin-bottom: 0; }

.m-popup__label { font-weight: bold; font-size: 12px; margin: 16px 8px 8px; }

.m-profile { position: relative; padding: 8px; }

.m-profile:after { clear: both; content: ""; display: table; }

.m-profile__image { position: relative; z-index: 2; width: 80px; max-height: 86px; overflow: hidden; float: left; }

.m-profile__image img { width: 100%; }

.m-profile__edit { display: block; position: absolute; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.2); color: #FFF; padding: 6px 0; width: 100%; text-align: center; font-size: 10px; text-decoration: none; color: #FFF; }

.m-profile__info { position: relative; width: 100%; padding: 0 0 36px 88px; box-sizing: border-box; }

.m-profile__infoBody { display: table; width: 100%; min-height: 50px; }

.m-profile__action { display: table-cell; vertical-align: middle; padding: 0 0 8px; }

.m-profile__status { display: table-cell; width: 100%; vertical-align: middle; padding: 0 0 8px; }

.m-profile__name { font-size: 14px; font-weight: bold; padding: 8px 0; }

.m-profile__counter { position: absolute; bottom: 0; right: 0; width: 100%; box-sizing: border-box; background: #FFFDE6; padding: 8px 8px 8px 96px; }

.m-profile__counter table { text-align: center; font-weight: bold; width: 100%; }

.m-profile__counter table th, .m-profile__counter table td { border-left: solid 1px #D8D8D8; width: 33.333px; }

.m-profile__counter table th:first-child, .m-profile__counter table td:first-child { border-left: none; }

.m-profile__counter table th { font-size: 10px; font-weight: normal; padding: 0 0 6px; }

.m-myprofile { display: table; width: 100%; padding: 8px; box-sizing: border-box; }

.m-myprofile__image { position: relative; display: table-cell; width: 80px; }

.m-myprofile__image a { position: relative; display: block; max-height: 86px; overflow: hidden; }

.m-myprofile__image img { width: 100%; }

.m-myprofile__edit { display: block; position: absolute; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.2); color: #FFF; padding: 6px 0; width: 100%; text-align: center; font-size: 10px; text-decoration: none; color: #FFF; }

.m-myprofile__info { position: relative; display: table-cell; vertical-align: middle; padding: 0 0 0 8px; }

.m-myprofile__name { font-weight: bold; font-size: 14px; margin: 0 0 8px; }

.m-myprofile__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-right: 5px; box-sizing: border-box; }

.m-myprofile__link:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-register { padding: 8px 8px 24px; }

.m-registerHeading { position: relative; padding: 16px 0; }

.m-registerHeading__label { text-align: center; font-weight: bold; font-size: 14px; }

.m-registerSeparate { border: none; border-top: 1px dashed #979797; margin: 16px 0 0; height: 1px; display: block; }

.m-registerBox { background: #fff; padding: 12px; line-height: 1.6; }

.m-registerBox__label { font-weight: bold; font-size: 14px; margin: 0 0 4px; }

.m-registerBox__label--center { text-align: center; margin: 16px 0; }

.m-registerBox__row { margin: 8px 0 0; }

.m-registerBox__row:first-child { margin-top: 0; }

.m-registerBox__confirm { background: #EAEAEA; border-radius: 2px; padding: 8px; }

.m-registerBox--separator { margin-top: 1px; }

.m-registerComplete { padding: 32px 0; text-align: center; }

.m-registerComplete__label { font-size: 14px; line-height: 1.4; text-align: center; }

.m-registerComplete__text { line-height: 1.6; }

.m-link { color: #1AA0E9; text-decoration: none; }

.m-link:hover { text-decoration: underline; }

.m-link--arrow { position: relative; padding: 0 0 0 15px; }

.m-link--arrow:before { content: ""; background: url("/sp/assets/img/ico_arrow_03.png") 50% 50% no-repeat #1AA0E9; background-size: auto 8px; width: 12px; height: 12px; position: absolute; top: 1px; left: 0; border-radius: 100%; }

.m-segmentedController { font-size: 10px; color: #787878; font-weight: bold; text-align: center; min-width: 160px; }

.m-segmentedController ul { background: #FFF; display: -webkit-box; display: -ms-flexbox; display: flex; border-radius: 4px; border: solid 1px #787878; }

.m-segmentedController li { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; border-left: solid 1px #787878; }

.m-segmentedController li:first-child { border-left: none; }

.m-segmentedController li.is-active { background: #787878; color: #FFF; }

.m-segmentedController li a { -webkit-tap-highlight-color: transparent; color: inherit; text-decoration: none; display: block; padding: 8px 4px; cursor: pointer; white-space: nowrap; }

.m-segmentedController li a:hover { -webkit-tap-highlight-color: transparent; }

.m-stepNavigation { background: #FFF; font-size: 8px; text-align: center; }

.m-stepNavigation ol { display: -webkit-box; display: -ms-flexbox; display: flex; border: solid 1px #F0F0F0; }

.m-stepNavigation li { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; padding: 10px 0; height: 30px; }

.m-stepNavigation li.is-active { background: #E5E5E5; font-weight: bold; color: #4A4A4A; }

.m-stepNavigation li.is-active:before { position: absolute; top: 0; left: 0; content: ""; display: block; height: 0; width: 0; border-bottom: 15px solid transparent; border-left: 4px solid #FFF; border-top: 15px solid transparent; }

.m-stepNavigation li.is-active:after { position: absolute; top: 0; right: -4px; content: ""; display: block; height: 0; width: 0; border-bottom: 15px solid transparent; border-left: 4px solid #E5E5E5; border-top: 15px solid transparent; }

.m-stepNavigation li.is-active:first-child:before { display: none; }

.m-stepNavigation li.is-active:last-child:after { display: none; }

.m-accordionMenu { background: #FFF; border-bottom: solid 1px #F0F0F0; }

.m-accordionMenu__heading { position: relative; padding: 14px 24px 14px 8px; line-height: 1.6; }

.is-open .m-accordionMenu__heading { background: #1AA0E9; color: #FFF; }

.m-accordionMenu__heading:before { content: ""; position: absolute; top: 50%; right: 8px; margin: -3px 0 0; background: url("/sp/assets/img/ico_arrow_04.png") 0 0 no-repeat; background-size: 100% auto; width: 9px; height: 6px; }

.is-open .m-accordionMenu__heading:before { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); }

.m-accordionMenu__label { font-size: 12px; }

.m-accordionMenu__body { background: #F0F0F0; padding: 16px; line-height: 1.6; }

.m-tabNavigation { position: relative; border-bottom: solid 1px #1AA0E9; padding: 8px 0 0; }

.m-tabNavigation--gray { background: #E7E7E7; }

.m-tabNavigation--inline ul { width: 60%; font-size: 0; }

.m-tabNavigation.with-icon li > a { padding: 4px 0; }

.m-tabNavigation ul { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0 6px 3px; }

.m-tabNavigation li { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; background: #FFF; font-size: 10px; margin: 0 2px; text-align: center; color: #1AA0E9; border: solid 1px #1AA0E9; border-radius: 2px; font-weight: bold; }

.m-tabNavigation li.is-active { background-color: #1AA0E9; color: #FFF; margin-bottom: -3px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

.m-tabNavigation li.is-active i { background-position: 50% -25px; }

.m-tabNavigation li .ico-notice { position: absolute; top: 3px; right: 3px; }

.m-tabNavigation li > a { -webkit-tap-highlight-color: transparent; color: inherit; text-decoration: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; padding: 8px 2px; cursor: pointer; white-space: nowrap; }

.m-tabNavigation li > a:hover { -webkit-tap-highlight-color: transparent; }

.m-tabNavigation__support { position: absolute; top: 4px; right: 0; }

.m-globalTab { background: #F0F0F0; padding: 8px 6px 0; }

.m-globalTab ul { display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; }

.m-globalTab li { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; background: #FFF; font-size: 12px; text-align: center; color: #1AA0E9; font-weight: bold; margin: 0 2px; border-radius: 2px 2px 0 0; }

.m-globalTab li.is-active { background: #1AA0E9; color: #fff; }

.m-globalTab li > a { -webkit-tap-highlight-color: transparent; color: inherit; text-decoration: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: inherit; display: block; padding: 10px 0 11px; cursor: pointer; }

.m-globalTab li > a:hover { -webkit-tap-highlight-color: transparent; }

.m-basicTable { width: 100%; }

.m-basicTable th, .m-basicTable td { border: solid 1px #D2D2D2; padding: 4px 8px; text-align: center; }

.m-basicTable th { background: #F0F0F0; }

.m-tags ul { margin: -4px 0 0 -4px; }

.m-tags ul:after { clear: both; content: ""; display: table; }

.m-tags li { float: left; margin: 4px 0 0 4px; background: #FFF; border: 1px solid #D2D2D2; border-radius: 2px; }

.m-tags li a { color: inherit; text-decoration: none; display: block; padding: 5px 6px; font-size: 12px; }

.m-viewer__page { position: relative; border-bottom: solid 4px #EFEFEF; }

.m-viewer__page:first-child { border-top: solid 4px #EFEFEF; }

.m-viewer__pageContent { padding: 24px 5%; }

.m-viewer__chapter { position: relative; text-align: center; padding: 0 34px; margin: 0 0 16px; line-height: 1.6; font-size: 120%; font-weight: bold; }

.m-viewer__chapter--modest { font-size: 85%; font-weight: normal; color: #9B9B9B; }

.m-viewer__bookmark { position: absolute; top: -2px; right: 0; padding: 0 5% 24px 40px; cursor: pointer; }

.m-viewer__body { line-height: 1.7; font-size: 110%; }

.m-viewer__image { margin: 15px 0; }

.m-viewerBox { padding: 12px 16px; }

.m-viewerBox--borderTop { border-top: solid 1px #F0F0F0; }

.m-viewerBox--borderBottom { border-bottom: solid 1px #F0F0F0; }

.m-viewerBox--gray { background: #F6F6F6; border-top: solid 1px #D8D8D8; border-bottom: solid 1px #D8D8D8; }

.m-viewerForetell { padding: 40px 16px; line-height: 1.6; border-bottom: solid 4px #EFEFEF; }

.m-viewerPageAction { text-align: right; margin: 7px -5px -5px; font-size: 12px; font-weight: bold; color: #9B9B9B; }

.m-viewerPageAction i { margin: 0 4px 0 0; }

.m-viewerPageAction__btn { color: inherit; text-decoration: none; display: inline-block; padding: 5px; cursor: pointer; }

.m-viewerPager { display: table; width: 100%; padding: 16px 0; text-align: center; }

.m-viewerPager__btn { position: relative; display: table-cell; width: 25%; font-weight: bold; font-size: 10px; color: #1AA0E9; }

.m-viewerPager__btn a { color: inherit; text-decoration: none; display: block; text-align: center; }

.m-viewerPager__btn a.is-disable { opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; }

.m-viewerPager__btn a span { display: block; margin: 8px 0 0; }

.m-viewerPager__content { display: table-cell; width: 50%; vertical-align: middle; border-left: solid 2px #EFEFEF; border-right: solid 2px #EFEFEF; }

.m-viewerPager__label { font-size: 10px; color: #777; margin: 6px 0 0; }

.m-viewerPager__label > p { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 156px; margin: 0 auto; }

.icoViewer { display: inline-block; }

.icoViewer-prev { display: inline-block; background: url("/sp/assets/img/viewer/ico_prev.png") 0 0 no-repeat; background-size: 120px auto; height: 40px; width: 40px; vertical-align: middle; }

.icoViewer-next { display: inline-block; background: url("/sp/assets/img/viewer/ico_next.png") 0 0 no-repeat; background-size: 120px auto; height: 40px; width: 40px; vertical-align: middle; }

.icoViewer-index { display: inline-block; background: url("/sp/assets/img/viewer/ico_index.png") 0 0 no-repeat; background-size: 120px auto; height: 40px; width: 40px; vertical-align: middle; }

.icoViewer-comment { display: inline-block; background: url("/sp/assets/img/viewer/ico_comment_balloon.png") 0 0 no-repeat; background-size: 45px auto; height: 15px; width: 15px; vertical-align: middle; }

.icoViewer-bookmark--small { display: inline-block; background: url("/sp/assets/img/viewer/ico_bookmark_small.png") 0 0 no-repeat; background-size: 30px auto; height: 17px; width: 10px; vertical-align: middle; }

.is-bookmarked .icoViewer-bookmark--small { background-position-y: -17px; }

.icoViewer-bookmark { display: inline-block; background: url("/sp/assets/img/viewer/ico_bookmark.png") 0 0 no-repeat; background-size: 48px auto; height: 30px; width: 16px; vertical-align: middle; }

.is-bookmarked .icoViewer-bookmark { background-position-y: -30px; }

.m-action { position: relative; top: -16px; width: 62px; height: 62px; z-index: 2; display: inline-block; background: #1AA0E9; border: solid 2px #fff; border-radius: 100%; }

.m-pageComment li { background: #F1F1F1; border-radius: 4px; margin: 0 0 4px; line-height: 1.5; }

.m-pageComment li:last-child { margin-bottom: 0; }

.m-pageComment li a { color: inherit; text-decoration: none; display: block; padding: 10px 12px; }

.m-pageLoading { position: fixed; top: 0; left: 0; z-index: 10000; background: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; }

.m-pageLoading__message { position: absolute; top: 50%; left: 50%; width: 100px; margin: -50px 0 0 -50px; background: #FFF; padding: 20px 0; border-radius: 3px; text-align: center; }

.m-pageLoading__ico { display: inline-block; }

.m-pageLoading__text { margin: 12px 0 0; }

.m-viewerSetting__label { font-size: 10px; font-weight: bold; margin: 14px 0 4px; }

.m-viewerSettingRadio ul { display: -webkit-box; display: -ms-flexbox; display: flex; border: solid 1px #D8D8D8; text-align: center; border-radius: 2px; }

.m-viewerSettingRadio__item { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; border-left: solid 1px #D8D8D8; }

.m-viewerSettingRadio__item:first-child { border-left: none; }

.m-viewerSettingRadio__item label { display: block; padding: 12px 0; font-weight: bold; }

.m-viewerSettingRadio__item input[type=radio] { display: none; }

.m-viewerSettingRadio__item input[type=radio]:checked + label { background: #1AA0E9; color: #FFF; }

.m-viewerSettingTheme ul { border-radius: 2px; }

.m-viewerSettingTheme__item { display: inline-block; width: 64px; margin: 0 8px 0 0; font-size: 0; border: solid 1px #fff; padding: 1px; text-align: center; }

.m-viewerSettingTheme__item--black { color: #eee; }

.m-viewerSettingTheme__item--black label { background: #111; }

.m-viewerSettingTheme__item--sepia label { background: #FFFBE6; }

.m-viewerSettingTheme__item label { position: relative; display: block; padding: 20px 0; font-size: 18px; border: solid 1px #D8D8D8; }

.m-viewerSettingTheme__item label:before { content: ""; position: absolute; top: 0; left: 0; margin: -3px 0 0 -3px; z-index: 2; width: 100%; height: 100%; padding: 2px; border: solid 1px #fff; }

.m-viewerSettingTheme__item input[type=radio] { display: none; }

.m-viewerSettingTheme__item input[type=radio]:checked + label:before { border-color: #1AA0E9; }

.m-viewerOption { display: -webkit-box; display: -ms-flexbox; display: flex; line-height: 1; }

.m-viewerOption__item { color: inherit; text-decoration: none; background: #1AA0E9; color: #FFF; display: block; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; font-size: 11px; margin: 0 0 0 1px; line-height: 30px; font-weight: bold; }

.m-viewerOption__item:first-child { margin-left: 0; }

.m-viewerOption__item i { margin: 0 3px 0 0; font-size: 16px; vertical-align: middle; }

.m-viewerOption__item span { vertical-align: middle; }

.m-balloon { position: fixed; top: 48px; right: 8px; z-index: 9999; background: #1AA0E9; padding: 12px 8px; border-radius: 4px; color: #FFF; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); }

.m-balloon:before { content: ""; position: absolute; top: -12px; right: 9px; border-bottom: solid 12px #1AA0E9; border-left: solid 8px transparent; border-right: solid 8px transparent; }

.m-viewerIndex { background: #FFF; border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; }

.m-viewerIndex li { position: relative; border-bottom: solid 1px #F0F0F0; font-size: 14px; line-height: 1.4; }

.m-viewerIndex li:last-child { border-bottom: none; }

.m-viewerIndex li a { color: inherit; text-decoration: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 10px 24px 10px 8px; }

.m-viewerIndex li a:before { content: ""; background: url("/sp/assets/img/ico_arrow_01.png") 0 0 no-repeat; background-size: auto 100%; width: 5px; height: 9px; position: absolute; top: 50%; right: 8px; margin: -5px 0 0; }

.m-viewerIndex__title { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; }

.m-viewerIndex__pages { padding: 0 0 0 12px; text-align: right; }

.m-viewerPageCommentSlider { margin: -12px 8px 8px; position: relative; overflow: hidden; border-radius: 2px; }

.m-viewerPageCommentSlider a { color: inherit; text-decoration: none; }

.m-viewerPageCommentSlider__label { display: block; position: absolute; top: 0; left: 0; z-index: 11; height: 100%; padding: 8px; background: #e3e3e3; background: #ddd; }

.m-viewerPageCommentSlider__content { background: #EFEFEF; position: relative; overflow: hidden; }

.m-viewerPageCommentSlider__item { padding: 8px 0; float: left; white-space: nowrap; }

.m-viewerPageCommentSlider p { display: inline-block; padding: 0 20px; }

.m-star { position: relative; padding: 16px 0 22px; border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; overflow: hidden; }

.m-star__cover { position: absolute; top: 50%; left: 50%; background: #F76986; opacity: 0.08; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=8)"; width: 60px; height: 60px; margin: -8px 0 0 -30px; box-sizing: border-box; border-radius: 100%; }

.is-pressed .m-star__cover { -webkit-transform: scale(12.5); transform: scale(12.5); }

.m-starBalloon { position: relative; z-index: 90; background: #F0F0F0; padding: 12px 8px; text-align: center; font-weight: bold; max-width: 300px; margin: 0 auto; box-sizing: border-box; }

.m-starBalloon:before { content: ""; position: absolute; bottom: -8px; left: 50%; margin: 0 0 0 -6px; border-top: solid 8px #F0F0F0; border-left: solid 6px transparent; border-right: solid 6px transparent; }

.m-starBalloon__lead { font-size: 12px; }

.m-starBalloon__count { font-size: 16px; color: #F76986; margin: 8px 0 0; }

.m-starCircle { position: relative; z-index: 100; width: 60px; height: 60px; margin: 22px auto 0; }

.m-starCircle__element { position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; border-radius: 100%; }

.m-starCircle__element--outer { background: #F76986; z-index: 1; }

.m-starCircle__element--inner { background: #FFF; -webkit-transform: scale(0.9); transform: scale(0.9); z-index: 2; }

.m-starCircle__element--press { background: #F76986; -webkit-transform: scale(0); transform: scale(0); z-index: 3; }

.is-pressed .m-starCircle__element--press { -webkit-transform: scale(1); transform: scale(1); }

.m-starCircle__icon { position: absolute; top: 50%; left: 50%; z-index: 11; margin: -10px 0 0 -10px; display: inline-block; background: url("/sp/assets/img/viewer/ico_stars.png") 0 0 no-repeat; background-size: 20px auto; height: 20px; width: 20px; vertical-align: middle; -webkit-transform: translate3d(0, 0, 10px); -moz-transform: translate3d(0, 0, 10px); }

.m-starCircle__icon:after { content: '.'; color: transparent; }

.is-pressed .m-starCircle__icon { background-position: 50% -20px; }

.m-starLabel { position: relative; text-align: center; font-size: 16px; color: #F76986; font-weight: bold; margin: 16px 0 0; height: 16px; }

.m-starLabel small { font-size: 10px; }

.m-starLabel__lead { position: absolute; top: 0; left: 0; width: 100%; }

.is-pressed .m-starLabel__lead { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }

.m-starLabel__done { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; position: absolute; top: -6px; left: 0; width: 100%; font-size: 13px; line-height: 1.4; }

.is-pressed .m-starLabel__done { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.m-workPickup { padding: 8px; border: solid 1px #ff9d1e; }

.m-workPickup__label { text-align: center; padding: 6px 0; margin: -8px -8px 8px; background: #FF9D1E; color: #FFF; font-size: 12px; font-weight: bold; }

.m-workData { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; word-break: break-all; }

.m-workData a { color: inherit; text-decoration: none; display: inline-block; }

.m-workData > a { position: relative; display: inherit; width: 100%; }

.m-workData__image { position: relative; max-width: 90px; width: 17%; margin: 0 8px 0 0; }

.m-workData__image--large { max-width: initial; width: 28%; margin-right: 3%; }

.m-workData__image img { border: solid 1px #D2D2D2; width: 100%; }

.m-workData__image a { position: relative; }

.m-workData__imageEdit { display: block; position: absolute; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.2); color: #FFF; padding: 6px 0; width: 100%; text-align: center; font-size: 10px; text-decoration: none; color: #FFF; }

.m-workData__info { position: relative; font-size: 10px; line-height: 1.4; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; }

.m-workData__info > * { margin-top: 5px; }

.m-workData__info > *:first-child { margin-top: 0; }

.m-workData__genre { font-size: 10px; }

.m-workData__genreSub:before { content: " > "; }

.m-workData__series { font-size: 12px; margin-bottom: -2px; padding: 0 24px 0 0; }

.m-workData__title { font-size: 14px; font-weight: bold; line-height: 1.4; margin: 2px 0 6px; padding: 0 24px 0 0; }

.m-workData__label:after { clear: both; content: ""; display: table; }

.m-workData__label .label { margin: 0 8px 0 0; float: left; }

.m-workData__comment { background: #F0F0F0; border-radius: 4px; padding: 6px 8px; margin: 6px 0 0; line-height: 1.4; }

.m-workData__meta { overflow: hidden; color: #9B9B9B; }

.m-workData__meta * { margin-top: 2px; }

.m-workData__meta *:first-child { margin-top: 0; }

.m-workData__meta__left { float: left; margin: 0; }

.m-workData__meta__right { float: right; margin: 0; text-align: right; }

.m-workData__cta { margin: 10px 0 0; }

.m-workData__fav { position: absolute; top: 0; right: 0; z-index: 10; }

.m-workData__fav a { display: block; padding: 10px; margin: -10px; }

.m-workData__bookmark { position: absolute; top: 0; right: 0; z-index: 99; }

.m-workData__bookmark > a { display: block; margin: -8px; padding: 8px 8px 0 24px; }

.m-workData__checkbox { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

.m-workData__counter { background: #EAEAEA; padding: 8px; text-align: left; }

.m-workData__counter:after { clear: both; content: ""; display: table; }

.m-workData__counter p { width: 50%; float: left; }

.m-workList { border-top: solid 1px #F0F0F0; border-bottom: solid 1px #F0F0F0; }

.m-workList__item { padding: 8px; border-top: solid 1px #F0F0F0; }

.m-workList__item:first-child { border-top: none; }

.m-review { background: #F0F0F0; padding: 8px; border-radius: 4px; margin: 8px 0 0; }

.m-review__title { font-size: 10px; font-weight: bold; margin: 0 0 4px; }

.m-review__text { font-size: 12px; line-height: 1.5; }

.m-rationg > .ico { margin: 0 0 0 2px; }

.m-rationg > .ico:first-child { margin-left: 0; }

.m-workCheckbox { position: relative; height: 100%; }

.m-workCheckbox label { display: block; height: 100%; }

.m-workCheckbox label:before { content: ""; background: rgba(255, 255, 255, 0.9); position: absolute; top: 0; right: 0; width: 48px; height: 100%; }

.m-workCheckbox input[type="checkbox"] { position: absolute; top: 50%; right: 16px; z-index: 2; margin: -8px 0 0 0; width: 16px; height: 16px; background: #FFF; border: solid 1px #D2D2D2; border-radius: 100%; vertical-align: middle; }

.m-workCheckbox input[type="checkbox"]:checked { background: url("/sp/assets/img/ico_checkbox_01.png") 50% 50% no-repeat #1AA0E9; background-size: 12px auto; border-color: #1AA0E9; }

.m-status { margin: 0 8px; padding: 8px 0; border-top: solid 1px #F0F0F0; overflow: hidden; }

.m-status__col { float: left; width: 33.333%; padding: 4px 0; font-size: 10px; }

.m-circle { position: relative; }

.m-circle:after { clear: both; content: ""; display: table; }

.m-circle__image { width: 90px; float: left; }

.m-circle__image img { border: solid 1px #d2d2d2; width: 100%; }

.m-circle__info { padding: 0 0 0 96px; line-height: 1.6; font-size: 10px; }

.m-circle__name { font-size: 14px; font-weight: bold; }

.m-circle__action { position: absolute; top: 0; right: 0; z-index: 2; }

.m-circle__comment { font-size: 12px; }

.m-circle__detail { border-top: 1px solid #f0f0f0; margin-top: 4px; padding-top: 4px; }

.m-coverList { overflow: hidden; }

.m-coverList ul { text-align: center; padding: 0 10%; margin: -4px -2px; }

.m-coverList ul li { display: inline-block; width: 25%; margin: 4px 4px; }

.m-coverList ul li a { display: block; }

.m-coverList ul li img { width: 100%; }

.is-font--serif .m-viewer__chapter, .is-font--serif .m-viewer__body { font-family: 'Times New Roman', '游明朝', 'YuMincho', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'ＭＳ Ｐ明朝', 'MS PMincho', serif; }

.is-font--small { font-size: 10px; }

.is-font--medium { font-size: 12px; }

.is-font--large { font-size: 14px; }

.is-font--xlarge { font-size: 16px; }

.is-font-line--small .m-viewer__body { line-height: 1.5; }

.is-font-line--medium .m-viewer__body { line-height: 1.7; }

.is-font-line--large .m-viewer__body { line-height: 2; }

.is-theme--white .m-viewerPager, .is-theme--white .m-viewer__content { background: #fff; color: #222; }

.is-theme--black .m-viewerPager, .is-theme--black .m-viewer__content { background: #111; color: #eee; }

.is-theme--black .m-viewer__page, .is-theme--black .m-viewerPager__btn { border-color: #373737; color: inherit; }

.is-theme--black .m-viewerOption__item { background: #373737; color: #fff; }

.is-theme--black .icoViewer-prev { background-position-x: -40px; }

.is-theme--black .icoViewer-next { background-position-x: -40px; }

.is-theme--black .icoViewer-index { background-position-x: -40px; }

.is-theme--black .icoViewer-stars { background-position-x: -18px; }

.is-theme--black .icoViewer-bookmark { background-position-x: -16px; }

.is-theme--black .m-viewerPageCommentSlider { color: #222; }

.is-theme--sepia .m-viewerPager, .is-theme--sepia .m-viewer__content { background: #FFFBE6; color: #5B412A; }

.is-theme--sepia .m-viewer__page, .is-theme--sepia .m-viewerPager__btn { border-color: #f1e8e0; color: inherit; }

.is-theme--sepia .m-viewerOption__item { background: #5B412A; color: #FFFBE6; }

.is-theme--sepia .icoViewer-prev { background-position-x: -80px; }

.is-theme--sepia .icoViewer-next { background-position-x: -80px; }

.is-theme--sepia .icoViewer-index { background-position-x: -80px; }

.is-theme--sepia .icoViewer-stars { background-position-x: -36px; }

.is-theme--sepia .icoViewer-bookmark { background-position-x: -32px; }

.is-comment--none .m-viewerPageCommentSlider { height: 0; }

.is-fixed { padding-top: 42px; }

.is-fixed .l-header { position: fixed; top: 0; }

.js-menu__switch a { -webkit-tap-highlight-color: transparent; }

.js-menu__switch a:hover { -webkit-tap-highlight-color: transparent; }

.js-tabs__content { height: 0; overflow: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-duration: 0.42s; -moz-transition-duration: 0.42s; -webkit-transition-timing-function: ease-out-cubic; -moz-transition-timing-function: ease-out-cubic; }

.js-tabs__content.is-show { height: auto; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.js-segmented__content { height: 0; overflow: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-duration: 0.42s; -moz-transition-duration: 0.42s; -webkit-transition-timing-function: ease-out-cubic; -moz-transition-timing-function: ease-out-cubic; }

.js-segmented__content.is-show { height: auto; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.is-hidden { display: none !important; }

.theme-yanmaga .pc-header { border-bottom: solid 3px #006ab4; }

.theme-yanmaga .pc-header__logo { background-image: url("/sp/assets/img/theme/yanmaga/logo.png"); background-size: auto 34px; width: 240px; margin: 0 0 0 -120px; }

.theme-yanmaga .l-header { border-bottom: solid 3px #006ab4; }

.theme-yanmaga .l-header__logo { background-image: url("/sp/assets/img/theme/yanmaga/logo.png"); width: 90px; background-size: auto 26px; }

.theme-yanmaga .btn { border-color: #006ab4 !important; }

.theme-yanmaga .btn--primary { background: #006ab4 !important; }

.theme-yanmaga .btn--highlight { color: #006ab4 !important; }

.eyoung-body { max-width: 1000px; padding: 0 8px; margin: 0 auto; }

.eyoung-announce { display: table; border-bottom: solid 1px #006ab4; width: 100%; margin: 12px 0; line-height: 1.4; }

.eyoung-announce a { text-decoration: none; color: inherit; display: block; padding: 10px 0; }

.eyoung-announce__label { display: table-cell; vertical-align: middle; color: #006ab4; font-weight: bold; width: 110px; text-align: center; border: solid 1px #006ab4; border-bottom: none; }

.eyoung-announce__info { display: table-cell; vertical-align: middle; }

.eyoung-announce__info a { padding-left: 8px; }

.eyoung-footer { width: 100%; padding: 8px; }

@media screen and (min-width: 700px) { .eyoung { margin: -10px 0 0; }
  .eyoung-announce { margin: 24px 0 12px; }
  .eyoung-announce__label { width: 21%; }
  .eyoung-announce__info a { padding-left: 16px; }
  .eyoung-footer { background: #FFF; width: 80%; margin: 40px auto 0; padding: 24px; } }

.theme-jbooks .pc-header { border-bottom: solid 3px #DA0B38; }

.theme-jbooks .pc-header__logo { background-image: url("/sp/assets/img/theme/jbooks/logo_pc.png"); background-size: auto 28px; width: 240px; margin: -3px 0 0 -120px; }

.theme-jbooks .l-header { border-bottom: solid 3px #DA0B38; }

.theme-jbooks .l-header__logo { background-image: url("/sp/assets/img/theme/jbooks/logo.png"); background-size: auto 18px; width: 166px; }

.theme-jbooks .btn { border-color: #DA0B38 !important; }

.theme-jbooks .btn--primary { background: #DA0B38 !important; }

.theme-jbooks .btn--highlight { color: #DA0B38 !important; }

.theme-eiji .pc-header { border-bottom: solid 3px #ec6d00; }

.theme-eiji .pc-header__logo { background-image: url("/sp/assets/img/theme/eiji/logo_pc.png"); background-size: auto 21px; width: 280px; margin: 0 0 0 -140px; }

.theme-eiji .l-header { border-bottom: solid 3px #ec6d00; }

.theme-eiji .l-header__logo { background-image: url("/sp/assets/img/theme/eiji/logo.png"); background-size: auto 13px; width: 174px; }

.theme-eiji .btn { border-color: #ec6d00 !important; }

.theme-eiji .btn--primary { background: #ec6d00 !important; }

.theme-eiji .btn--highlight { color: #ec6d00 !important; }

.theme-cococomi .pc-header { border-bottom: solid 3px #ff5629; }

.theme-cococomi .pc-header__logo { background-image: url("/sp/assets/img/theme/cococomi/logo_pc.png"); background-size: auto 36px; width: 320px; margin: 0 0 0 -160px; }

.theme-cococomi .l-header { border-bottom: solid 3px #ff5629; }

.theme-cococomi .l-header__logo { background-image: url("/sp/assets/img/theme/cococomi/logo.png"); width: 100px; background-size: auto 21px; }

.theme-cococomi .btn { border-color: #ff5629 !important; }

.theme-cococomi .btn--primary { background: #ff5629 !important; }

.theme-cococomi .btn--highlight { color: #ff5629 !important; }

.cococomi-body { max-width: 1000px; padding: 0 8px; margin: 0 auto; }

.cococomi-announce { display: table; border-bottom: solid 1px #ff5629; width: 100%; margin: 12px 0; line-height: 1.4; }

.cococomi-announce a { text-decoration: none; color: inherit; display: block; padding: 10px 0; }

.cococomi-announce__label { display: table-cell; vertical-align: middle; color: #ff5629; font-weight: bold; width: 110px; text-align: center; border: solid 1px #ff5629; border-bottom: none; }

.cococomi-announce__info { display: table-cell; vertical-align: middle; }

.cococomi-announce__info a { padding-left: 8px; }

.cococomi-footer { width: 100%; padding: 8px; }

@media screen and (min-width: 700px) { .cococomi { margin: -10px 0 0; }
  .cococomi-announce { margin: 24px 0 12px; }
  .cococomi-announce__label { width: 21%; }
  .cococomi-announce__info a { padding-left: 16px; }
  .cococomi-footer { background: #FFF; width: 80%; margin: 40px auto 0; padding: 24px; } }

.m-cardList { background: #EFEFEF; padding: 8px; }

.m-card { max-width: 480px; margin: 0 auto 8px; border-radius: 2px; background: #fff; box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3); }

.m-card > a { text-decoration: none; color: inherit; }

.m-card__info { padding: 8px; }

.m-card__title { font-weight: bold; font-size: 14px; }

.m-card__text { margin: 4px 0 0; font-size: 12px; line-height: 1.5; }

.m-card__meta { color: #9B9B9B; font-size: 10px; margin: 6px 0 0; }

.m-card__meta:after { clear: both; content: ""; display: table; }

.m-card__genre { float: left; }

.m-card__page { float: right; }

.m-labelListing { background: #F8F8F8; padding: 4px; margin: 0 -8px; }

.m-labelListing:after { clear: both; content: ""; display: table; }

.m-labelListing__item { float: left; width: 50%; padding: 4px; }

.m-labelListing__item:nth-child(2n + 1) { clear: both; }

@media screen and (min-width: 700px) { .m-labelListing { padding: 0; margin: -8px; }
  .m-labelListing__item { padding: 8px; } }

.m-labelCard { position: relative; background: #FFF; height: 100%; }

.m-labelCard > a { text-decoration: none; color: inherit; display: block; padding: 2px 2px 0; }

.m-labelCard__image { position: relative; }

.m-labelCard__image img { width: 100%; }

.m-labelCard__accent { background: #7fc33b; color: #FFF; padding: 5px 6px 4px; margin: -4px -4px 0; font-size: 10px; font-weight: bold; }

.m-labelCard__info { padding: 4px; }

.m-labelCard__title { font-weight: bold; font-size: 13px; line-height: 1.3; padding: 6px 0 6px; }

.m-labelCard__meta { font-size: 9px; border-top: solid 1px #efefef; padding: 4px 0 2px; line-height: 1.4; }

@media screen and (min-width: 700px) { .m-labelCard { display: table; width: 100%; }
  .m-labelCard__image { width: 42%; display: table-cell; }
  .m-labelCard__accent { margin: 0 0 14px; padding: 6px; font-size: 11px; }
  .m-labelCard__info { display: table-cell; vertical-align: middle; padding: 8px 16px; width: 58%; }
  .m-labelCard__title { font-size: 15px; padding: 0 0 14px; }
  .m-labelCard__meta { font-size: 11px; padding: 10px 0 0; margin: 0; }
  .m-labelCard__meta > * { margin: 6px 0 0; } }

.theme-gray { background: #eee; }

.l-review_cp { max-width: 280px; display: inline-block; text-align: left; }

.u-center { text-align: center; }

.u-link { color: #1AA0E9 !important; text-decoration: underline !important; }

/* ******************************************* border関連 */
.u-border--none { border-top: none !important; border-bottom: none !important; }

.u-border--noneTop { border-top: none !important; }

.u-border--noneBottom { border-bottom: none !important; }

.u-frame { border: solid 1px #D2D2D2; }

/* ******************************************* margin関連 */
.u-m { margin-top: 8px !important; margin-bottom: 8px !important; }

.u-m--none { margin-top: 0 !important; margin-bottom: 0 !important; }

.u-m--xsmall { margin-top: 2px !important; margin-bottom: 2px !important; }

.u-m--small { margin-top: 4px !important; margin-bottom: 4px !important; }

.u-m--large { margin-top: 16px !important; margin-bottom: 16px !important; }

.u-m--xlarge { margin-top: 24px !important; margin-bottom: 24px !important; }

.u-mt { margin-top: 8px !important; }

.u-mt--none { margin-top: 0 !important; }

.u-mt--xsmall { margin-top: 2px !important; }

.u-mt--small { margin-top: 4px !important; }

.u-mt--large { margin-top: 16px !important; }

.u-mt--xlarge { margin-top: 24px !important; }

.u-mb { margin-bottom: 8px !important; }

.u-mb--none { margin-bottom: 0 !important; }

.u-mb--xsmall { margin-bottom: 2px !important; }

.u-mb--small { margin-bottom: 4px !important; }

.u-mb--large { margin-bottom: 16px !important; }

.u-mb--xlarge { margin-bottom: 24px !important; }

.u-ml { margin-left: 8px !important; }

.u-ml--xsmall { margin-left: 2px !important; }

.u-ml--small { margin-left: 4px !important; }

.u-mr { margin-right: 8px !important; }

.u-mr--xsmall { margin-right: 2px !important; }

.u-mr--small { margin-right: 4px !important; }

/* ******************************************* padding関連 */
.u-p { padding-top: 8px !important; padding-bottom: 8px !important; }

.u-p--none { padding-top: 0 !important; padding-bottom: 0 !important; }

.u-p--xsmall { padding-top: 2px !important; padding-bottom: 2px !important; }

.u-p--small { padding-top: 4px !important; padding-bottom: 4px !important; }

.u-p--large { padding-top: 16px !important; padding-bottom: 16px !important; }

.u-p--xlarge { padding-top: 24px !important; padding-bottom: 24px !important; }

.u-pt { padding-top: 8px !important; }

.u-pt--none { padding-top: 0 !important; }

.u-pt--xsmall { padding-top: 2px !important; }

.u-pt--small { padding-top: 4px !important; }

.u-pt--large { padding-top: 16px !important; }

.u-pt--xlarge { padding-top: 24px !important; }

.u-pb { padding-bottom: 8px !important; }

.u-pb--none { padding-bottom: 0 !important; }

.u-pb--xsmall { padding-bottom: 2px !important; }

.u-pb--small { padding-bottom: 4px !important; }

.u-pb--large { padding-bottom: 16px !important; }

.u-pb--xlarge { padding-bottom: 24px !important; }

.u-pl { padding-left: 8px !important; }

.u-pl--xsmall { padding-left: 2px !important; }

.u-pl--small { padding-left: 4px !important; }

.u-pr { padding-right: 8px !important; }

.u-pr--xsmall { padding-right: 2px !important; }

.u-pr--small { padding-right: 4px !important; }

/* ******************************************* height/width関連 */
.u-w5 { width: 5% !important; }

.u-h5 { height: 5% !important; }

.u-w10 { width: 10% !important; }

.u-h10 { height: 10% !important; }

.u-w15 { width: 15% !important; }

.u-h15 { height: 15% !important; }

.u-w20 { width: 20% !important; }

.u-h20 { height: 20% !important; }

.u-w25 { width: 25% !important; }

.u-h25 { height: 25% !important; }

.u-w30 { width: 30% !important; }

.u-h30 { height: 30% !important; }

.u-w35 { width: 35% !important; }

.u-h35 { height: 35% !important; }

.u-w40 { width: 40% !important; }

.u-h40 { height: 40% !important; }

.u-w45 { width: 45% !important; }

.u-h45 { height: 45% !important; }

.u-w50 { width: 50% !important; }

.u-h50 { height: 50% !important; }

.u-w55 { width: 55% !important; }

.u-h55 { height: 55% !important; }

.u-w60 { width: 60% !important; }

.u-h60 { height: 60% !important; }

.u-w65 { width: 65% !important; }

.u-h65 { height: 65% !important; }

.u-w70 { width: 70% !important; }

.u-h70 { height: 70% !important; }

.u-w75 { width: 75% !important; }

.u-h75 { height: 75% !important; }

.u-w80 { width: 80% !important; }

.u-h80 { height: 80% !important; }

.u-w85 { width: 85% !important; }

.u-h85 { height: 85% !important; }

.u-w90 { width: 90% !important; }

.u-h90 { height: 90% !important; }

.u-w95 { width: 95% !important; }

.u-h95 { height: 95% !important; }

.u-w100 { width: 100% !important; }

.u-h100 { height: 100% !important; }

/* ******************************************* color関連 */
.u-color--blue { color: #1AA0E9; }

.u-color--red { color: #D0021B; }

.u-color--pink { color: #F8697A; }

.u-color--green { color: #7DC52E; }

.u-color--yellow { color: #F2B229; }

.u-color--beige { color: #CBA75D; }
