@charset "UTF-8";
#section-title { /*background: url(/archives/jlyp/2021/assets/images/interview/bg_title.jpg) 50% 0% no-repeat;*/ background-size: cover; position: relative; width: 100%; }

#section-title:before { background: rgba(0, 0, 0, 0); }

#section-title .title h1 { height: 600px; position: relative; top: -100px; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8); }

#section-contents .artist { text-align: center; margin: -20px 0 50px 0; font-weight: bold; }

#section-contents .artist .tag { font-size: 1.4rem; display: inline-block; margin-right: 1em; }

#section-contents .artist .name { font-size: 2.2rem; display: inline-block; }

#section-contents .artist .name span { font-size: 1.6rem; display: inline-block; margin-left: 0.3em; }

#section-contents .youtube { position: relative; width: calc(100% + 120px); padding-top: 63.6%; left: -60px; margin-bottom: 90px; }

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

#section-contents h3 { font-size: 3.4rem; line-height: 1.6; margin-bottom: 40px; }

#section-contents h4 { font-size: 2.2rem; line-height: 1.6; margin-bottom: 30px; }

#section-contents h4:before { content: '—'; margin-right: 5px; }

#section-contents ._p { margin-bottom: 40px; }

#section-contents .image { height: 384px; width: calc(100% + 60px); position: relative; left: 0; display: block; margin: 150px 0 90px 0; background-position: 50% 50% !important; background-repeat: no-repeat !important; background-size: cover !important; }

#section-contents .box { margin: 150px 0 60px 0; }

#section-contents .box .image { float: left; width: 35%; margin: 0; padding-top: 26.25%; height: auto; }

#section-contents .box .text { float: right; width: 61%; }

#section-contents .box .text .artist { text-align: left; margin: 0 0 30px 0; font-weight: bold; }

#section-contents .box .text .artist .tag { margin-left: 2em; }

#section-contents .more { min-width: 1040px; max-width: 1040px; width: 100%; margin: 0 auto 120px auto; }

#section-contents .more h2 { font-size: 4.8rem; font-family: 'Oswald', 'Noto Sans JP'; text-align: center; margin-bottom: 30px; }

#section-contents .more ul.list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

#section-contents .more ul.list li { list-style: none; float: left; width: 32%; margin: 0 2% 30px 0; background: #fff; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }

#section-contents .more ul.list li:hover { opacity: 0.7; }

#section-contents .more ul.list li:nth-child(3n) { margin-right: 0; }

#section-contents .more ul.list li .image { width: 100%; margin: 0; padding-top: 56.25%; height: auto; }

#section-contents .more ul.list li a { color: #333; text-decoration: none; display: block; }

#section-contents .more ul.list li a .artist { display: block; padding: 20px 15px 10px 15px; margin: 0px; text-align: left; }

#section-contents .more ul.list li a .artist .tag { font-size: 1.2rem; margin-right: 2em; }

#section-contents .more ul.list li a .artist .name { font-size: 1.6rem; }

#section-contents .more ul.list li a .artist .name span { font-size: 1.2rem; }

#section-contents .more ul.list li a .title { font-size: 2.0rem; font-weight: bold; line-height: 1.3; display: block; padding: 0 15px 20px 15px; }

#section-contents ._btn-basic.red { padding: 70px 0; background: #333; margin: 0; }

@media screen and (min-width: 1300px) { #section-title { background-size: 1300px auto !important; background-color: #333 !important; } }
