@charset "UTF-8";
/*
//PC-SPのみ

@mixin sp { @media only screen and (max-width: $width-smartphone) { @content; }
}
@mixin pc { @media only screen and (min-width: $width-smartphone + 1) { @content; }
}
*/
/*!
	Modaal - accessible modals - v0.4.4
	by Humaan, for all humans.
	http://humaan.com
 */
.modaal-noscroll { overflow: hidden; }

.modaal-accessible-hide { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }

.modaal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; opacity: 0; }

.modaal-wrapper { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; overflow: auto; opacity: 1; box-sizing: border-box; -webkit-overflow-scrolling: touch; transition: all 0.3s ease-in-out; }
.modaal-wrapper * { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; }
.modaal-wrapper .modaal-close { border: none; background: transparent; padding: 0; -webkit-appearance: none; }
.modaal-wrapper.modaal-start_none { display: none; opacity: 1; }
.modaal-wrapper.modaal-start_fade { opacity: 0; }
.modaal-wrapper *[tabindex="0"] { outline: none !important; }
.modaal-wrapper.modaal-fullscreen { overflow: hidden; }

.modaal-outer-wrapper { display: table; position: relative; width: 100%; }
.modaal-fullscreen .modaal-outer-wrapper { display: block; }

.modaal-inner-wrapper { display: table-cell; width: 100%; position: relative; vertical-align: middle; text-align: center; padding: 80px 25px; }
.modaal-fullscreen .modaal-inner-wrapper { padding: 0; display: block; vertical-align: top; }

.modaal-container { position: relative; display: inline-block; width: 100%; margin: auto; text-align: left; color: #000; max-width: 1000px; border-radius: 0px; background: #fff; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); cursor: auto; }
.modaal-container.is_loading { height: 100px; width: 100px; overflow: hidden; }
.modaal-fullscreen .modaal-container { max-width: none; height: 100%; overflow: auto; }

.modaal-close { position: fixed; right: 20px; top: 20px; color: #fff; cursor: pointer; opacity: 1; width: 50px; height: 50px; background: transparent; border-radius: 100%; transition: all 0.2s ease-in-out; }
.modaal-close:focus, .modaal-close:hover { outline: none; background: #fff; }
.modaal-close:focus:before, .modaal-close:focus:after, .modaal-close:hover:before, .modaal-close:hover:after { background: #b93d0c; }
.modaal-close span { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }
.modaal-close:before, .modaal-close:after { display: block; content: " "; position: absolute; top: 14px; left: 23px; width: 4px; height: 22px; border-radius: 4px; background: #fff; transition: background 0.2s ease-in-out; }
.modaal-close:before { transform: rotate(-45deg); }
.modaal-close:after { transform: rotate(45deg); }
.modaal-fullscreen .modaal-close { background: #afb7bc; right: 10px; top: 10px; }

.modaal-content-container { padding: 30px; }

.modaal-confirm-wrap { padding: 30px 0 0; text-align: center; font-size: 0; }

.modaal-confirm-btn { font-size: 14px; display: inline-block; margin: 0 10px; vertical-align: middle; cursor: pointer; border: none; background: transparent; }
.modaal-confirm-btn.modaal-ok { padding: 10px 15px; color: #fff; background: #555; border-radius: 3px; transition: background 0.2s ease-in-out; }
.modaal-confirm-btn.modaal-ok:hover { background: #2f2f2f; }
.modaal-confirm-btn.modaal-cancel { text-decoration: underline; }
.modaal-confirm-btn.modaal-cancel:hover { text-decoration: none; color: #2f2f2f; }

@keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-o-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-moz-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-ms-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
.modaal-instagram .modaal-container { width: auto; background: transparent; box-shadow: none !important; }
.modaal-instagram .modaal-content-container { padding: 0; background: transparent; }
.modaal-instagram .modaal-content-container > blockquote { width: 1px !important; height: 1px !important; opacity: 0 !important; }
.modaal-instagram iframe { opacity: 0; margin: -6px !important; border-radius: 0 !important; width: 1000px !important; max-width: 800px !important; box-shadow: none !important; animation: instaReveal 1s linear forwards; }

.modaal-image .modaal-inner-wrapper { padding-left: 140px; padding-right: 140px; }
.modaal-image .modaal-container { width: auto; max-width: 100%; }

.modaal-gallery-wrap { position: relative; color: #fff; }

.modaal-gallery-item { display: none; }
.modaal-gallery-item img { display: block; width: auto !important; height: 86vh; }
@media only screen and (max-width: 768px) { .modaal-gallery-item img { height: auto; } }
.modaal-gallery-item.is_active { display: block; position: relative; }
.modaal-gallery-item.is_active:after { text-align: center; content: "SAMPLE"; display: inline; display: flex; align-items: center; justify-content: center; font-size: 6rem; letter-spacing: 3px; padding: 0 10px; font-weight: bold; color: #fff; opacity: .7; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; font-family: a-otf-midashi-go-mb31-pr6n, sans-serif; font-weight: 600; font-style: normal; }

.modaal-gallery-label { position: absolute; left: 0; width: 100%; margin: 20px 0 0; font-size: 18px; text-align: center; color: #fff; }
.modaal-gallery-label:focus { outline: none; }

.modaal-gallery-control { position: absolute; top: 50%; transform: translateY(-50%); opacity: 1; cursor: pointer; color: #fff; width: 50px; height: 50px; background: transparent; border: none; border-radius: 100%; transition: all 0.2s ease-in-out; }
.modaal-gallery-control.is_hidden { opacity: 0; cursor: default; }
.modaal-gallery-control:focus, .modaal-gallery-control:hover { outline: none; background: #fff; }
.modaal-gallery-control:focus:before, .modaal-gallery-control:focus:after, .modaal-gallery-control:hover:before, .modaal-gallery-control:hover:after { background: #afb7bc; }
.modaal-gallery-control span { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }
.modaal-gallery-control:before, .modaal-gallery-control:after { display: block; content: " "; position: absolute; top: 16px; left: 25px; width: 4px; height: 18px; border-radius: 4px; background: #fff; transition: background 0.2s ease-in-out; }
.modaal-gallery-control:before { margin: -5px 0 0; transform: rotate(-45deg); }
.modaal-gallery-control:after { margin: 5px 0 0; transform: rotate(45deg); }

.modaal-gallery-next-inner { left: 100%; margin-left: 40px; }
.modaal-gallery-next-outer { right: 45px; }

.modaal-gallery-prev:before, .modaal-gallery-prev:after { left: 22px; }
.modaal-gallery-prev:before { margin: 5px 0 0; transform: rotate(-45deg); }
.modaal-gallery-prev:after { margin: -5px 0 0; transform: rotate(45deg); }
.modaal-gallery-prev-inner { right: 100%; margin-right: 40px; }
.modaal-gallery-prev-outer { left: 45px; }

.modaal-video-wrap { margin: auto 50px; position: relative; }

.modaal-video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); background: #000; max-width: 1300px; margin-left: auto; margin-right: auto; }
.modaal-video-container iframe, .modaal-video-container object, .modaal-video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.modaal-iframe .modaal-content { width: 100%; height: 100%; }

.modaal-iframe-elem { width: 100%; height: 100%; display: block; }

@media only screen and (min-width: 1400px) { .modaal-video-container { padding-bottom: 0; height: 731px; } }
@media only screen and (max-width: 1140px) { .modaal-image .modaal-inner-wrapper { padding-left: 25px; padding-right: 25px; }
  .modaal-gallery-control { top: auto; bottom: 20px; transform: none; background: rgba(0, 0, 0, 0.7); }
  .modaal-gallery-control:before, .modaal-gallery-control:after { background: #fff; }
  .modaal-gallery-next { left: auto; right: 20px; }
  .modaal-gallery-prev { left: 20px; right: auto; } }
@media screen and (max-width: 900px) { .modaal-instagram iframe { width: 500px !important; } }
@media screen and (max-height: 1100px) { .modaal-instagram iframe { width: 700px !important; } }
@media screen and (max-height: 1000px) { .modaal-inner-wrapper { padding-top: 60px; padding-bottom: 60px; }
  .modaal-instagram iframe { width: 600px !important; } }
@media screen and (max-height: 900px) { .modaal-instagram iframe { width: 500px !important; }
  .modaal-video-container { max-width: 900px; max-height: 510px; } }
@media only screen and (max-width: 600px) { .modaal-instagram iframe { width: 280px !important; } }
@media only screen and (max-height: 820px) { .modaal-gallery-label { display: none; } }
.modaal-loading-spinner { background: none; position: absolute; width: 200px; height: 200px; top: 50%; left: 50%; margin: -100px 0 0 -100px; transform: scale(0.25); }

@-ms-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-moz-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-webkit-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-o-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
.modaal-loading-spinner > div { width: 24px; height: 24px; margin-left: 4px; margin-top: 4px; position: absolute; }

.modaal-loading-spinner > div > div { width: 100%; height: 100%; border-radius: 15px; background: #fff; }

.modaal-loading-spinner > div:nth-of-type(1) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: 0s; -moz-animation-delay: 0s; -webkit-animation-delay: 0s; -o-animation-delay: 0s; animation-delay: 0s; }

.modaal-loading-spinner > div:nth-of-type(2) > div, .modaal-loading-spinner > div:nth-of-type(3) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(1) { -ms-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(2) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .12s; -moz-animation-delay: .12s; -webkit-animation-delay: .12s; -o-animation-delay: .12s; animation-delay: .12s; }

.modaal-loading-spinner > div:nth-of-type(2) { -ms-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(3) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .25s; -moz-animation-delay: .25s; -webkit-animation-delay: .25s; -o-animation-delay: .25s; animation-delay: .25s; }

.modaal-loading-spinner > div:nth-of-type(4) > div, .modaal-loading-spinner > div:nth-of-type(5) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(3) { -ms-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(4) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .37s; -moz-animation-delay: .37s; -webkit-animation-delay: .37s; -o-animation-delay: .37s; animation-delay: .37s; }

.modaal-loading-spinner > div:nth-of-type(4) { -ms-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(5) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .5s; -moz-animation-delay: .5s; -webkit-animation-delay: .5s; -o-animation-delay: .5s; animation-delay: .5s; }

.modaal-loading-spinner > div:nth-of-type(6) > div, .modaal-loading-spinner > div:nth-of-type(7) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(5) { -ms-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(6) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .62s; -moz-animation-delay: .62s; -webkit-animation-delay: .62s; -o-animation-delay: .62s; animation-delay: .62s; }

.modaal-loading-spinner > div:nth-of-type(6) { -ms-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(7) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .75s; -moz-animation-delay: .75s; -webkit-animation-delay: .75s; -o-animation-delay: .75s; animation-delay: .75s; }

.modaal-loading-spinner > div:nth-of-type(7) { -ms-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(8) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .87s; -moz-animation-delay: .87s; -webkit-animation-delay: .87s; -o-animation-delay: .87s; animation-delay: .87s; }

.modaal-loading-spinner > div:nth-of-type(8) { -ms-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); }

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

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; }

html { font-size: 62.5%; }

body { line-height: 1; -webkit-text-size-adjust: 100%; color: #000; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

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

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

a { color: #000; text-decoration: none; }

input[type="submit"], input[type="button"] { appearance: button; border: none; box-sizing: border-box; }
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration { display: none; }
input[type="submit"]::focus, input[type="button"]::focus { outline-offset: -2px; }

input { -webkit-appearance: none; -webkit-tap-highlight-color: transparent; }

select::-ms-expand { display: none; }

@media screen and (min-width: 1025px) { .sp-only { display: none !important; }
  .sp_tab-only { display: none !important; }
  .br-sp { display: block !important; } }
@media screen and (max-width: 1024px) { .pc-only { display: none !important; } }
@media screen and (min-width: 768px) { .br-sp { display: none !important; }
  .sp-only { display: none !important; } }
@media screen and (max-width: 768px) { .pc-only { display: none !important; }
  .pc_tab-only { display: none !important; } }
.wrap-l { width: 1080px; margin: auto; }
@media screen and (max-width: 1080px) { .wrap-l { width: calc(100% - 20px); } }

.wrap-s { width: 880px; margin: auto; }
@media screen and (max-width: 768px) { .wrap-s { width: calc(100% - 20px); } }

.wrap-pc { width: 990px; margin: auto; }
@media screen and (max-width: 1080px) { .wrap-pc { width: calc(100% - 20px); } }
@media only screen and (max-width: 768px) { .wrap-pc { width: 100%; } }

@media only screen and (max-width: 768px) { .wrap-sp { width: calc(100% - 20px); margin: auto; } }

.text-center { text-align: center; display: block; }

.text-left { text-align: left; display: block; }

.text-right { text-align: right; display: block; }

@media only screen and (min-width: 1025px) { .pc-text-center { text-align: center; display: block; } }

@media only screen and (min-width: 1025px) { .pc-text-left { text-align: left; display: block; } }

@media only screen and (min-width: 1025px) { .pc-text-right { text-align: right; display: block; } }

@media only screen and (max-width: 768px) { .sp-text-center { text-align: center; display: block; } }

@media only screen and (max-width: 768px) { .sp-text-left { text-align: left; display: block; } }

@media only screen and (max-width: 768px) { .sp-text-right { text-align: right; display: block; } }

.text-bold { font-weight: bold; }

.text-size-basic { font-size: 1.6rem; line-height: 1.6; }
@media only screen and (max-width: 768px) { .text-size-basic { font-size: 1.6rem; } }

.text-size-heading { font-size: 3.2rem; line-height: 1.6; }

.text-size-small { line-height: 1.6; font-size: 1.4rem; }
@media only screen and (max-width: 768px) { .text-size-small { font-size: 1.2rem; } }

.text-size-large { font-size: 2.4rem; line-height: 1.6; }

.right { float: right !important; }

.left { float: left !important; }

.pc-right { float: right !important; }
@media only screen and (max-width: 768px) { .pc-right { float: none !important; } }

.pc-left { float: left !important; }
@media only screen and (max-width: 768px) { .pc-left { float: none !important; } }

@media only screen and (max-width: 768px) { .sp-right { float: right !important; } }

@media only screen and (max-width: 768px) { .sp-left { float: left !important; } }

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

.youtube { position: relative; width: 100%; padding-top: 56.25%; }

.youtube iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

.flex { display: flex; }
@media only screen and (max-width: 768px) { .flex > * { min-height: 0%; } }

@media only screen and (max-width: 768px) { .sp-flex { display: flex; } }
@media only screen and (max-width: 768px) and (max-width: 768px) { .sp-flex > * { min-height: 0%; } }

.flex-wrap { flex-wrap: wrap; }

.flex-between { justify-content: space-between; }
.flex-between.flex-column-3 > * { width: 31.666%; }
@media only screen and (max-width: 768px) { .flex-between.flex-column-3 > * { width: 100%; } }
.flex-between.flex-column-2 > * { width: 48%; }

.flex-around { justify-content: space-around; }

.flex-center { justify-content: center; }

.flex-end { justify-content: flex-end; }

.flex-item-start { align-items: flex-start; }

.flex-item-end { align-items: flex-end; }

.flex-item-center { align-items: center; }

.flex-column { flex-flow: column; }

@media only screen and (max-width: 768px) { .sp-flex-column { flex-flow: column; }
  .sp-flex-column.flex-column-3 > *, .sp-flex-column.flex-column-2 > * { width: 100%; } }

@media only screen and (max-width: 768px) { .sp-flex-wrap { flex-wrap: wrap; } }

@media only screen and (max-width: 768px) { .sp-flex-column-reverce { flex-flow: column-reverse; } }

@media only screen and (max-width: 768px) { .sp-flex-row-reverce { flex-flow: row-reverse; } }

@media screen and (max-width: 1024px) { .tab-flex-column { flex-flow: column; }
  .tab-flex-column.flex-column-3 > *, .tab-flex-column.flex-column-2 > * { width: 100%; } }

.wid-5 { width: 5% !important; }

.wid-10 { width: 10% !important; }

.wid-15 { width: 15% !important; }

.wid-20 { width: 20% !important; }

.wid-25 { width: 25% !important; }

.wid-30 { width: 30% !important; }

.wid-35 { width: 35% !important; }

.wid-40 { width: 40% !important; }

.wid-45 { width: 45% !important; }

.wid-50 { width: 50% !important; }

.wid-55 { width: 55% !important; }

.wid-60 { width: 60% !important; }

.wid-65 { width: 65% !important; }

.wid-70 { width: 70% !important; }

.wid-75 { width: 75% !important; }

.wid-80 { width: 80% !important; }

.wid-85 { width: 85% !important; }

.wid-90 { width: 90% !important; }

.wid-95 { width: 95% !important; }

.wid-100 { width: 100% !important; }

@media only screen and (max-width: 768px) { .sp-wid-100 { width: 100% !important; } }

.img-center { display: block; margin: auto; max-width: 100%; }

.m-auto { margin: auto; }

.mv-0 { margin: 0; }

.mv-10 { margin: 10px auto; }

.mv-20 { margin: 20px auto; }

.mv-30 { margin: 30px auto; }

.mv-40 { margin: 40px auto; }

.mv-50 { margin: 50px auto; }

.mv-60 { margin: 60px auto; }

.mv-70 { margin: 70px auto; }

.mv-80 { margin: 80px auto; }

.mv-90 { margin: 90px auto; }

.mv-100 { margin: 100px auto; }

.mt-0 { margin-top: 0; }

.mt-10 { margin-top: 10px !important; }

.mt-20 { margin-top: 20px !important; }

.mt-30 { margin-top: 30px !important; }

.mt-40 { margin-top: 40px !important; }

.mt-50 { margin-top: 50px !important; }

.mt-60 { margin-top: 60px !important; }

.mt-70 { margin-top: 70px !important; }

.mt-80 { margin-top: 80px !important; }

.mt-90 { margin-top: 90px !important; }

.mt-100 { margin-top: 100px 0; }

.mr-0 { margin-right: 0; }

.mr-10 { margin-right: 10px !important; }

.mr-20 { margin-right: 20px !important; }

.mr-30 { margin-right: 30px !important; }

.mr-40 { margin-right: 40px !important; }

.mr-50 { margin-right: 50px !important; }

.mr-60 { margin-right: 60px !important; }

.mr-70 { margin-right: 70px !important; }

.mr-80 { margin-right: 80px !important; }

.mr-90 { margin-right: 90px !important; }

.mr-100 { margin-right: 100px !important; }

.ml-0 { margin-left: 0; }

.ml-10 { margin-left: 10px !important; }

.ml-20 { margin-left: 20px !important; }

.ml-30 { margin-left: 30px !important; }

.ml-40 { margin-left: 40px !important; }

.ml-50 { margin-left: 50px !important; }

.ml-60 { margin-left: 60px !important; }

.ml-70 { margin-left: 70px !important; }

.ml-80 { margin-left: 80px !important; }

.ml-90 { margin-left: 90px !important; }

.ml-100 { margin-left: 100px !important; }

.mb-0 { margin-bottom: 0; }

.mb-10 { margin-bottom: 10px !important; }

.mb-20 { margin-bottom: 20px !important; }

.mb-30 { margin-bottom: 30px !important; }

.mb-40 { margin-bottom: 40px !important; }

.mb-50 { margin-bottom: 50px !important; }

.mb-60 { margin-bottom: 60px !important; }

.mb-70 { margin-bottom: 70px !important; }

.mb-80 { margin-bottom: 80px !important; }

.mb-90 { margin-bottom: 90px !important; }

.mb-100 { margin-bottom: 100px !important; }

.mb-110 { margin-bottom: 110px !important; }

.mb-120 { margin-bottom: 120px !important; }

.mb-130 { margin-bottom: 130px !important; }

.mb-140 { margin-bottom: 140px !important; }

.mb-150 { margin-bottom: 150px !important; }

.mb-160 { margin-bottom: 160px !important; }

.mb-170 { margin-bottom: 170px !important; }

.mb-180 { margin-bottom: 180px !important; }

.mb-190 { margin-bottom: 190px !important; }

.mb-200 { margin-bottom: 200px !important; }

.pv-0 { padding: 0; }

.pv-10 { padding: 10px 0; }

.pv-20 { padding: 20px 0; }

.pv-30 { padding: 30px 0; }

.pv-40 { padding: 40px 0; }

.pv-50 { padding: 50px 0; }

.pv-60 { padding: 60px 0; }

.pv-70 { padding: 70px 0; }

.pv-80 { padding: 80px 0; }

.pv-90 { padding: 90px 0; }

.pv-100 { padding: 100px 0; }

.pt-0 { padding-top: 0; }

.pt-10 { padding-top: 10px !important; }

.pt-20 { padding-top: 20px !important; }

.pt-30 { padding-top: 30px !important; }

.pt-40 { padding-top: 40px !important; }

.pt-50 { padding-top: 50px !important; }

.pt-60 { padding-top: 60px !important; }

.pt-70 { padding-top: 70px !important; }

.pt-80 { padding-top: 80px !important; }

.pt-90 { padding-top: 90px !important; }

.pt-100 { padding-top: 100px 0; }

.pr-0 { padding-right: 0; }

.pr-10 { padding-right: 10px !important; }

.pr-20 { padding-right: 20px !important; }

.pr-30 { padding-right: 30px !important; }

.pr-40 { padding-right: 40px !important; }

.pr-50 { padding-right: 50px !important; }

.pr-60 { padding-right: 60px !important; }

.pr-70 { padding-right: 70px !important; }

.pr-80 { padding-right: 80px !important; }

.pr-90 { padding-right: 90px !important; }

.pr-100 { padding-right: 100px !important; }

.pl-0 { padding-left: 0; }

.pl-10 { padding-left: 10px !important; }

.pl-20 { padding-left: 20px !important; }

.pl-30 { padding-left: 30px !important; }

.pl-40 { padding-left: 40px !important; }

.pl-50 { padding-left: 50px !important; }

.pl-60 { padding-left: 60px !important; }

.pl-70 { padding-left: 70px !important; }

.pl-80 { padding-left: 80px !important; }

.pl-90 { padding-left: 90px !important; }

.pl-100 { padding-left: 100px !important; }

.pb-0 { padding-bottom: 0; }

.pb-10 { padding-bottom: 10px !important; }

.pb-20 { padding-bottom: 20px !important; }

.pb-30 { padding-bottom: 30px !important; }

.pb-40 { padding-bottom: 40px !important; }

.pb-50 { padding-bottom: 50px !important; }

.pb-60 { padding-bottom: 60px !important; }

.pb-70 { padding-bottom: 70px !important; }

.pb-80 { padding-bottom: 80px !important; }

.pb-90 { padding-bottom: 90px !important; }

.pb-100 { padding-bottom: 100px !important; }

.padding-0 { padding: 0; }

.padding-10 { padding: 10px !important; }

.padding-20 { padding: 20px !important; }

.padding-30 { padding: 30px !important; }

.padding-40 { padding: 40px !important; }

.padding-50 { padding: 50px !important; }

.padding-60 { padding: 60px !important; }

.padding-70 { padding: 70px !important; }

.padding-80 { padding: 80px !important; }

.padding-90 { padding: 90px !important; }

.padding-100 { padding: 100px !important; }

/*-------------------------*/
/* TAB                  */
/*-------------------------*/
/*-------------------------*/
/* SP                       */
/*-------------------------*/
@media screen and (max-width: 768px) { .mv-10 { margin: 5px auto; }
  .mv-20 { margin: 10px auto; }
  .mv-30 { margin: 15px auto; }
  .mv-40 { margin: 20px auto; }
  .mv-50 { margin: 25px auto; }
  .mv-60 { margin: 30px auto; }
  .mv-70 { margin: 35px auto; }
  .mv-80 { margin: 40px auto; }
  .mv-90 { margin: 45px auto; }
  .mv-100 { margin: 50px auto; }
  .mt-10 { margin-top: 5px !important; }
  .mt-20 { margin-top: 10px !important; }
  .mt-30 { margin-top: 15px !important; }
  .mt-40 { margin-top: 20px !important; }
  .mt-50 { margin-top: 25px !important; }
  .mt-60 { margin-top: 30px !important; }
  .mt-70 { margin-top: 35px !important; }
  .mt-80 { margin-top: 40px !important; }
  .mt-90 { margin-top: 45px !important; }
  .mt-100 { margin-top: 50px !important; }
  .mr-10 { margin-right: 5px !important; }
  .mr-20 { margin-right: 10px !important; }
  .mr-30 { margin-right: 15px !important; }
  .mr-40 { margin-right: 20px !important; }
  .mr-50 { margin-right: 25px !important; }
  .mr-60 { margin-right: 30px !important; }
  .mr-70 { margin-right: 35px !important; }
  .mr-80 { margin-right: 40px !important; }
  .mr-90 { margin-right: 45px !important; }
  .mr-100 { margin-right: 50px !important; }
  .ml-10 { margin-left: 5px !important; }
  .ml-20 { margin-left: 10px !important; }
  .ml-30 { margin-left: 15px !important; }
  .ml-40 { margin-left: 20px !important; }
  .ml-50 { margin-left: 25px !important; }
  .ml-60 { margin-left: 30px !important; }
  .ml-70 { margin-left: 35px !important; }
  .ml-80 { margin-left: 40px !important; }
  .ml-90 { margin-left: 45px !important; }
  .ml-100 { margin-left: 50px !important; }
  .mb-10 { margin-bottom: 5px !important; }
  .mb-20 { margin-bottom: 10px !important; }
  .mb-30 { margin-bottom: 15px !important; }
  .mb-40 { margin-bottom: 20px !important; }
  .mb-50 { margin-bottom: 25px !important; }
  .mb-60 { margin-bottom: 30px !important; }
  .mb-70 { margin-bottom: 35px !important; }
  .mb-80 { margin-bottom: 40px !important; }
  .mb-90 { margin-bottom: 45px !important; }
  .mb-100 { margin-bottom: 50px !important; }
  .mb-110 { margin-bottom: 50px !important; }
  .mb-120 { margin-bottom: 60px !important; }
  .mb-130 { margin-bottom: 65px !important; }
  .mb-140 { margin-bottom: 70px !important; }
  .mb-150 { margin-bottom: 75px !important; }
  .mb-160 { margin-bottom: 80px !important; }
  .mb-170 { margin-bottom: 85px !important; }
  .mb-180 { margin-bottom: 80px !important; }
  .mb-190 { margin-bottom: 95px !important; }
  .mb-200 { margin-bottom: 100px !important; }
  .pv-10 { padding: 5px 0; }
  .pv-20 { padding: 10px 0; }
  .pv-30 { padding: 15px 0; }
  .pv-40 { padding: 20px 0; }
  .pv-50 { padding: 25px 0; }
  .pv-60 { padding: 30px 0; }
  .pv-70 { padding: 35px 0; }
  .pv-80 { padding: 40px 0; }
  .pv-90 { padding: 45px 0; }
  .pv-100 { padding: 50px 0; }
  .pt-10 { padding-top: 5px !important; }
  .pt-20 { padding-top: 10px !important; }
  .pt-30 { padding-top: 15px !important; }
  .pt-40 { padding-top: 20px !important; }
  .pt-50 { padding-top: 25px !important; }
  .pt-60 { padding-top: 30px !important; }
  .pt-70 { padding-top: 35px !important; }
  .pt-80 { padding-top: 40px !important; }
  .pt-90 { padding-top: 45px !important; }
  .pt-100 { padding-top: 50px !important; }
  .pr-10 { padding-right: 5px !important; }
  .pr-20 { padding-right: 10px !important; }
  .pr-30 { padding-right: 15px !important; }
  .pr-40 { padding-right: 20px !important; }
  .pr-50 { padding-right: 25px !important; }
  .pr-60 { padding-right: 30px !important; }
  .pr-70 { padding-right: 35px !important; }
  .pr-80 { padding-right: 40px !important; }
  .pr-90 { padding-right: 45px !important; }
  .pr-100 { padding-right: 50px !important; }
  .pb-10 { padding-bottom: 5px !important; }
  .pb-20 { padding-bottom: 10px !important; }
  .pb-30 { padding-bottom: 15px !important; }
  .pb-40 { padding-bottom: 20px !important; }
  .pb-50 { padding-bottom: 25px !important; }
  .pb-60 { padding-bottom: 30px !important; }
  .pb-70 { padding-bottom: 35px !important; }
  .pb-80 { padding-bottom: 40px !important; }
  .pb-90 { padding-bottom: 45px !important; }
  .pb-100 { padding-bottom: 50px !important; }
  .pl-10 { padding-left: 5px !important; }
  .pl-20 { padding-left: 10px !important; }
  .pl-30 { padding-left: 15px !important; }
  .pl-40 { padding-left: 20px !important; }
  .pl-50 { padding-left: 25px !important; }
  .pl-60 { padding-left: 30px !important; }
  .pl-70 { padding-left: 35px !important; }
  .pl-80 { padding-left: 40px !important; }
  .pl-90 { padding-left: 45px !important; }
  .pl-100 { padding-left: 50px !important; }
  .padding-10 { padding: 5px !important; }
  .padding-20 { padding: 10px !important; }
  .padding-30 { padding: 15px !important; }
  .padding-40 { padding: 20px !important; }
  .padding-50 { padding: 25px !important; }
  .padding-60 { padding: 30px !important; }
  .padding-70 { padding: 35px !important; }
  .padding-80 { padding: 40px !important; }
  .padding-90 { padding: 45px !important; }
  .padding-100 { padding: 50px !important; }
  .sp-mb-0 { margin-bottom: 0px !important; }
  .sp-mb-10 { margin-bottom: 10px !important; }
  .sp-mb-20 { margin-bottom: 20px !important; }
  .sp-mb-30 { margin-bottom: 30px !important; }
  .sp-mb-40 { margin-bottom: 40px !important; }
  .sp-mb-50 { margin-bottom: 50px !important; }
  .sp-mb-60 { margin-bottom: 60px !important; }
  .sp-mb-70 { margin-bottom: 70px !important; }
  .sp-mb-80 { margin-bottom: 80px !important; }
  .sp-mb-90 { margin-bottom: 90px !important; }
  .sp-mb-100 { margin-bottom: 100px !important; }
  .sp-mt-10 { margin-top: 10px !important; }
  .sp-mt-20 { margin-top: 20px !important; }
  .sp-mt-30 { margin-top: 30px !important; }
  .sp-mt-40 { margin-top: 40px !important; }
  .sp-mt-50 { margin-top: 50px !important; }
  .sp-mt-60 { margin-top: 60px !important; }
  .sp-mt-70 { margin-top: 70px !important; }
  .sp-mt-80 { margin-top: 80px !important; }
  .sp-mt-90 { margin-top: 90px !important; }
  .sp-mt-100 { margin-top: 100px !important; }
  .sp-nobg { background: none !important; } }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

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

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

html { font-size: 62.5%; }

#content { font-feature-settings: "palt"; position: relative; }
#content .cover { background-image: url(../images/coverSP_bg.png); height: calc(100vw * 1.585241731); width: 100%; background-size: cover; background-repeat: no-repeat; margin-top: 16.541125641vw; position: relative; z-index: 1; }
@media screen and (min-width: 500px) { #content .cover { background-image: url(../images/coverPC_bg.png); height: calc(100vw * 0.447972972); margin-top: 72px; } }
#content .cover__wrap { margin-right: auto; margin-left: auto; padding-top: 19vw; width: 88%; }
@media screen and (min-width: 500px) { #content .cover__wrap { margin-left: 11vw; padding-top: 5.1vw; width: 41.8%; } }
#content .cover__title__a { width: 100%; }
@media screen and (min-width: 500px) { #content .cover__title__a { width: 78%; } }
#content .cover__title__b { width: 100%; }
#content .cover__title__read { color: #ffffff; font-size: 3.95vw; line-height: 1.8; }
@media screen and (min-width: 500px) { #content .cover__title__read { font-size: 1.13vw; line-height: 1.8; } }
#content .cover__title__read br { display: none; }
@media screen and (min-width: 500px) { #content .cover__title__read br { display: block; } }
#content .signup { background-image: url(../images/about__mv02.jpg); width: 100%; background-size: cover; background-repeat: no-repeat; padding-top: 11.254554021vw; padding-bottom: 0.125844603vw; text-align: center; }
@media screen and (min-width: 500px) { #content .signup { padding-top: 3.054554vw; padding-bottom: 0.125844603vw; } }
#content .signup.signup__primary { margin-top: -14.541126544vw; }
@media screen and (min-width: 500px) { #content .signup.signup__primary { margin-top: -8.541127vw; } }
#content .signup.signup__primary .signup__wrap { margin-bottom: 6.8vw; }
@media screen and (min-width: 500px) { #content .signup.signup__primary .signup__wrap { margin-bottom: 3.3vw; } }
#content .signup.signup__secondary { padding-top: 0.125844603vw; padding-bottom: 0.125844603vw; }
#content .signup.signup__secondary .signup__wrap { align-items: center; flex-direction: column; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary .signup__wrap { margin: 4.6vw auto; padding: 3.88vw 1.48vw; width: 50%; } }
#content .signup.signup__secondary h1 { font-size: 6.1vw; font-weight: bold; line-height: 1.2; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary h1 { font-size: 2.5vw; } }
#content .signup.signup__secondary h1 img { width: 43vw; margin-right: 6px; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary h1 img { width: 17vw; } }
#content .signup.signup__secondary h1 br { display: block; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary h1 br { display: none; } }
#content .signup.signup__secondary .signup__txt { background: none; font-size: 4.3vw; line-height: 1.3; margin-top: 2.6vw; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary .signup__txt { font-size: 1.5701284vw; margin-top: 1vw; margin-bottom: 1vw; } }
#content .signup.signup__secondary .signup__txt br { display: none; }
@media screen and (min-width: 500px) { #content .signup.signup__secondary .signup__txt br { display: block; } }
@media screen and (min-width: 500px) { #content .signup.signup__secondary .signup__link { font-size: 1.820248vw; padding: 1.4vw 1vw; width: 60%; margin: 0; } }
#content .signup__wrap { background-color: #ffffff; margin-left: auto; margin-right: auto; width: 88%; margin-bottom: 10vw; margin-top: 10vw; padding: 7.48vw 7.48vw 6.64vw; border-radius: 6.6px; font-weight: bold; }
@media screen and (min-width: 500px) { #content .signup__wrap { display: flex; align-items: center; justify-content: center; width: 45%; margin-bottom: 3.3vw; margin-top: 9vw; padding: 1.88vw 1.48vw; } }
#content .signup__txt { position: relative; display: inline-block; background: linear-gradient(rgba(0, 0, 0, 0) 60%, #fbc53b 0%); padding-bottom: 3px; font-size: 4.5vw; }
@media screen and (min-width: 500px) { #content .signup__txt { font-size: 1.85vw; } }
#content .signup__link { font-size: 3.5vw; border: 1px solid #C89C5E; background-color: #C89C5E; color: #ffffff; padding: 3vw; display: block; width: 60%; margin: 13px auto 0; border-radius: 10vw; transition-duration: .3s; }
@media screen and (min-width: 500px) { #content .signup__link { font-size: 1.2vw; padding: 1vw; width: 29%; margin: 0 0 0 1.5vw; } }
#content .signup__link:hover { border: 1px solid #C89C5E; background-color: #ffffff; color: #C89C5E; }
#content .articles { background-image: url(../images/blackboard_a.jpg); width: 100%; background-size: cover; background-repeat: no-repeat; color: #ffffff; padding-top: 10vw; padding-bottom: 4vw; }
@media screen and (min-width: 500px) { #content .articles { padding-top: 4vw; padding-bottom: 1.5vw; } }
#content .articles__slider__wrap { overflow-y: hidden; width: 100%; margin-bottom: 3.5vw; }
@media screen and (min-width: 500px) { #content .articles__slider__wrap { overflow: hidden; margin-bottom: 1.3vw; } }
#content .owl-dots { display: none; }
#content .owl-nav { transition-duration: .4s; }
@media screen and (min-width: 920px) { #content .owl-nav { opacity: 0; } }
#content .owl-nav button.disabled { opacity: 0; }
#content .owl-nav .owl-prev { left: -2.65vw; }
#content .owl-nav .owl-prev::before { left: 21px; transform: rotate(222deg); }
#content .owl-nav .owl-next { right: -2.25vw; }
#content .owl-nav .owl-next::before { right: 21px; transform: rotate(45deg); }
#content .owl-nav .owl-prev, #content .owl-nav .owl-next { position: absolute; border: none; top: 33%; text-indent: -9999px; background: #ffffff !important; width: 54px; height: 54px; padding: 0 !important; border-radius: 34px !important; cursor: pointer; }
@media screen and (min-width: 768px) and (max-width: 920px) { #content .owl-nav .owl-prev, #content .owl-nav .owl-next { display: none; } }
#content .owl-nav .owl-prev::before, #content .owl-nav .owl-next::before { content: ""; position: absolute; width: 11px; height: 11px; border-top: 5px solid #000000; border-right: 5px solid #000000; z-index: 5; top: 19px; }
@media screen and (min-width: 500px) { #content .owl-stage { display: flex; justify-content: flex-start; } }
@media screen and (min-width: 500px) { #content .owl-stage-outer { overflow: visible; } }
#content .articles__slider { display: flex; flex-wrap: nowrap; justify-content: unset; width: 88%; margin-left: 6.4854vw; margin-right: 0; margin-top: 4vw; margin-bottom: 8px; position: relative; }
@media screen and (min-width: 500px) { #content .articles__slider { transition-duration: .3s; opacity: 0; } }
@media screen and (min-width: 500px) { #content .articles__slider { margin-left: auto; margin-right: auto; margin-top: 1vw; } }
#content .articles__slider.owl-loaded { opacity: 1; }
@media screen and (min-width: 920px) { #content .articles__slider:hover .owl-nav { opacity: 1; } }
#content .articles__box { position: relative; min-width: 51.158vw; margin-right: 1.7vw; max-width: 54vw; height: calc(100vw * 0.33295); overflow-y: clip; border-radius: 4px; }
@media screen and (min-width: 500px) { #content .articles__box { overflow: hidden; } }
#content .articles__box img { transition-duration: .3s; transform: scale(1); }
#content .articles__box:last-child::after { content: ''; display: block; height: 1px; width: 1px; position: absolute; right: -6.4854vw; bottom: 0; }
@media screen and (min-width: 500px) { #content .articles__box { min-width: inherit; margin-right: 0; max-width: inherit; height: calc(100vw * 0.135815698); width: 100%; }
  #content .articles__box a:hover img { transform: scale(1.07); }
  #content .articles__box a:hover .comment img { transform: scale(1); } }
#content .articles__title { position: absolute; bottom: 0; padding: 20px 8px 5px; background: black; background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 36%, rgba(0, 0, 0, 0) 100%); }
@media screen and (min-width: 500px) { #content .articles__title { padding: 20px 15px 10px; } }
#content .comment { display: none; }
@media screen and (min-width: 920px) { #content .comment { display: block; position: absolute; z-index: 5; top: 12px; right: 12px; width: 22px; height: auto; } }
@media screen and (min-width: 500px) { #content .tooltip .tooltip__content { transition-duration: .3s; opacity: 0; position: absolute; padding: 33px 18px 18px; background: rgba(0, 0, 0, 0.85); color: #fff; z-index: 4; top: 0; left: 0; width: 100%; height: 100%; font-size: 0.858712654vw; line-height: 1.5; font-weight: bold; } }
#content .tooltip:hover .tooltip__content { opacity: 1; }
#content .articles__heading { font-size: 5.6vw; font-weight: bold; width: 88%; margin: 0 auto; }
#content .articles__heading span { color: #FBC53B; }
@media screen and (min-width: 500px) { #content .articles__heading { font-size: 1.46521589vw; } }
#content .articles__required { font-size: 2.8vw; font-weight: bold; color: #ffffff; display: inline-block; padding: 3px 6px; margin-bottom: 4px; border-radius: 2px; }
#content .articles__required.fee { background-color: #000000; }
#content .articles__required.free { background-color: #C89C5E; padding: 3px 14px; }
@media screen and (min-width: 500px) { #content .articles__required { font-size: 0.701545863vw; } }
#content .articles__txt { color: #ffffff; font-size: 3.24vw; line-height: 1.4; font-weight: bold; }
@media screen and (min-width: 500px) { #content .articles__txt { font-size: 0.958712654vw; } }
#content .magazine { background-image: url(../images/blackboard_b.jpg); width: 100%; background-size: cover; background-repeat: no-repeat; color: #ffffff; padding-top: 10vw; padding-bottom: 3vw; }
@media screen and (min-width: 500px) { #content .magazine { padding-top: 6vw; padding-bottom: 1.4vw; } }
#content .magazine_title { width: 88%; margin: 0 auto; text-align: center; }
#content .magazine_title p { font-size: 3.5vw; line-height: 1.4; margin-top: 3.4vw; margin-bottom: 0; }
@media screen and (min-width: 500px) { #content .magazine_title p { font-size: 1.415462vw; line-height: 1.4; margin-top: 1.758602vw; margin-bottom: 1.68521024vw; letter-spacing: .12458vw; } }
#content .magazine__heading { font-weight: bold; font-size: 5.8vw; position: relative; border-bottom: 1px solid #FBC53B; padding: 0 8.85vw 3.425706548vw; display: inline-block; line-height: 1.3; }
@media screen and (min-width: 500px) { #content .magazine__heading { font-size: 2.995874201vw; padding: 0 3.45vw 1.3706548vw; } }
#content .magazine__heading br { display: block; }
@media screen and (min-width: 500px) { #content .magazine__heading br { display: none; } }
#content .magazine__heading span { color: #FBC53B; }
#content .magazine__heading::before, #content .magazine__heading::after { background-size: cover; background-repeat: no-repeat; content: ''; display: block; position: absolute; top: 3.3452vw; min-width: 4.8215vw; height: calc(100vw * 0.081256884); }
@media screen and (min-width: 500px) { #content .magazine__heading::before, #content .magazine__heading::after { top: -0.6vw; min-width: 2.6vw; height: calc(100vw * 0.04118); width: inherit; } }
#content .magazine__heading::before { background-image: url(../images/headingDingbat_left.png); left: 1vw; }
@media screen and (min-width: 500px) { #content .magazine__heading::before { left: -0.5vw; } }
#content .magazine__heading::after { background-image: url(../images/headingDingbat_right.png); right: 1vw; }
@media screen and (min-width: 500px) { #content .magazine__heading::after { right: -0.5vw; } }
#content .magazine__slider__wrap { overflow-y: hidden; width: 100%; margin-bottom: 3.5vw; }
@media screen and (min-width: 500px) { #content .magazine__slider__wrap { overflow: hidden; } }
#content .magazine__slider { display: flex; flex-wrap: nowrap; justify-content: unset; width: 88%; margin-left: 6.4854vw; margin-right: 0; margin-top: 4vw; margin-bottom: 8px; position: relative; }
@media screen and (min-width: 500px) { #content .magazine__slider { margin-left: auto; margin-right: auto; margin-top: 1vw; } }
@media screen and (min-width: 1050px) { #content .magazine__slider:hover .owl-nav { opacity: 1; } }
#content .magazine__slider .owl-nav .owl-next, #content .magazine__slider .owl-nav .owl-prev { top: 40%; cursor: pointer; }
#content .magazine__box { position: relative; min-width: 37.158vw; margin-right: 1.7vw; height: calc(100vw * 0.46395); overflow-y: clip; border-radius: 4px; }
#content .magazine__box:last-child::after { content: ''; display: block; height: 1px; width: 1px; position: absolute; right: -6.4854vw; bottom: 0; }
@media screen and (min-width: 500px) { #content .magazine__box { height: calc(100vw * 0.26911); min-width: inherit; margin: 0; } }
#content .magazine__box img { opacity: 1; transition-duration: .3s; }
#content .magazine__box:hover img { opacity: .7; filter: grayscale(1); }
#content .new__release { color: #ffffff; padding: 7vw 0; }
@media screen and (min-width: 500px) { #content .new__release { padding: 4vw 0; } }
#content .new__release .new__release__wrap { background-color: #5C0428; background-image: url(../images/dog-ear.png); background-repeat: no-repeat; background-position: top right; background-size: 22px; display: flex; width: 88%; margin: 0 auto; }
@media screen and (min-width: 500px) { #content .new__release .new__release__wrap { background-size: 50px; width: 60%; } }
#content .new__release .new__release__wrap > a { display: block; width: 40%; }
@media screen and (min-width: 500px) { #content .new__release .new__release__wrap > a { width: 30%; } }
#content .new__release .new__release_text { display: flex; flex-direction: column; justify-content: center; width: 60%; margin: 0 auto; }
@media screen and (min-width: 500px) { #content .new__release .new__release_text { width: 70%; } }
#content .new__release .new__release_text a { color: #ffffff; text-decoration: underline; }
#content .new__release .new__release_text a:hover { text-decoration: none; }
#content .new__release .new__release_text h1 { font-size: 3.8vw; font-weight: bold; width: 84%; margin: 0 auto 1vw; line-height: 1.4; }
@media screen and (min-width: 500px) { #content .new__release .new__release_text h1 { font-size: 1.8vw; } }
#content .new__release .new__release_text p { font-size: 3vw; width: 84%; margin: 0 auto; line-height: 1.4; }
@media screen and (min-width: 500px) { #content .new__release .new__release_text p { font-size: 1.25vw; } }
#content .sns-icons.pc { display: none; }
@media screen and (min-width: 500px) { #content .sns-icons.pc { display: block; position: absolute; right: 0; left: auto; top: auto; bottom: -60px; padding: 10px 20px; } }
#content .sns-icons.sp { padding: 0; display: flex !important; top: auto; bottom: -1px; position: relative; }
#content .sns-icons.sp a { width: 25%; margin: 0 !important; display: block; }
@media screen and (min-width: 500px) { #content .sns-icons.sp { display: none !important; } }
#content .articles__header { width: 88%; margin: 0 auto; }
@media screen and (min-width: 500px) { #content .articles__header { display: flex; justify-content: space-between; } }
#content .articles__header h2 { width: inherit; margin: 0; }
#content .notice { display: none; font-size: .8vw; }
@media screen and (min-width: 920px) { #content .notice { display: block; } }
#content .notice .comment { position: inherit; display: inline-block; vertical-align: middle; width: 18px; margin-left: -18px; }

.owl-carousel, .owl-carousel .owl-item { -webkit-tap-highlight-color: transparent; position: relative; }

.owl-carousel { display: none; width: 100%; z-index: 1; }

.owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; }

.owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

.owl-carousel .owl-stage-outer { position: relative; overflow: hidden; -webkit-transform: translate3d(0, 0, 0); }

.owl-carousel .owl-item, .owl-carousel .owl-wrapper { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); }

.owl-carousel .owl-item { min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-touch-callout: none; }

.owl-carousel .owl-item img { display: block; width: 100%; }

.owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled { display: none; }

.no-js .owl-carousel, .owl-carousel.owl-loaded { display: block; }

.owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot { background: 0 0; color: inherit; border: none; padding: 0 !important; font: inherit; }

.owl-carousel.owl-loading { opacity: 0; display: block; }

.owl-carousel.owl-hidden { opacity: 0; }

.owl-carousel.owl-refresh .owl-item { visibility: hidden; }

.owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.owl-carousel.owl-grab { cursor: move; cursor: grab; }

.owl-carousel.owl-rtl { direction: rtl; }

.owl-carousel.owl-rtl .owl-item { float: right; }

.owl-carousel .animated { animation-duration: 1s; animation-fill-mode: both; }

.owl-carousel .owl-animated-in { z-index: 0; }

.owl-carousel .owl-animated-out { z-index: 1; }

.owl-carousel .fadeOut { animation-name: fadeOut; }

@keyframes fadeOut { 0% { opacity: 1; }
  100% { opacity: 0; } }
.owl-height { transition: height .5s ease-in-out; }

.owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity .4s ease; }

.owl-carousel .owl-item .owl-lazy:not([src]), .owl-carousel .owl-item .owl-lazy[src^=""] { max-height: 0; }

.owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; }

.owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; }

.owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url(owl.video.play.png) no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform .1s ease; }

.owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); }

.owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn { display: none; }

.owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity .4s ease; }

.owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; }