@charset "utf-8";

header {
 margin: auto;
 display: flex;
 flex-wrap: wrap;
 padding-top: 30px;
}
header .logo {
 margin: 0 15px 0 auto;
 max-width: 440px;
}
header ul {
 list-style: none;
 display: flex;
 margin: 0 auto 0 10px;
}
header ul li {
 vertical-align: middle;
 text-align: center;
 margin: auto;
 padding: 0 18px;
 font-weight: 700;
 padding-top: 10px;
}
header ul li.here {border-top: solid 1px #333;}
header ul li:last-child {font-size: 86%;padding-right: 25px;}

header ul li a.pc {
 position: relative;
 display: inline-block;
 padding: 0.25em 0.5em;
 text-decoration: none;
 color: #fff;
 background: #333;
 transition:.2s;
}

@media screen and (min-width:768px) {
	header ul li a.pc:hover{color:#333;background: rgba(255,255,255,0);}
}

@media screen and (max-width:980px) {
 header {display: block;width: 90%;text-align: center;}
 header .logo{width: 50%;margin: auto;padding: 20px 0 0;}
 header ul {margin: auto;max-width: 600px;padding: 0;}
 header ul li {margin: auto;padding: 4px 0;}
 header ul li a.pc{display:none;}
}
@media screen and (max-width: 767px) {
 header{width:100%;}
 header .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;}
}

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


h2{
 padding:0 0 20px;
 font-weight: 800;
 font-size:46px;
 line-height: 1.2em;
}


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

main{padding-bottom:80px;}


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

.mv_box{
 margin:auto;
 max-width:800px;
 padding:10px 0 0;
}


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

.profile_area{padding:0 30px 0;}
.profile_box{
 margin:0 auto;
 max-width:1100px;
 padding:30px 0 0;
}

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

.tool_list{
 display: flex;
 flex-wrap: wrap;
 gap:8px;
 justify-content: center;
	text-align: center;
	padding-top: 10px;
}
.tool_list a{
	display: flex;
 flex-wrap: wrap;
 width:fit-content;
 gap:5px;
	border: solid 2px #222;
	border-radius: 5px;
	background-color: #222;
	color: #fff;
	text-decoration: none;
	padding: 2px 10px;
	font-size: 17px;
	transition: .2s;
}
.tool_list a svg{
 margin: auto 0;
 fill:#fff;
 width:1em;
 transition: .2s;
}

@media screen and (min-width:768px) {
	.tool_list a:hover {
		color: #222;
		background-color: #fff;
	}
 .tool_list a:hover svg{
  fill:#222;
 }
}

.tool_list a img{
	width:20px;
	padding-right:5px;
}

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

.profile_name{}

.h1sub{font-size:20px;font-weight:600;}

.profile_name h1{
 font-weight: 800;
 font-size:50px;
 line-height: 1.2em;
}


/*=====================*/
.profile_title{padding:10px 0 0;}
.profile_title a{text-decoration: underline;}

.profile_title ul{
 padding:0 0 6px;
 display:flex;
 flex-wrap:wrap;
 gap:0 8px;
 justify-content:center;
}
.profile_title ul li::after{content:"/";padding-left:8px;}
.profile_title ul li:last-child::after{display:none;}

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

.profile_links ul{
 display:flex;
 flex-wrap:wrap;
 gap:0 20px;
 justify-content:center;
 line-height:0;
}
.profile_links ul li{margin: auto 0; line-height:0;}
.profile_links ul li.x{max-width:35px;}
.profile_links ul li.hs{max-width:140px;}
.profile_links ul li.hs span{display:block;font-size:10px;line-height:1em;}

.profile_links ul li a{transition:.2s;}

@media screen and (min-width: 768px) {
 .profile_links ul li a:hover{opacity:.4;}
}

.profile_print{
 display: none;
 padding:0;
 margin: auto;
 max-width:400px;
 flex-wrap: wrap;
 gap:20px;
}
.profile_qr{width:calc((100% - 20px)/ 2);}
.profile_qr img{width:90px;}
.profile_qr p{line-height:1.2em;}

.profile_overview p{
 padding-bottom:10px;
}




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

.profile_overview{
 padding:30px 0 0;
 text-align:left;
}

.profile_overview a{text-decoration:underline;}


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

.schedule_area{padding:0 30px 0;}
.schedule_box{
 margin:0 auto;
 max-width:1000px;
 padding:70px 0 0;
}

.schedule_list{
 overflow-y: scroll;
 max-height: 450px;
 background: #f8f8f8;
 padding:10px 20px 0;
}
.schedule_list::-webkit-scrollbar {
 -webkit-appearance: none;
 width: 5px;
}

.schedule_list::-webkit-scrollbar-thumb {
 border-radius: 4px;
 background-color: rgba(0, 0, 0, .5);
 box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

.schedule_list li{
 display: block;
 position: relative;
 color: #111;
 padding: 25px 0 10px;
 transition: .3s;
}

.schedule_list li a{
 display: block;
 position:relative;
 text-align: left;
 font-family: "Helvetica Neue", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
 padding-bottom:15px;
}
.schedule_list li a p{
 padding-right:30px;
}

.schedule_list li a::before {
 position: absolute;
 content: "";
 width: 10px;
 height: 10px;
 border-bottom: #333 2px solid;
 border-right: #333 2px solid;
 bottom: 25px;
 right: 15px;
 transform: rotate(-45deg);
 transition: 0.3s;
}
.schedule_list li a::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background: #111;
	bottom: -2px;
	transform: scale(1, 1);
	transform-origin: right top;
	transition: transform 0.3s;
}
.schedule_list li:last-child a::after{display:none;}

.schedule_list li a.none{pointer-events:none;}
.schedule_list li a.none::before{display:none;}

.schedule_list li a span {
    margin: 0 5px 0 0;
    padding: 2px 5px;
    font-size: 14px;
    letter-spacing: 0.02em;
    border-radius: 3px;
    border: 1px #222 solid;
    color: #222;
}
.schedule_list li a span.att {
    background-color: #edba25;
    color: #333;
    font-weight: 600;
    border: none;
}
.schedule_text{
 display:flex;
 flex-wrap: wrap;
}
.schedule_text h3{
 padding:3px 0;
 font-weight: 800;
 font-size:22px;
 line-height: 1.2em;
}
.schedule_text .venue{
 margin: auto 0;
 padding:2px 5px;
}
.schedule_text .venue::before{
 content:"";
 margin-right:10px;
 padding-left:10px;
 border-right:2px solid #333;
}

@media only screen and (min-width: 767px){
	.schedule_list li a:hover{
		opacity: .6;
	}
	
	.schedule_list li a:hover::after {
		transform: scale(0, 1);
	}
	.schedule_list li a:hover::before {
		border-bottom: rgba(255,255,255,0) 2px solid;
		border-right: rgba(255,255,255,0) 2px solid;
	}
}

/*=====================*/
.awards_area{padding:0 30px 0;}
.awards_box{
 margin:0 auto;
 max-width:1100px;
 padding:70px 0 0;
}

.awards_list a{text-decoration:underline;}

.awards_list ul li{
 display:flex;
 flex-wrap: wrap;
 text-align:left;
 line-height:1.4em;
 padding:0 0 15px;
}

.awards_list ul li span{display:block;}
.awards_list ul li span:nth-child(1){width:100px;}
.awards_list ul li span:nth-child(2){width:calc(100% - 100px);}


/*=====================*/
.works_area{padding:0 30px 0;}
.works_box{
 margin:0 auto;
 max-width:1100px;
 padding:70px 0 0;
}

.works_inner{padding:20px 0;}

.works_inner h3{
 background-color:#222;
 color:#fff;
 display:flex;
 flex-wrap:wrap;
 justify-content: center;
 gap:0 5px;
 padding:10px 0;
 font-weight: 800;
 font-size:28px;
 line-height: 1.2em;
}
.works_inner h3 span{}
.works_inner h3 a{
 display:block;
 margin: auto 0;
 width:1em;
 line-height:0;
 transition:.2s;
}
@media screen and (min-width: 768px) {
 .works_inner h3 a:hover{opacity:.5;}
}


.works_h3_sub{
 padding:10px 0;
 font-weight: 800;
 font-size:20px;
 line-height: 1.2em;
}

.works_inner_movie{
 display:flex;
 flex-wrap: wrap;
 justify-content: center;
 gap:20px;
 padding:0 0 20px;
}
.works_inner_movie div{
 width:calc((100% - 20px)/ 2);
}

.works_inner_img{
 display:flex;
 flex-wrap: wrap;
 justify-content: center;
 gap:20px;
 padding:0 0 20px;
}
.works_inner_img img{
 width:calc((100% - 20px)/ 2);
}

.works_view{
 padding:0 0 25px;
}
.works_view h4{
 font-weight:800;
 font-size:18px;
 line-height: 1.2em;
 padding:0 0 10px;
}
.works_view ul{
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
 gap:10px;
}
.works_view ul li a{
 display:block;
 background-color:#333;
 color:#fff;
 font-family: Meiryo, "sans-serif";
 line-height:1.2em;
 padding:4px 15px 3px;
 border-radius:3px;
 border:1px solid #333;
 transition:.2s;
}

@media screen and (min-width: 768px) {
 .works_view ul li a:hover{
  background-color:rgba(255,255,255,0);
  color:#333;
 }
}

.works_open{
 gap:0 5px;
 padding:20px 0 30px;
 font-weight: 800;
 font-size:28px;
 line-height: 1.2em;
}

.works_inner_text{padding:0 0 20px;}
.works_inner_text h4{
 font-weight:900;
 font-size:20px;
 line-height: 1.2em;
 padding:0 0 10px;
}
.works_inner_text p{text-align: left;padding-bottom:10px;}
.works_inner_text p.credit{text-align:right;font-size:80%;}
.works_inner_text p a{text-decoration:underline;}

.works_inner_detail{
 font-size:14px;
}
.works_inner_detail ul{
 display:flex;
 flex-wrap: wrap;
 gap:0 20px;
 justify-content:center;
}
.works_inner_detail ul li span:nth-child(1)::after{content:"：";}

.works_inner_actor{
 padding:0 0 10px;
 font-size:14px;
}
.works_inner_actor ul{
 display:flex;
 flex-wrap: wrap;
 gap:0 10px;
 justify-content:center;
}




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

.performance_area{padding:0 30px 0;}
.performance_box{
 margin:0 auto;
 padding:70px 0 0;
}

.flyer_list{
 margin:0 auto;
 max-width:1200px;
 padding:5px;
 border:2px #ddd solid;
}
.flyer_list ul::-webkit-scrollbar {height:8px;}

.flyer_list ul::-webkit-scrollbar-thumb {border-radius: 3px;background: #b22222;}
.flyer_list ul::-webkit-scrollbar-track {background:#eee;border-radius:8px;}

.flyer_list ul{
 overflow-y: hidden;
 white-space: nowrap;
 overflow-x: scroll;
 line-height:0;
 padding-bottom:5px;
}

.flyer_list ul li {
 width:20%;
 margin: 0 auto;
 overflow: hidden;
 display: inline-block;
}
.flyer_list ul li a{transition:.2s;}

@media screen and (min-width: 768px) {
 .flyer_list ul li a:hover{
  opacity:.5;
 }
}




/*=====================*/
.media_area{padding:0 30px 0;}
.media_box{
 margin:0 auto;
 padding:70px 0 0;
}

.media_movie{
 text-align: left;
 margin: auto;
 max-width:1200px;
 display:flex;
 flex-wrap: wrap;
 gap:20px;
 padding-bottom: 40px;
}
.media_movie_inner{
 width:calc((100% - 20px)/ 2);
}

.media_list{
 margin:0 auto 40px;
 max-width:1200px;
 text-align: left;
}
.media_list ul li{
 padding:10px 0;
 border-bottom:1px solid #ddd;
}
.media_box a{
 text-decoration:underline;
}



/*=====================*/
footer {
 width: 100%;
 background-color: rgba(0, 0, 0, 0.5);
 color: #fff;
 text-align: center;
 padding: 10px 0;
 bottom: 0px;
 clear: left;
 margin-top: auto;
}


address {
 font-size: 75%;
}

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

@media screen and ( max-width:767px) {
 
 header{padding:0;}
 
 h2{padding:0 0 5vw;font-size:min(44px,9vw);}
 
 .profile_box{padding:5vw 0 0;}
 .profile_area{padding:0 5vw;}
 .h1sub {font-size: 18px;}
 .profile_name h1{font-size:40px;}
 .profile_title ul{font-size:15px;gap:0 4px;}
 .profile_title ul li::after {padding-left: 4px;}
 .profile_links ul li.x {max-width: 25px;}
 .profile_links ul li.hs {max-width: 115px;}
 .profile_overview {padding: 20px 0 0;}
 .profile_overview p{font-size:14px;}
 
 .tool_list a{font-size:14px;}
 .tool_list a[href*="java"]{display:none;}
 
 .schedule_area{padding:0 5vw;}
 .schedule_box{padding:5vw 0 0;}
 .schedule_list li a{line-height:1.2em;}
 .schedule_list li a time{font-size:14px;}
 .schedule_list li a span{font-size:12px;}
 .schedule_text h3{width:100%;font-size:16px;}
 .schedule_text .venue{padding:0;font-size:14px;}
 .schedule_text .venue::before{display:none;}
 .schedule_list{padding:0 5vw;max-height: 380px;}
 .schedule_list li{padding:min(30px,8vw) 0 0;}
 .schedule_list li a p{padding:5px 30px 0 0;font-size:12px;line-height:1.3em;}
 
 .awards_area{padding:0 5vw;}
 .awards_list ul li{font-size:14px;}
 .awards_list ul li span:nth-child(1){width:100%;}
 .awards_list ul li span:nth-child(2){width:100%;}
 
 .works_area{padding:0 5vw;}
 .works_box{padding:5vw 0 0;}
 .works_box h2{padding:0;}
 .works_inner{padding:5vw 0;}
 .works_inner h3{font-size: 20px;}
 .works_h3_sub{font-size: 16px;}
 .works_inner_movie{gap:2vw;}
 .works_inner_movie div{width:100%;}
 .works_inner_img{gap:2vw;}
 .works_inner_img img{width:100%;}
 .works_open{font-size: 23px;}
 
 .works_view ul{gap:6px;}
 .works_view ul li a{font-size:14px;padding: 4px 9px 3px;}
 .works_inner_text {padding: 0 0 2vw;}
 .works_inner_text h4{font-size:16px;text-align:left;}
 .works_inner_text p{font-size:14px;}
 .works_inner_detail ul{gap: 0 10px;font-size:13px;}
 
 .performance_area{padding:0 5vw;}
 .performance_box{padding:5vw 0 0;}
 .flyer_list ul li {width: 45%;}
 
 .media_area {padding: 0 5vw 0;}
 .media_box{padding:12vw 0 0;}
 .media_movie_inner{width:100%;font-size:13px;}
 
 .media_list ul li{font-size:14px;}

 address {font-size: 65%;}
 
}




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



.print_on{display: none;font-size:60%;text-align:left;}

@media print {
 header{display:none;}
 main{padding-bottom:0;}
 .print_on{display:block;}
 .tool_list{display:none;}
 .profile_box{padding: 20px 0 0;}
 .profile_title{padding:0;}
 .profile_links{display: none;}
 .profile_print{display:flex;break-after: page;}
 .schedule_area{display:none;}
 .awards_area{break-after: page;}
 .works_box{padding:0;}
 .works_inner h3{background-color:#fff;color:#333;padding:0;}
 .works_inner h3 a{display:none;}
 .works_inner_text h4{text-align: left;}
 .works_view ul li a{background-color:#fff;color:#333;border:none;padding:0 8px;}
 .works_inner_movie,.works_inner_img{display:none;}
 .media_movie_inner{width:100%;}
 .media_movie_inner .youtube{display:none;}
 .performance_area{display:none;}
 footer {background-color: rgba(0,0,0,0);color:#333;padding:10px 0 0;}
 
 .profile_title a,.profile_overview a,.awards_list a,.media_box a,.media_box a{text-decoration:none;}
}






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

.photo_index{
 padding:30px;
}

.photo_cap a[href*="king"]{
 margin: auto;
 display:block;
 max-width:300px;
}

.photo_cap p{font-size:14px;}

.photo_click{
 padding:30px 0;
 font-family: "Helvetica Neue", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.photo_attention {padding:30px 0;color: crimson;}

.photo_box {
 max-width: 800px;
 margin: auto;
 display: flex;
 flex-wrap: wrap;
}
.photo_box a{transition:.2s;}
.photo_box a.half {width: 50%;}
@media screen and (min-width: 768px) {
 .photo_box a:hover{opacity:.5;}
}
@media screen and (max-width: 767px) {
 .photo_cap p{font-size:12px;}
 .photo_attention{padding:20px 0;font-size:14px;}
 .photo_click{padding:0;font-size:14px;}
}
