@charset "UTF-8";

/*
Theme Name: mx
Author: Yuuki Sakai
Description: meloflux.com専用テーマ
*/

body,dd,dl,dt,form,h1,h2,h3,h4,h5,li,ol,p,table,td,th,ul{margin:0px;padding:0px;font-weight:normal;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;list-style-type:none;font-size:100%}
* html body{font-size:100%}a{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-touch-callout:none}a img{border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none}a img.animate{-webkit-transition:0.5s;transition:0.5s}img{vertical-align:bottom;max-width:100%;height:auto;-webkit-backface-visibility:hidden;backface-visibility:hidden}button,input,select,textArea{background:none;margin:0px;outline:none;padding:0px;font-weight:normal;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;list-style-type:none;font-size:16px;-webkit-appearance:none}button{cursor:pointer}*{-webkit-box-sizing:border-box;box-sizing:border-box}a:link{color:#000000;text-decoration:none}a:visited{color:#000000;text-decoration:none}a:hover{color:#000000;text-decoration:underline;-webkit-transition:0.5s;transition:0.5s}a:hover img.animate{-webkit-transition:0.5s;transition:0.5s;opacity:0.8}.clear:after{content:"";display:block;clear:both}.clear_both{clear:both}input[type=text], input[type=url], input[type=password], input[type=email], input[type=search], input[type=tel], textarea {background-color: #fff;background-image: none;border: 1px solid #ccc;box-shadow: 0 1px 1px rgba(0,0,0,.075) inset;color: #9a9a9a;line-height: 1.42857;padding: 6px 12px;width: 100%;transition: border-color .15s ease-in-out 0,box-shadow .15s ease-in-out 0;box-sizing: border-box;}.button,button,input[type=submit],input[type=reset],input[type=button]{display:inline-block;margin-bottom:20px;padding:10px 60px;border:1px solid #75288b;border-radius:3px;background:#9a34b7;color:#fff;text-decoration:none;font-weight:700;line-height:normal;cursor:pointer;font-size:1.2em}.button:hover,button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{opacity:.8}

input[type=text], input[type=url], input[type=password], input[type=email], input[type=search], input[type=tel], textarea {background-color: #fff;background-image: none;border: 1px solid #ccc;box-shadow: 0 1px 1px rgba(0,0,0,.075) inset;color: #9a9a9a;line-height: 1.42857;padding: 6px 12px;width: 100%;transition: border-color .15s ease-in-out 0,box-shadow .15s ease-in-out 0;box-sizing: border-box;}.button,button,input[type=submit],input[type=reset],input[type=button]{display:inline-block;margin-bottom:20px;padding:10px 60px;border:1px solid #9d35a3;border-radius:3px;background:#9d35a3;color:#fff;text-decoration:none;font-weight:700;line-height:normal;cursor:pointer;font-size:1.2em}.button:hover,button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{opacity:.8}.wpcf7-select{padding: .4em;font-size: 1em;}

@font-face{font-family:Mulish;src:url('/wp-content/themes/mx/webfonts/mulish/Mulish-Regular.ttf') format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Mulish;src:url('/wp-content/themes/mx/webfonts/mulish/Mulish-Black.ttf') format("truetype");font-weight:700;font-display:swap}
html{overflow-y: scroll;}
body{color:#000000;background-color:#ffffff;font-family:"Mulish","Helvetica Neue",HiraginoHelvetica,Hiragino Kaku Gothic ProN,Hiragino Sans,Helvetica Neue,arial,meiryo,sans-serif;line-height:1.3;font-size:16px;-webkit-text-size-adjust:none}
p{line-height:1.6}
p a{text-decoration:underline}
iframe {width: 100%}
html{scroll-behavior:smooth}
main{display: block; margin:0}
.layout{margin:2em 0}
.side-grid{margin:0 1em}
@media screen and (min-width: 576px) {
}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
	main{display: grid;grid-template-columns: 340px 800px;column-gap: 40px;max-width: 1180px;margin: 4em auto;grid-template-areas: "side main";}
	.layout{ margin:4em auto}
	.main-grid {grid-area: main;}
	.side-grid {grid-area: side; margin:0}
}

a{color:#000;text-decoration:none;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease;}
a:hover{color:#4277ce;text-decoration:none !important;}
a:hover img{opacity:.75;filter:alpha(opacity=75);-ms-filter:"alpha(opacity=75)";-khtml-opacity:.75;-moz-opacity:.75;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease;}

:root{--header-py: clamp(20px, 2.4vw, 40px);--header-bg: #000;--burger-w: clamp(28px, 6.5vw, 40px);--burger-h: clamp(20px, 5vw, 28px);--bar: clamp(1px, 0.5vw, 2px);--bar-color:#fff;--drawer-w: clamp(240px, 100%, 340px);--speed: .45s;--easing: cubic-bezier(.16,.84,.24,1);--backdrop: rgba(0,0,0,.24);--z-header: 1000;--z-drawer: 1001;--z-backdrop: 1000;}
#header{position: sticky; top: 0; z-index: var(--z-header);background: var(--header-bg);box-shadow: 0 1px 0 rgba(0,0,0,.06);display: flex; justify-content: center; align-items: center;padding: var(--header-py) 0;min-height: calc(var(--burger-h) + var(--header-py) * 2);box-sizing: border-box;}
.h-logo{margin: 0; line-height: 1;}
.h-logo img{display:block; height:auto;max-height: clamp(14px, 6vw, 14px);width:auto;}
@media screen and (min-width: 576px) {
	.h-logo img{max-height: clamp(20px, 6vw, 20px)}
}
.h-slider-toggle{position: absolute;appearance: none; -webkit-appearance: none;width:1px; height:1px; margin:0; padding:0; border:0;clip-path: inset(50%); overflow:hidden; white-space:nowrap;}
.h-slider-button{position: absolute; left: clamp(20px, 3vw, 26px); top: 50%;transform: translateY(-50%);width: var(--burger-w); height: var(--burger-h);display: block;cursor: pointer; padding: clamp(4px, 1vw, 6px) 2px;z-index: var(--z-drawer);min-width: 30px; min-height: 34px;}
.h-slider-button span{position: absolute; left: 0; right: 0;height: var(--bar); background: var(--bar-color);border-radius: 2px;transform-origin: 50% 50%;transition: transform var(--speed) var(--easing), opacity var(--speed) var(--easing), top var(--speed) var(--easing), bottom var(--speed) var(--easing);}
.h-slider-button span:nth-child(1){ top: 5px; }
.h-slider-button span:nth-child(2){ top: calc(50% - var(--bar) / 2); }
.h-slider-button span:nth-child(3){ bottom: 5px; }
.h-slider-nav{position: fixed; inset: 0 auto 0 0;width: var(--drawer-w); transform: translateX(-100%);opacity: 0;transition: transform var(--speed) var(--easing), opacity var(--speed) var(--easing);background: #292929;box-shadow: 2px 0 18px rgba(0,0,0,.16);padding: 6em 0 0;z-index: var(--z-header);will-change: transform, opacity;overflow-y: auto; -webkit-overflow-scrolling: touch;}
.h-slider-drop{position: fixed; inset: 0;background: var(--backdrop);opacity: 0; pointer-events: none;transition: opacity var(--speed) var(--easing);z-index: var(--z-backdrop);}
.h-slider-toggle:checked ~ .h-slider-nav{transform: translateX(0);opacity: 1;}
.h-slider-toggle:checked ~ .h-slider-drop{opacity: 1; pointer-events: auto;}
.h-slider-toggle:checked ~ .h-slider-button{position:fixed; top:36px}
@media screen and (min-width: 576px) {
	.h-slider-toggle:checked ~ .h-slider-button{position:fixed; top:46px}
}
@media screen and (min-width: 1024px) {
	.h-slider-toggle:checked ~ .h-slider-button{position:fixed; top:6.6vh}
}
.h-slider-toggle:checked ~ .h-slider-button span:nth-child(1){top: 50%; transform: translateY(-50%) rotate(45deg);}
.h-slider-toggle:checked ~ .h-slider-button span:nth-child(2){opacity: 0;}
.h-slider-toggle:checked ~ .h-slider-button span:nth-child(3){bottom: auto; top: 50%; transform: translateY(-50%) rotate(-45deg);}
@media (prefers-reduced-motion: reduce){.h-slider-nav, .h-slider-drop, .h-slider-button span{ transition: none; }}
@supports selector(body:has(#h-toggle:checked)){body:has(#h-toggle:checked){ overflow: hidden; }}
.h-slider-nav-search{padding:0 1em;}
.h-slider-nav nav ul li a{color: #fff;display: block;padding: 1em;text-decoration: none;}
.h-slider-nav nav ul li a:after {content: attr(title) "";display: block;font-size: .6em;line-height: 2.4em;}
.h-slider-nav nav ul li a:hover{background:#494949;}
.social-list{display: flex;align-items: center;justify-content: center;margin: 2em 0 0;padding: 2em 0 0;border-top: 1px solid #494949;}
.social-list li {margin: 0 .4em;}
.social-list li a {display: block;width: 60px;height: 60px;border-radius: 50%;text-align: center;cursor: pointer;background: #494949;color: #fff;font-size: 1.6rem;line-height: 66px !important;transition: transform ease-out 0.2s, background 0.2s;}
.social-list li a:hover{background: rgba(255,255,255,0.05);transform: scale(0.9);color: #fff;}

.search-box{margin:0 0 1em;padding:0;position:relative;}
.search-edit{border:0 !important;border-radius:8px;height:40px;}
.search-submit{position:absolute;right:10px;top:8px;font-size:1.4em;cursor:pointer;line-height:32px;border:0;color:#ddd;padding:0;background:#fff;}
select{border: 1px solid #ccc;box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset;appearance: revert;-webkit-appearance: revert;-moz-appearance: revert;}

.main-header{margin:2em 1em}
.main-heading{font-size: 1.2em;font-weight: 900;margin: 0 0 2rem;}
.main-heading:before {content: attr(title) "";display: block;font-size:2.4rem;font-weight: 900;}
.main-description{border:1px solid #c9c9c9; padding:1em; margin:0 0 2em}
.main-description p{font-size:.8em}
.top-news .main-list-item{display:block;margin:0 0 1em; padding:0 0 1em; border-bottom:1px solid #efefef}
.top-news .main-list-item:hover{text-decoration:none;color:#696969}
.top-news .main-list-item figure{width:100%; margin:0 0 1em}
.top-news .main-list-item figure img{width:100%}
.top-news .main-list-item-card{margin:0 1em}
.top-news .main-list-item-card time{text-align:right;font-size:.8em;letter-spacing: 0.2em;display: block;margin:0 0 1vh;}
.top-news .main-list-item-card h3{font-weight:700; font-size:.88em; line-height:1.6}
.main-list{display:flex;justify-content: space-between;flex-wrap: wrap;margin:0 1em}
.main-list .main-list-item{width:49%;margin:0 0 1em; padding:0 0 1em;}
.main-list .main-list-item:hover{text-decoration:none;color:#696969}
.main-list .main-list-item figure{width:100%; margin:0 0 1em}
.main-list .main-list-item-card time{text-align:right;font-size:.8em;letter-spacing: 0.2em;display: block;margin:0 0 1vh;}
.main-list .main-list-item-card h2,.main-list .main-list-item-card h3{font-weight:700; font-size:.8em; line-height:1.6}

.main-more{padding: 1em;text-align: center; margin:0 0 4em;}
.main-more a {display: block;border: 1px solid #000;padding: 1em;}
.main-more a:hover{background:#000; color:#fff}

.side-heading{font-size:2.4rem;font-weight:900;text-align:center;margin:0 0 2rem;}
.side-related-heading{font-size:1.4rem;font-weight:900;margin:0 0 2rem;}
.side-list{display: flex;justify-content: space-between;flex-wrap: wrap;}
.side-list li{width:49%;margin:0 0 1em; padding:0 0 1em;}
.side-list li .side-post-image{margin:0 0 1em; display:block}
.side-list li .side-post-title{font-size:.8em; line-height:1.6}
.side-list li .side-post-title:hover{color:#696969}
/**** footer ************************/
#footer{background:#000}
.footer-container{padding:2em 1em}
.footer-nav ul{margin:0 0 2em}
.footer-nav li a{color:#fff; font-weight:900; display:block;margin: 0 0 1em;}
.footer-nav li a:hover{text-decoration:underline !important}
.footer-about{color:#fff}
.footer-about a{color:#fff;text-decoration:underline !important}
.footer-about a:hover{text-decoration:none !important}
.footer-copy{background:#75288b; text-align:center; color:#fff; font-size:.6em; padding:2em 0}

@media screen and (min-width: 576px) {
}
@media screen and (min-width: 768px) {
	.main-list .main-list-item-card h2,.main-list .main-list-item-card h3{font-size:1.4em; line-height:1.4}
}
@media screen and (min-width: 1024px) {
	.top-news .main-list a{width:24%;}
	.main-list{display:block; margin:0}
	.main-list .main-list-item{width:auto;}
	.main-list .main-list-item article{display:flex;justify-content: space-between;flex-wrap: wrap;border-bottom:1px solid #efefef; margin:0 0 2em;padding:0 0 2em;}
	.main-list .main-list-item article figure{width:30%; margin:0}
	.main-list .main-list-item article .main-list-item-card{width:68%}
	.main-header{margin:0}
	.main-heading{font-size:1.4rem;text-align: center;}
	.main-heading:before {font-size:4rem;}
	.main-description p{font-size:1em}
	.main-more{width:40%; margin:0 auto 4em}
	.side-heading{font-size:2rem; text-align:left}
	.side-list{display:block}
	.side-list li{width:auto;display:flex;justify-content: space-between;flex-wrap: wrap; padding:0}
	.side-list li .side-post-image{width:30%; margin:0}
	.side-list li .side-post-title{width:68%}
	.footer-container{padding:2em 0;max-width:1180px; margin:0 auto}
	.footer-nav ul{display:flex;}
	.footer-nav li{flex:1}
	.footer-nav li a{text-align:center;margin:0}
}
/**** pagination ********************/
.pagination{display: flex;justify-content: center; margin:0 0 4em}
.pagination li{margin:.2em;}
.pagination a{text-decoration:none;border:0;padding:.6em .8em;color:#fff; font-size:.8em;display:block;background:#c9c9c9; border-radius:4px}
.pagination li:not([class*="current"]) a:hover{background:#9d35a3;}
.pagination .current a{background-color:#333;cursor:default;pointer-events:none;}
@media screen and (min-width: 1024px) {
	.pagination a{ font-size:1em}
}

.posted-image{margin:0 0 2em}
.posted-image figcaption{margin:.4em 1em 0; font-size:.8em}
.posted-header, .posted-contents{margin:0 1em 2em}
.posted-header h1{font-size: 1.4em; font-weight:900;line-height: 1.4; margin:0 0 1em}
.posted-header-item{display: flex;justify-content:space-between;margin: 0 0 1em;align-items: center;}
.posted-header-item li{font-size: .8em;}
.posted-header-item .posted-header-author a{display: flex;align-items: center;}
.posted-header-item .posted-header-author a span{margin:0 .4em}
.posted-header-item li time{letter-spacing: 0.2em;}
.posted-header-pr{font-size: .68em; margin:0 0 1em}

.share-list{display: flex;margin:0 0 2em;}
.share-list li {margin: 0 0.2em;}
.share-list li a {display: block;width: 40px;height: 40px;border-radius: 50%;text-align: center;position: relative;z-index: 1;background: #494949;color: #fff;line-height: 40px !important;transition: transform ease-out 0.2s, background 0.2s;}
.share-list li a:after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: 50%;z-index: -1;transform: scale(0.9);}
.share-list li a svg {width: 18px;height: 18px;fill: #fff;vertical-align: sub;}
.share-list li a:hover {background: rgba(255,255,255,0.05);transform: scale(0.9);color: #fff;}
.share-list li a:hover:after {animation: sonar 1s ease-out 75ms;}
.share-list li a:hover{background: #292929;}

.posted-contents p{margin:0 0 2em; line-height:1.8}
.posted-contents p a{text-decoration:underline}
.posted-contents h2{font-size:1.4em;font-weight:700;margin:0 0 1em;}
.posted-contents h3{font-size:1.2em;font-weight:700;margin:0 0 1em;}
.posted-contents h4,.posted-contents h5,.posted-contents h6{font-size:1.2em;font-weight:700;margin:0 0 1em;}
.posted-contents .photo-slider {text-align: center;margin: 1em 0;}
.posted-contents .photo-slider a {display: inline-flex;border: 1px;align-items: center;border: 1px solid #000;padding: 1em 2em;color: #000;text-decoration: none;cursor: pointer;justify-content: center;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;display: -webkit-inline-box;display: -webkit-inline-flex;display: -ms-inline-flexbox;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;}
.posted-contents .photo-slider a:hover{background:#000;color:#fff;}
.mv-frame{aspect-ratio: 16 / 9;max-width: 600px;margin:0 0 2em;}
.mv-frame iframe {height: 100%;}
.posted-contents table,.posted-contents th,.posted-contents td {border-collapse: collapse;}
.posted-contents table{width:100%;margin:0 auto 2em;box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);font-size:.88em;line-height: 1.6;}
.posted-contents th {border-bottom: 2px solid #75288b;padding:1em;font-weight: 700;text-align: center;width: 20%;min-width: 4em;}
.posted-contents td{padding:1em;border-bottom: 2px solid #c1c7c6;}
.posted-contents tr:nth-of-type(even) {background: #f3f3f3;}


.artists-list{display: flex;flex-wrap: wrap;}
.artists-list li{width: auto;text-align: center;margin: 0 .2em 1em;}
.artists-list li a{border: 1px solid #000;padding:1em .6em;font-size:.8em;color: #000;text-decoration: none;cursor: pointer;display:block;}
.artists-list li a:hover{background:#000;color:#fff;}
@media screen and (min-width: 768px) {
	.artists-list li{width: 48%}
}

blockquote img{
	width:100%;
	height:auto;
}
blockquote p{
	margin:0 0 1em !important;
	font-size:1em !important;
}
blockquote footer{
	font-size:.8em;
}
blockquote footer cite a{
	color:#306acb;
    text-decoration: underline;
}
blockquote footer cite a:hover{
	text-decoration:none;
	color:#306acb;
}
blockquote{
	background:#eee;
	border:1px solid #ccc;
	margin:0 0 2em;
	padding:2em 1em;
	position:relative;
}
blockquote:before{
	color:#aaa;
	content:"\"";
	font-family:serif;
	font-size:4em;
	left:10px;
	line-height:1em;
	position:absolute;
	top:0;
}
blockquote:after{
	color:#aaa;
	content:"\"";
	font-family:serif;
	font-size:4em;
	line-height:0;
	position:absolute;
	right:10px;
	bottom:0;
}
.reference{background:#f9f9f9;padding:0 1em 1em;border:1px solid #000;position:relative;}
.reference span{background:#000;color:#fff;font-size:.8em;font-weight:900;position:absolute;top:-1.4em;left:-0.8em;padding: 0.6em;}


@media screen and (min-width: 768px) {
	.posted-header-pr{font-size: 1em;}
}
@media screen and (min-width: 1024px) {
	.posted-header h1{font-size: 2em;}
	.share-list li a{font-size: 1em;}
	.posted-contents h2{font-size:2em;}
	.posted-contents h3{font-size:1.8em;}
	.posted-contents h4{font-size:1.4em;}
}

.posted-footer{margin:0 1em 2em}
.audio-link-list{border-bottom:1px solid #eee; padding:0 0 2em; margin:0 0 2em}
.audio-link-item{display: flex;justify-content: space-between; margin:0 0 1em}
.audio-link-image{width:30%}
.audio-link-image a img{width:100%}
.audio-link-heading{width:68%}
.audio-link-title{font-weight:900}
.audio-link-artists{ font-size:.8em}
:root {--gap: 8px;}
.audio-link-product{display: flex;flex-wrap: wrap;gap:var(--gap);}
.audio-link-product li{box-sizing: border-box;flex: 1 1 calc((100% - var(--gap)) / 2);}
.audio-link-product li:only-child{flex-basis: 100%;}
.audio-link-product:has(> li:nth-child(3):last-child) > li:last-child{flex-basis: 100%;}
.audio-btn_amazon{display:inline-block;border-radius:6px;padding:1em 0;text-decoration:none !important;width:100%;text-align:center;margin:0;font-weight: 700;font-size: .68em;}
.audio-btn_amazon:hover{opacity:.6;}
.amazon_jp{color:#fff !important;background-color:#007dcd;border-bottom:4px solid #0064a4;}
.amazon_import{color:#fff !important;background-color:#405672;border-bottom:4px solid #232f3e;}
.amazon_prime{color:#0a3638 !important;background-color:#25d1da;border-bottom:4px solid #0a3638;}

.post-name{margin: 0 0 1em;}
.post-name a {background: #000;padding: .6em 1em;border-radius: 6px;color: #fff;font-size: .8em;line-height: 1.2;white-space: nowrap;text-decoration: none;margin: 0 0 .4em 0;width: auto;text-align: center;display: inline-block;}
.post-name a:hover{ background:#9a34b7}
.post-metatag {margin: 0 0 1em;}
.post-tag a {border: 1px solid #494949;font-size: .8em;line-height: 1em;color: #494949;display: inline-block;white-space: nowrap;padding: .8em;margin-top: 3px;border-radius: 4px;text-decoration: none;}
.post-tag a:hover{background:#999; border:1px solid #999; color:#fff}
.tag-separator {margin: 0 .4em;}
.author-box{background:#f0f0f0;padding:1.4em 1em;display:block;position:relative; margin:0 0 2em}
.author-title{position:absolute;top:0;right: 4px;font-weight: 900;font-size: 2em;line-height: 1;color: #e0e0e0;}
.author-eyecatch{margin:0}
.author-eyecatch img{width:100px;height:100px;}
.author-item{width:auto;z-index: 1;}
.author-name{margin:0 0 .6em;}
.author-name a{font-weight:700;}
.author-text{font-size:.8em;margin:0 0 1em;padding:0 0 1em;border-bottom:1px dotted #d9d9d9;}
.author-item ul{display: flex;justify-content: flex-end;font-size: 1.2em;}
.author-item ul li{margin:0 0 0 .2em;}
.author-item ul li a{display: block;width: 30px;height: 30px;border-radius: 50%;text-align: center;position: relative;z-index: 1;border: 1px solid #999;line-height: 2.2em !important;transition: transform ease-out 0.2s, background 0.2s;color: #999;font-size: .8em;}
.author-item ul li a:after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: 50%;z-index: -1;transform: scale(0.9);}
.author-item ul li a:hover{border: 1px solid #c9c9c9;color: #c9c9c9;}
.author-item ul li a svg{fill:#999;width: 16px;height: 16px}
.author-item ul li a:hover svg{fill:#c9c9c9;}
@media screen and (min-width: 768px) {
	.audio-link-image{width:10%}
	.audio-link-heading{width:88%}
	.audio-link-product{flex-wrap: nowrap;}
	.audio-link-product li{flex: 1 1 0;min-width: 0;}
	.audio-link-product:has(> li:nth-child(3):last-child) > li:last-child{flex: 1 1 0%;}
	.audio-btn_amazon{font-size: .8em;}

}

.slider-header{padding:2em 0 0}
.back-to-link{text-align: center;margin: 1em 0;}
.back-to-link a {display: inline-flex;border: 1px;align-items: center;border: 1px solid #000;padding: 1em 2em;color: #000;text-decoration: none;cursor: pointer;justify-content: center;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;display: -webkit-inline-box;display: -webkit-inline-flex;display: -ms-inline-flexbox;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;}
.back-to-link a:hover{background:#000; color:#fff}

.meta-slider .flex-control-nav {display: none;}
.meta-slider .slides img {display: block;margin: 0 auto;max-width: 100%;height: auto;}
.meta-slider .slides {text-align: center;}
.meta-slider {overflow: hidden;}
.metaslider .caption{font-size: .8em;}
.slideshow{position: relative;width: 100%;max-width: 1200px;margin: 0 auto;overflow: hidden;}
.slideshow .slide{aspect-ratio: 1 / 1;width: 100%;background: #000;display: flex;align-items: center;justify-content: center;overflow: hidden; margin:0}
.slideshow .slide.is-active{opacity: 1;pointer-events: auto;z-index: 1;}
.slideshow .slide picture { display: contents; }
.slideshow .slide img{display: block;max-width: 100%;max-height: 100%;width: auto;height: auto;object-fit: contain;display: block;object-position: center}
.slideshow .slide{position: absolute;}
.slideshow .slide figcaption{position: absolute;left: 0; right: 0; bottom: 0;background: rgba(0,0,0,.5);color: #fff;font-size: .9rem;padding: .5em .75em;}
.slideshow .slide figcaption a{ color: #fff; text-decoration: underline; }
.slideshow .nav{position: absolute;top: 50%;transform: translateY(-50%);width: 30px; height: 48px;background: rgba(225,225,225,.4);color: #fff;border: none;cursor: pointer;font-size: 1.5rem;line-height: 48px;text-align: center;z-index: 2;padding:0;}
.slideshow .prev{ left: 0; }
.slideshow .next{ right: 0; }
.slideshow .nav:hover{ background: rgba(0,0,0,.6); }
@media (prefers-reduced-motion: reduce){
	.slideshow .slide{ transition: none; }
}
@media screen and (min-width: 768px) {
	.slideshow .nav{width: 44px; height: 44px;}
}
@media screen and (min-width: 1024px) {
	.slider-header{padding:0}
}


/**** breadcrumb ********************/
#breadcrumb{background:#292929;padding:1em;}
.breadcrumb-list ul{display: table;}
.breadcrumb-list ul li {margin: 0 .6em 0 0;display: inline;color:#fff}
.breadcrumb-list ul li a{color:#fff;font-size:.8em;margin: 0 .6em 0 0;}
.breadcrumb-list ul li a:hover{color:#999;}
@media screen and (min-width: 768px) {
	.breadcrumb-list ul li a{font-size:1em;}
}
@media screen and (min-width: 1024px) {
	.breadcrumb-list{max-width: 1180px; margin:0 auto}
}


/**** archive ***********************/
.archive-heading{
	font-size: 1.4em;
    font-weight: 900;
	margin: .4em 0;
	text-align:center;
}
.archive-heading:before {
    content: attr(title) "";
    display: block;
    font-size: 3em;
    font-weight: 700;
}
.archive-subheading{
	text-align:center;
}
.archive-description{
	border-top:1px solid #eee;
	padding:1em 0;
	margin: 0 0 1em;
	line-height:1.6;
}
.archive-heading-link{
	display:flex;
	justify-content: center;
}
.archive-heading-link li{
	margin:0 1em 0 0;
}
.archive-heading-link li .fa-angle-right{
	margin:0 .4em 0 0;
}
.archive-heading-link li a{
	color: #306acb;
    text-decoration: underline;
}
.archive-heading-link li a:hover{
	text-decoration:none;
}
.archive-list{
	margin:0 0 2em;
}
.archive-list-item{
	margin:0 .4vw 1vw;
	width:23.8%;
	color:#000;
	text-decoration:none;
}
.archive-list-item article{
	display:flex;
	justify-content: space-between;
}
.archive-list-item figure{
	margin: 0 1em 0 0;
    position: relative;
    overflow: hidden;
    padding-top: 132px;
	width:28%;
}
.archive-list-item figure img {
    width: 234px;
    height: 132px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
	object-fit:cover;
}
.archive-list-item .main-list-item-card{
	width:70%;
}
.archive-list-item h2{
	font-size:1.6em;
	font-weight:700;
	line-height:1.4;
}
.archive-list-item time{
	font-size:.8em;
}
.archive-list-item time .fa-clock{
	margin:0 .4em 0 0;
}
.archive-list-item:hover{
	color:#999;
}
.archive-list-item figure img:hover{
	opacity:.8;
}

@media screen and (max-width: 1024px) {
	.archive-list{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.archive-list-item{
		width:49%;
	}
	.archive-list-item article{
		display:block;
	}
	.archive-list-item figure{
		width:100%;
		height:auto;
		margin:0 0 .6em;
		padding-top:56.29%;
	}
	.archive-list-item figure img{
		width:100%;
		height:auto;
	}
	.archive-list-item .main-list-item-card{
		width:auto;
	}
	.archive-list-item h2{
		font-size:1em;
	}
	.archive-list-item time{
		font-size:.6em;
	}


}

@media screen and (max-width: 767px) {
	.archive-heading,
	.archive-subheading{
		text-align:left;
	}
	.archive-heading-link{
		justify-content: left;
	}

}

@media screen and (max-width: 450px) {
	.archive-heading:before{
		font-size:1.6em;
	}
	.archive-description{
		font-size:.8em;
		line-height:1.6;
	}

}

/**** song archive ******************/
.songs-archive-heading{
	font-size: 3em;
    font-weight: 900;
    margin: 0.4em 0 0;
}
.songs-archive-subheading{
	font-size: 1.4em;
    font-weight: 700;
    margin: 0 0 0.4em;
}
.songs-archive-list-item article{
	display:flex;
	align-items: flex-start;
	margin: 0 0 1em;
}
.songs-archive-list-item figure {
    margin: 0 1em 0 0;
    width: 20%;
}
.songs-archive-list-item-card{
	width:70%;
}
.songs-archive-list-item-card h2 {
	font-size: 2em;
    font-weight: 700;
	line-height:1;
}
.songs-archive-list-item-artists{
	font-size: 1.2em;
}
.songs-archive-list-item-category{
	font-size:.8em;
}

@media screen and (max-width: 767px) {
	.songs-archive-list-item figure{
		width:38%;
	}
	.songs-archive-list-item-card{
		width:60%;
	}
}

@media screen and (max-width: 450px) {
	.songs-archive-list-item-card h2 {
		font-size:1.2em;
		margin:0 0 .2em;
	}
	.songs-archive-list-item-artists{
		font-size:1em;
	}
}








/**** page **************************/
.page-heading{
	font-size:3em;
	font-weight:700;
	margin:0 0 1em;
}
.page-heading-item,
.page-heading-attribution-item{
	display:flex;
	align-items: center;
}
.page-heading-item time{
	margin:0 .6em 0 0;
}
.page-heading-item time .fa-clock,
.page-heading-item time .fa-history{
	margin:0 .6em 0 0;
}
.page-heading-category a{
	background:#000;
	color:#fff;
	padding:0.4em 1em;
	font-size:.8em;
}
.page-heading-category a:hover{
	background:#999;
}
.section-heading-pr{
	margin:0 0 0 1em;
	color:#999;
}

.page-contents p{
	margin:2em 1em;
	line-height:1.8;
	font-size: 1.2em;
}
.page-contents figure{
	margin:0 0 2em;
}
.page-contents a{
	color: #306acb;
    text-decoration: underline;
}
.page-contents a:hover{
	text-decoration:none;
}
.page-contents h2{
	font-size:2em;
	font-weight:700;
	margin:2em 0;
}
.page-contents h3{
	font-size:1.8em;
	font-weight:700;
	margin:0 0 1em;
}
.page-contents h4{
	font-size:1.6em;
	font-weight:700;
	margin:0 0 1em;
}
.page-contents h5,
.page-contents h6{
	font-size:1.2em;
	font-weight:700;
	margin:0 0 1em;
}

.page-footer{
	border-top: 1px solid #f0f0f0;
	padding:2em 0;
}


@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 767px) {
	.page-heading{
		font-size:2em;
	}
	.page-heading-attribution-item{
		display:block;
	}
	.section-heading-pr{
		margin:.4em 0 0;
		font-size:.8em;
	}

}

@media screen and (max-width: 450px) {
	.page-heading-item time .fa-clock,
	.page-heading-item time .fa-history{
		margin:0 .2em 0 0;
	}
	.page-contents p{
		margin:2em 0;
	}

}

/*** in the article ***/
.mv-figure {
    position: relative;
	width: 90%;
    margin: 0 auto 2em !important;
}
.mv-figure:before {
    content: "";
    display: block;
    padding-top: 56.25%;
}
.mv-figure a .icon-play2 {
    position: absolute;
    top: 36%;
    left: 40%;
    font-size: 8em;
    color: #fff;
    z-index: 2;
}
.mv-figure a img {
    position: absolute;
    top: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.mv-figure-name {
    position: absolute;
    top: 10px;
    right: 10px;
    text-align: right;
    color: #fff;
    text-shadow: #000 1px 0 1px;
}
.discimg {
    width: 160px !important;
    height: auto !important;
	margin: -2em 1em !important;
}
.page-contents table,
.page-contents th,
.page-contents td {
    border-collapse: collapse;
}
.page-contents table{
	width:90%;
	margin:0 auto 2em;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
.page-contents th {
    background: #191919;
    color: #fff;
	padding:.4em;
	text-align:left;
}
.page-contents td{
	padding:.4em;
}
.page-contents tr:nth-of-type(even) {
	background: #f3f3f3;
}
.page-contents tr:last-of-type {
	border-bottom: 2px solid #000;
}
.page-contents .no-line tr:nth-of-type(even) {
	background: #fff;
}
.page-contents .no-line tr{
	border-bottom:1px solid #eee;
}

blockquote img{
	width:100%;
	height:auto;
}
blockquote p{
	margin:0 0 1em !important;
	font-size:1em !important;
}
blockquote footer{
	font-size:.8em;
}
blockquote footer cite a{
	color:#306acb;
    text-decoration: underline;
}
blockquote footer cite a:hover{
	text-decoration:none;
	color:#306acb;
}
blockquote{
	background:#eee;
	border:1px solid #ccc;
	margin:0 0 2em;
	padding:2em 1em;
	position:relative;
}
blockquote:before{
	color:#aaa;
	content:"\"";
	font-family:serif;
	font-size:4em;
	left:10px;
	line-height:1em;
	position:absolute;
	top:0;
}
blockquote:after{
	color:#aaa;
	content:"\"";
	font-family:serif;
	font-size:4em;
	line-height:0;
	position:absolute;
	right:10px;
	bottom:0;
}
.bq-comment {
    font-size: .8em !important;
    margin: 1em 0 3em !important;
    line-height: 1.4em !important;
}
.post-relate{
	background:#f9f9f9;
	padding:1em;
	border:1px solid #0b7d6c;
	position:relative;
	margin: 0 1em 2em !important;
}
.post-relate span{
	background:#0b7d6c;
	color:#fff;
	font-size:.8em;
	font-weight:700;
	position:absolute;
	top:-0.8em;
	left:-0.8em;
	padding: 0.6em;
}
.rec-relate{
	background:#f9f9f9;
	padding:0 1em 1em;
	border:1px solid #7d0b5c;
	position:relative;
	margin: 0 1em 2em !important;
}
.rec-relate span{
	background:#7d0b5c;
	color:#fff;
	font-size:.8em;
	font-weight:700;
	position:absolute;
	top:-0.8em;
	left:-0.8em;
	padding: 0.6em;
}
.post-relate a,
.rec-relate a{
	color:#000 !important;
}
.ytsl-wrapper{
	margin:2em 0;
}
.ytmv-embed iframe{
	right:0;
}

@media screen and (max-width: 1024px) {
	.mv-figure a .icon-play2{
		font-size: 18vw;
	}

}

@media screen and (max-width: 767px) {
	.rec-relate, 
	.post-relate{
		margin:0 0 2em !important;
	}
	.post-relate span{
		position:inherit;
		top:0;
		left:0;
		display:block;
		margin: -1em;
	}
	iframe{
		width:100% !important;
	}
	.instagram-media {
		max-width: inherit !important;
		min-width: inherit !important;
	}
	.ytmv-embed iframe{
		width: 100%;
		height: auto;
		right: 0;
		left: inherit;
	}

}

@media screen and (max-width: 450px) {
	.mv-figure {
		width:100%;
		margin:0 0 1em !important;
	}
	.mv-figure-name{
		font-size:.6em;
	}
	.page-contents table{
		width:96%;
		font-size:.8em;
	}
	.discimg {
		margin: -2em 0 !important;
	}

}




/*** recommend, ranking ***/
.rec-rank li{
	position:relative;
}
.rec-rank li:before {
    content: attr(title) "";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 700;
    background: #000;
    text-align: center;
    width: 80px;
    height: 80px;
    color: #fff;
    font-size: 3em;
    border-radius: 50%;
    line-height: 2em;
}
.rec-rank-title {
    margin: 0 0 3em 7em;
}
.rec-rank-title h3,
.rec-rank-title h4{
	margin: 0 !important;
	font-size: 2.6em;
    line-height: 1.1;
}
.rec-rank-artists {
    margin: 0 !important;
}
.rec-ad:before{
	display:none;
}
.recommend table tr:nth-of-type(even){
	background:#fff;
	border-bottom: 1px solid #eee;
}
.recommend table tr:nth-of-type(odd) td:nth-of-type(3),
.recommend table tr:nth-of-type(odd) td:nth-of-type(4),
.recommend table tr:nth-of-type(even) td:nth-of-type(3){
	text-align:center;
}
.recommend table tr:nth-of-type(1){
	border-bottom:1px solid #444;
}
.recommend table tr:nth-of-type(1) th:nth-of-type(1),
.recommend table tr:nth-of-type(1) th:nth-of-type(2),
.recommend table tr:nth-of-type(1) th:nth-of-type(3),
.recommend table tr:nth-of-type(2) th:nth-of-type(1),
.recommend table tr:nth-of-type(2) th:nth-of-type(2){
	border-right:1px solid #444;
}
.recommend table th{
	text-align:center;
	vertical-align: middle;
}

.ranking {
    margin: 2em 0;
}
.ranking-title{
	text-align:center;
	font-size:4em;
	font-weight:900;
}
.ranking-heading {
    font-size: 2em;
	text-align:center;
    font-weight: 700;
    margin: 0 0 1em;
}

.ranking-description{
	border:1px solid #eee;
	padding:1em;
}
.ranking-contents h2{
	text-align:center;
	font-size: 1.6em;
}
.ranking-contents h2:before {
    content: attr(title) "";
    display: block;
    font-size: 2em;
    font-weight: 700;
}
.under10{
	text-align:center;
}
.under10 span,
.ranking-contents h2 span{
	display:block;
}
.ranking-contents .ranking-list li{
	margin:0 0 2em;
	padding:0 0 2em;
	border-bottom: 1px solid #eee;
}
.ranking-ctitle{
	position:relative;
	margin:0 0 1em 3em !important;
	font-size: 2.4em !important;
}
.ranking-ctitle .number{
	position: absolute;
    top: 0;
    left: -2em;
    font-weight: 700;
    background: #000;
    text-align: center;
    width: 80px;
    height: 80px;
    color: #fff;
    font-size: 1.4em;
    border-radius: 50%;
    line-height: 1.8em;
}
.ranking-cartists{
	display:block;
	font-size:.6em;
	font-weight: 400;
}
.ranking-wrap{
	display:flex;
	justify-content: space-between;
}
.ranking-figure,
.ranking-box{
	width:49%;
}
.ranking-figure{
	margin:0 !important;
}
.ranking-figure a .icon-play2{
	top: 30%;
    left: 38%;
}

.ranking-box table{
	width:100%;
}
.ranking-box table tr:last-of-type {
    border-bottom: 0;
}
.ranking-explan{
	font-size:1em !important;
}
.amzlink{
	display:flex;
}
.amzlink__image{
	width:160px;
}
.amzlink__item{
	padding:0 1em;
	flex: 1;
}

@media screen and (max-width: 1024px) {
	.ranking-contents .rec-rank{
		margin:0 4em;
	}
	.ranking-wrap{
		display:block;
	}
	.ranking-figure,
	.ranking-box{
		width:auto;
	}
	.ranking-figure{
		margin:0 0 1em !important;
	}
	.ranking-figure a .icon-play2{
		top: 32%;
	}

}

@media screen and (max-width: 767px) {
	.ranking-title{
		text-align:left;
	}
	.ranking-heading{
		text-align:left;
		font-size: 1em;
	}
	.ranking-description{
		font-size:.8em;
	}
	.rec-rank-title h3, .rec-rank-title h4{
		font-size: 1.6em;
	}
	.ranking-contents .rec-rank{
		margin:0;
	}
	.ranking-contents h2{
		font-size:1.2em;
		text-align:left;
	}
	.ranking-contents h2:before{
		font-size:1.8em;
	}
	.ranking-contents h3,
	.ranking-ctitle{
		font-size:1.8em !important;
	}
	.ranking-ctitle .number{
		width:60px;
		height:60px;
	}
	.ranking-contents p{
		font-size:1em;
	}
	.under10{
		text-align:left;
	}

}

@media screen and (max-width: 450px) {
	.rec-rank li:before {
		width: 50px;
		height:50px;
		font-size: 2em;
		line-height:1.8em;
	}
	.rec-rank-title{
		margin:0 0 3em 4em;
	}
	.amazlet-name,
	.amachazl-name{
		margin:0 0 .2em !important;
	}
	.amazlet-detail,
	.amachazl-detail{
		font-size:.8em;
	}
	.amazlet-sub-info,
	.amachazl-sub-info{
		float:inherit !important;
		font-size:.8em;
		margin: -0.6em 0 0;
	}
	.amzlink{
		display:block;
	}
	.amzlink__image{
		margin:0 auto 1em;
	}

}

/**** lyrics ************************/
.lyrics-flex{
	display: flex;
    justify-content: space-between;
    margin: 2em 0 4em;
}
.lyrics {
	margin:0 0 2em;
}
.lyrics h1{
	font-size: 3em;
    font-weight: 700;
    margin: 0 0 .4em;
}
.lyrics-artists{
	display: block;
}
.lyrics-title{
    display: block;
	font-size:1.6em;
}
.lyrics-h-list{
	display: flex;
    align-items: center;
    justify-content: center;
}
.lyrics-h-list li{
	box-sizing: border-box;
    width: 100%;
    margin: 0 2px;
}
.lyrics-h-list li a {
    background: #000;
    width: 100%;
    text-align: center;
    color: #fff;
    text-decoration: none;
    display: block;
    padding: .4em;
	line-height:1;
}
.lyrics-h-list li a:hover{
	background:#494949;
}
.songCopy {
    padding: 1em;
    border: 2px solid #494949;
    position: relative;
    margin: 3em 0 !important;
}
.songCopyCaution {
    background: #494949;
    color: #fff;
    font-size: .8em;
    font-weight: 700;
}
.songCopyTitle {
    position: absolute;
    top: -16px;
    left: -2px;
    padding: 0 1em;
}
.songCopyRight {
    font-size: .8em;
    color: #999;
}
.songCopyRightLine {
    display: block;
    border: 1px #eee dashed;
    margin: 0.6em 0;
}
.movie,
.ytmv-embed {
    position: relative;
    z-index: 9999;
}
.movie iframe {
    right: 0;
}
.ytmv-link {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 560px;
    height: 315px;
}
.ytmv-link .icon-play2 {
    position: absolute;
    top: 122px;
    left: 245px;
    font-size: 5em;
    color: #fff;
}
.ytmv-link img {
    width: 560px;
    height: 315px;
    object-fit: cover;
}
.ytmv-name {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #fff;
    text-shadow: #000 1px 0 1px;
}
.ytmv-link:hover img{
	opacity:1 !important;
}
.ytmv-link:hover .icon-play2 {
	color: #0fb958;
}
.ks{margin:0 !important}
.kw{font-weight:700;margin:0 !important;font-size:1em !important}
.kb{font-weight:700;color:#999;margin:0 0 10px !important;font-size:1em !important}
.ka{font-weight:700;color:#fcb50c;margin:0 0 10px !important;font-size:1em !important}
.kn{font-weight:700;color:#0fb958;margin:0 0 10px !important;font-size:1em !important}

.kk{font-weight:700;margin:0 0 10px !important;font-size:1em !important}
.kk-red{color:#e05542}
.kk-blue{color:#315ec6}
.kk-black{color:#797979}
.kk-purple{color:#ad50dd}
.kk-pink{color:#f17ae0}
.kk-green{color:#25a635}
.kk-gold{color:#d5b225}
.kk-grapefruit{color:#f2a4b2}

.kbr{margin:3em 0 !important}

@media screen and (max-width: 1024px) {
	.lyrics-flex{
		display:block;
	}

}

@media screen and (max-width: 767px) {
	.lyrics h1{
		font-size:1.6em;
	}
	.movie iframe {
		width: 100%;
	}
	.ytmv-link,
	.ytmv-link img {
		width: 100%;
		height: 150px;
	}
	.ytmv-link .icon-play2 {
		top: 44%;
		left: 44%;
		font-size: 3em;
	}
	.ytmv-name {
		font-size: .8em;
	}

}


@media screen and (max-width: 450px) {
	.movie iframe {
		height:auto;
	}

}

/**** biography *********************/
.biography{
	margin: 0 0 2em;
}
.biography-box{
	display:flex;
	justify-content: space-between;
	margin:0 0 2em;
}
.biography-item,
.biography-image{
	width:49%;
}
.biography-item h2{
	font-size:2em;
	font-weight:700;
	margin:0 0 .4em;
}
.biography-item p{
	margin:0 0 .4em;
}
.biography-list{
	display:flex;
	justify-content:center;
}
.biography-list li{
	margin:0 1em 0 0;
}
.biography-list li .fa-angle-right{
	margin:0 .4em 0 0;
}
.biography-list li a,
.biography-image figcaption a{
	color: #306acb;
    text-decoration: underline;
}
.biography-list li a:hover,
.biography-image figcaption a;hover{
	text-decoration:none;
}
.biography-image figcaption{
	font-size:.8em;
}

@media screen and (max-width: 767px) {
	.biography-box{
		flex-direction: column-reverse;
	}
	.biography-item,
	.biography-image{
		width: auto;
	}
	.biography-image{
		margin:0 0 1em;
	}
	.biography-list{
		justify-content:left;
	}

}

/**** hits **************************/
.hits-side-heading{
	font-size:1.2em;
	font-weight:700;
	margin:1em 0;
}
.hits-side-subheading{
	font-size:1em;
	font-weight:700;
	margin:0 0 .6em;
}
.hits-side-list{
}
.hits-side-list-harf{
	display:flex;
	margin:0 0 1em;
	justify-content: space-between;
    flex-wrap: wrap;
}
.hits-side-list a,
.hits-side-list-harf a{
	border:1px solid #999;
	text-align:center;
	display:block;
	border-radius:4px;
	margin:0 0 .4em;
	padding:.4em 0;
}
.hits-side-list a:hover,
.hits-side-list-harf a:hover{
	background:#494949;
	color:#fff;
}
.hits-side-list li{
	width:100%;
}
.hits-side-list-harf li{
	width:49%;
}


/**** side **************************/


@media print{#wrapper{display:none}}