@charset "UTF-8";
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after 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, 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/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

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

/** Improve readability when focused and also mouse hovered in all browsers. */
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 { -webkit-box-sizing: content-box; 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"] { -webkit-box-sizing: border-box; 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 (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }

/** 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 v4.3.0 | MIT License | http://h5bp.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: h5bp.com/i These selection rule sets have to be separate. Customize the background color to match your design. */

::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 images, videos, audio and canvas and the bottom of their containers: h5bp.com/i/440 */
audio, canvas, 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; }

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

/* Hide only visually, but have it available for screen readers: h5bp.com/v */
.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: h5bp.com/p */
.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; }

/* ========================================================================== Helper classes ========================================================================== */
:focus { outline: none; }

@media screen and (max-width: 960px) { .onlyPC { display: none; } }

@media screen and (min-width: 961px) { .onlySP { display: none; } }

iframe { border: 0; }

/* ========================================================================== Helper classes ========================================================================== */
html { color: #36454d; line-height: 1.5; }

body { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; }

@media screen and (max-width: 960px) { body.drawer-open { overflow: hidden; height: 100%; }
  body.drawer-open #site-header #header-main .nav-container .box-search.drawer-close .btn-search { display: none; }
  body.drawer-open #site-header .drawer-nav-container.drawer-close .btn-drawer { display: none; } }

h1, h2, p, ul, ol { margin: 0; padding: 0; }

#site-header { border-top: solid 3px #ED1C24; }

@media screen and (max-width: 960px) { #site-header { position: fixed; z-index: 1; width: 100%; top: 0; } }

#site-header #header-main { margin: 0 auto; width: 100%; }

@media screen and (max-width: 960px) { #site-header #header-main { position: relative; height: 56px; background: #fff; } }

@media screen and (min-width: 961px) { #site-header #header-main { width: 950px; } }

#site-header #header-main #site-title { float: left; margin: 24px 0 0 5px; line-height: 1; }

#site-header #header-main #site-title a { display: block; }

@media screen and (max-width: 960px) { #site-header #header-main #site-title { width: 109px; height: 25px; margin: 17px 0 0 16px; font-size: 0; }
  #site-header #header-main #site-title a img { width: 109px; height: 25px; } }

@media screen and (min-width: 961px) { #site-header #header-main #site-title { width: 252px; height: 58px; }
  #site-header #header-main #site-title a img { width: 252px; height: 58px; } }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container { position: absolute; top: 0; left: 0; width: 100%; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; margin-right: 5px; } }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container .box-search { width: 100%; }
  #site-header #header-main .nav-container .box-search .btn-search, #site-header #header-main .nav-container .box-search input[type="submit"] { overflow: hidden; position: absolute; padding: 0; text-indent: -9999px; background: url("img/btn_search_sp.png") no-repeat center center; background-size: 56px 56px; border: none; }
  #site-header #header-main .nav-container .box-search .btn-search { right: 64px; width: 60px; height: 56px; }
  #site-header #header-main .nav-container .box-search.drawer-open .btn-search { right: 0; background-image: url("img/btn_close_sp.png"); }
  #site-header #header-main .nav-container .box-search input[type="submit"] { right: 20px; top: 9px; width: 38px; height: 38px; }
  #site-header #header-main .nav-container .box-search .box-search-inner { display: none; position: relative; height: 40px; top: 56px; padding: 8px; background: #e6e8eb; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container .box-search { margin: 24px 0 0 313px; } }

#site-header #header-main .nav-container .box-search input[type="search"] { padding: 0 12px; border: 1px solid #E1E3E6; }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container .box-search input[type="search"] { width: calc(100vw - 42px); height: 38px; font-size: 20px; line-height: 38px; border-radius: 19px; background-color: #fff; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container .box-search input[type="search"] { width: 168px; height: 28px; font-size: 14px; line-height: 28px; border-radius: 15px; background-color: #F7F7F7; -webkit-box-shadow: inset 0 0 0 1px #FFF; box-shadow: inset 0 0 0 1px #FFF; } }

#site-header #header-main .nav-container .box-search input[type="search"]::-webkit-input-placeholder { font-family: "Bitter"; font-weight: 400; }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container .box-search input[type="search"]::-webkit-input-placeholder { color: #e1e3e6; font-size: 20px; line-height: 38px; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container .box-search input[type="search"]::-webkit-input-placeholder { color: #ED1C24; font-size: 14px; line-height: 28px; } }

#site-header #header-main .nav-container .box-search input[type="search"]:-ms-input-placeholder { font-family: "Bitter"; font-weight: 400; }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container .box-search input[type="search"]:-ms-input-placeholder { color: #e1e3e6; font-size: 20px; line-height: 38px; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container .box-search input[type="search"]:-ms-input-placeholder { color: #ED1C24; font-size: 14px; line-height: 28px; } }

#site-header #header-main .nav-container .box-search input[type="search"]::-moz-placeholder { font-family: "Bitter"; font-weight: 400; }

@media screen and (max-width: 960px) { #site-header #header-main .nav-container .box-search input[type="search"]::-moz-placeholder { color: #e1e3e6; font-size: 20px; line-height: 38px; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container .box-search input[type="search"]::-moz-placeholder { color: #ED1C24; font-size: 14px; line-height: 28px; } }

@media screen and (min-width: 961px) { #site-header #header-main .nav-container #secondary-navigation ul { float: right; margin-top: 7px; list-style: none; }
  #site-header #header-main .nav-container #secondary-navigation ul li { display: block; float: left; border-right: 1px solid #e1e3e6; }
  #site-header #header-main .nav-container #secondary-navigation ul li:last-child { border-right: none; }
  #site-header #header-main .nav-container #secondary-navigation ul li:last-child a { padding-right: 0; }
  #site-header #header-main .nav-container #secondary-navigation ul li a { padding: 0 20px; color: #0D5B80; font-family: "Bitter"; font-size: 14px; font-weight: 400; line-height: 37px; text-decoration: none; }
  #site-header #header-main .nav-container #secondary-navigation ul li a:hover, #site-header #header-main .nav-container #secondary-navigation ul li a:active { text-decoration: underline; } }

#site-header > .nav-container { padding-top: 32px; background-color: #F2F6F7; border-top: 1px solid #E1E3E6; }

#site-header #primary-navigation { border-top: 1px solid #0D5B80; border-bottom: 1px solid #3383a8; background-color: #0F6D99; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); }

#site-header #primary-navigation ul { margin: -18px auto -1px; list-style: none; width: 952px; }

#site-header #primary-navigation ul li { position: relative; display: block; float: left; width: 190px; }

#site-header #primary-navigation ul li a { display: block; padding-top: 3px; line-height: 68px; font-size: 13px; color: #ffff99; text-decoration: none; white-space: nowrap; }

#site-header #primary-navigation ul li a:hover { color: #b2e7ff; }

#site-header #primary-navigation ul li:first-child, #site-header #primary-navigation ul li:last-child { width: 191px; }

#site-header #primary-navigation ul li span { position: absolute; top: 0; left: 127px; line-height: 1; }

#site-header #primary-navigation ul li.nav-ctg1 a { padding-left: 61px; background: url("img/bg_primary_nav.png") 0 0 no-repeat; }

#site-header #primary-navigation ul li.nav-ctg1 a:hover { background-position: 0 -71px; }

body.category-electronics #site-header #primary-navigation ul li.nav-ctg1 a, body.single-electronics #site-header #primary-navigation ul li.nav-ctg1 a { color: #fff; background-position: 0 -142px; }

#site-header #primary-navigation ul li.nav-ctg2 a { padding-left: 61px; background: url("img/bg_primary_nav.png") -191px 0 no-repeat; }

#site-header #primary-navigation ul li.nav-ctg2 a:hover { background-position: -191px -71px; }

body.category-fabrication #site-header #primary-navigation ul li.nav-ctg2 a, body.single-fabrication #site-header #primary-navigation ul li.nav-ctg2 a { color: #fff; background-position: -191px -142px; }

#site-header #primary-navigation ul li.nav-ctg3 a { padding-left: 76px; background: url("img/bg_primary_nav.png") -381px 0 no-repeat; }

#site-header #primary-navigation ul li.nav-ctg3 a:hover { background-position: -381px -71px; }

body.category-kids #site-header #primary-navigation ul li.nav-ctg3 a, body.single-kids #site-header #primary-navigation ul li.nav-ctg3 a { color: #fff; background-position: -381px -142px; }

#site-header #primary-navigation ul li.nav-ctg4 a { padding-left: 85px; background: url("img/bg_primary_nav.png") -571px 0 no-repeat; }

#site-header #primary-navigation ul li.nav-ctg4 a:hover { background-position: -571px -71px; }

body.category-science #site-header #primary-navigation ul li.nav-ctg4 a, body.single-science #site-header #primary-navigation ul li.nav-ctg4 a { color: #fff; background-position: -571px -142px; }

#site-header #primary-navigation ul li.nav-ctg5 a { padding-left: 89px; background: url("img/bg_primary_nav.png") -761px 0 no-repeat; }

#site-header #primary-navigation ul li.nav-ctg5 a:hover { background-position: -761px -71px; }

body.category-crafts #site-header #primary-navigation ul li.nav-ctg5 a, body.single-crafts #site-header #primary-navigation ul li.nav-ctg5 a { color: #fff; background-position: -761px -142px; }

#site-header .drawer-nav-container { position: absolute; top: 0; left: 0; width: 100%; }

#site-header .drawer-nav-container.drawer-open .btn-drawer { background-image: url("img/btn_close_sp.png"); }

#site-header .btn-drawer { overflow: hidden; position: absolute; right: 0; width: 60px; height: 56px; padding: 0; text-indent: -9999px; background: url("img/btn_menu_sp.png") no-repeat center center; background-size: 56px 56px; border: none; }

#site-header #drawer-navigation { position: relative; display: none; overflow-y: scroll; height: calc(100vh - 59px); top: 56px; width: auto; padding: 0 8px; background: #083C54; }

#site-header .drawer-primary-navigation { padding: 16px; }

#site-header .drawer-primary-navigation > li { padding: 8px; list-style: none; border-bottom: solid 1px #215065; }

#site-header .drawer-primary-navigation > li > a { display: block; font-family: "Bitter"; font-size: 18px; line-height: 40px; letter-spacing: 0.05rem; font-weight: 400; text-decoration: none; color: #fff; }

#site-header .drawer-primary-navigation > li:first-child { border-top: solid 1px #215065; }

#site-header .drawer-category-navigation { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-flow: wrap; -ms-flex-flow: wrap; flex-flow: wrap; margin: 0 -8px -8px; }

#site-header .drawer-category-navigation li { list-style: none; position: relative; width: calc(50% - 8px); margin-bottom: 8px; }

#site-header .drawer-category-navigation li a { display: block; height: 30px; padding-top: 60px; font-size: 11px; letter-spacing: 0.05rem; text-align: center; text-decoration: none; white-space: nowrap; border-radius: 6px; background: #0a4766; color: #ffff99; }

#site-header .drawer-category-navigation li a:hover { color: #b2e7ff; }

#site-header .drawer-category-navigation li span { position: absolute; display: block; top: 6px; right: 6px; font-family: "Bitter"; font-size: 10px; color: #91D4F2; }

#site-header .drawer-category-navigation li::after { content: " "; display: block; overflow: hidden; position: absolute; width: 56px; height: 56px; top: 0; left: 0; right: 0; margin: 2px auto 0; background: transparent url("img/icn_ctg_sp.png") no-repeat left top; background-size: 280px 112px; pointer-events: none; }

#site-header .drawer-category-navigation li.nav-ctg2::after { background-position: -56px 0; }

#site-header .drawer-category-navigation li.nav-ctg3::after { background-position: -112px 0; }

#site-header .drawer-category-navigation li.nav-ctg4::after { background-position: -168px 0; }

#site-header .drawer-category-navigation li.nav-ctg5::after { background-position: -224px 0; }

#site-header .drawer-secondary-navigation li { list-style: none; }

#site-header .drawer-secondary-navigation li a { font-size: 13px; line-height: 36px; letter-spacing: 0.05rem; text-decoration: none; color: #91D4F2; }

#site-header .drawer-secondary-navigation li a:hover { color: #b2e7ff; }

#site-header .drawer-secondary-navigation li:last-child a { font-family: "Bitter"; }

#site-header #drawer-sub { margin-bottom: 60px; }

#site-header #drawer-sub ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

#site-header #drawer-sub ul li { list-style: none; margin: 17px 10px 30px; }

#site-header #drawer-sub p { text-align: center; }

#site-header #drawer-sub a img { width: 30px; height: 30px; }

@media screen and (max-width: 960px) { .home-content-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
  #featured-container { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; }
  #main { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } }

@media screen and (min-width: 961px) { #featured-container { padding-bottom: 26px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #083C54 url("img/bg_featured.png") left top repeat; } }

@media screen and (min-width: 961px) { #featured-container #featured { width: 950px; margin: 0 auto; } }

#featured-container #featured h1 { font-family: "Bitter"; font-size: 16px; font-weight: 400; }

@media screen and (max-width: 960px) { #featured-container #featured h1 { padding-left: 16px; color: #FFF; letter-spacing: 0.05em; line-height: 45px; background-color: #0F6D99; } }

@media screen and (min-width: 961px) { #featured-container #featured h1 { margin-top: 20px; color: #6397B0; letter-spacing: 0.05em; line-height: 20px; text-align: center; background: url("img/bg_ttl_featured.png") left center no-repeat; } }

@media screen and (max-width: 960px) { #featured-container #featured ul { margin-top: 16px; margin-bottom: 32px; } }

@media screen and (min-width: 961px) { #featured-container #featured ul { margin-top: 20px; } }

#featured-container #featured ul li { display: block; }

@media screen and (max-width: 960px) { #featured-container #featured ul li { margin: 16px 8px 0; }
  #featured-container #featured ul li:first-child { margin-top: 0; } }

@media screen and (min-width: 961px) { #featured-container #featured ul li { float: left; margin-left: 31px; width: 296px; }
  #featured-container #featured ul li:first-child { margin-left: 0; } }

#featured-container #featured ul li a { text-decoration: none; }

@media screen and (max-width: 960px) { #featured-container #featured ul li a { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } }

#featured-container #featured ul li a:hover .date, #featured-container #featured ul li a:hover .ttl { text-decoration: underline; }

#featured-container #featured ul li .ph { overflow: hidden; }

@media screen and (max-width: 960px) { #featured-container #featured ul li .ph { height: 88px; height: 27.5vw; -webkit-flex-basis: 37.5vw; -ms-flex-preferred-size: 37.5vw; flex-basis: 37.5vw; -webkit-box-flex: 0; -webkit-flex-grow: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; }
  #featured-container #featured ul li .ph img { height: 88px; height: 27.5vw; width: 120px; width: 37.5vw; } }

@media screen and (min-width: 961px) { #featured-container #featured ul li .ph { height: 198px; width: 296px; }
  #featured-container #featured ul li .ph img { height: 198px; } }

@media screen and (max-width: 960px) { #featured-container #featured ul li .box-text { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0 8px; } }

@media screen and (min-width: 961px) { #featured-container #featured ul li .box-text { position: relative; padding-top: 10px; }
  #featured-container #featured ul li .box-text .ctg { position: absolute; top: -28px; left: 225px; } }

#featured-container #featured ul li .date { font-family: "Bitter"; letter-spacing: 0.05em; font-size: 12px; line-height: 16px; }

@media screen and (max-width: 960px) { #featured-container #featured ul li .date { color: #97a0a8; } }

@media screen and (min-width: 961px) { #featured-container #featured ul li .date { color: #91D4F2; } }

@media screen and (max-width: 960px) { #featured-container #featured ul li .ttl { position: relative; overflow: hidden; height: 57px; margin-top: 6px; font-size: 13px; line-height: 19px; letter-spacing: 0.05rem; font-weight: bold; word-break: break-all; text-align: justify; text-justify: inter-ideograph; color: #333; }
  @supports (-webkit-line-clamp: 3) { #featured-container #featured ul li .ttl { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } }
  @supports not (-webkit-line-clamp: 3) { #featured-container #featured ul li .ttl::before { position: absolute; content: '…'; width: 1em; top: 38px; right: 0; text-align: center; background: #fff; } }
  @supports not (-webkit-line-clamp: 3) { #featured-container #featured ul li .ttl::after { content: " "; position: absolute; height: 100%; width: 100%; background: #fff; } } }

@media screen and (min-width: 961px) { #featured-container #featured ul li .ttl { margin-top: 8px; font-size: 14px; line-height: 22px; color: #FFF; } }

#main { background-color: #F2F6F7; }

@media screen and (max-width: 960px) { #main { margin-top: 59px; } }

@media screen and (min-width: 961px) { #main { -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15) inset; } }

#main-content { margin: 0 auto; width: 100%; }

@media screen and (min-width: 961px) { #main-content { padding-top: 40px; width: 950px; } }

#main-content #primary { width: 100%; }

@media screen and (min-width: 961px) { #main-content #primary { float: left; width: 630px; } }

#main-content #primary article { margin-bottom: 60px; border-top: 5px solid #ed1c24; }

#main-content #primary article .ph { overflow: hidden; }

@media screen and (min-width: 961px) { #main-content #primary article .ph { width: 630px; height: 420px; } }

@media screen and (min-width: 961px) { #main-content #primary article .ph img { height: 420px; } }

#main-content #primary article .box-text { position: relative; padding: 24px 20px; background-color: #0F6D99; }

#main-content #primary article .box-text .ctg { position: absolute; margin-top: 0; }

@media screen and (max-width: 960px) { #main-content #primary article .box-text .ctg { top: -18.5px; right: 16px; }
  #main-content #primary article .box-text .ctg img { width: 37px; height: 37px; } }

@media screen and (min-width: 961px) { #main-content #primary article .box-text .ctg { top: -37px; left: 531px; } }

#main-content #primary article .box-text .date { color: #91D4F2; margin-top: 0; font-family: "Bitter"; letter-spacing: 0.05em; font-size: 12px; line-height: 16px; }

#main-content #primary article .box-text h1 { color: #FFF; margin-top: 8px; font-size: 24px; font-weight: normal; }

#main-content #primary article .box-text h1 a { color: #FFF; text-decoration: none; }

#main-content #primary article .box-text h1 a:hover { text-decoration: underline; }

@media screen and (min-width: 961px) { #main-content #primary article .box-text h1 { letter-spacing: 0.1em; } }

#main-content #primary article .box-text p { margin-top: 18px; color: #91D4F2; font-size: 14px; letter-spacing: 0.05em; line-height: 26px; }

#main-content #primary article .box-text .body { margin-top: 28px; color: #91D4F2; font-size: 14px; line-height: 26px; }

#main-content #primary article .box-text .link-more { margin: 19px 20px 0 0; text-align: right; }

#main-content #primary article .box-text .link-more a { padding-right: 30px; color: #FFF; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; line-height: 22px; text-decoration: underline; background: url("img/arw_link_more.png") right 2px no-repeat; }

#main-content #primary article .box-text .link-more a:hover { color: #ffff33; background-position: right -25px; }

#main-content #primary article .box-text .btn-excerpt { display: none; }

#main-content #primary article .box-tag { background-color: #0d5b80; }

@media screen and (max-width: 960px) { #main-content #primary article .box-tag { padding: 18px 16px 17px; } }

@media screen and (min-width: 961px) { #main-content #primary article .box-tag { padding: 10px 20px; } }

#main-content #primary article .box-tag h1 { float: left; width: 50px; font-size: 20px; line-height: 1; }

#main-content #primary article .box-tag ul { float: right; margin: 0; list-style: none; width: 100%; }

@media screen and (min-width: 961px) { #main-content #primary article .box-tag ul { width: 525px; } }

#main-content #primary article .box-tag ul li { float: left; display: block; }

@media screen and (max-width: 960px) { #main-content #primary article .box-tag ul li { margin-right: 16px; } }

@media screen and (min-width: 961px) { #main-content #primary article .box-tag ul li { margin-right: 18px; } }

#main-content #primary article .box-tag ul li:last-child { margin-right: 0; }

#main-content #primary article .box-tag ul li a { display: block; color: #FFF; text-decoration: none; }

@media screen and (max-width: 960px) { #main-content #primary article .box-tag ul li a { font-size: 12px; line-height: 24px; } }

@media screen and (min-width: 961px) { #main-content #primary article .box-tag ul li a { font-size: 13px; line-height: 26px; } }

#main-content #primary article .box-tag ul li a:hover { text-decoration: underline; }

#main-content #primary article .social { line-height: 20px; background-color: #0d5b80; }

#main-content #primary article .social #fb-root { margin: 0 !important; }

@media screen and (max-width: 960px) { #main-content #primary article .social { margin: 0 8px; padding: 0 8px 24px; } }

@media screen and (min-width: 961px) { #main-content #primary article .social { height: 20px; padding: 5px 20px 15px; } }

@media screen and (max-width: 960px) { #main-content #primary article ul, #main-content #primary article ol { margin-left: 42px; margin-bottom: 28px; } }

@media screen and (min-width: 961px) { #main-content #primary article ul, #main-content #primary article ol { margin-left: 60px; margin-bottom: 24px; } }

@media screen and (max-width: 960px) { #main-content #primary article .noimage { margin-top: 27px; } }

@media screen and (max-width: 960px) { #main-content #primary article .noimage .box-text { background: #fff; padding: 23px 16px 21px; } }

@media screen and (min-width: 961px) { #main-content #primary article .noimage .box-text { padding-top: 0; padding-left: 85px; background: none; } }

@media screen and (max-width: 960px) { #main-content #primary article .noimage .box-text .ctg { top: -18.5px; right: 16px; margin: 0; }
  #main-content #primary article .noimage .box-text .ctg img { width: 37px; height: 37px; }
  #main-content #primary article .noimage .box-text .ctg::after { content: " "; display: block; position: absolute; top: 0; left: 0; width: 37px; height: 37px; border-radius: 50%; border: solid 2px #fff; -webkit-box-sizing: border-box; box-sizing: border-box; } }

@media screen and (min-width: 961px) { #main-content #primary article .noimage .box-text .ctg { top: 1px; left: -5px; } }

#main-content #primary article .noimage .box-text .date { margin-bottom: 0; color: #97a0a8; }

@media screen and (max-width: 960px) { #main-content #primary article .noimage .box-text .date { margin: 0; line-height: 12px; } }

#main-content #primary article .noimage .box-text h1, #main-content #primary article .noimage .box-text h1 a { color: #36454c; }

@media screen and (max-width: 960px) { #main-content #primary article .noimage .box-text h1, #main-content #primary article .noimage .box-text h1 a { margin: 7px 0; font-size: 20px; line-height: 28px; font-weight: bold; } }

@media screen and (min-width: 961px) { #main-content #primary article .noimage .box-text h1, #main-content #primary article .noimage .box-text h1 a { margin-top: 5px; } }

#main-content #primary article .noimage .box-tag { background: none; }

@media screen and (min-width: 961px) { #main-content #primary article .noimage .box-tag { border-top: solid 1px #e1e3e6; } }

#main-content #primary article .noimage .box-tag ul li a { color: #00a0e9; }

#main-content #primary article .noimage .social { border-bottom: solid 1px #e1e3e6; background: none; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination { width: 100%; margin: 32px 0 50px; padding: 0 16px; background: #e6e8eb; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination { padding: 10px 0; margin-bottom: 100px; border-top: 1px solid #e1e3e6; border-bottom: 1px solid #e1e3e6; } }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .prev, #main-content #primary .box-pagination .next { margin: 24px 0; width: 72px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .prev, #main-content #primary .box-pagination .next { width: 94px; } }

#main-content #primary .box-pagination .prev.empty:after, #main-content #primary .box-pagination .next.empty:after { content: "　"; }

#main-content #primary .box-pagination .prev a, #main-content #primary .box-pagination .next a { display: block; color: #36454D; font-family: "Bitter"; letter-spacing: 0.05em; text-decoration: underline; background-image: url("img/arw_pagination.png"); background-repeat: no-repeat; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .prev a, #main-content #primary .box-pagination .next a { font-size: 13px; line-height: 24px; background-size: 8.25px 225px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .prev a, #main-content #primary .box-pagination .next a { font-size: 18px; line-height: 46px; background-size: 11px 300px; } }

#main-content #primary .box-pagination .prev a:hover, #main-content #primary .box-pagination .next a:hover { color: #ed1c24; }

#main-content #primary .box-pagination .prev { float: left; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .prev a { margin-left: 8px; padding-left: 16px; background-position: 0 5px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .prev a { padding-left: 28px; background-position: 0 14px; } }

#main-content #primary .box-pagination .prev a:hover { color: #ED1C24; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .prev a:hover { background-position: 0 -32px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .prev a:hover { background-position: 0 -36px; } }

#main-content #primary .box-pagination .next { float: right; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .next a { margin-right: 8px; padding-left: 15px; background-position: right -69.5px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .next a { padding-left: 19px; background-position: right -86px; } }

#main-content #primary .box-pagination .next a:hover { color: #ED1C24; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination .next a:hover { background-position: right -107px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination .next a:hover { background-position: right -136px; } }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination div { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination div { float: left; border-left: 1px solid #e1e3e6; border-right: 1px solid #e1e3e6; width: 440px; } }

#main-content #primary .box-pagination ul { display: table; margin: 0 auto; list-style: none; text-align: center; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination ul { padding: 24px 0; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination ul { padding: 8px 0; } }

#main-content #primary .box-pagination ul li { display: inline-table; float: left; }

#main-content #primary .box-pagination ul li a { display: block; font-family: "Bitter"; color: #00A0E9; text-align: center; text-decoration: none; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination ul li a { margin: 0 12px; width: 24px; font-size: 13px; line-height: 24px; } }

@media screen and (min-width: 961px) { #main-content #primary .box-pagination ul li a { margin: 0 9px; width: 29px; font-size: 14px; line-height: 29px; } }

#main-content #primary .box-pagination ul li a:hover { text-decoration: underline; }

#main-content #primary .box-pagination ul li.current a { color: #fff; border-radius: 5px; background-color: #ed1c24; }

@media screen and (max-width: 960px) { #main-content #primary .box-pagination ul li.onlyPC { display: none; } }

#main-content #primary .box-pagination .pager { display: table; vertical-align: top; margin: 34px 0 0; padding-left: 0; text-align: center; width: 100%; height: 18px; line-height: 18px; list-style: none; }

#main-content #primary .box-pagination .pager li { display: inline-table; vertical-align: top; padding-right: 9px; }

#main-content #primary .box-pagination .pager li:last-child { padding-right: 0; }

#main-content #primary .box-pagination .pager li a { display: block; width: 36px; font-size: 18px; line-height: 24px; text-align: center; text-decoration: none; color: #000; background-color: #d9d9d9; }

#main-content #primary .box-pagination .pager li.current a { color: #fff; background-color: #000; }

@media screen and (min-width: 961px) { #main-content #secondary { float: right; width: 280px; padding-bottom: 60px; } }

@media screen and (max-width: 960px) { #main-content #secondary aside { display: none; } }

@media screen and (min-width: 961px) { #main-content #secondary aside { margin-bottom: 40px; } }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular { padding-bottom: 32px; background: #fff; } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular { border-bottom: 3px solid #0f6d99; } }

#main-content #secondary #most-popular a { text-decoration: none; }

#main-content #secondary #most-popular h1 { color: #FFF; font-family: "Bitter"; letter-spacing: 0.05em; font-weight: normal; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular h1 { font-size: 15px; line-height: 45px; padding-left: 16px; background-color: #299074; } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular h1 { font-size: 16px; line-height: 46px; padding-left: 20px; background-color: #0F6D99; } }

#main-content #secondary #most-popular ul { list-style: none; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; padding: 16px 24px 0 8px; }
  #main-content #secondary #most-popular ul li.clearfix:before, #main-content #secondary #most-popular ul li.clearfix:after { display: none; } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular ul li { padding: 14px 0; border-top: 1px solid #e1e3e6; }
  #main-content #secondary #most-popular ul li:first-child { border-top: none; } }

#main-content #secondary #most-popular ul li a { text-decoration: none; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li a { width: 100%; } }

#main-content #secondary #most-popular ul li a:hover .date, #main-content #secondary #most-popular ul li a:hover .ttl { text-decoration: underline; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li .ph { position: relative; overflow: hidden; width: 120px; width: 37.5vw; height: 88px; height: 27.5vw; margin-right: 8px; -webkit-box-flex: 0; -webkit-flex-grow: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li .wpp-thumbnail { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular ul li .wpp-thumbnail { float: left; overflow: hidden; width: 80px; height: 80px; } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular ul li .box-text { float: right; width: 190px; } }

#main-content #secondary #most-popular ul li .box-text .date { color: #97A0A8; font-family: "Bitter"; letter-spacing: 0.05em; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li .box-text .date { font-size: 12px; line-height: 18px; } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular ul li .box-text .date { font-size: 13px; line-height: 20px; } }

#main-content #secondary #most-popular ul li .box-text .ttl { color: #00A0E9; }

@media screen and (max-width: 960px) { #main-content #secondary #most-popular ul li .box-text .ttl { position: relative; overflow: hidden; height: 57px; margin-top: 4px; font-size: 13px; line-height: 19px; font-weight: bold; word-break: break-all; text-align: justify; text-justify: inter-ideograph; }
  @supports (-webkit-line-clamp: 3) { #main-content #secondary #most-popular ul li .box-text .ttl { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } }
  @supports not (-webkit-line-clamp: 3) { #main-content #secondary #most-popular ul li .box-text .ttl::before { position: absolute; content: '…'; width: 1em; top: 38px; right: 0; text-align: center; background: #fff; } }
  @supports not (-webkit-line-clamp: 3) { #main-content #secondary #most-popular ul li .box-text .ttl::after { content: " "; position: absolute; height: 100%; width: 100%; background: #fff; } } }

@media screen and (min-width: 961px) { #main-content #secondary #most-popular ul li .box-text .ttl { font-size: 13px; line-height: 20px; } }

#main-content #secondary aside.rail_content { margin-bottom: 40px; }

#main-content #secondary aside.rail_content h2.rail { padding-left: 20px; color: #FFF; font-family: "Bitter"; font-size: 16px; font-weight: normal; letter-spacing: 0.05em; line-height: 46px; background-color: #0F6D99; }

#main-content #secondary #monthly-archive { border-bottom: 3px solid #0f6d99; }

#main-content #secondary #monthly-archive h1 { padding-left: 20px; color: #FFF; font-family: "Bitter"; font-size: 16px; font-weight: normal; letter-spacing: 0.05em; line-height: 46px; background-color: #0F6D99; }

#main-content #secondary #monthly-archive select { margin: 25px 20px; width: 240px; }

#main-content #secondary #newsletter { border-bottom: 3px solid #0f6d99; }

#main-content #secondary #newsletter h1 { padding-left: 20px; color: #FFF; font-family: "Bitter"; font-size: 16px; font-weight: normal; letter-spacing: 0.05em; line-height: 46px; background-color: #0F6D99; }

#main-content #secondary #newsletter p { margin: 29px 20px; }

#main-content #secondary #newsletter p a { display: block; padding-left: 45px; color: #00A0E9; font-size: 14px; line-height: 22px; text-decoration: underline; background: url("img/icn_newsletter.png") left top no-repeat; }

#main-content #secondary #newsletter p a:hover { color: #91d4f2; }

#main-content #secondary #btns_social { margin-bottom: 20px; }

#main-content #secondary #btns_social ul { padding-left: 25px; list-style: none; }

#main-content #secondary #btns_social ul li { float: left; width: 120px; line-height: 20px; }

#site-footer-container { background-color: #242E33; }

@media screen and (min-width: 961px) { #site-footer-container { border-bottom: 3px solid #ED1C24; -webkit-box-shadow: inset 0 5px 15px rgba(0, 0, 0, 0.5); box-shadow: inset 0 5px 15px rgba(0, 0, 0, 0.5); } }

#site-footer-container #site-footer { margin: 0 auto; }

@media screen and (max-width: 960px) { #site-footer-container #site-footer { padding: 16px 16px 23px; } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer { width: 940px; padding: 40px 0 34px; } }

#site-footer-container #site-footer #footer-main { float: left; width: 560px; }

#site-footer-container #site-footer #footer-main .logo { margin-top: -2px; }

#site-footer-container #site-footer #footer-main ul { margin-top: 18px; list-style: none; }

#site-footer-container #site-footer #footer-main ul li { float: left; margin-right: 22px; }

#site-footer-container #site-footer #footer-main ul li a { color: #E1E3E6; font-size: 13px; line-height: 17px; text-decoration: none; }

#site-footer-container #site-footer #footer-main ul li a:hover { text-decoration: underline; }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub { float: right; width: 380px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-flex-flow: wrap; -ms-flex-flow: wrap; flex-flow: wrap; } }

#site-footer-container #site-footer #footer-sub ul { list-style: none; }

@media screen and (max-width: 960px) { #site-footer-container #site-footer #footer-sub ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin-top: 18px; } }

@media screen and (max-width: 960px) { #site-footer-container #site-footer #footer-sub ul li { margin: 0 10px; } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub ul li { float: left; }
  #site-footer-container #site-footer #footer-sub ul li:not(:first-child) { margin-left: 15px; } }

#site-footer-container #site-footer #footer-sub ul li img { width: 30px; height: 30px; }

#site-footer-container #site-footer #footer-sub p { clear: both; color: #97A0A8; font-family: "Bitter"; font-size: 12px; line-height: 16px; }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub p { text-align: right; } }

@media screen and (max-width: 960px) { #site-footer-container #site-footer #footer-sub p.link-newsletter { text-align: center; padding: 30px 0; } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub p.link-newsletter { margin-left: 15px; } }

#site-footer-container #site-footer #footer-sub p.link-newsletter img { width: 30px; height: 30px; }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub p.logo { padding-top: 17px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } }

#site-footer-container #site-footer #footer-sub p.logo a { display: block; }

@media screen and (max-width: 960px) { #site-footer-container #site-footer #footer-sub p.logo img { width: 72.5px; height: 12.5px; } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub p.logo img { width: 145px; height: 25px; } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub p.copyright { padding-top: 8px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } }

@media screen and (max-width: 960px) { #site-footer-container #site-footer #footer-sub small { display: block; width: 200%; margin: 14px 0 0; font-size: 14px; letter-spacing: 0.05rem; -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.5); transform: scale(0.5); } }

@media screen and (min-width: 961px) { #site-footer-container #site-footer #footer-sub small { font-size: 12px; } }

/* Category Top */
@media screen and (max-width: 960px) { body.category #content-header { height: 56px; margin-top: 59px; background: #242e33; } }

@media screen and (min-width: 961px) { body.category #content-header { padding-top: 23px; height: 184px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.category #content-header .content-header-inner { display: table; }

@media screen and (max-width: 960px) { body.category #content-header .content-header-inner { width: calc(100% - 16px); margin: 0 8px; } }

@media screen and (min-width: 961px) { body.category #content-header .content-header-inner { width: 950px; margin: 0 auto; } }

body.category #content-header .content-header-inner h1 { display: table-cell; margin: 0 auto; color: #97A0A8; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.category #content-header .content-header-inner h1 { position: relative; padding-left: 56px; font-size: 22px; line-height: 56px; }
  body.category #content-header .content-header-inner h1::after { content: " "; position: absolute; display: block; width: 56px; height: 56px; top: 0; left: -4px; background-image: url("img/icn_ctg_sp.png"); background-repeat: no-repeat; background-size: 280px 112px; background-position: 0 -56px; } }

@media screen and (min-width: 961px) { body.category #content-header .content-header-inner h1 { padding-left: 90px; font-size: 22px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

body.category #content-header .content-header-inner p { display: table-cell; padding-right: 15px; vertical-align: middle; color: #e1e3e6; font-size: 13px; text-align: right; }

@media screen and (max-width: 960px) { body.category #main { margin-top: 0; } }

body.category #main-content { padding-top: 0; }

body.category #content-pickup { margin-top: -113px; margin-bottom: 60px; }

body.category #content-pickup .ph { width: 100%; height: 534px; overflow: hidden; }

@media screen and (min-width: 961px) { body.category #content-pickup .ph { width: 950px; } }

body.category #content-pickup .ph img { height: 634px; max-width: 100%; }

body.category #content-pickup .box-text { position: relative; padding: 24px 20px; background-color: #0F6D99; }

body.category #content-pickup .box-text .ctg { position: absolute; top: -37px; left: 221px; margin-top: 0; }

@media screen and (min-width: 961px) { body.category #content-pickup .box-text .ctg { left: 851px; } }

body.category #content-pickup .box-text .date { color: #91D4F2; font-family: "Bitter"; font-size: 12px; letter-spacing: 0.05em; line-height: 16px; margin-top: 0; }

body.category #content-pickup .box-text h1 a { margin-top: 8px; color: #FFF; font-size: 24px; font-weight: normal; letter-spacing: 0.1em; text-decoration: none; }

body.category #content-pickup .box-text h1 a:hover { text-decoration: underline; }

body.category #content-pickup .box-text p { margin-top: 18px; color: #91D4F2; font-size: 14px; letter-spacing: 0.05em; line-height: 26px; }

body.category #content-pickup .box-text .body { margin-top: 28px; color: #91D4F2; font-size: 14px; line-height: 26px; }

body.category #content-pickup .box-text .link-more { margin: 19px 20px 0 0; text-align: right; }

body.category #content-pickup .box-text .link-more a { padding-right: 30px; color: #FFF; font-family: "Bitter"; font-size: 18px; line-height: 22px; letter-spacing: 0.05em; text-decoration: underline; background: url("img/arw_link_more.png") right 2px no-repeat; }

body.category #content-pickup .box-text .link-more a:hover { color: #ffff33; background-position: right -25px; }

body.category #content-pickup .box-text .btn-excerpt { display: none; }

body.category #content-pickup .box-tag { padding: 10px 20px; background-color: #0d5b80; }

body.category #content-pickup .box-tag h1 { float: left; width: 50px; margin-top: 3px; font-size: 20px; line-height: 1; }

body.category #content-pickup .box-tag ul { float: right; width: 845px; list-style: none; }

body.category #content-pickup .box-tag ul li { float: left; display: block; margin-right: 18px; }

body.category #content-pickup .box-tag ul li a { display: block; color: #FFF; font-size: 13px; line-height: 26px; text-decoration: none; }

body.category #content-pickup .box-tag ul li a:hover { text-decoration: underline; }

@media screen and (max-width: 960px) { body.category.category-electronics #content-header .wrapper h1::after, body.category.category-electronics #content-header h1::after, body.single.single-electronics #content-header .wrapper h1::after, body.single.single-electronics #content-header h1::after { background-position: 0 -56px; } }

@media screen and (min-width: 961px) { body.category.category-electronics #content-header .wrapper h1, body.category.category-electronics #content-header h1, body.single.single-electronics #content-header .wrapper h1, body.single.single-electronics #content-header h1 { background: url("img/icn_content_header.png") 12px -3px no-repeat; } }

@media screen and (max-width: 960px) { body.category.category-fabrication #content-header .wrapper h1::after, body.category.category-fabrication #content-header h1::after, body.single.single-fabrication #content-header .wrapper h1::after, body.single.single-fabrication #content-header h1::after { background-position: -56px -56px; } }

@media screen and (min-width: 961px) { body.category.category-fabrication #content-header .wrapper h1, body.category.category-fabrication #content-header h1, body.single.single-fabrication #content-header .wrapper h1, body.single.single-fabrication #content-header h1 { background: url("img/icn_content_header.png") 12px -55px no-repeat; } }

@media screen and (max-width: 960px) { body.category.category-kids #content-header .wrapper h1::after, body.category.category-kids #content-header h1::after, body.single.single-kids #content-header .wrapper h1::after, body.single.single-kids #content-header h1::after { background-position: -112px -56px; } }

@media screen and (min-width: 961px) { body.category.category-kids #content-header .wrapper h1, body.category.category-kids #content-header h1, body.single.single-kids #content-header .wrapper h1, body.single.single-kids #content-header h1 { background: url("img/icn_content_header.png") 12px -107px no-repeat; } }

@media screen and (max-width: 960px) { body.category.category-science #content-header .wrapper h1::after, body.category.category-science #content-header h1::after, body.single.single-science #content-header .wrapper h1::after, body.single.single-science #content-header h1::after { background-position: -168px -56px; } }

@media screen and (min-width: 961px) { body.category.category-science #content-header .wrapper h1, body.category.category-science #content-header h1, body.single.single-science #content-header .wrapper h1, body.single.single-science #content-header h1 { background: url("img/icn_content_header.png") 12px -159px no-repeat; } }

@media screen and (max-width: 960px) { body.category.category-crafts #content-header .wrapper h1::after, body.category.category-crafts #content-header h1::after, body.single.single-crafts #content-header .wrapper h1::after, body.single.single-crafts #content-header h1::after { background-position: -224px -56px; } }

@media screen and (min-width: 961px) { body.category.category-crafts #content-header .wrapper h1, body.category.category-crafts #content-header h1, body.single.single-crafts #content-header .wrapper h1, body.single.single-crafts #content-header h1 { background: url("img/icn_content_header.png") 12px -211px no-repeat; } }

body.category.paged #content-header { border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; }

@media screen and (min-width: 961px) { body.category.paged #content-header { padding-top: 26px; height: 70px; } }

body.category.paged #content-header .wrapper { margin: 0 auto; }

@media screen and (min-width: 961px) { body.category.paged #content-header .wrapper { width: 950px; } }

body.category.paged #content-header .wrapper h1 { float: left; padding-left: 90px; width: 550px; color: #97A0A8; font-family: "Bitter"; font-size: 36px; letter-spacing: 0.05em; font-style: italic; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); }

body.category.paged #main-content { padding-top: 40px; }

/* Detail */
body.single #content-header { background: #242E33; }

@media screen and (max-width: 960px) { body.single #content-header { width: calc(100% - 16px); margin-top: 59px; padding: 0 8px; } }

@media screen and (min-width: 961px) { body.single #content-header { padding-top: 23px; height: 74px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; background: url("img/bg_content_header.png") left top repeat; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; } }

body.single #content-header .wrapper { margin: 0 auto; }

@media screen and (min-width: 961px) { body.single #content-header .wrapper { width: 950px; } }

body.single #content-header .wrapper h1 { font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; color: #97A0A8; }

@media screen and (max-width: 960px) { body.single #content-header .wrapper h1 { position: relative; padding-left: 56px; font-size: 22px; line-height: 56px; }
  body.single #content-header .wrapper h1::after { content: " "; position: absolute; display: block; width: 56px; height: 56px; top: 0; left: -4px; background-image: url("img/icn_ctg_sp.png"); background-repeat: no-repeat; background-size: 280px 112px; background-position: 0 -56px; } }

@media screen and (min-width: 961px) { body.single #content-header .wrapper h1 { float: left; width: 860px; padding-left: 90px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

body.single #content-header .wrapper .box-singlepagination { float: right; padding-top: 7px; width: 253px; }

body.single #content-header .wrapper .box-singlepagination .prev a, body.single #content-header .wrapper .box-singlepagination .next a { display: block; color: #FFF; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; text-decoration: underline; line-height: 33px; }

body.single #content-header .wrapper .box-singlepagination .prev a:hover, body.single #content-header .wrapper .box-singlepagination .next a:hover { color: #717A80; }

body.single #content-header .wrapper .box-singlepagination .prev { float: left; border-right: 1px solid #42545e; }

body.single #content-header .wrapper .box-singlepagination .prev.end { float: right; border-right: none; }

body.single #content-header .wrapper .box-singlepagination .prev a { padding-left: 48px; width: 78px; background: url("img/arw_pagination.png") 20px -192px no-repeat; }

body.single #content-header .wrapper .box-singlepagination .prev a:hover { color: #ED1C24; background-position: 20px -42px; }

body.single #content-header .wrapper .box-singlepagination .next { float: right; }

body.single #content-header .wrapper .box-singlepagination .next a { padding-left: 30px; width: 96px; background: url("img/arw_pagination.png") 95px -242px no-repeat; }

body.single #content-header .wrapper .box-singlepagination .next a:hover { color: #ED1C24; background-position: 95px -142px; }

@media screen and (max-width: 960px) { body.single #main { margin-top: 0; } }

body.single #main-content #primary article { border-top: none; }

@media screen and (max-width: 960px) { body.single #main-content #primary article .top_article { margin-bottom: 28px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article .top_article { margin-bottom: 60px; } }

body.single #main-content #primary article .top_article p.author { text-align: right; margin: 0; font-family: "Bitter"; font-size: 12px; letter-spacing: 0.05em; color: #fff; }

body.single #main-content #primary article .top_article p.author .label { color: #91d4f2; }

@media screen and (min-width: 961px) { body.single #main-content #primary article .top_article p.author .label { margin-left: 15px; }
  body.single #main-content #primary article .top_article p.author .label:first-child { margin-left: 0; } }

body.single #main-content #primary article .top_article p.author a { color: #fff; text-decoration: none; }

body.single #main-content #primary article .top_article.noimage p.author { text-align: left; color: #36454c; }

body.single #main-content #primary article .top_article.noimage p.author a { color: #36454c; }

@media screen and (max-width: 960px) { body.single #main-content #primary article .top_article.noimage p.author { line-height: 20px; } }

body.single #main-content #primary article h1, body.single #main-content #primary article h2, body.single #main-content #primary article h3, body.single #main-content #primary article h4, body.single #main-content #primary article h5, body.single #main-content #primary article h6 { line-height: 1.4em; }

@media screen and (max-width: 960px) { body.single #main-content #primary article h1, body.single #main-content #primary article h2, body.single #main-content #primary article h3, body.single #main-content #primary article h4, body.single #main-content #primary article h5, body.single #main-content #primary article h6 { margin: 0 16px 1em; } }

@media screen and (max-width: 960px) { body.single #main-content #primary article h2 { font-size: 20px; }
  body.single #main-content #primary article h3 { font-size: 15px; }
  body.single #main-content #primary article h4 { font-size: 13px; }
  body.single #main-content #primary article h5 { font-size: 12px; }
  body.single #main-content #primary article h6 { font-size: 10px; } }

body.single #main-content #primary article p { color: #36454D; }

@media screen and (max-width: 960px) { body.single #main-content #primary article p { font-size: 15px; line-height: 27px; margin: 0 16px 28px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article p { font-size: 14px; line-height: 26px; letter-spacing: 0.05em; margin-bottom: 24px; } }

body.single #main-content #primary article p a { color: #00A0E9; text-decoration: underline; }

body.single #main-content #primary article p a:hover { color: #91d4f2; }

body.single #main-content #primary article img { max-width: 100%; height: auto; }

body.single #main-content #primary article .img { display: block; padding: 7px 20px; font-size: 12px; line-height: 18px; color: #97A0A8; }

body.single #main-content #primary article em { letter-spacing: 0.05em; font-style: normal; color: #97a0a8; }

@media screen and (max-width: 960px) { body.single #main-content #primary article em { font-size: 13px; line-height: 19px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article em { font-size: 12px; line-height: 18px; } }

body.single #main-content #primary article blockquote:not(.instagram-media) { display: block; color: #005f3f; }

@media screen and (max-width: 960px) { body.single #main-content #primary article blockquote:not(.instagram-media) { margin: 0 40px; width: auto; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article blockquote:not(.instagram-media) { margin: 0 auto; width: 490px; font-size: 14px; line-height: 26px; letter-spacing: 0.05em; } }

body.single #main-content #primary article blockquote:not(.instagram-media) p { display: inline-block; color: #005f3f; }

@media screen and (min-width: 961px) { body.single #main-content #primary article blockquote:not(.instagram-media) p { width: 490px; font-size: 14px; letter-spacing: 0.05em; line-height: 26px; } }

body.single #main-content #primary article blockquote:not(.instagram-media):before, body.single #main-content #primary article blockquote:not(.instagram-media):after { display: inline-block; padding-top: 5px; font-family: "Bitter"; font-size: 40px; line-height: 40px; color: #97a0a8; }

@media screen and (max-width: 960px) { body.single #main-content #primary article blockquote:not(.instagram-media):before, body.single #main-content #primary article blockquote:not(.instagram-media):after { width: 32px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article blockquote:not(.instagram-media):before, body.single #main-content #primary article blockquote:not(.instagram-media):after { width: 40px; } }

body.single #main-content #primary article blockquote:not(.instagram-media):before { vertical-align: top; content: "\201C"; text-align: center; }

@media screen and (max-width: 960px) { body.single #main-content #primary article blockquote:not(.instagram-media):before { margin-left: -32px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article blockquote:not(.instagram-media):before { margin-left: -40px; } }

body.single #main-content #primary article blockquote:not(.instagram-media):after { vertical-align: bottom; content: "\201D"; text-align: center; }

@media screen and (max-width: 960px) { body.single #main-content #primary article blockquote:not(.instagram-media):after { margin-right: -32px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article blockquote:not(.instagram-media):after { margin-right: -40px; } }

@media screen and (max-width: 960px) { body.single #main-content #primary article ul, body.single #main-content #primary article ol { font-size: 15px; line-height: 27px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article ul, body.single #main-content #primary article ol { font-size: 14px; line-height: 26px; letter-spacing: 0.05em; } }

body.single #main-content #primary article .box_meta { background-color: #0d5b80; border-bottom: 5px solid #ed1c24; }

body.single #main-content #primary article .box_meta .meta { position: relative; margin: 0 20px; padding: 6px 0 4px; border-bottom: solid 1px #266c8d; }

body.single #main-content #primary article .box_meta .meta .ctg { position: absolute; top: -37px; right: 0; }

body.single #main-content #primary article .box_meta .meta .text, body.single #main-content #primary article .box_meta .meta .transrated { font-family: "Bitter"; font-size: 12px; letter-spacing: 0.05em; line-height: 22px; color: #91D4F2; }

body.single #main-content #primary article .box_meta .meta .text a, body.single #main-content #primary article .box_meta .meta .transrated a { color: #FFF; font-size: 13px; line-height: 26px; text-decoration: none; }

body.single #main-content #primary article .box_meta .meta .text a:hover, body.single #main-content #primary article .box_meta .meta .transrated a:hover { text-decoration: underline; }

body.single #main-content #primary article .box_meta .meta .text { margin: 0; }

@media screen and (max-width: 960px) { body.single #main-content #primary article .embed-youtube object { width: 100%; height: calc(56.25vw - 9px); }
  body.single #main-content #primary article iframe { width: 100%; }
  body.single #main-content #primary article iframe:not(.instagram-media) { height: calc(56.25vw - 9px); }
  body.single #main-content #primary article p > iframe, body.single #main-content #primary article p:not(.ctg) > img, body.single #main-content #primary article p > a > img { width: calc( 100% + 16px); max-width: calc( 100% + 16px); margin-left: -8px; margin-right: -8px; } }

body.single #main-content #primary article .yarpp-related { display: none; }

@media screen and (max-width: 960px) { body.single #main-content #primary article .n2-section-smartslider { margin-bottom: 28px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary article .n2-section-smartslider { margin-bottom: 24px; } }

body.single #main-content #primary .backnumber { margin-bottom: 60px; background-color: #fff; }

body.single #main-content #primary .backnumber h1 { padding-left: 20px; color: #717A80; font-family: "Bitter"; font-size: 16px; letter-spacing: 0.05em; line-height: 46px; background-color: #E1E3E6; }

body.single #main-content #primary .backnumber ul { padding: 0 20px 10px; list-style: none; }

body.single #main-content #primary .backnumber ul li { padding: 14px 0; border-top: 1px solid #e1e3e6; }

body.single #main-content #primary .backnumber ul li:first-child { border-top: none; }

body.single #main-content #primary .backnumber ul li a { text-decoration: none; }

body.single #main-content #primary .backnumber ul li a:hover .date { text-decoration: underline; }

body.single #main-content #primary .backnumber ul li a:hover .ttl { text-decoration: underline; }

body.single #main-content #primary .backnumber ul li .ph { float: left; width: 80px; height: 80px; overflow: hidden; }

body.single #main-content #primary .backnumber ul li .ph img { height: 80px; }

body.single #main-content #primary .backnumber ul li .box-text { float: right; padding: inherit; background-color: #ffffff; }

@media screen and (min-width: 961px) { body.single #main-content #primary .backnumber ul li .box-text { width: 490px; } }

body.single #main-content #primary .backnumber ul li .box-text .date { color: #97A0A8; font-family: "Bitter"; font-size: 13px; letter-spacing: 0.05em; line-height: 20px; }

body.single #main-content #primary .backnumber ul li .box-text .ttl { padding-top: 3px; color: #36454D; font-size: 18px; line-height: 24px; }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-sizing: border-box; box-sizing: border-box; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination { padding: 0; margin-bottom: 100px; border-top: none; border-bottom: 1px solid #e1e3e6; } }

body.single #main-content #primary .box-pagination div { float: none; width: auto; border-right: none; border-left: none; }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination .box_next { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination .box_next { padding: 10px 0; border-top: 1px solid #e1e3e6; }
  body.single #main-content #primary .box-pagination .box_next .link_text { display: table; height: 46px; float: left; padding-right: 15px; text-align: right; }
  body.single #main-content #primary .box-pagination .box_next .link_text span { display: table-cell; vertical-align: middle; } }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination .box_prev { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination .box_prev { padding: 10px 0; border-top: 1px solid #e1e3e6; }
  body.single #main-content #primary .box-pagination .box_prev .link_text { display: table; height: 46px; float: right; padding-left: 15px; text-align: left; }
  body.single #main-content #primary .box-pagination .box_prev .link_text span { display: table-cell; vertical-align: middle; } }

body.single #main-content #primary .box-pagination a .link_text { color: #00A0E9; font-size: 14px; text-decoration: underline; }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a .link_text { width: 520px; } }

body.single #main-content #primary .box-pagination a:hover .link_text { color: #91d4f2; }

body.single #main-content #primary .box-pagination a:hover .prev, body.single #main-content #primary .box-pagination a:hover .next { color: #ED1C24; }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination a:hover .prev { background-position: 0 -32px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a:hover .prev { background-position: 0 -36px; } }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination a:hover .next { background-position: right -107px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a:hover .next { background-position: right -136px; } }

body.single #main-content #primary .box-pagination a .prev, body.single #main-content #primary .box-pagination a .next { display: block; color: #36454D; font-family: "Bitter"; letter-spacing: 0.05em; text-decoration: underline; background-image: url("img/arw_pagination.png"); background-repeat: no-repeat; }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination a .prev, body.single #main-content #primary .box-pagination a .next { width: 49px; margin: 24px 0; font-size: 13px; line-height: 24px; background-size: 8.25px 225px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a .prev, body.single #main-content #primary .box-pagination a .next { font-size: 18px; line-height: 46px; background-size: 11px 300px; } }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination a .prev { margin-left: 8px; padding-left: 15px; background-position: 0 5px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a .prev { width: 66px; float: left; border-right: 1px solid #e1e3e6; padding-left: 28px; background-position: 0 14px; } }

body.single #main-content #primary .box-pagination a .next { float: right; }

@media screen and (max-width: 960px) { body.single #main-content #primary .box-pagination a .next { margin-right: 8px; padding-left: 15px; background-position: right -69.5px; } }

@media screen and (min-width: 961px) { body.single #main-content #primary .box-pagination a .next { width: 75px; border-left: 1px solid #e1e3e6; padding-left: 19px; background-position: right -86px; } }

@media screen and (max-width: 960px) { body.single #main-content #secondary #most-popular { display: block; } }

/* Search Results */
@media screen and (max-width: 960px) { body.search #content-header, body.date #content-header { margin-top: 59px; background: #242E33; } }

@media screen and (min-width: 961px) { body.search #content-header, body.date #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.search #content-header h1, body.date #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; font-weight: normal; }

@media screen and (max-width: 960px) { body.search #content-header h1, body.date #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.search #content-header h1, body.date #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

@media screen and (max-width: 960px) { body.search #main, body.date #main { margin-top: 0; } }

body.search #main-content, body.date #main-content { padding-top: 0; }

body.search #ttl_result, body.date #ttl_result { padding: 46px 0 28px; font-size: 14px; font-weight: normal; line-height: 18px; color: #97A0A8; }

body.search #ttl_result span, body.date #ttl_result span { color: #ED1C24; }

/* About */
@media screen and (max-width: 960px) { body.about #content-header { background: #242E33; } }

@media screen and (min-width: 961px) { body.about #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.about #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.about #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.about #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

body.about #main-content #primary .nav_internal { margin-bottom: 27px; width: 560px; }

body.about #main-content #primary .nav_internal ol { list-style: none; }

body.about #main-content #primary .nav_internal ol li { display: inline-block; white-space: nowrap; }

body.about #main-content #primary .nav_internal ol li a { font-size: 13px; color: #00A0E9; line-height: 3; }

body.about #main-content #primary .nav_internal ol li:after { content: "\FF0F"; padding-left: 10px; color: #97A0A8; }

body.about #main-content #primary .nav_internal ol li:last-child:after { content: ""; padding-left: 0; }

body.about #main-content #primary .contents_inner { padding-bottom: 40px; }

body.about #main-content #primary .contents_inner article { margin-bottom: 0; padding-bottom: 10px; border-top: none; background-color: #fff; }

body.about #main-content #primary .contents_inner article .heading_lv2 { padding-left: 20px; color: #FFF; font-size: 16px; line-height: 46px; background-color: #0F6D99; }

body.about #main-content #primary .contents_inner article p { padding: 14px 20px; color: #36454D; font-size: 14px; line-height: 26px; }

body.about #main-content #primary .contents_inner article p a { color: #00A0E9; text-decoration: underline; }

body.about #main-content #primary .contents_inner article p a:hover { color: #91d4f2; }

body.about #main-content #primary .contents_inner article .movie { padding: 26px 30px 20px; }

body.about #main-content #primary .contents_inner article .fig { margin-top: 1px; }

body.about #main-content #primary .contents_inner article .img_right { float: right; }

body.about #main-content #primary .contents_inner article .img_left { float: left; }

body.about #main-content #primary .contents_inner article .txt_right { float: right; width: 330px; }

body.about #main-content #primary .contents_inner article .txt_left { float: left; width: 330px; }

body.about #main-content #primary .contents_inner .pagetop { margin: 18px 0 58px; padding-right: 35px; text-align: right; }

body.about #main-content #primary .contents_inner .pagetop a { padding-right: 35px; color: #36454D; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; line-height: 22px; text-decoration: underline; background: url("img/arw_pagetop.png") right 7px no-repeat; }

body.about #main-content #primary .contents_inner .pagetop a:hover { color: #717A80; background-position: right -13px; }

/* Contact */
@media screen and (max-width: 960px) { body.contact #content-header { background: #242E33; } }

@media screen and (min-width: 961px) { body.contact #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.contact #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.contact #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.contact #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

body.contact #main-content #primary { /* border_table_02 */ }

body.contact #main-content #primary .border_table_02 { width: 630px; border-top: 5px solid #ed1c24; font-size: 13px; font-weight: bold; line-height: 20px; color: #333; }

body.contact #main-content #primary .border_table_02 .badge-important { color: #E60012; font-weight: normal; }

body.contact #main-content #primary .border_table_02 th, body.contact #main-content #primary .border_table_02 td { padding: 10px 0; }

body.contact #main-content #primary .border_table_02 th .inner, body.contact #main-content #primary .border_table_02 td .inner { border-left: 1px solid #e1e3e6; padding: 5px 0; }

body.contact #main-content #primary .border_table_02 th { width: 225px; text-align: right; border-bottom: 1px solid #e1e3e6; vertical-align: top; }

body.contact #main-content #primary .border_table_02 th .inner { padding-top: 8px; padding-right: 25px; border-left: none; }

body.contact #main-content #primary .border_table_02 td { border-bottom: 1px solid #e1e3e6; vertical-align: top; }

body.contact #main-content #primary .border_table_02 td .inner { padding-left: 25px; }

body.contact #main-content #primary .border_table_02 input, body.contact #main-content #primary .border_table_02 textarea { width: 355px; font-weight: normal; }

body.contact #main-content #primary .bt_submit { text-align: center; margin: 30px auto 100px; width: 120px; }

body.contact #main-content #primary .bt_submit input { width: 120px; height: 50px; color: #FFF; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; border: none; border-radius: 4px; background-color: #36454D; }

body.contact #main-content #primary .bt_submit input:hover { background-color: #0D5B80; }

body.contact #main-content #primary .error_tr th, body.contact #main-content #primary .error_tr td { color: #E60012; background-color: #fff7f8; }

body.contact #main-content #primary .wpcf7-validation-errors { background-color: #fff7f8; border: 1px solid #fae6e8; border-radius: 4px; color: #e60012; font-size: 14px; font-weight: bold; text-align: center; margin: 30px 30px 0; padding: 26px 0; }

body.contact #main-content #primary .wpcf7-mail-sent-ok { background-color: #dceed4; border: 1px solid #9ad780; color: #398f14; font-weight: bold; text-align: center; border-radius: 4px; margin: 30px 30px 0; padding: 26px 0; }

body.contact #main-content #primary .wpcf7-not-valid-tip { display: block; color: #e60012; margin-top: 10px; }

/* (Events) */
@media screen and (max-width: 960px) { body.events #content-header { background: #242E33; } }

@media screen and (min-width: 961px) { body.events #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.events #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.events #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.events #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

body.events #main-content { padding-top: 0; }

body.events #main-content #ttl_events { padding: 46px 0 28px; font-size: 14px; font-weight: normal; line-height: 18px; color: #36454D; }

body.events #main-content #primary { border-top: 5px solid #ed1c24; }

body.events #main-content #primary article { margin-bottom: 0; padding: 30px 0; border-top: none; border-bottom: 1px solid #e1e3e6; }

body.events #main-content #primary article .ph { float: left; width: auto; height: auto; border: 1px solid #E1E3E6; }

body.events #main-content #primary article .ph img { width: auto; height: auto; }

body.events #main-content #primary article .box-text { float: right; padding: 0; width: 320px; background-color: transparent; }

body.events #main-content #primary article .box-text h1 { margin-top: 16px; color: #00A0E9; font-size: 16px; line-height: 24px; }

body.events #main-content #primary article .box-text .date { color: #717A80; font-size: 13px; line-height: 23px; }

body.events #main-content #primary article .box-text .link-more { position: absolute; top: 142px; right: 30px; margin: 0; text-align: right; }

body.events #main-content #primary article .box-text .link-more a { padding-right: 30px; color: #36454D; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; line-height: 22px; text-decoration: underline; background: url("img/arw_link_more.png") right -52px no-repeat; }

body.events #main-content #primary article .box-text .link-more a:hover { color: #ffff33; text-decoration: none; background-position: right -52px; }

/* About, Contact, Events, Site Map */
@media screen and (max-width: 960px) { body.page #content-header, body.post-type-archive-events #content-header { margin-top: 59px; background: #242E33; } }

@media screen and (min-width: 961px) { body.page #content-header, body.post-type-archive-events #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.page #content-header h1, body.post-type-archive-events #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.page #content-header h1, body.post-type-archive-events #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.page #content-header h1, body.post-type-archive-events #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

@media screen and (max-width: 960px) { body.page #main, body.post-type-archive-events #main { margin-top: 0; } }

body.page #main-content #primary .toppage, body.post-type-archive-events #main-content #primary .toppage { font-size: 14px; line-height: 26px; color: #36454D; }

body.page #main-content #primary .toppage a, body.post-type-archive-events #main-content #primary .toppage a { color: #00A0E9; text-decoration: underline; }

body.page #main-content #primary .toppage a:hover, body.post-type-archive-events #main-content #primary .toppage a:hover { color: #91d4f2; }

body.page #main-content #primary .nav_internal, body.post-type-archive-events #main-content #primary .nav_internal { margin-bottom: 27px; width: 560px; }

body.page #main-content #primary .nav_internal ol, body.post-type-archive-events #main-content #primary .nav_internal ol { list-style: none; }

body.page #main-content #primary .nav_internal ol li, body.post-type-archive-events #main-content #primary .nav_internal ol li { display: inline-block; white-space: nowrap; }

body.page #main-content #primary .nav_internal ol li a, body.post-type-archive-events #main-content #primary .nav_internal ol li a { font-size: 13px; color: #00A0E9; line-height: 3; }

body.page #main-content #primary .nav_internal ol li:after, body.post-type-archive-events #main-content #primary .nav_internal ol li:after { content: "\FF0F"; padding-left: 10px; color: #97A0A8; }

body.page #main-content #primary .nav_internal ol li:last-child:after, body.post-type-archive-events #main-content #primary .nav_internal ol li:last-child:after { content: ""; padding-left: 0; }

body.page #main-content #primary ul, body.page #main-content #primary ol, body.post-type-archive-events #main-content #primary ul, body.post-type-archive-events #main-content #primary ol { color: #36454D; }

@media screen and (max-width: 960px) { body.page #main-content #primary ul, body.page #main-content #primary ol, body.post-type-archive-events #main-content #primary ul, body.post-type-archive-events #main-content #primary ol { width: calc(100% - 58px); margin-left: 42px; margin-bottom: 24px; } }

@media screen and (min-width: 961px) { body.page #main-content #primary ul, body.page #main-content #primary ol, body.post-type-archive-events #main-content #primary ul, body.post-type-archive-events #main-content #primary ol { margin-top: 28px; padding-left: 40px; font-size: 14px; line-height: 26px; } }

body.page #main-content #primary ul li a, body.page #main-content #primary ol li a, body.post-type-archive-events #main-content #primary ul li a, body.post-type-archive-events #main-content #primary ol li a { color: #00A0E9; text-decoration: underline; }

body.page #main-content #primary ul li a:hover, body.page #main-content #primary ol li a:hover, body.post-type-archive-events #main-content #primary ul li a:hover, body.post-type-archive-events #main-content #primary ol li a:hover { color: #91d4f2; }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner, body.post-type-archive-events #main-content #primary .about.contents_inner { padding-bottom: 40px; } }

body.page #main-content #primary .about.contents_inner article, body.post-type-archive-events #main-content #primary .about.contents_inner article { margin-bottom: 0; border-top: none; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article, body.post-type-archive-events #main-content #primary .about.contents_inner article { padding-bottom: 27px; } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article, body.post-type-archive-events #main-content #primary .about.contents_inner article { padding-bottom: 10px; background-color: #fff; } }

body.page #main-content #primary .about.contents_inner article .heading_lv2, body.post-type-archive-events #main-content #primary .about.contents_inner article .heading_lv2 { color: #FFF; background-color: #0F6D99; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .heading_lv2, body.post-type-archive-events #main-content #primary .about.contents_inner article .heading_lv2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; min-height: 29px; margin: 1px 0; padding: 8px 16px; font-size: 15px; line-height: 21px; font-weight: bold; }
  body.page #main-content #primary .about.contents_inner article .heading_lv2 span, body.post-type-archive-events #main-content #primary .about.contents_inner article .heading_lv2 span { display: block; } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article .heading_lv2, body.post-type-archive-events #main-content #primary .about.contents_inner article .heading_lv2 { padding-left: 20px; font-size: 16px; line-height: 46px; letter-spacing: 0.1em; font-weight: normal; } }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article p, body.post-type-archive-events #main-content #primary .about.contents_inner article p { padding: 10px 16px 24px; font-size: 15px; line-height: 27px; color: #666666; } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article p, body.post-type-archive-events #main-content #primary .about.contents_inner article p { padding: 14px 20px; font-size: 14px; line-height: 26px; color: #36454D; } }

body.page #main-content #primary .about.contents_inner article p a, body.post-type-archive-events #main-content #primary .about.contents_inner article p a { color: #00A0E9; text-decoration: underline; }

body.page #main-content #primary .about.contents_inner article p a:hover, body.post-type-archive-events #main-content #primary .about.contents_inner article p a:hover { color: #91d4f2; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .movie, body.post-type-archive-events #main-content #primary .about.contents_inner article .movie { padding: 10px 16px 24px; }
  body.page #main-content #primary .about.contents_inner article .movie iframe, body.post-type-archive-events #main-content #primary .about.contents_inner article .movie iframe { width: 100%; height: calc(56.25vw - 18px); } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article .movie, body.post-type-archive-events #main-content #primary .about.contents_inner article .movie { padding: 26px 30px 20px; } }

body.page #main-content #primary .about.contents_inner article .fig, body.post-type-archive-events #main-content #primary .about.contents_inner article .fig { margin-top: 1px; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .fig img, body.post-type-archive-events #main-content #primary .about.contents_inner article .fig img { width: 100%; height: auto; } }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .img_left img, body.page #main-content #primary .about.contents_inner article .img_right img, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_left img, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_right img { width: 37.5vw; height: 37.5vw; } }

body.page #main-content #primary .about.contents_inner article .img_right, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_right { float: right; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .img_right, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_right { padding: 16px 16px 8px 8px; } }

body.page #main-content #primary .about.contents_inner article .img_left, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_left { float: left; }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .img_left, body.post-type-archive-events #main-content #primary .about.contents_inner article .img_left { padding: 16px 8px 8px 16px; } }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .txt_right + p:not(.img_right), body.post-type-archive-events #main-content #primary .about.contents_inner article .txt_right + p:not(.img_right) { display: none; } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article .txt_right, body.post-type-archive-events #main-content #primary .about.contents_inner article .txt_right { float: right; width: 330px; } }

@media screen and (max-width: 960px) { body.page #main-content #primary .about.contents_inner article .txt_left + p:not(.img_right), body.post-type-archive-events #main-content #primary .about.contents_inner article .txt_left + p:not(.img_right) { display: none; } }

@media screen and (min-width: 961px) { body.page #main-content #primary .about.contents_inner article .txt_left, body.post-type-archive-events #main-content #primary .about.contents_inner article .txt_left { float: left; width: 330px; } }

body.page #main-content #primary .about.contents_inner .pagetop, body.post-type-archive-events #main-content #primary .about.contents_inner .pagetop { margin: 18px 0 58px; padding-right: 35px; text-align: right; }

body.page #main-content #primary .about.contents_inner .pagetop a, body.post-type-archive-events #main-content #primary .about.contents_inner .pagetop a { padding-right: 35px; color: #36454D; font-family: "Bitter"; font-size: 18px; letter-spacing: 0.05em; line-height: 22px; text-decoration: underline; background: url("img/arw_pagetop.png") right 7px no-repeat; }

body.page #main-content #primary .about.contents_inner .pagetop a:hover, body.post-type-archive-events #main-content #primary .about.contents_inner .pagetop a:hover { color: #ED1C24; background-position: right -13px; }

body.page .border_table_02, body.post-type-archive-events .border_table_02 { font-weight: bold; color: #333; }

@media screen and (max-width: 960px) { body.page .border_table_02, body.post-type-archive-events .border_table_02 { width: 100%; margin-top: 16px; padding: 0 16px; font-size: 15px; line-height: 21px; } }

@media screen and (min-width: 961px) { body.page .border_table_02, body.post-type-archive-events .border_table_02 { width: 630px; font-size: 13px; line-height: 20px; border-top: 5px solid #ed1c24; } }

body.page .border_table_02 .badge-important, body.post-type-archive-events .border_table_02 .badge-important { color: #E60012; font-weight: normal; }

@media screen and (max-width: 960px) { body.page .border_table_02 tr, body.post-type-archive-events .border_table_02 tr { display: block; } }

@media screen and (max-width: 960px) { body.page .border_table_02 th, body.page .border_table_02 td, body.post-type-archive-events .border_table_02 th, body.post-type-archive-events .border_table_02 td { display: block; padding: 0 16px; } }

@media screen and (min-width: 961px) { body.page .border_table_02 th, body.page .border_table_02 td, body.post-type-archive-events .border_table_02 th, body.post-type-archive-events .border_table_02 td { padding: 10px 0; } }

@media screen and (min-width: 961px) { body.page .border_table_02 th .inner, body.page .border_table_02 td .inner, body.post-type-archive-events .border_table_02 th .inner, body.post-type-archive-events .border_table_02 td .inner { padding: 5px 0; border-left: 1px solid #e1e3e6; } }

@media screen and (max-width: 960px) { body.page .border_table_02 th, body.post-type-archive-events .border_table_02 th { padding: 13px 16px; text-align: left; } }

@media screen and (min-width: 961px) { body.page .border_table_02 th, body.post-type-archive-events .border_table_02 th { width: 225px; text-align: right; vertical-align: top; border-bottom: 1px solid #e1e3e6; }
  body.page .border_table_02 th .inner, body.post-type-archive-events .border_table_02 th .inner { padding-top: 8px; padding-right: 25px; border-left: none; } }

@media screen and (max-width: 960px) { body.page .border_table_02 td, body.post-type-archive-events .border_table_02 td { margin-bottom: 8px; } }

@media screen and (min-width: 961px) { body.page .border_table_02 td, body.post-type-archive-events .border_table_02 td { border-bottom: 1px solid #e1e3e6; vertical-align: top; }
  body.page .border_table_02 td .inner, body.post-type-archive-events .border_table_02 td .inner { padding-left: 25px; } }

body.page .border_table_02 input, body.page .border_table_02 textarea, body.page .border_table_02 select, body.post-type-archive-events .border_table_02 input, body.post-type-archive-events .border_table_02 textarea, body.post-type-archive-events .border_table_02 select { font-weight: normal; }

@media screen and (max-width: 960px) { body.page .border_table_02 input, body.page .border_table_02 textarea, body.page .border_table_02 select, body.post-type-archive-events .border_table_02 input, body.post-type-archive-events .border_table_02 textarea, body.post-type-archive-events .border_table_02 select { width: 100%; padding: 7px; font-size: 16px; border: solid 1px #e1e3e6; background: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; } }

@media screen and (min-width: 961px) { body.page .border_table_02 input, body.page .border_table_02 textarea, body.page .border_table_02 select, body.post-type-archive-events .border_table_02 input, body.post-type-archive-events .border_table_02 textarea, body.post-type-archive-events .border_table_02 select { width: 355px; } }

@media screen and (max-width: 960px) { body.page .border_table_02 input, body.page .border_table_02 select, body.post-type-archive-events .border_table_02 input, body.post-type-archive-events .border_table_02 select { height: 40px; } }

@media screen and (max-width: 960px) { body.page .border_table_02 textarea, body.post-type-archive-events .border_table_02 textarea { height: 200px; } }

body.page .bt_submit, body.post-type-archive-events .bt_submit { width: 120px; text-align: center; }

@media screen and (max-width: 960px) { body.page .bt_submit, body.post-type-archive-events .bt_submit { margin: 16px auto 50px; } }

@media screen and (min-width: 961px) { body.page .bt_submit, body.post-type-archive-events .bt_submit { margin: 30px auto 100px; } }

body.page .bt_submit input, body.post-type-archive-events .bt_submit input { width: 120px; color: #FFF; font-family: "Bitter"; letter-spacing: 0.05em; border: none; background-color: #36454D; }

@media screen and (max-width: 960px) { body.page .bt_submit input, body.post-type-archive-events .bt_submit input { height: 56px; font-size: 15px; border-radius: 8px; } }

@media screen and (min-width: 961px) { body.page .bt_submit input, body.post-type-archive-events .bt_submit input { height: 50px; font-size: 18px; border-radius: 4px; } }

body.page .bt_submit input:hover, body.post-type-archive-events .bt_submit input:hover { background-color: #0D5B80; }

body.page .error_tr th, body.page .error_tr td, body.post-type-archive-events .error_tr th, body.post-type-archive-events .error_tr td { color: #E60012; background-color: #fff7f8; }

body.page .wpcf7-validation-errors, body.post-type-archive-events .wpcf7-validation-errors { background-color: #fff7f8; border: 1px solid #fae6e8; color: #e60012; font-weight: bold; text-align: center; background-image: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; text-shadow: none; }

@media screen and (max-width: 960px) { body.page .wpcf7-validation-errors, body.post-type-archive-events .wpcf7-validation-errors { margin: 16px 16px 0; padding: 16px; font-size: 13px; border-radius: 8px; } }

@media screen and (min-width: 961px) { body.page .wpcf7-validation-errors, body.post-type-archive-events .wpcf7-validation-errors { margin: 30px 30px 0; padding: 26px 0; font-size: 14px; border-radius: 4px; } }

body.page .wpcf7-mail-sent-ok, body.post-type-archive-events .wpcf7-mail-sent-ok { background-color: #dceed4; border: 1px solid #9ad780; color: #398f14; font-weight: bold; text-align: center; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; text-shadow: none; }

@media screen and (max-width: 960px) { body.page .wpcf7-mail-sent-ok, body.post-type-archive-events .wpcf7-mail-sent-ok { margin: 16px 16px 0; padding: 16px; font-size: 13px; border-radius: 8px; } }

@media screen and (min-width: 961px) { body.page .wpcf7-mail-sent-ok, body.post-type-archive-events .wpcf7-mail-sent-ok { margin: 30px 30px 0; padding: 26px 0; border-radius: 4px; } }

body.page .wpcf7-not-valid-tip, body.post-type-archive-events .wpcf7-not-valid-tip { display: block; color: #e60012; position: inherit; left: 0; background: none; width: inherit; margin-bottom: 0; border: none; text-shadow: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; }

@media screen and (max-width: 960px) { body.page .wpcf7-not-valid-tip, body.post-type-archive-events .wpcf7-not-valid-tip { margin-top: 8px; padding-bottom: 8px; } }

@media screen and (min-width: 961px) { body.page .wpcf7-not-valid-tip, body.post-type-archive-events .wpcf7-not-valid-tip { margin-top: 10px; } }

body.post-type-archive-events .h2__upcoming { margin: 30px 16px 0; padding: 0; font-family: "Bitter"; font-size: 18px; line-height: 11px; letter-spacing: 0.05em; font-style: italic; color: #ed1c24; border-bottom: 2.5px solid #ed1c24; }

@media screen and (min-width: 961px) { body.post-type-archive-events .h2__upcoming { margin: 10px 0 0; font-size: 28px; line-height: 22px; border-bottom-width: 5px; } }

body.post-type-archive-events .h2__event { margin: 30px 16px 0; padding: 0; font-family: "Bitter"; font-size: 18px; line-height: 11px; letter-spacing: 0.05em; font-style: italic; color: #0f6d99; }

@media screen and (min-width: 961px) { body.post-type-archive-events .h2__event { margin: 50px 0 0; font-size: 28px; line-height: 22px; } }

body.post-type-archive-events .h2__event::after { display: block; content: " "; height: 5px; border-bottom: 2.5px solid #0f6d99; }

@media screen and (min-width: 961px) { body.post-type-archive-events .h2__event::after { height: 10px; border-bottom-width: 5px; } }

body.post-type-archive-events #main-content #primary section { margin-bottom: 40px; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary section { margin-bottom: 100px; } }

body.post-type-archive-events #main-content #primary article.events { border-top: none; border-bottom: 1px solid #e1e3e6; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; margin: 16px 16px 0; padding: 0 0 16px; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events { margin-bottom: 0; padding: 30px 0; }
  body.post-type-archive-events #main-content #primary article.events:first-child { padding-top: 0; } }

body.post-type-archive-events #main-content #primary article.events .ph { -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #E1E3E6; width: auto; height: auto; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events .ph { padding: 0; margin: 0 8px 0 0; -webkit-box-flex: 0; -webkit-flex-grow: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; }
  body.post-type-archive-events #main-content #primary article.events .ph img { width: 120px; width: 37.5vw; height: auto; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .ph { float: left; }
  body.post-type-archive-events #main-content #primary article.events .ph img { width: 280px; height: auto; } }

body.post-type-archive-events #main-content #primary article.events .box-text { background-color: transparent; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events .box-text { padding: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .box-text { float: right; padding: 0; width: 320px; } }

body.post-type-archive-events #main-content #primary article.events .box-text h1 { margin-top: 5px; font-size: 13px; line-height: 18px; color: #00A0E9; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .box-text h1 { margin-top: 20px; font-size: 16px; line-height: 24px; } }

body.post-type-archive-events #main-content #primary article.events .box-text .date { margin-top: 6px; font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-size: 12px; line-height: 12px; letter-spacing: 0.1em; color: #717A80; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .box-text .date { margin-top: 0; font-size: 16px; line-height: 23px; } }

body.post-type-archive-events #main-content #primary article.events .box-text .link-more { margin: 12px 0 0; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .box-text .link-more { position: absolute; top: 142px; right: 30px; text-align: right; } }

body.post-type-archive-events #main-content #primary article.events .box-text .link-more a { color: #36454D; font-family: "Bitter"; letter-spacing: 0.05em; text-decoration: underline; background-image: url("img/arw_pagination.png"); background-repeat: no-repeat; }

body.post-type-archive-events #main-content #primary article.events .box-text .link-more a:hover { color: #ED1C24; text-decoration: none; background-position: right -148px; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events .box-text .link-more a { padding-right: 16px; font-size: 13px; line-height: 19px; background-position: right -74.5px; background-size: 8.25px 225px; }
  body.post-type-archive-events #main-content #primary article.events .box-text .link-more a:hover { background-position: right -111px; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events .box-text .link-more a { padding-right: 30px; font-size: 18px; line-height: 22px; background-position: right -98px; background-size: 11px 300px; }
  body.post-type-archive-events #main-content #primary article.events .box-text .link-more a:hover { background-position: right -148px; } }

body.post-type-archive-events #main-content #primary article.events.upcoming-event { background: #fff; border-bottom: 1px solid #ed1c24; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event { display: block; margin: 0 16px; padding: 24px; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event { padding: 50px 40px; } }

body.post-type-archive-events #main-content #primary article.events.upcoming-event .ph img { width: 100%; height: auto; }

@media screen and (max-width: 960px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .ph { width: calc(100vw - 80px); margin: 0; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .ph { float: none; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text { float: none; padding: 0; width: auto; } }

body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text h1 { margin-top: 10px; font-size: 17px; line-height: 22px; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text h1 { margin-top: 20px; font-size: 24px; line-height: 32px; } }

body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text .date { font-size: 14px; }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text .date { margin-top: 16px; font-size: 16px; } }

@media screen and (min-width: 961px) { body.post-type-archive-events #main-content #primary article.events.upcoming-event .box-text .link-more { margin-top: 16px; position: static; } }

/* 404 not found */
@media screen and (max-width: 960px) { body.error404 #content-header { margin-top: 59px; background: #242E33; } }

@media screen and (min-width: 961px) { body.error404 #content-header { padding-top: 26px; height: 70px; border-top: 3px solid #041B26; border-bottom: 3px solid #fff; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) inset; background: #242E33 url("img/bg_content_header.png") left top repeat; } }

body.error404 #content-header h1 { margin: 0 auto; color: #fff; font-family: "Bitter"; letter-spacing: 0.05em; font-style: italic; }

@media screen and (max-width: 960px) { body.error404 #content-header h1 { padding-left: 16px; font-size: 22px; line-height: 56px; } }

@media screen and (min-width: 961px) { body.error404 #content-header h1 { width: 950px; font-size: 36px; line-height: 48px; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } }

@media screen and (max-width: 960px) { body.error404 #main { margin-top: 0; } }

/* Smartphone home, category top, SearchResults */
@media screen and (max-width: 960px) { body.page #main-content #primary, body.error404 #main-content #primary { margin-bottom: 26px; }
  body.page #main-content #primary p, body.error404 #main-content #primary p { padding: 10px 16px 24px; }
  body.page #main-content #primary .box-text p, body.error404 #main-content #primary .box-text p { padding: 0; }
  body.home #main-content #primary, body.category #main-content #primary, body.search #main-content #primary { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: wrap; -ms-flex-flow: wrap; flex-flow: wrap; }
  body.home #main-content #primary article, body.category #main-content #primary article, body.search #main-content #primary article { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; border-top: none; margin-bottom: 0; }
  body.home #main-content #primary article .ph, body.category #main-content #primary article .ph, body.search #main-content #primary article .ph { height: 97px; height: 30.3125vw; margin: 8px 7px 0 8px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  body.home #main-content #primary article .ph img, body.category #main-content #primary article .ph img, body.search #main-content #primary article .ph img { height: 97px; height: 30.3125vw; }
  body.home #main-content #primary article .box-text, body.category #main-content #primary article .box-text, body.search #main-content #primary article .box-text { background: transparent; padding: 14px 16px 22px; }
  body.home #main-content #primary article .box-text h1, body.category #main-content #primary article .box-text h1, body.search #main-content #primary article .box-text h1 { position: relative; overflow: hidden; height: 76px; font-size: 13px; line-height: 19px; font-weight: bold; word-break: break-all; text-align: justify; text-justify: inter-ideograph; color: #333; }
  body.home #main-content #primary article .box-text h1 a, body.category #main-content #primary article .box-text h1 a, body.search #main-content #primary article .box-text h1 a { color: #333; }
  @supports (-webkit-line-clamp: 4) { body.home #main-content #primary article .box-text h1, body.category #main-content #primary article .box-text h1, body.search #main-content #primary article .box-text h1 { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } }
  @supports not (-webkit-line-clamp: 4) { body.home #main-content #primary article .box-text h1::before, body.category #main-content #primary article .box-text h1::before, body.search #main-content #primary article .box-text h1::before { position: absolute; content: '…'; width: 1em; top: 57px; right: 0; text-align: center; background: #F2F6F7; } }
  @supports not (-webkit-line-clamp: 4) { body.home #main-content #primary article .box-text h1::after, body.category #main-content #primary article .box-text h1::after, body.search #main-content #primary article .box-text h1::after { content: " "; position: absolute; height: 100%; width: 100%; background: #F2F6F7; } }
  body.home #main-content #primary article .box-text .ctg, body.category #main-content #primary article .box-text .ctg, body.search #main-content #primary article .box-text .ctg { top: -18.5px; right: 16px; }
  body.home #main-content #primary article .box-text .ctg img, body.category #main-content #primary article .box-text .ctg img, body.search #main-content #primary article .box-text .ctg img { width: 37px; height: 37px; }
  body.home #main-content #primary article .box-text .date, body.category #main-content #primary article .box-text .date, body.search #main-content #primary article .box-text .date { font-size: 12px; line-height: 13px; color: #97a0a8; }
  body.home #main-content #primary article:first-child, body.home #main-content #primary article:nth-child(6), body.category.paged #main-content #primary article:first-child, body.category.paged #main-content #primary article:nth-child(6), body.search #main-content #primary article:first-child, body.search #main-content #primary article:nth-child(6) { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; }
  body.home #main-content #primary article:first-child .ph, body.home #main-content #primary article:nth-child(6) .ph, body.category.paged #main-content #primary article:first-child .ph, body.category.paged #main-content #primary article:nth-child(6) .ph, body.search #main-content #primary article:first-child .ph, body.search #main-content #primary article:nth-child(6) .ph { height: 160px; height: 50vw; margin: 8px 8px 0; }
  body.home #main-content #primary article:first-child .ph img, body.home #main-content #primary article:nth-child(6) .ph img, body.category.paged #main-content #primary article:first-child .ph img, body.category.paged #main-content #primary article:nth-child(6) .ph img, body.search #main-content #primary article:first-child .ph img, body.search #main-content #primary article:nth-child(6) .ph img { height: 160px; height: 50vw; }
  body.home #main-content #primary article:first-child .box-text h1, body.home #main-content #primary article:nth-child(6) .box-text h1, body.category.paged #main-content #primary article:first-child .box-text h1, body.category.paged #main-content #primary article:nth-child(6) .box-text h1, body.search #main-content #primary article:first-child .box-text h1, body.search #main-content #primary article:nth-child(6) .box-text h1 { height: 38px; }
  @supports (-webkit-line-clamp: 2) { body.home #main-content #primary article:first-child .box-text h1, body.home #main-content #primary article:nth-child(6) .box-text h1, body.category.paged #main-content #primary article:first-child .box-text h1, body.category.paged #main-content #primary article:nth-child(6) .box-text h1, body.search #main-content #primary article:first-child .box-text h1, body.search #main-content #primary article:nth-child(6) .box-text h1 { -webkit-line-clamp: 2; } }
  @supports not (-webkit-line-clamp: 2) { body.home #main-content #primary article:first-child .box-text h1::before, body.home #main-content #primary article:nth-child(6) .box-text h1::before, body.category.paged #main-content #primary article:first-child .box-text h1::before, body.category.paged #main-content #primary article:nth-child(6) .box-text h1::before, body.search #main-content #primary article:first-child .box-text h1::before, body.search #main-content #primary article:nth-child(6) .box-text h1::before { top: 19px; } }
  body.category:not(.paged) #main-content #content-pickup { margin: 0; }
  body.category:not(.paged) #main-content #content-pickup .box-text { background: transparent; padding: 16px; }
  body.category:not(.paged) #main-content #content-pickup .box-text h1 { position: relative; overflow: hidden; height: 38px; font-size: 13px; line-height: 19px; font-weight: bold; word-break: break-all; text-align: justify; text-justify: inter-ideograph; color: #000; }
  body.category:not(.paged) #main-content #content-pickup .box-text h1 a { font-size: 14px; font-weight: bold; color: #000; }
  @supports (-webkit-line-clamp: 2) { body.category:not(.paged) #main-content #content-pickup .box-text h1 { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } }
  @supports not (-webkit-line-clamp: 2) { body.category:not(.paged) #main-content #content-pickup .box-text h1::before { position: absolute; content: '…'; width: 1em; top: 19px; right: 0; text-align: center; background: #F2F6F7; } }
  @supports not (-webkit-line-clamp: 2) { body.category:not(.paged) #main-content #content-pickup .box-text h1::after { content: " "; position: absolute; height: 100%; width: 100%; background: #F2F6F7; } }
  body.category:not(.paged) #main-content #content-pickup .box-text .ctg { top: -18.5px; right: 16px; left: auto; }
  body.category:not(.paged) #main-content #content-pickup .box-text .ctg img { width: 37px; height: 37px; }
  body.category:not(.paged) #main-content #content-pickup, body.category:not(.paged) #main-content #primary article:nth-child(5) { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; }
  body.category:not(.paged) #main-content #content-pickup .ph, body.category:not(.paged) #main-content #primary article:nth-child(5) .ph { width: auto; height: 160px; height: 50vw; margin: 8px 8px 0; -webkit-box-sizing: border-box; box-sizing: border-box; }
  body.category:not(.paged) #main-content #content-pickup .ph img, body.category:not(.paged) #main-content #primary article:nth-child(5) .ph img { height: 160px; height: 50vw; }
  body.category:not(.paged) #main-content #content-pickup .box-text h1, body.category:not(.paged) #main-content #primary article:nth-child(5) .box-text h1 { height: 38px; }
  @supports (-webkit-line-clamp: 2) { body.category:not(.paged) #main-content #content-pickup .box-text h1, body.category:not(.paged) #main-content #primary article:nth-child(5) .box-text h1 { -webkit-line-clamp: 2; } }
  @supports not (-webkit-line-clamp: 2) { body.category:not(.paged) #main-content #content-pickup .box-text h1::before, body.category:not(.paged) #main-content #primary article:nth-child(5) .box-text h1::before { top: 19px; } }
  .banner-sp-upper { background: #0f6d99; }
  .banner-sp-upper a { padding: 8px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .banner-sp-bottom { padding: 0 8px; background: #f2f6f7; }
  .banner-sp-bottom a { display: block; width: 100%; padding-top: 32px; }
  .banner-sp-bottom a img { width: 100%; height: auto; }
  .banner-sp-bottom a:last-child { padding-bottom: 32px; }
  .banner-sp-upper a, .banner-sp-bottom a { display: block; width: 100%; }
  .banner-sp-upper a img, .banner-sp-bottom a img { width: 100%; height: auto; }
  .yarpp-related { display: none; } }