@charset "UTF-8";

/******** タブレット *********/

@media screen and (min-width: 641px) and (max-width: 1300px) {


/* ----------------------------- 共通 */

.wrap{
	width: 90%;
}

.wrap1000{
	width: 90%;
}

.wrap900{
	width: 90%;
}

.wrap800{
	width: 90%;
}




.bg{
	background: url(images/bg_sp.png) center no-repeat;
	background-size: cover;
	height: 1366px;
}




/* ----------------------------- ヘッダー */

.header .side_btn{
	width: 180px;
}

.header .side_btn .pc{
	display: none;
}

.header .side_btn .sp{
	display: block;
}


/* ----------------------------- kv */

.kv h2{
	display: none;
}

.kv .triangle{
	width: 15%;
}

.kv .triangle1{
    bottom: 35%;
    left: 2%;
}

.kv .triangle2{
	top: 42%;
    right: 2%;
}


/* ----------------------------- コンテンツ */

.block1{
	padding: 100px 0;
}



.block2 li p{
	margin-top: 0;
}

.block2 li:nth-child(1) p {
    right: 10%;
}

.block2 li:nth-child(2) p {
    left: 10%;
}

.block2 li:nth-child(3) p {
    right: 10%;
}

.block2 li:nth-child(4) p {
    left: 10%;
}

.block2 li:nth-child(5) p{
	margin-top: 0;
	right: 15%;
}

.block2 li:last-child p{
	margin-top: 0;
}


.block2 li:nth-child(1) .btn1,
.block2 li:nth-child(2) .btn1,
.block2 li:nth-child(3) .btn1,
.block2 li:nth-child(4) .btn1,
.block2 li:nth-child(5) .btn1{
    bottom: 10%;
}

.block2 li:nth-child(6) .btn1{
	bottom: 0;
}

.block2 li:nth-child(7) .btn1{
	right: -80%;
    top: 45%;
}

.fancybox_inner{
	width: 75%;
}

.fancybox_inner.right_box .img{
	bottom: 10%;
}

.fancybox_inner.left_box .img{
	top: 10%;
}



}




@media screen and (min-width: 641px) and (max-width: 800px) {


.bg{
	height: 1280px;
}

.bg .triangle3{
	bottom: 20%;
    left: 10%;
}

.bg .triangle4{
	bottom: 20%;
}


/* ----------------------------- kv */

.kv h2{
	bottom: 30%;
}





/* ----------------------------- コンテンツ */


.block2{
	padding: 100px 0;
}

.block2 li{
	float: none;
    width: 70%;
	margin: 60px auto 0 !important;
}

.block2 li:nth-child(3){
	margin-top: 100px;
}

.block2 li:nth-child(2n){
	float: none;
	margin-left: 0;
}

.block2 li:nth-child(2) {
    margin-top: 60px;
}

.block2 li:nth-child(4) {
    margin-top: 40px;
}

.block2 li:last-child{
	position: relative;
	/*width: 80%;*/
	bottom: auto;
    /*margin-top: 20px !important;*/
}



.block2 li .img {
    width: 65%;
}

.block2 li:last-child .img {
    width: 90%;
}



.block2 li p{
	font-size: 16px;
}

.block2 li p br.sp{
	display: block;
}

.block2 li:nth-child(2n) p{
	text-align: right;
}

.block2 li:nth-child(1) p {
    /*right: 10%;*/
}

.block2 li:nth-child(2) p {
    left: 8%;
}

.block2 li:nth-child(3) p {
    /*right: 0;*/
    /*top: -10%;*/
}

.block2 li:nth-child(4) p {
    left: 5%;
}

.block2 li:nth-child(5) p {
    right: 20%;
}

.block2 li .btn1{
	bottom: 10%;
}

.block2 li:nth-child(1) .btn1,
.block2 li:nth-child(5) .btn1 {
    bottom: 20%;
    right: 15%;
}

.block2 li:last-child .btn1{
	left: 0;
	bottom: auto;
    top: 65%;
}



.fancybox_inner{
	width: 85%;
}

.fancybox-close-small{
	right: 0 !important;
	/*top: -40px !important;
    width: 25px !important;*/
}

.fancybox_inner .img {
    width: 45%;
}

.fancybox_inner.last .img{
	height: auto;
    width: 70%;
    right: 0;
}

.fancybox_inner.last .txt{
	width: auto;
}

.fancybox_inner .txt{
	width: 85%;
    margin-top: 40%;
}

.fancybox_inner .txt .sub{
	/*font-size: 14px;
	padding: 0;*/
}

.fancybox_inner .txt h4{
	/*font-size: 20px;
	width: auto;*/
	border-bottom: 3px solid #000;
}

.fancybox_inner .txt h5{
	/*font-size: 16px;*/
}

.fancybox_inner .txt h5:before{
	/*width: 7px;
    height: 13px;*/
}

.fancybox_inner .txt .repertoire p{
	/*display: block;
    padding-left: 0;
    margin-top: 10px;
    font-size: 16px;*/
}

.fancybox_inner .txt .biography p{
	/*font-size: 14px;
    line-height: 1.6;*/
}



.fancybox_inner.right_box{
	/*background: url(images/right_box_bg_sp.png) center no-repeat;
    background-size: cover;*/
}

.fancybox_inner.right_box .img{
	bottom: auto;
    top: -4%;
    left: 0;
}

.fancybox_inner.right_box .sub{
	/*text-align: right;*/
}

.fancybox_inner.right_box:before,
.fancybox_inner.right_box:after{
	display: none;
}



.fancybox_inner.left_box{
	/*background: url(images/left_box_bg_sp.png) center no-repeat;
    background-size: cover;*/
}

.fancybox_inner.left_box .img{
	bottom: auto;
    top: -4%;
    right: 0;
}

.fancybox_inner.left_box .sub{
	text-align: left;
}

.fancybox_inner.left_box:before,
.fancybox_inner.left_box:after{
	display: none;
}






.block4 .box2 table{
	width: 90%;
}

.block5 .box .txt{
	float: none;
    width: auto;
}

.block5 .box .map{
	float: none;
    width: auto;
    margin-top: 40px;
}


}




/******** スマホ *********/

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

/* ----------------------------- 全体 */
body { font-size: 13px; -webkit-text-size-adjust: 100%; }

.pc{ display: none; }
.sp{ display: block; }

.inline_pc{ display: none; }
.inline_sp{ display: inline-block; }

img, .bx-wrapper img { max-width: 100%; height: auto; }


/* ----------------------------- 共通 */

.wrap{
	width: 95%;
}

.wrap1000{
	width: 95%;
}

.wrap900{
	width: 95%;
}

.wrap800{
	width: 95%;
}




.bg{
	background: url(images/bg_sp.png) top center no-repeat;
	background-size: cover;
	/*height: 812px;*/
}


/* ----------------------------- タイトル */

.c_tit1{
	font-size: 26px;
    padding-bottom: 25px;
}




.c_tit2{
	font-size: 26px;
    padding: 0 1.4em 10px;
    border-bottom: 3px solid #333;
}

.c_tit2:before{
	width: 15px;
    height: 8px;
    bottom: -20px;
}



/* ----------------------------- ボタン */

.btn1 {
    width: 200px;
}

.btn1 a{
	font-size: 16px;
	padding: 3% 5%;
}


/* ----------------------------- ヘッダー */

.header{
	padding: 3%;
}

.header .logo{
	width: 130px;
}

.header .side_btn{
	width: 140px;
}



/* ----------------------------- kv */

.kv{
	padding: 90px 3%;
}

.kv h1{
	width: 80%;
    margin: 0 auto;
}

.kv p{
	margin-top: 10px;
    font-size: 13px;
    line-height: 1.4;
}

.kv .date{
	width: 75%;
    margin: 40px auto 0;
}

.kv .place {
    margin-top: 20px;
}

.kv .ticket {
    margin-top: 20px;
}



.kv .triangle{
	width: 20%;
}

.kv .triangle1{
    bottom: 45%;
    left: 2%;
}

.kv .triangle2{
	top: 42%;
    right: 2%;
}




/* ----------------------------- コンテンツ */

.block1 {
    padding: 60px 0;
}

.block1 p{
	font-size: 16px;
    line-height: 2.2;
    margin-top: 20px;
}





.block2{
	padding: 60px 0;
}

.block2 li{
	float: none;
    width: 100%;
    margin-top: 30px !important;
}

.block2 li:nth-child(2n){
	float: none;
	margin-left: 0;
}

.block2 li:nth-child(2) {
    /*margin-top: 60px;*/
}

.block2 li:nth-child(3) {
    /*margin-top: 100px;*/
}

.block2 li:nth-child(4) {
    /*margin-top: 40px;*/
}

.block2 li:nth-child(5) {
    /*margin-top: 40px;*/
    width: 100%;
    left: 0;
}

.block2 li:nth-child(6) {
    width: 100%;
}

.block2 li:nth-child(7){
	width: 100%;
	position: relative;
    bottom: auto;
	margin: 0;
}


.block2 li .img {
    width: 80%;
}

.block2 li:nth-child(3) .img{
	margin-left: 5%;
}

.block2 li:nth-child(5) .img{
	width: 65%;
}

.block2 li:nth-child(6) .img{
	width: 55%;
	margin-right: 0;
}

.block2 li:nth-child(7) .img{
	width: 45%;
}



.block2 li .btn1{
	bottom: 10%;
}

.block2 li:nth-child(1) .btn1,
.block2 li:nth-child(3) .btn1{
	right: 0;
	left: auto;
}

.block2 li:nth-child(4) .btn1{
	left: 0;
}

.block2 li:nth-child(5) .btn1 {
    left: auto;
    right: 0;
}

.block2 li:nth-child(6) .btn1 {
    left: 0;
    right: auto;
}

.block2 li:nth-child(7) .btn1{
	right: 0;
}

/*.block2 li:nth-child(1) .btn1,
.block2 li:nth-child(3) .btn1,
.block2 li:last-child .btn1 {
    bottom: 10%;
}


.block2 li:nth-child(1) .btn1,
.block2 li:nth-child(5) .btn1 {
    right: 15%;
}

.block2 li:nth-child(2) .btn1,
.block2 li:nth-child(4) .btn1{
	bottom: 0;
}

.block2 li:last-child .btn1{
	left: 0;
	bottom: auto;
    top: 50%;
}*/



.fancybox_inner{
	width: 85%;
	padding: 5% !important;
}

.fancybox-close-small{
	background: url(images/fancy_close_sp.png) center no-repeat !important;
	background-size: contain !important;
	width: 85px !important;
    height: 25px !important;
	right: 0 !important;
    top: auto !important;
    bottom: -30px;
    left: 0;
    margin: auto !important;
}

.fancybox_inner .img {
    width: 65%;
}

/*.fancybox_inner.last .img{
	height: auto;
    width: 90%;
    right: 0;
}*/

.fancybox_inner .txt{
	width: auto;
    margin-top: 55%;
}

.fancybox_inner .txt .sub{
	font-size: 14px;
	padding: 0;
}

.fancybox_inner .txt h4{
	font-size: 18px;
	border-bottom: 3px solid #000;
	width: auto;
}

.fancybox_inner .txt h5{
	font-size: 16px;
}

.fancybox_inner .txt h5:before{
	width: 7px;
    height: 13px;
}

.fancybox_inner .txt .repertoire {
    margin-top: 10px;
}

.fancybox_inner .txt .repertoire p{
	display: block;
    padding-left: 0;
    margin-top: 5px;
    font-size: 16px;
}

.fancybox_inner .txt .biography {
    margin-top: 10px;
}

.fancybox_inner .txt .biography p{
	font-size: 13px;
    line-height: 1.6;
    margin-top: 5px;
}



.fancybox_inner.right_box{
	/*background: url(images/right_box_bg_sp.png) center no-repeat;
    background-size: cover;*/
}

.fancybox_inner.right_box .img{
	bottom: auto;
    top: -6% !important;
    left: 0;
    right: 0;
    margin: auto;
}

.fancybox_inner.right_box .sub{
	text-align: right;
}

.fancybox_inner.right_box:before,
.fancybox_inner.right_box:after{
	display: none;
}



.fancybox_inner.left_box{
	/*background: url(images/left_box_bg_sp.png) center no-repeat;
    background-size: cover;*/
}

.fancybox_inner.left_box .img{
	bottom: auto;
    top: -6% !important;
    left: 0;
    right: 0;
    margin: auto;
}

.fancybox_inner.left_box .sub{
	text-align: left;
}

.fancybox_inner.left_box:before,
.fancybox_inner.left_box:after{
	display: none;
}





.block3 {
    padding: 60px 0;
}

.block3 .box{
	margin-top: 40px;
    font-size: 16px;
}

.block3 .box .inner {
    margin-top: 20px;
}





.block4 {
    padding: 60px 0;
}

.block4 .box1 {
    margin-top: 40px;
}

.block4 .box1 .note {
    margin-top: 10px;
}



.block4 .box2 {
    margin-top: 40px;
}

.block4 .box2 h4{
	display: inline-block;
    padding: 0 0.8em;
    position: relative;
    line-height: 1.4;
}

.block4 .box2 h4.pc{
	display: none;
}

.block4 .box2 h4:before{
	content: "";
	display: block;
	background: url(images/icon6.png) no-repeat;
	background-size: contain;
	width: 8px;
    height: 50px;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

.block4 .box2 h4:after{
	content: "";
	display: block;
	background: url(images/icon6.png) no-repeat;
	background-size: contain;
	width: 8px;
    height: 50px;
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	transform: scale(-1, 1);
}

.block4 .box2 h5 {
    margin-top: 40px;
}

.block4 .box2 table{
	width: 85%;
    margin: 20px auto 0;
    font-size: 16px;
    line-height: 1.6;
}

.block4 .box2 table th{
	display: block;
	text-align: center;
}

.block4 .box2 table td{
	display: block;
	text-align: center;
	padding-bottom: 20px;
}

.block4 .box2 ul {
    margin-top: 20px;
}

.block4 .box2 li{
	float: none;
    width: 65%;
    margin: 20px auto 0 !important;
}

/*.block4 .box2 li a{
	padding: 15px 0;
	font-size: 15px;
}

.block4 .box2 li a:before{
	width: 12px;
    height: 6px;
}*/

.block4 .box2 p.read{
	font-size: 16px;
}

.block4 .box2 p{
	margin-top: 20px;
    font-size: 14px;
    line-height: 1.6;
}




.block5 {
    padding: 60px 0;
}

.block5 .box {
    margin-top: 40px;
}

.block5 .box .txt{
	float: none;
	width: auto;
}

.block5 .box .txt .inner{
	text-align: center;
}

.block5 .box .txt .inner h4{
	float: none;
    width: 30%;
    display: inline-block;
}

.block5 .box .txt .inner p{
	float: none;
    width: auto;
    margin: 10px 0 0;
    font-size: 16px;
}

.block5 .box .txt .inner p.big{
	font-size: 24px;
}

.block5 .box .map{
	float: none;
	width: auto;
	margin-top: 40px;
}



.block6 {
    padding: 60px 0;
}

.block6 .box {
    margin-top: 40px;
}

.block6 .box table th{
	width: auto;
	display: block;
	padding: 10px 0 5px;
}

.block6 .box table td{
	display: block;
	padding: 5px 0 10px;
}

.block6 .box table td textarea{
	height: 140px;
}

.block6 .box .contact_btn{
	margin-top: 20px;
}

.block6 .box .contact_btn input,
.block6 .box .contact_btn button{
	/*padding: 10px 0;*/
	font-size: 16px;
	background-size: 8px;
	width: 220px;
	border: 2px solid #000;
}

.block6 .box .contact_btn input:hover,
.block6 .box .contact_btn button:hover{
	background-size: 8px;
}


.block6 .box .contact_btn .li{
	display: block;
	margin: 20px 0;
}



/* ----------------------------- 送信完了 */

.thanks{
	padding: 60px 0;
}

.thanks p{
	font-size: 18px;
	margin-top: 60px;
}

.thanks .date {
    width: 75%;
    margin: 60px auto 0;
}

.thanks .place {
    margin-top: 20px;
}

.thanks .ticket {
    margin-top: 20px;
}


/* ----------------------------- フッター */

.footer{
	padding-top: 20px;
}

.footer .txt{
	font-size: 13px;
}

.footer .txt a{
	font-size: 16px;
}

.footer .copy{
	/*margin-top: 20px;*/
}

.pagetop{
	width: 50px;
	bottom: 5%;
}




}