@charset "UTF-8";
/* CSS Document */

#main_img{ position: relative; color: white; background-color: black;}
#main_img>div{ position: absolute; width: 100%;}
#main_img>div:first-child{ z-index: 1; background: black url("../images/kurizen_20190708.jpg") no-repeat center; background-size: cover;}
#main_img>div:nth-child(2){ z-index: 2; display: table;}
#main_img>div>div{ display: table-cell; vertical-align: middle; text-align: center;}
#main_img>div>div>p{}
#main_img>div>div>p:first-child>strong,
#main_img>div>div>p:last-child{ text-shadow: 0px 1px 9px rgba(0, 0, 0, 0.3); display: block;}
@media (min-width: 768px) {
#main_img{ padding: 0 0 100vh; min-width: 1054px;}
#main_img>div{ height: 100vh;}
#main_img>div:first-child{}
#main_img>div:nth-child(2){}
#main_img>div>div{ padding-top: 35.34vh; padding-bottom: 60px;}
#main_img>div>div>p:first-child>strong{ font-size: 6.47vh;}
#main_img>div>div>p:first-child>img{ height: 5.6vh; width:19.57vh;}
#main_img>div>div>p:last-child{ width: 990px; margin: 18.1vh auto 0; font-size: 2.07vh;}
#main_img>div>div>p:last-child>strong{ font-size: 3.45vh; display: block; text-align: center; margin-bottom: 1em; line-height: 1em;}
}
@media (max-width: 767.98px) {
#main_img{ padding: 0 0 calc(100vh - 80px);}
#main_img>div{ height: calc(50vh - 40px);}
#main_img>div:first-child{ top: 0;}
#main_img>div:nth-child(2){ top: 50%;}
#main_img>div>div>p:nth-child(2){ display: none;}
#main_img>div>div>p:first-child>strong{ font-size: 37.5px;}
#main_img>div>div>p:first-child>img{ width: 138.5px; height: auto;}
}


#top_sub_box{ position: relative; color: white; display: block;}
#top_sub_img{ background-size: cover; background-repeat: no-repeat; background-position: center; display: block}
#top_sub_img>p{ border-bottom-style: solid; position: absolute; display: block; text-align: right; font-weight: bold; line-height: 1em; margin: 0;}
#top_sub_img>p.interview{ border-bottom-color: #e34236;}

#top_sub_box>#top_sub_text h2,
#top_sub_box>#top_sub_text p strong{ transition: .3s;}
#top_sub_box:hover>#top_sub_text h2,
#top_sub_box:hover>#top_sub_text p strong{ color: #e34236; }

#top_sub_text{}
#top_sub_text h2{ margin: 0 0 0.25em;}
#top_sub_text p strong{ display: block; margin: 0 0 0.36em;}
#top_sub_text p{ margin: 0;}
#top_sub_soundcloud_box{ font-size: 0;}

@media (min-width: 768px) {
#top_sub_box{ margin-top: -50px; margin-left: 60px; margin-bottom: 76px; width: 900px; padding-top: 506px;}
#top_sub_img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
#top_sub_img>p{ width: 160px; font-size: 16px; border-bottom-width: 6px; padding-bottom: 4px; top: 24px; left: 0;}
#top_sub_text{ position: absolute; width: 430px; display: table; table-layout: fixed; top:50px; left: 25px; z-index: 2;}
#top_sub_text>div{ display: table-cell; height: 366px; vertical-align: middle;}
#top_sub_text h2{ font-size: 40px;}
#top_sub_text p strong{ font-size: 28px;}
#top_sub_text p{ font-size: 20px;}
#top_sub_soundcloud_box{ position: absolute; bottom: -76px; left: 25px; width: 850px; z-index: 3;}
}
@media (min-width: 1480px) {
#top_sub_box{ margin-left:auto; margin-right: calc(50% - 220px);}
}
@media (max-width: 767.98px) {
#top_sub_box{ margin-bottom: 20px;}
#top_sub_img{ padding: 56.25% 0 0 0; position: relative;}
#top_sub_img>p{ width: 125px; font-size: 15px; border-bottom-width: 3px; padding-bottom: 2px; top: 10px; left: 0;}
#top_sub_text{ padding: 15px 10px;}
#top_sub_text h2{ font-size: 20px;}
#top_sub_text p strong{ font-size: 14px;}
#top_sub_text p{ font-size: 12px;}
#top_sub_soundcloud_box{ width: calc(100% - 40px); margin: 0 auto;}
#top_sub_soundcloud_box>iframe{ height: 100px;}
}




.top_sub_box_container{}

.top_sub_box{ position: relative; color: white; display: block;}
.top_link_box{ color: white;}
.top_sub_img{ background-size: cover; background-repeat: no-repeat; background-position: center; display: block}
.top_sub_img>p{ border-bottom-style: solid; position: absolute; display: block; text-align: right; font-weight: bold; line-height: 1em; margin: 0;}
.top_sub_img>p.interview{ border-bottom-color: #e34236;}

.top_sub_box .top_sub_text h2,
.top_sub_box .top_sub_text p strong{ transition: .3s; color: white;}
.top_sub_box .top_sub_text h2,
.top_sub_box .top_sub_text p strong{}
.top_sub_box:hover,
.top_link_box:hover{ color: white; text-decoration: none;}
.top_sub_box:hover>.top_sub_text h2,
.top_sub_box:hover>.top_sub_text p strong,
.top_link_box:hover>.top_sub_text h2,
.top_link_box:hover>.top_sub_text p strong{ color: #e34236; }

.top_sub_text{}
.top_sub_text h2{ margin: 0 0 0.25em;}
.top_sub_text p strong{ display: block; margin: 0 0 0.36em;}
.top_sub_text p{ margin: 0;}
.top_sub_soundcloud_box{ font-size: 0;}

@media (min-width: 768px) {
.top_sub_box_container{}
.top_sub_box_container>.top_sub_box:first-child{ margin-top: -50px; z-index: 1;}
.top_sub_box_container>.top_sub_box:nth-child(odd){ margin-left: 60px; margin-right: auto;}
.top_sub_box_container>.top_sub_box:nth-child(even){ margin-right: 60px; margin-left: auto;}

.top_sub_box{ margin-top: 166px; margin-bottom: 76px; width: 900px; padding-top: 506px;}
.top_sub_img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
.top_sub_img>p{ width: 160px; font-size: 16px; border-bottom-width: 6px; padding-bottom: 4px; top: 24px; left: 0;}
.top_sub_text{ position: absolute; width: 430px; display: table; table-layout: fixed; top:50px; left: 25px; z-index: 2;}
.top_sub_text.width520{ width: 520px;}
.top_sub_text.right_text{ left:auto; right: 25px;}
.top_sub_text>div{ display: table-cell; height: 366px; vertical-align: middle;}
.top_sub_text h2{ font-size: 40px;}
.top_sub_text p strong{ font-size: 28px;}
.top_sub_text p{ font-size: 20px;}
.top_sub_soundcloud_box{ position: absolute; bottom: -76px; left: 25px; width: 850px; z-index: 3;}

.sds_box.top_sub_text{ width: 680px; left: auto; right: 5px;}
.sds_box.top_sub_text>div{ vertical-align:bottom;}

.top_sub_box>.embed-responsive.embed-responsive-16by9{ position: absolute; left: 0; top: 0;}

}
@media (min-width: 1480px) {
.top_sub_box_container>.top_sub_box:nth-child(odd){ margin-left:auto; margin-right: calc(50% - 220px);}
.top_sub_box_container>.top_sub_box:nth-child(even){ margin-right: auto; margin-left: calc(50% - 220px);}

}
@media (max-width: 767.98px) {
.top_sub_box{ margin-bottom: 50px;}
.top_sub_img{ padding: 56.25% 0 0 0; position: relative;}
.top_sub_img>p{ width: 125px; font-size: 15px; border-bottom-width: 3px; padding-bottom: 2px; top: 10px; left: 0;}
.top_sub_text{ padding: 15px 10px;}
.top_sub_text h2{ font-size: 20px;}
.top_sub_text p strong{ font-size: 14px;}
.top_sub_text p{ font-size: 12px;}
.top_sub_soundcloud_box{ width: calc(100% - 40px); margin: 0 auto;}
.top_sub_soundcloud_box>iframe{ height: 100px;}
}


.interview_link{ display: flex; background-color: white; justify-content: center; border-radius: 5px;}
.interview_link a{ color: black; text-align: center; transition: .3s;}
.interview_link a:hover{ text-decoration: none; opacity: 0.5;}
.interview_link a>span{ display: table; width: 100%; table-layout: fixed; text-align: center; border-radius: 10px;}
.interview_link a>span>span{ display: table-cell; vertical-align: middle;}
.interview_link a>span.soundcloud{ background: #ff7503;
background: -moz-linear-gradient(top,  #ff7503 0%, #ff3600 100%);
background: -webkit-linear-gradient(top,  #ff7503 0%,#ff3600 100%);
background: linear-gradient(to bottom,  #ff7503 0%,#ff3600 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7503', endColorstr='#ff3600',GradientType=0 );}
.interview_link a>span.youtube{ background-color: #ff0a01;}
@media (min-width: 768px) {
.interview_link{ padding: 30px 0;}
.interview_link a{ font-size: 14px; width: 350px; margin: 0 25px;}
.interview_link a>span>span{ height: 70px;}
}
@media (max-width: 767.98px) {
.interview_link{ padding: 10px 5px 8px;}
.interview_link a{ font-size: 8px; width: calc(50% - 10px); margin: 0 5px;}
.interview_link a>span>span{ height: 50px;}
.interview_link a>span.soundcloud img{ height: 25px; width: auto;}
.interview_link a>span.youtube img{ height: 15px; width: auto;}
}

















#top_trend_box{ background: url("../test_img/02.jpg") no-repeat center; background-size: cover;}
#trend_title{ text-align: center; position: relative;}
#trend_title::after{ content:""; background-color: white; display: block;}
#top_trend_box>ul{ padding: 0; list-style: none; display: flex; flex-wrap: wrap;}
#top_trend_box>ul>li{ text-align: center; position: relative;}
#top_trend_box>ul>li>a{ text-decoration: none; display: block;}
#top_trend_box>ul>li>a:hover{ opacity: 0.7;}
#top_trend_box>ul>li>a>div{ width: 100%; padding: 56.25% 0 0 0; background-repeat: no-repeat; background-position: center; background-size: cover;}
#top_trend_box>ul>li>a>p{ margin: 0;}
#top_trend_box>ul>li>a>p>small,
#top_trend_box>ul>li>a>p>strong,
#top_trend_box>ul>li>a>time{ display: block; line-height: 1.6em; color: white;}
#top_trend_box>ul>li>a>p>small{ font-weight: bold;}
#top_trend_box>ul>li>a>p>strong{}
#top_trend_box>ul>li>a>time{ margin: 0; position: absolute; width: 100%; left: 0; bottom: 0; display: block;}
@media (min-width: 768px) {
#top_trend_box{ margin-top: 216px; min-width: 1054px; padding: 80px 0 390px;}
#trend_title{ min-width: 1054px; font-size: 40px; margin-bottom: 50px;}
#trend_title::after{ height: 5px; width: 124px; margin: 5px auto 0;}
#top_trend_box>ul{ max-width: 1364px; min-width: 1054px; margin: 0 auto; padding: 0 9px; border-bottom: 1px solid #535353;}
#top_trend_box>ul>li{ width: calc(25% - 12px); margin: 0 6px 50px; padding-bottom: 2em;}
#top_trend_box>ul>li>a>p>small{ font-size: 12px; margin: 1em 0;}
#top_trend_box>ul>li>a>p>strong{ font-size: 16px;}
#top_trend_box>ul>li>a>time{ font-size: 12px;}
}
@media (max-width: 767.98px) {
#top_trend_box{ padding: 35px 0 ;}
#trend_title{ font-size: 20px; margin-bottom: 25px;}
#trend_title::after{ height: 2.5px; width: 62px; margin: 5px auto 0;}
#top_trend_box>ul{margin: 0 auto; padding: 0 5px;}
#top_trend_box>ul>li{ width: calc(50% - 10px); margin: 0 5px 20px; padding-bottom: 1em;}
#top_trend_box>ul>li>a>p>small{ font-size: 6px; margin: 1.5em 0 1em;}
#top_trend_box>ul>li>a>p>strong{ font-size: 13px;}
#top_trend_box>ul>li>a>time{ font-size: 6px;}
}





#ad_box{}
@media (min-width: 768px) {
#ad_box{ margin-top: -360px;}
}
@media (max-width: 767.98px) {}


#introduction_title{ text-align: center; position: relative;}
#introduction_title::after{ content:""; background-color: white; display: block;}
.introduction_list{ border-bottom: 1px solid #535353;}
.introduction_list{ display: flex; flex-wrap: wrap;}
.introduction_list>div{}
.introduction_list>div>a{ display: table; width: 100%; table-layout: fixed; color: white;}
.introduction_list>div>a:hover{ opacity: 0.7; text-decoration: none;}
.introduction_list>div>a>span,
.introduction_list>div>a>div{ display: table-cell;}
.introduction_list>div>a>span{ width: 36%; background-repeat: no-repeat; background-position: center top; background-size: cover;}
.introduction_list>div>a>div{ width: 64%;}
.introduction_list>div>a>div>p:first-child{ font-weight: bold; border-bottom-style: solid; margin: 0;line-height: 2em;}

.introduction_list>div>a>div>p:nth-child(2){ margin: 0.5em 0;}


.introduction_list>div>a>div>p.music{ border-bottom-color: #5cae24; color: #5cae24;}
.introduction_list>div>a>div>p.sakaba{ border-bottom-color: #ffe21f; color: #ffe21f;}
.introduction_list>div>a>div>p:last-child{ margin: 0;}
.introduction_list>div>a>div>p:last-child::after{ content:"more→"; display: block; color: #07bcff; text-decoration: underline;}

@media (min-width: 768px) {
#introduction_title{ min-width: 1054px; font-size: 40px; margin-bottom: 50px; margin-top: 70px;}
#introduction_title::after{ height: 5px; width: 124px; margin: 5px auto 0;}
.introduction_list{ max-width: 1364px; min-width: 1054px; margin: 0 auto; padding: 0 9px;}
.introduction_list>div{ width: calc(50% - 30px); margin: 0 15px 50px;}
.introduction_list>div>a{ height: 100%;}
.introduction_list>div>a>div{ padding-left: 20px;}
.introduction_list>div>a>div>p:first-child{ border-bottom-width: 6px; font-size: 12px;}
.introduction_list>div>a>div>p:nth-child(2){ font-size: 18px;}
.introduction_list>div>a>div>p:last-child{ font-size: 14px;}
}
@media (max-width: 767.98px) {
#introduction_title{ font-size: 20px; margin-bottom: 25px; margin-top: 40px;}
#introduction_title::after{ height: 2.5px; width: 62px; margin: 5px auto 0;}

.introduction_list{ padding: 0 10px;}
.introduction_list>div{ width: 100%; margin: 0 auto 30px;}
.introduction_list>div>a{ height: 100%;}
.introduction_list>div>a>div{ padding-left: 10px;}
.introduction_list>div>a>div>p:first-child{ border-bottom-width: 3px; font-size: 8px;}
.introduction_list>div>a>div>p:nth-child(2){ font-size: 12px;}
.introduction_list>div>a>div>p:last-child{ font-size: 10px;}

}