*{
	margin:0;
	padding:0;
	box-sizing: border-box;
}

body{
	display:flex;
	flex-wrap:wrap;
	align-content:space-between;
	min-height:100vh;
	font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" ,"ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" ,"HiraMinProN-W3","HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" ,serif;
	line-height: 1.4;
}

a {
	color:#333;
	text-decoration:none;
	transition:.2s
}
@media screen and (min-width:521px) {
	a:hover {
		color: #aaa;
	}
}


.sp{display: none;}
.tb{display: none;}
.tb_b{display: none;}
.phone{display: none;}
.no_phone{display: inline;}

@media screen and (max-width:980px) {
	.sp{display: inline-block;}
	.pc{display: none !important;}
}
@media screen and (max-width:767px) {
	.tb{display: inline;}
	.tb_b{display: block;}
	.no_tb{display: none;}
}
@media screen and (max-width:520px) {
	.phone{display: inline;}
	.no_phone{display: none;}
}


.header_box{
	width:100%;
}

.header{
	display:flex;
	padding-top:30px;
}

.logo{
	margin:0 15px 0 auto;
	width:440px;
}

.logo img{
	width:100%;
}

.header ul{
	list-style: none;
	display:flex;
	margin:0 auto 0 10px;
	padding:0;
}

.header ul li{
	vertical-align:middle;
	text-align:center;
	margin:auto;
	padding:0 18px;
	font-weight:700;
	padding-top:10px;
}

.header ul li:last-child{
	font-size:86%;
	padding-right:25px;
}

.here{
	border-top: solid 1px #333;
}

.here a{
	color:#333;
}

@media screen and (max-width:980px) {
	.header{
		display:inline;
		width:90%;
		text-align:center;
	}
	.logo{
		width:50%;
		margin:auto;
		padding:20px 0 0;
	}
	.header ul{
		width:600px;
		margin:auto;
		padding:0;
	}
	.header ul li{
		margin:auto;
		padding:0;
	}
	.header ul li:last-child{
		font-size:100%;
		padding-right:0;
	}
}

@media screen and (max-width:767px) {
	.logo{
		width:80%;
		max-width: 470px;
	}
	.header ul{
		width:90%;
		max-width:530px;
	}
}
@media screen and (max-width:520px) {
	.header ul li,
	.header ul li .sp{
		font-size:15px;
	}
	.no_phone{
		display: none;
	}
}

/*==ボタン==*/

.btn{
	display: inline-block;
	padding: 0.25em 0.5em;
	color:#fff;
	background:#b22222;
}

@media screen and (min-width:521px) {
	.btn:hover{
		color:#333;
		background:#fff;
	}
}


/*====*/

.phone{display: none !important; }
@media only screen and (max-width: 520px) {
.phone{ display: inline-block !important; }
}

.mobile{display: none; }
@media only screen and (max-width: 374px) {
.mobile{ display: inline-block; }
}


/*====*/


.footer{
	text-align:center;
	width:100%;
	height:40px;
	background-color:rgba(0,0,0,.75);

}

address{
	color:#fff;
	font-style: normal;
	font-family: "Helvetica Neue","Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size:12px;
	padding-top:12px;
}

/*====*/

.youtube iframe{
	width:100%;
	height:auto;
	aspect-ratio:16/9;
}


/*============*/

article{
	width: 100%;
}
article img{
	width: 100%;
}

.article_box{
	margin:auto;
	max-width:1140px;
	padding:20px;
}

.article_title{
	padding:0 10px 5px;
	border-left:15px #333 solid;
	border-bottom:2px #333 solid;
}

.article_title h1{
	color:#333;
}

.article_main{
	padding:30px 20px 30px;
}

.article_main h2{
	padding:10px 0;
}
.article_main h2.center800{
	text-align:center;
}


.article_main p{
	padding-bottom:15px;
}
.article_main p a{
	text-decoration:underline;
}

.article_main ul{
	font-size:85%;
	padding-bottom:15px;
}
.article_main ul li{
	padding-bottom:10px;
}

.article_main ul a{
	text-decoration:underline;
}

.img_list{
	display: flex;
	flex-wrap: wrap;
}
.img_list.double div{width:50%}


.article_button_area{text-align: center;}
.article_button_area a{
	text-decoration: none;
	background-color: #b22222;
	display: inline-block;
	font-size:120%;
	font-weight:800;
	padding: 0.25em 0.5em;
	color: #fff;
	transition: .2s;
}
@media only screen and (min-width:768px) {
	.article_button_area a:hover{
		color:#333;
		background-color:rgba(255,255,255,0);
	}
}


@media only screen and (max-width: 800px) {
	.article_main h2.center800{
		text-align:left;
	}
}

@media only screen and (max-width: 767px) {
	
	.article_title h1{
		font-size:1.3em;
	}
}

@media only screen and (max-width: 520px) {
	time{font-size:18px;}
	.article_box{padding:30px 20px 20px;}
	.article_main{padding:30px 5px 30px;}
	.img_list.double div{width:100%}
}



/*========================
■ 品川心中 230612
========================*/

body.shinagawa{
	background-color: #fcfafb;
	background: url("img/230612/230612_bk.webp");
	background-size:cover;
	background-attachment:fixed;
}
@media only screen and (max-width: 520px){
	body.shinagawa{
		background: none;
	}
	body.shinagawa::before{
    	content: "";
    	display: block;
    	position: fixed;
    	top: 0;
    	left: 0;
    	z-index: -20;
    	width: 100%;
    	height: 100vh;
    	background-repeat: no-repeat;
    	background-position: 50% 100%;
    	background-image: url("img/230612/230612_bk_sp.webp");
    	background-size: cover;
	}
}


.cd_top{
	text-align:center;
	background: url("img/230612/top_bk.webp");
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	line-height: 0;
}

.cd_top img{
	width: 100%;
	max-width: 1000px;
}
@media only screen and (max-width: 980px){
	.cd_container{padding-top:15px;}
}
@media only screen and (max-width: 580px){
	.cd_container{padding-top:4vw;}
}


body.shinagawa .article_main{
	background-color: rgba(255, 255, 255, 0.65);
}



.cd{
	background: url("img/230612/cd_bk.webp");
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
@media only screen and (max-width: 520px){
	.cd{
		background: url("img/230612/cd_bk_sp.webp");
	}
}

.cd_box{
	display: flex;
	flex-wrap: wrap;
	gap:20px;
	margin:30px auto;
	max-width:1200px;
	padding:0 20px;
}
.cd_box img {
    width:calc(50% - 20px);
    height: auto;
    margin-bottom: auto;
    box-shadow: 1px 0 12px rgba(0, 0, 0, .8);
}

.cd_intro{
	width:50%;
	text-align: left;
	background-color:rgba(255,255,255,.7);
	box-shadow: 1px 0 12px rgba(0,0,0,.8);
}

.cd_intro .line_box {
    border: #333 5px solid;
    margin: 26px;
    height: calc(100% - 60px);
}
.cd_intro .in_line_box {
    border: #333 2px solid;
    margin: 1%;
    width: 97%;
    height: 97%;
}
.cd_intro .box_intro {
    margin: 10px;
}
.cd_intro .cd_title {
    display: flex;
    font-family: 'Shippori Mincho', serif;
    color: #333;
}
.cd_intro .cd_title .sub {
    font-size: 18px;
    font-weight: 800;
    margin: auto 0 auto 10px;
}
.cd_intro .cd_title .title {
    font-size: 30px;
    font-weight: 800;
}
.cd_text_box_wrap {
    margin: 10px 0;
}
.cd_intro .cd_text_box {
    display: flex;
    margin: 3px 0;
}
.cd_intro .cd_text_box p {
    padding: 0 8px;
    font-size: 15px;
}
.cd_intro .cd_text_box p.tpc {
    background-color: #333;
    color: #fff;
    padding: 0 8px;
}
.box_intro .lineup {
    padding: 10px 0;
}
.box_intro .lineup .song {
    display: flex;
    margin-top: 10px;
}


.cd{padding:30px 0;}

.cd_btn_area{
	margin: 30px auto;
	text-align: center;
}
.cd_btn_area a{
	margin: auto;
    padding: 10px 20px 14px;
	display: inline-block;
    text-decoration: none;
    font-size: 30px;
    color: #fff;
    background-color: rgba(0, 0, 0, .72);
    border: solid 2px rgba(0, 0, 0, 0);
	border-radius: 5px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .3);
    transition: .2s;
}
@media only screen and (min-width: 768px) {
    .cd_btn_area a:hover {
        background: rgba(0, 0, 0, 0);
        color: #333;
        border: solid 2px #333;
        box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    }
}

@media only screen and (max-width: 1100px){
	.cd_box{justify-content: center;}
	.cd_intro{
		width:80%;
		display: block;
		margin:10px auto;
		padding:1px 0;
	}
	.cd_box img {
		width:94%;
		max-width:600px;
	}
	.cd_intro .cd_text_box {display: inline-block;}
	.cd_intro .cd_text_box p.tpc {display: inline-block;}
	.cd_intro .cd_text_box p {font-size: 14px;}
}
@media only screen and (max-width: 767px){
	.cd_intro{width:94%;}
	
}
@media only screen and (max-width: 520px){
	.cd{padding:30px 0 15px;}
	.cd_box{padding:0 5px;}
	.cd_intro .line_box {
		margin:15px;
        width: calc(100% - 30px);
        height: calc(100% - 30px);
    }
	.cd_intro .in_line_box {
		border: #333 2px solid;
		margin: 1%;
		width: 98%;
		height: 99%;
	}
	.cd_intro .cd_title {
		display: block;
		text-align: center;
	}
	.cd_btn_area {margin: 20px auto;}
	
}

/*~~~~~~~~~*/

.article_imgbox{
	max-width: 950px;
    margin:40px auto 0;
}
.article_imgbox h3 {
	text-align: center;
    background-color: #01a8cc;
    margin: auto;
    padding: 20px;
    color: #fff;
    font-weight: 600;
    font-size: 30px;
    line-height: 1.1em;
    letter-spacing: 0.02em;
    font-family: 'Shippori Mincho', serif;
}
.article_imgbox h3 > span {
    font-size: 20px;
    display: block;
}
.article_imgwrap{
	line-height:0;
}
.article_imgbox .name_line {
	text-align: center;
    margin: 0 20px;
    font-size: 11px;
}


.artist {
    max-width: 800px;
    margin: auto;
}
.artist a{text-decoration: underline;}
.artist h3 {
	text-align: center;
    margin: 20px 20px 8px;
    padding: 10px 0;
    border-top: solid 1px #222;
    border-bottom: solid 1px #222;
    line-height: 1.3em;
    letter-spacing: 0.02em;
    color: rgba(0, 0, 0, 0.75);
    font-size: 30px;
    font-weight: 800;
    font-family: 'Shippori Mincho', serif;
}
.artist_wrap {
    display: flex;
    margin: 0 20px;
}
.artist_wrap .inner_img {
    width: 35%;
}
.artist_wrap .inner_text {
    width: 65%;
    text-align: left;
    background-color: rgba(255, 255, 255, 0.65);
	padding-left: 20px;
	color:#333;
}
.artist_wrap .inner_text h4 {
    font-size: 20px;
}
.artist_wrap .inner_text h5 {
    margin-top: 10px;
    font-size: 16px;
}
.artist_wrap .inner_text h6 {
    font-size: 15px;
    font-weight: 400;
}

@media only screen and (max-width:520px) {
	.article_imgbox{margin-top:0;}
	.article_imgbox .article_main{padding: 30px 15px 10px;}
	
	.artist_wrap{flex-wrap:wrap;padding-bottom:30px;}
	.artist_wrap .inner_img{width:100%;text-align:center;}
	.artist_wrap .inner_img img{max-width:200px;}
	.artist_wrap .inner_text{width:100%;padding-left:0;}
	.artist_wrap .inner_text h4{text-align:center;}
	.artist h3 {font-size:24px;}
}

/*~~~~~~~~~~~~~~~~~~*/

.director_box{
	padding:0 30px 60px;
}

.director_wrap{
	margin:auto;
	max-width:1200px;
	padding:30px 50px;
	background-color:rgba(255,255,255,.7);
}
.director_wrap a{text-decoration:underline;}

.director_title{
	display:flex;
	flex-wrap: wrap;
	gap:20px;
}
.director_img{width:100px;margin:auto 0;}
.director_name{width:calc(100% - 120px);}
.director_name h2{
	color:#231815;
	line-height: 1em;
    font-size: 20px;
    font-weight: 800;
}
.director_name h2 span{
	font-size:70%;
}
.director_name h3{
	color:#231815;
	line-height: 1em;
    font-size: 36px;
    font-weight: 800;
    padding-bottom: 5px;
}
.director_namesub{
	font-size:15px;
}

.director_text{padding-top:15px;}
.director_text p{
	padding-bottom: 15px;
    color: #231815;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.55em;
    letter-spacing: 0.04em;
}
.director_text a{
	color:#222;
}

@media only screen and (max-width:1100px) {
	.director_name h2 span{display:block;}
}
@media only screen and (max-width:580px) {
	.director_box{padding:0 0 8vw;}
	.director_wrap{padding:7vw 6vw;}
	.director_title{gap:5px 10px;}
	.director_name{display:contents;}
	.director_img{width:60px;order:1;}
	.director_namemain{order:2;width:calc(100% - 70px);}
	.director_name h2{order:3;}
}