@charset "UTF-8";
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/** 1. Set default font family to sans-serif. 2. Prevent iOS and IE text size adjust after device orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */
audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

/* Links ========================================================================== */
/** Remove the gray background color from active links in IE 10. */
a { background-color: transparent; }

/** Improve readability of focused elements when they are also in an active/hover state. */
a:active, a:hover { outline: 0; }

/* Text-level semantics ========================================================================== */
/** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari and Chrome. */
dfn { font-style: italic; }

/** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome. */
h1 { font-size: 2em; margin: 0.67em 0; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9/10. */
img { border: 0; }

/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }

/* Grouping content ========================================================================== */
/** Address margin not present in IE 8/9 and Safari. */
figure { margin: 1em 40px; }

/** Address differences between Firefox and other browsers. */
hr { box-sizing: content-box; height: 0; }

/** Contain overflow in all browsers. */
pre { overflow: auto; }

/** Address odd `em`-unit font size rendering in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
input { line-height: normal; }

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width. 1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome. */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ box-sizing: content-box; /* 2 */ }

/** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** Remove default vertical scrollbar in IE 8/9/10/11. */
textarea { overflow: auto; }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

/* Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */
/* What follows is the result of much research on cross-browser styling. Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, Kroc Camen, and the H5BP dev community and team. */
/* ========================================================================== Base styles: opinionated defaults ========================================================================== */
html { color: #222; font-size: 1em; line-height: 1.4; }

/* Remove text-shadow in selection highlight: https://twitter.com/miketaylr/status/12228805301 These selection rule sets have to be separate. Customize the background color to match your design. */
::-moz-selection { background: #b3d4fc; text-shadow: none; }

::selection { background: #b3d4fc; text-shadow: none; }

/* A better looking default horizontal rule */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

/* Remove the gap between audio, canvas, iframes, images, videos and the bottom of their containers: https://github.com/h5bp/html5-boilerplate/issues/440 */
audio, canvas, iframe, img, svg, video { vertical-align: middle; }

/* Remove default fieldset styles. */
fieldset { border: 0; margin: 0; padding: 0; }

/* Allow only vertical resizing of textareas. */
textarea { resize: vertical; }

/* ========================================================================== Browser Upgrade Prompt ========================================================================== */
.browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

/* ========================================================================== Author's custom styles ========================================================================== */
ul, li { list-style: none; margin: 0; padding: 0; }

/* ========================================================================== Helper classes ========================================================================== */
/* Hide visually and from screen readers */
.hidden { display: none !important; }

/* Hide only visually, but have it available for screen readers: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: https://www.drupal.org/node/897638 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screen readers, but maintain layout */
.invisible { visibility: hidden; }

/* Clearfix: contain floats For modern browsers 1. The space content is one way to avoid an Opera bug when the `contenteditable` attribute is included anywhere else in the document. Otherwise it causes space to appear at the top and bottom of elements that receive the `clearfix` class. 2. The use of `table` rather than `block` is only necessary if using `:before` to contain the top-margins of child elements. */
.clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ }

.clearfix:after { clear: both; }

/* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */
@media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ }

@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ }

/* ========================================================================== Print styles. Inlined to avoid the additional HTTP request: http://www.phpied.com/delay-loading-your-print-css/ ========================================================================== */
@media print { *, *:before, *:after, *:first-letter, *:first-line { background: transparent !important; color: #000 !important; /* Black prints faster: http://www.sanbeiji.com/archives/953 */ box-shadow: none !important; text-shadow: none !important; }
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  /* Don't show links that are fragment identifiers, or use the `javascript:` pseudo protocol */
  a[href^="#"]:after, a[href^="javascript:"]:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  /* Printing Tables: http://css-discuss.incutio.com/wiki/Printing_Tables */
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; } }

/*Setup Break Points*/
/* Colors */
/* @mixin trans-line($color){

} */
@font-face { font-family: 'Marianina-Bold'; src: url("../font/MarianinaWdFY-Bold_M.eot"); src: url("../font/MarianinaWdFY-Bold_M.eot?#iefix") format("embedded-opentype"), url("../font/MarianinaWdFY-Bold_M.woff") format("woff"), url("../font/MarianinaWdFY-Bold_M.ttf") format("truetype"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'Marianina-Black'; src: url("../font/MarianinaWdFY-Black_M.eot"); src: url("../font/MarianinaWdFY-Black_M.eot?#iefix") format("embedded-opentype"), url("../font/MarianinaWdFY-Black_M.woff") format("woff"), url("../font/MarianinaWdFY-Black_M.ttf") format("truetype"); font-weight: normal; font-style: normal; }

.icon { display: inline-block; width: 1em; height: 1em; stroke-width: 0; stroke: currentColor; fill: currentColor; }

@media screen and (max-width: 48em) { #commonFooter { width: 100%; position: static; }
  .thanks #commonFooter { position: absolute; height: auto; left: 0; bottom: 0; }
  #commonFooterInner { padding: 5px 0; width: 100%; background-color: #282828; text-align: center; letter-spacing: -.40em; }
  #commonFooter li { display: inline-block !important; float: none; line-height: 0; } }

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-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); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-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; }

/* Slider */
.slick-loading .slick-list { background: #fff url("../img/ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face { font-family: "slick"; src: url("../font/slick.eot"); src: url("../font/slick.eot?#iefix") format("embedded-opentype"), url("../font/slick.woff") format("woff"), url("../font/slick.ttf") format("truetype"), url("../font/slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; }

/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 0; border: none; outline: none; z-index: 100; }

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: 10px; }

[dir="rtl"] .slick-prev { left: auto; right: 10px; }

.slick-prev:before { content: "←"; }

[dir="rtl"] .slick-prev:before { content: "→"; }

.slick-next { right: 10px; }

[dir="rtl"] .slick-next { left: 10px; right: auto; }

.slick-next:before { content: "→"; }

[dir="rtl"] .slick-next:before { content: "←"; }

/* Dots */
.slick-dots { position: absolute; bottom: -25px; list-style: none; display: block; text-align: center; padding: 0; margin: 0; width: 100%; }

.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }

.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }

.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }

.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }

.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-dots li.slick-active button:before { color: black; opacity: 0.75; }

/* ------------------------------------------------------------*/
/* Initialize*/
/* ------------------------------------------------------------*/
/*a	{ font-weight: bold; text-decoration:underline; }*/
a:link { color: #0277BD; text-decoration: underline; }

a:visited { color: #0277BD; }

a:hover { color: #EC407A; text-decoration: underline; }

/* a:active, a:focus {outline:none;}*/
.nobr { white-space: nowrap; }

strong { font-weight: bold; }

html { box-sizing: border-box; }

h1, h2, h3, h4, h5 { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W6", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-weight: bold; }

html body { background: #f2f2f2; font: 16px/1.5 "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", 'メイリオ', Meiryo, "ＭＳＰゴシック", sans-serif; /*font: 13px/1.5 Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;*/ /*font: 13px/1.5 "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;*/ color: #090909; -webkit-text-size-adjust: 100%; }

@media (max-width: 62em) { html body { font-size: 1.8vw; } }

@media (max-width: 30em) { html body { font-size: 3.6vw; } }

html body.no-scroll { overflow: hidden; }

/* ------------------------------------------------------------*/
/* Layout*/
/* ------------------------------------------------------------*/
.container { min-width: 1100px; overflow: hidden; }

.content { width: 1100px; margin: auto; }

.content::after { clear: both; content: ""; display: block; }

.content .content-wrapper { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); width: 1140px; margin: 0 -20px; }

.sidebar { width: calc(100% - 40px); float: left; margin-left: 20px; }

.sidebar .widget-list { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); }

.main { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); }

.home .item-list { width: calc(100% - 40px); float: left; margin-left: 20px; }

.home .item { width: calc(25% - 25px); float: left; margin-left: 20px; }

.entry .present_pane { width: calc(83.3333333333% - 36.6666666667px); float: left; margin-left: 20px; margin-left: calc(8.3333333333% - 21.6666666667px + 40px); }

.entry .present_pane .present-photo { width: calc(58.3333333333%); float: left; margin-left: 0px; }

.entry .present_pane .present-text { width: calc(41.6666666667%); float: left; margin-left: 0px; }

@media (max-width: 62em) { .container { min-width: auto; }
  .content { width: auto; }
  .content .content-wrapper { width: calc(100% - 40px); float: left; margin-left: 20px; width: 100%; margin: 0; }
  .home .item-list { width: calc(100% - 40px); float: left; margin-left: 20px; }
  .home .item { width: calc(33.3333333333% - 26.6666666667px); float: left; margin-left: 20px; }
  .entry .main { width: calc(100% - 40px); float: left; margin-left: 20px; }
  .entry .present_pane { margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); } }

@media (max-width: 30em) { .sidebar { margin-left: -10px; margin-right: -10px; width: calc(100% + 20px); }
  .home .main { margin-left: -10px; margin-right: -10px; width: calc(100% + 20px); }
  .home .item-list { width: calc(100% - 20px); float: left; margin-left: 10px; }
  .home .item { width: calc(50% - 15px); float: left; margin-left: 10px; }
  .entry .present_pane .present-photo { width: calc(100%); float: left; margin-left: 0px; }
  .entry .present_pane .present-text { width: calc(100% - 20px); float: left; margin-left: 10px; } }

/* ------------------------------------------------------------*/
/* Elements*/
/* ------------------------------------------------------------*/
.headbar { background: #fff url(../img/jwave.svg) no-repeat center center; background-size: 120px 20px; background-position: right 20px center; position: relative; height: 60px; overflow: hidden; }

.headbar .logo_wowtokyo { position: relative; width: 100px; height: 52px; fill: #20A8E2; z-index: 1; }

.headbar .headbar-logo { display: inline-block; width: 100px; position: relative; z-index: 1; }

.headbar .headbar-logo img { width: 100%; height: auto; }

@media (max-width: 62em) { .headbar { background-image: none; height: 40px; }
  .headbar .headbar-logo { width: 64px; }
  .headbar .logo_wowtokyo { width: 64px; height: 33px; } }

@media (max-width: 30em) { .headbar { background-image: none; height: 55px; } }

.header { position: relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.header.top-header { background: url(../img/bg_top_head.jpg), #20A8E2; background-size: cover; background-position: center 85%; background-repeat: no-repeat; width: 100%; height: 100%; padding-top: 320px; text-align: center; }

.header.top-header .wrapper { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.header.top-header .sitetitle { width: 106px; margin: auto; overflow: hidden; }
.header.top-header .sitetitle img { width: 100%; height: auto; }
.header.top-header .sitecatch { width: 415px; margin: auto; overflow: hidden; padding-top:10px;}
.header.top-header .sitecatch img { width: 100%; height: auto; }

.header.top-header h2.pagetitle { position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #f2f2f2; display: inline-block; margin: 0; padding: 0.5em 1em 0.3em; font-size: 1.4em; color: #20A8E2; white-space: nowrap; }

.header.top-header .copytext { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W6", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-weight: bold; color: #fff; margin: 10px 0 0; }

.header.top-header .btn_entry { background: #0277BD; display: inline-block; padding: 0.8em 2em; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W6", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-size: 0.9em; font-weight: bold; color: #fff; text-decoration: none; transition: background-color 0.3s linear; }

.header.top-header .btn_entry:hover { background-color: #0267a4; transition: background-color 0s linear; }

@media (max-width: 62em) { .header.top-header { padding-top: 33.33%; }
  .header.top-header .sitetitle { width: 10.6vw; }
  .header.top-header .sitecatch { width: 31.6vw; }
  .header.top-header .copytext { white-space: nowrap; } }

@media (max-width: 30em) { .header.top-header { padding-top: 61.8%; }
  .header.top-header .sitetitle { width: 21vw; }
  .header.top-header .sitecatch { width: 46vw; }
  .header.top-header .pagetitle { font-size: 4vw; }
  .header.top-header .copytext { white-space: nowrap; } }

.footer { background: #fff; position: relative; height: 120px; overflow: hidden; text-align: center; }

.footer .btn_home { position: absolute; left: 30px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

.footer .btn_home img { display: block; margin-bottom: 1px; }

.footer .copyright { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.footer .copyright .logo_jwave { fill: #090909; width: 220px; height: 40px; }

.footer .copyright small { display: block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font: 0.64em/2em 'Montserrat', Helvetica, Arial, sans-serif; color: #090909; white-space: nowrap; }

.footer .btn_pagetop { background: url(../img/btn_arrow-up.svg); position: absolute; right: 35px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50%; width: 50px; height: 0; padding-top: 50px; opacity: 0.35; overflow: hidden; }

.footer .btn_pagetop:hover { opacity: 0.5; }

@media (max-width: 30em) { .footer { height: 60px; }
  .footer:before { width: 200px; height: 75%; }
  .footer .copyright .logo_jwave { width: 160px; height: 25px; }
  .footer .btn_home { left: 10px; }
  .footer .btn_pagetop { width: 40px; padding-top: 40px; right: 10px; } }

.sidebar { position: relative; padding: 20px 0; }

.sidebar:after { clear: both; content: ""; display: block; }

.sidebar .widget { height: 100px; display: flex; }

.sidebar .widget.widget_3-2 { width: calc(66.6666666667% - 33.3333333333px); float: left; margin-left: 20px; }

.sidebar .widget.widget_3-1 { width: calc(33.3333333333% - 26.6666666667px); float: left; margin-left: 20px; }

.sidebar .widget.widget_4-3 { width: calc(75% - 35px); float: left; margin-left: 20px; }

.sidebar .widget.widget_4-1 { width: calc(25% - 25px); float: left; margin-left: 20px; }

.sidebar .widget.widget_2-1 { width: calc(50% - 30px); float: left; margin-left: 20px; }

.sidebar .sb_listeners { background: #20A8E2; }

.sidebar .sb_listeners a { color: #fff; text-decoration: none; }

.sidebar .listeners-index { position: relative; display: block; flex: 1 1 100%; text-align: center; transition: background-color 0.3s linear; }

.sidebar .listeners-index:hover { background-color: #1b98ce; transition: background-color 0s linear; }

.sidebar .listeners-index img { width: 50%; height: 60%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.sidebar .listeners-entry { background: #0277BD; display: block; flex: 1 1 100%; height: 100%; text-align: center; line-height: 100px; font-size: 1.35em; letter-spacing: 0.05em; transition: background-color 0.3s linear; }

.sidebar .listeners-entry:hover { background-color: #0267a4; transition: background-color 0s linear; }

.sidebar .sb_backnumber a { background: #ccc url(../img/wowtokyo_g1.svg) no-repeat center top; background-size: 80% 80%; position: relative; transition: background-color 0.3s linear; display: block; flex: 1 1 100%; position: relative; height: 100%; text-align: center; }

.sidebar .sb_backnumber a:hover { background-color: #bfbfbf; transition: background-color 0s linear; }

.sidebar .sb_backnumber a:nth-child(even) { background-color: #d9d9d9; transition: background-color 0.3s linear; }

.sidebar .sb_backnumber a:nth-child(even):hover { background-color: #cccccc; transition: background-color 0s linear; }

.sidebar .sb_backnumber a .textbox { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.25em; text-decoration: none; color: #090909; }

.sidebar .sb_backnumber a .wowtokyo { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 50%; height: 50%; }

.sidebar .sb_backnumber .issue { -webkit-transform: translate(-50%, -50%) scale(0.4); transform: translate(-50%, -50%) scale(0.4); background: #090909; color: #fff; }

.sidebar .sb_banners a { display: block; margin-bottom: 20px; line-height: 0; }

.sidebar .sb_banners a:last-child { margin-bottom: 0; }

.sidebar .sb_banners img { width: 100%; height: auto; }

@media (max-width: 62em) { .sidebar .widget { height: 10vw; }
  .sidebar .listeners-entry { height: 10vw; line-height: 10vw; }
  .sidebar .sb_backnumber .issue { width: 17vw; height: 17vw; } }

@media (max-width: 30em) { .sidebar .widget { flex-direction: row; height: 20vw; }
  .sidebar .widget.widget_3-2, .sidebar .widget.widget_3-1, .sidebar .widget.widget_4-3, .sidebar .widget.widget_4-1, .sidebar .widget.widget_2-1 { width: calc(100% - 40px); float: left; margin-left: 20px; }
  .sidebar .listeners-entry { height: 20vw; line-height: 20vw; }
  .sidebar .sb_backnumber a .textbox { font-size: 1em; }
  .sidebar .sb_backnumber .issue { width: 34vw; height: 34vw; } }

.content { padding: 40px 0; }

@media (max-width: 62em) { .content { padding: 20px 0 0; } }

@media (max-width: 30em) { .content { padding: 10px 0 10px; } }

.present_pane { background: #fff; position: relative; margin-bottom: 40px; }

.present_pane:after { clear: both; content: ""; display: block; }

.present_pane .present-text h3 { margin: 20px; padding: 5px 0; border-bottom: 3px solid #090909; font-weight: bold; clear: both; font-size: 1.14em; }

.present_pane .present-text p { margin: 20px; }

.present_pane .present-photo { border-right: 1px solid #d9d9d9; margin-right: -1px; }

.present_pane .present-photo img { display: block; width: 100%; height: auto; }

@media (max-width: 30em) { .present_pane .present-text h3 { margin: 10px; }
  .present_pane .present-text p { margin: 10px 10px 20px; }
  .present_pane .present-photo { border-right: none; margin-right: 0; } }

.sort-navi-wrapper { background: #fff; position: relative; height: 80px; overflow-x: auto; overflow-y: hidden; text-align: center; letter-spacing: -.4em; }

.sort-navi { background: #f00; background: #fff; position: relative; display: inline-block; white-space: nowrap; text-align: center; height: 80px; letter-spacing: -.4em; }

.sort-navi .types-list, .sort-navi .tags-list, .sort-navi .btnbox { display: inline-block; height: 100%; text-align: left; letter-spacing: normal; font: 0.6em/1.2 'Montserrat', Helvetica, Arial, sans-serif; }

.sort-navi .types-list h4, .sort-navi .tags-list h4, .sort-navi .btnbox h4 { display: inline-block; float: left; box-sizing: border-box; border-right: 1px solid #ccc; width: 70px; height: calc(100% - 10px); margin: 5px; padding: 5px 5px 0 0; text-align: right; font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-weight: normal; color: #ccc; white-space: normal; }

.sort-navi .types-list ul, .sort-navi .tags-list ul, .sort-navi .btnbox ul { float: left; height: 100%; }

.sort-navi .types-list li, .sort-navi .tags-list li, .sort-navi .btnbox li { float: left; height: 100%; }

.sort-navi .types-list a, .sort-navi .tags-list a, .sort-navi .btnbox a { background: #ccc; position: relative; display: block; box-sizing: border-box; width: 80px; height: 100%; padding: 10px; text-decoration: none; color: #090909; white-space: normal; }

.sort-navi .types-list a.active, .sort-navi .tags-list a.active, .sort-navi .btnbox a.active { background: #bfbfbf; }

.sort-navi .types-list a.active .icon, .sort-navi .tags-list a.active .icon, .sort-navi .btnbox a.active .icon { display: block; }

.sort-navi .types-list a .icon, .sort-navi .tags-list a .icon, .sort-navi .btnbox a .icon { display: none; position: absolute; right: 5px; bottom: 5px; fill: #fff; width: 20%; height: 20%; }

.sort-navi .types-list.btnbox a, .sort-navi .tags-list.btnbox a, .sort-navi .btnbox.btnbox a { float: left; }

.sort-navi .types-list.types-list li:not(:last-child), .sort-navi .tags-list.types-list li:not(:last-child), .sort-navi .btnbox.types-list li:not(:last-child) { border-right: 1px solid #fff; }

@media (max-width: 62em) { .sort-navi .types-list, .sort-navi .tags-list, .sort-navi .btnbox { vertical-align: bottom; } }

.item-list .item { position: relative; height: 100%; padding-top: 280px; margin-bottom: 20px; }

.item-list .item a { background: #fff; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-decoration: none; color: #090909; transition: background-color 0.3s linear; }

.item-list .item a:hover { background: #e6e5e5; transition: background-color 0s linear; }

.item-list .item .photobox { background: url(../img/defo-img.png), #ccc; background-size: 120px 120px; background-position: center center; background-repeat: no-repeat; width: 100%; height: 0; padding-top: 56.25%; }

.item-list .item .textbox { position: relative; min-height: 70px; padding: 10px 10px 10px 10px; }

.item-list .item .textbox h3 { position: relative; margin: 0; padding: 0; font-size: 1em; line-height: 1.2; }

.item-list .item .textbox .item-appeal { font-size: .8em; margin: 7px 0 0; color: #505050; line-height: 1.4;}

.item-list .item .textbox .item-data { margin: 0; color: #808080; }

.item-list .item .textbox .item-data .item-pref { font-size: 0.8em; font-weight: bold; }

.item-list .item .textbox .item-data .item-type { font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 0.8em; }

.item-list .item .textbox .item-tag { position: absolute; top: 0; right: 0; }

.item-list .item .textbox .item-tag li { background: #090909; display: block; width: 12px; height: 0; margin: 0; padding-top: 12px; overflow: hidden; float: left; font-size: 0; }

.item-list .item .type { position: absolute; left: 10px; bottom: 8px; font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 0.75em; color: #0277BD; }

.item-list .item.entry-link a { background: #090909; color: #fff; }

.item-list .item.entry-link a:hover { background: #2f2f2f; transition: background-color 0s linear; }

.item-list .item.entry-link .textbox:before { background: url(../img/wowtokyo-w.svg) no-repeat; opacity: 0.25; }

.item-list .item.entry-link .entry-footer { color: #fff; opacity: 0.25; }

.item-list .item.entry-link .entry-footer .icon { width: 30px; height: 30px; fill: #fff; }

@media (max-width: 62em) { .item-list .item { padding-top: 32vw; margin-bottom: 20px; }
  .item-list .item .textbox { min-height: auto; padding: 10px 10px 10px; }
  .item-list .item .textbox .item-tag li { width: 10px; padding-top: 10px; }
  .item-list .item .type { position: absolute; left: 10px; bottom: 8px; } }

@media (max-width: 30em) { .item-list .item { padding-top: 60vw; margin-bottom: 10px; }
  .item-list .item .photobox { padding-top: 54%; }
  .item-list .item .textbox { min-height: auto; } }

#modal { display: none; }

.modal-back { background: #000; position: fixed; left: 0; top: 0; height: 100%; width: 100%; opacity: 0.9; filter: alpha(opacity=90); -moz-opacity: 0.90; z-index: 999; }

.item-detail { background: #fff; position: fixed; left: 50%; top: 0; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 640px; height: 90%; overflow-y: scroll; z-index: 1000; padding-bottom: 15px; }

.item-detail .detail-header { display: flex; }

.item-detail .photo-slider { background: url(../img/gradient-j.svg), #ccc; background-size: 180px 180px; background-position: center center; background-repeat: no-repeat; width: 420px; }

.item-detail .photo-slider .photobox { width: 100%; height: 100%; padding-top: 0; }

.item-detail .photo-slider .photobox:before { content: ""; display: block; padding-top: 280px; }

.item-detail .slick-dots { position: absolute; bottom: 0; }

.item-detail .detail-aside { background: url(../img/gradient-j_k.svg); background-size: 160px 160px; background-position: right -24px bottom -24px; background-repeat: no-repeat; position: relative; width: 220px; }

.item-detail .detail-aside .detail-logo { padding: 0 30px; }

.item-detail .detail-aside .logo { display: block; width: 160px; height: 50px; margin: 30px auto 1em; }

.item-detail .detail-aside .item-data { margin: 0; padding: 0; line-height: 1em; text-align: center; }

.item-detail .detail-aside .item-data .item-pref { font-size: 0.8em; font-weight: bold; }

.item-detail .detail-aside .item-data .item-type { font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 0.8em; }

.item-detail .detail-aside .detail-pp { position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; }

.item-detail .detail-aside .detail-pp h4 { border: 1px solid #808080; display: inline-block; margin: 2em; padding: 1px 0.5em 0; font: 0.6em/1.2 'Montserrat', Helvetica, Arial, sans-serif; color: #808080; }

.item-detail .detail-aside .detail-pp li { background: #f00; padding: 1em; font: 0.6em/1.2 'Montserrat', Helvetica, Arial, sans-serif; }

.item-detail .detail-aside .detail-pp li:nth-child(even) { background: #ff0; }

.item-detail .detail-body { padding: 0; font-size: 0.9em; }

.item-detail .detail-opt { position: relative; margin: 15px 0; font-size: 0.9em; overflow: hidden; }

.item-detail .detail-opt:last-of-type { margin-bottom: 300px; }

.item-detail .detail-opt .wrapper { background: rgba(245, 245, 245, 0.65); padding: 1em 0; }

.item-detail .detail-opt dl { background: rgba(245, 245, 245, 0.65); padding: 1em 0; }

.item-detail .detail-opt .icon { position: absolute; top: -4px; left: -8px; display: block; width: 36px; height: 36px; z-index: 0; }

.item-detail dl { margin: 0; padding: 30px 0 15px; }

.item-detail dt { position: relative; border-bottom: 1px solid #090909; margin: 1em 30px 0; padding: 0; font-size: 0.8em; font-weight: bold; z-index: 1; }

.item-detail dt:first-child { margin: 0 30px 0; }

.item-detail dt .tag { display: inline-block; padding: 2px 5px 0; margin-right: 5px; color: #090909; font-size: 0.9em; vertical-align: bottom; }

.item-detail dd { margin: 0.5em 30px 0; padding: 0; }

.item-detail dd.name { font-size: 1.25em; }

.item-detail .btn_close { position: relative; display: block; width: 30px; height: 30px; z-index: 1001; }

.item-detail .btn_close .icon { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 36%; height: 36%; fill: #808080; }

.item-detail .detail-header .btn_close { position: fixed; right: 0; top: 0; }

.item-detail .detail-footer { display: none; height: 40px; margin-top: -20px; }

.item-detail .detail-footer .btn_close { margin: 0 auto 0; width: 40px; height: 40px; }

@media (max-width: 30em) { .item-detail { width: 100%; height: 100%; }
  .item-detail .detail-header { flex-direction: column; }
  .item-detail .photo-slider { width: 100%; }
  .item-detail .photo-slider .photobox:before { padding-top: 61.8%; }
  .item-detail .detail-aside { background-size: 150px 150px; display: flex; flex-direction: column; width: 100%; height: auto; }
  .item-detail .detail-aside .detail-logo { position: relative; width: 100%; padding: 0; display: flex; }
  .item-detail .detail-aside .detail-logo .logo { box-sizing: border-box; width: 50%; height: auto; margin: 0; padding: 20px; }
  .item-detail .detail-aside .detail-logo .logo img { display: block; }
  .item-detail .detail-aside .detail-logo .item-data { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .item-detail .detail-aside .detail-pp { position: relative; width: 100%; height: auto; bottom: auto; }
  .item-detail .detail-aside .detail-pp h4 { display: none; }
  .item-detail .detail-aside .detail-pp ul { display: flex; }
  .item-detail .detail-aside .detail-pp ul li { flex: 1 1 100%; }
  .item-detail .detail-body { font-size: 1.1em; }
  .item-detail .detail-opt { margin: 20px 0; font-size: 1.1em; }
  .item-detail dl { padding: 20px 0 0; }
  .item-detail dt { margin: 1em 20px 0; }
  .item-detail dt:first-child { margin: 0 20px 0; }
  .item-detail dd { margin: 0.5em 20px 0; }
  .item-detail .detail-header .btn_close { background: rgba(0, 0, 0, 0.25); }
  .item-detail .detail-header .btn_close .icon { fill: #fff; }
  .item-detail .detail-footer { display: block; }
  .item-detail .detail-footer .btn_close { float: right; width: 40px; height: 40px; }
  .item-detail .detail-footer .btn_close .icon { fill: #808080; } }

/*////////////////////     MESSAGE     ////////////////////*/
#formarea hr { height: 1px; background-color: #090909; border: none; }

#formarea .formbox { width: 680px; margin: auto; padding: 0 0 20px; }

#formarea .formbox:after { clear: both; content: ""; display: block; }

#formarea .formbox strong { font-weight: normal; }

#formarea .formbox h3 { margin: 0 0 30px; padding: 5px 0; border-bottom: 3px solid #090909; font-weight: bold; clear: both; font-size: 1.14em; }

#formarea label, #formarea input { margin-bottom: 10px; }

#formarea label { display: block; float: left; width: 160px; margin: 0 20px 10px 0; padding: 4px 0; /*text-align: right;*/ font-size: 0.875em; }

#formarea label.radio-label { background: #d9d9d9; border-radius: 0.5em; display: inline; float: none; width: auto; margin: auto; padding: 0.6em; }

#formarea select option { font-size: 1.14em; }

#formarea input[type=text], #formarea textarea, #formarea .radioset { display: block; float: left; width: 500px; margin: 0 0 10px; overflow: hidden; height: 100%; }

#formarea .radioset { padding-bottom: 10px; }

#formarea .radioset label { margin-right: 20px; line-height: 2em; }

#formarea input[type=text], #formarea input[type=password], #formarea textarea { box-sizing: border-box; }

#formarea textarea { padding: 2px; height: 160px; }

#formarea input[type=radio] { margin-right: 5px; font-size: 1.14em; }

#formarea button, #formarea input[type=submit], #formarea input[type=reset] { font-size: 1.14em; }

#formarea p { clear: left; margin: 10px 0; }

#formarea p:after { clear: both; content: ""; display: block; }

#formarea .notice2 { margin-left: 170px; font-size: 0.86em; }

#formarea .center-buttons { padding: 30px 0 0; text-align: center; }

#formarea .center-buttons input { /*@include inline-block;*/ /*@include flat-button;*/ display: inline-block; }

#formarea .member-link a { /*@include inline-block;*/ display: inline-block; margin-right: 15px; text-decoration: none; }

#formarea .notice { border: 1px solid #ccc; background: #d9d9d9; margin: 20px 0; padding: 8px 10px; font-size: 0.8em; }

.formbox #formarea .notice { margin-top: 40px; }

#formarea .notice strong { font-weight: normal; }

#formarea p.small { font-size: 0.86em; line-height: 1.4em; margin-bottom: 6px; }

#formarea #alertBox { margin: 0 0 0 0; }

#formarea .notice3 { border-top: 3px solid #090909; border-bottom: 3px solid #090909; margin: 20px 0; padding: 1em 0; font-size: 0.9em; font-weight: bold; color: #090909; }

@media (max-width: 62em) { .formcontent h2 { padding: 0 10px; margin: -2px auto 0; }
  .formcontent h2 img { width: 100%; height: auto; }
  #formarea .formbox { width: auto; }
  #formarea .formbox h3 { margin: 0 0 10px; padding: 5px 0; }
  #formarea label { display: block; /*float: left;*/ width: 100%; margin: 0 0 0; }
  #formarea label.radio-label2 { margin-bottom: 5px; }
  #formarea label.radio-label { display: inline; margin: 1em auto; /*text-align:left;*/ font-size: 16px; }
  #formarea label br { display: none; }
  #formarea select { font-size: 16px; }
  #formarea input[type=text], #formarea textarea, #formarea .radioset, #formarea input[type=password], #formarea select { /*display: block;*/ float: none; width: 100%; margin: 0 0 10px; font-size: 16px; }
  #formarea textarea { height: 200px; }
  #formarea .notice { margin: 10px 0; } }

/*////////////////////     THANKS     ////////////////////*/
body.thanks .headbar { height: 40px; }

body.thanks .headbar .logo_wowtokyo { width: 64px; height: 33px; }

body.thanks .footer { display: none; }

.thanks_content { text-align: center; }

.thanks_content h3 { margin: 0; font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 3em; }

.thanks_content p { margin: 0 0 3em; }

.thanks_content a.btn { background: #0277BD; padding: 0.5em 1em; font-family: 'Montserrat', Helvetica, Arial, sans-serif; color: #fff; text-decoration: none; transition: background-color 0.3s linear; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.thanks_content a.btn:hover { background-color: #0267a4; transition: background-color 0s linear; }

/*////////////////////     J-me     ////////////////////*/
#jme { position: absolute; right: 160px; top: 10px; width: 540px; height: 40px; overflow: hidden; margin: auto; z-index: 0; text-align: right; }

#jme:after { clear: both; content: ""; display: block; }

#jme #gigyaShare { display: inline-block; width: 462px; margin: 5px 0 0; }

#jme #gigyaShare img { display: block; float: left; margin: 0; padding-right: 5px; }

#jme #gigyaShare .gig-bar-container { height: 20px; margin: 5px 0 0 5px; }

#jme #gigyaShare .gig-button-container-google-plusone { width: 64px; overflow: hidden; }

@media (max-width: 62em) { #jme { right: 0; top: 0; } }

@media (max-width: 30em) { #jme { width: 100%; height: 55px; }
  #jme #gigyaShare { width: auto; margin: 0; } }

.prefs_wrapper {
padding-top: 20px;
margin: 0 0 20px 20px;
}
.prefs {
display: inline-block;
border-radius: 20px;
background: none #4eb6e2;
color #090909;
font-weight: bold;
font-size: .9em;
padding: 5px 20px;
margin: 0 0 5px;
outline: none;
cursor: pointer;
}

.prefs.active {
color: #eee;
background-color: #0277BD !important;
}


.c-bnr {
  text-align: center;
}
.c-bnr img {
  max-width: 540px;
  width: 100%;
}