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

     #stages
	公演情報(主催・共催・提携)

------------------------------------------------------*/
/* 見出し
-----------------------------------------*/
#ticket_info h2{
     font-size: 1.500em;
     font-weight: bold;
     margin-bottom: 20px;
	padding: 0 0 0 10px;
}
#ticket_info h2:before{
     content: "|";
     color: #209e8b;
     transform: rotate(45deg);
     display: inline-block;
     margin-right: 15px;
}
#ticket_info h2 + p{
	margin-top: -10px;
	margin-bottom: 20px;
	padding-left: 30px;
}
@media only screen and (max-width: 767px) {
	#ticket_info h2.sp_ttl_style01{
	     position: relative;
	     display:block;
          text-align: center;
          padding: 0;
          margin-bottom: 10px;
	}
	#ticket_info h2.sp_ttl_style01:before{
	     position:absolute;
	     left: 0;
	     top: -5px;
	     content: "";
	     display: block;
	     width: 0;
	     height: 0;
	     border-style: solid;
	     border-width: 0px 24px 10px 30px;
	     border-color: transparent transparent #c6c6c6 transparent;
	     -webkit-transform: rotate(-35deg);
	     -ms-transform: rotate(-35deg);
	     transform: rotate(-35deg);
	}
	#ticket_info h2.sp_ttl_style01:after{
	     position: absolute;
	     right: 0;
	     bottom: -10px;
	     content: "";
	     display: block;
	     width: 0;
	     height: 0;
	     border-style: solid;
	     border-width: 0 30px 10px 24px;
	     border-color: transparent transparent #c6c6c6 transparent;
	     -webkit-transform: rotate(-210deg);
	     -ms-transform: rotate(-210deg);
	     transform: rotate(-210deg);
	}
}
/* icon_box
-----------------------------------------*/
#ticket_info .icon_box {
	border: 1px solid #d3d3d3;
	padding: 30px 10px;
	text-align: center;
	margin: 0 25px 45px;
}
#ticket_info .icon_box h2 {
	font-size: 1.667em;
     font-weight: bold;
     text-align: center;
	margin-bottom: 20px;
}
#ticket_info .icon_box ul{
	display: inline-block;
     font-size: 0.917em;
}
#ticket_info .icon_box ul li{
     float: left;
     display: table;
     height: 32px;
     position: relative;
     padding-left: 40px;
     line-height: 15px;
     font-size: 1.083em;
     margin-right: 10px;
     margin-bottom: 10px;
}
#ticket_info .icon_box ul li span{
     display: table-cell;
     vertical-align: middle;
}
#ticket_info .icon_box ul li img{
     position: absolute;
     left: 0;
     top: 0;
     display: block;
	width: auto;
  max-width: 32px;
}
@media only screen and (max-width: 767px) {
     #ticket_info .icon_box {
     	padding:0;
     	text-align: center;
     	margin: 0 0 45px;
     }
     #ticket_info .icon_box h2{
          font-size: 1.167em;
          height: 40px;
          line-height: 40px;
          margin-bottom:0;
          padding: 0;
          border-bottom: 1px solid #d3d3d3;
          letter-spacing: 1px;
          position: relative;
     }
     #ticket_info .icon_box h2:after{
          display: inline-block;
          content: "";
          width: 5px;
          height: 5px;
          border-top: 1px solid #000;
          border-left: 1px solid #000;
          transform: rotate(45deg);
          position: absolute;
          right: 15px;
          top: 55%;
          margin-top: -2px;
          background: none;
          bottom: auto;
          left: auto;
          margin-left: 0;
     }
     #ticket_info .icon_box h2.open:after{
          border: none;
          border-bottom: 1px solid #000;
          border-right: 1px solid #000;
              margin-top: -4px;
     }
     #ticket_info .icon_box h2:before{
          content: normal;
     }
     #ticket_info .icon_box .text_box{
          display: none;
     }
     #ticket_info .icon_box ul{
          padding:15px;
     }
     #ticket_info .icon_box ul li{
          float: left;
          width: 55%;
          margin-bottom: 10px;
          text-align: left;
     }
     #ticket_info .icon_box ul li:nth-child(even){
          width: 45%;
     }
     #ticket_info .icon_box ul li + li{
          margin-left: 0;
     }
     #ticket_info .icon_box ul li span{
          display: table-cell;
          vertical-align: middle;
          padding-right: 10px;
     }
}
/* ticket_table_01
-----------------------------------------*/
.ticket_table_01 a:link{
	color:#333333 !important;
	text-decoration:none !important;
}
.ticket_table_01 a:visited{
	color:#333333 !important;
	text-decoration:none !important;
}
.ticket_table_01 a:hover{
	color:#333333 !important;
	opacity:1;
	text-decoration:underline !important;
}
.ticket_table_01 .mainbox02 a:link{
	text-decoration:underline !important;
}
.ticket_table_01 .mainbox02 a:visited{
	text-decoration:underline !important;
}
.ticket_table_01 .mainbox02 a:hover{
	text-decoration:none !important;
}
.ticket_table_01{
	width:100%;
	margin:0 auto;
	border-top:1px solid #e5e5e5;
	border-left:1px solid #e5e5e5;
}
/*thead*/
.ticket_table_01 thead th{
	background:#292929;
	font-size:116%;
	color:#fff;
	padding:8px 0;
	text-align:center;
	border-right:1px solid #e5e5e5;
	border-bottom:1px solid #e5e5e5;
}
/*tbody*/
.ticket_table_01 th.title02{
	background:#cacaca;
	color:#000;
	padding:14px 15px;
	text-align:center;
	border-right:1px solid #e5e5e5;
	border-bottom:1px solid #e5e5e5;
	vertical-align:middle;
}
.ticket_table_01 tbody td{
	border-right:1px solid #e5e5e5;
	border-bottom:1px solid #e5e5e5;
	background: #fff;
	padding: 15px 10px;
	font-size: 1.083em;
}
.ticket_table_01 .mainbox01{
	max-width:350px;
	width: 35%;
	padding: 15px 10px !important;
}
.ticket_table_01 .icon_all img{
  max-width: 100px;
}
.ticket_table_01 .mainbox02,
.ticket_table_01 .mainbox03{
	max-width:95px;
	text-align:center;
	width: 10%;
}
.ticket_table_01 .mainbox04{
	text-align:center;
	width: 13%;
}
.ticket_table_01 .mainbox05{
	max-width:160px;
	text-align:center;
	width: 16%;
}
.ticket_table_01 .mainbox06{
	max-width:155px;
	text-align:center;
}
.ticket_table_01 .icon_all img + img{
	margin-left: 10px;
  max-width: 56px;
}
.ticket_table_01 .title{
	font-weight: bold;
	margin: 12px 0 10px;
}
.ticket_table_01 .mainbox06 ul{
  display: inline-block;
  text-align: center;
}
.ticket_table_01 .mainbox06 ul li{
  margin-left: 1px;
  display: inline-block;
}
.ticket_table_01 .mainbox06 ul li + li{
  margin-bottom: 5px;
}
.ticket_table_01 .mainbox06 ul li img{
  width:auto;
  max-width: 100%;
}
@media only screen and (min-width: 768px) {
#ticket_info .ticket_table_01 p.more_btn{
  display: none;
}
}
@media only screen and (max-width: 767px) {
	/*thead*/
	.ticket_table_01 thead,
	.ticket_table_01 tbody th{
		display: none;
	}
	/*tbody*/
	.ticket_table_01 tbody td,
	.ticket_table_01 .mainbox01{
		border: none;
		padding: 0 15px;
		display:block;
		max-width:100% !important;
		width: 100% !important;
		padding:0 15px 20px !important;
		text-align: left !important;
	}
     .ticket_table_01 .mainbox01{
          padding-top: 15px !important;
     }
	.ticket_table_01 .icon_all img{
		width:auto;
	}
     .ticket_table_01 tbody tr + tr{
          display: block;
          background: #fff;
          padding-bottom: 60px;
     }
     .ticket_table_01 tbody tr + tr{
          margin-top: 20px;
     }
	.ticket_table_01 .main_td{
		display: none;
	}
	.ticket_table_01 td em{
          display: block;
          background: #dddddd;
          padding: 8px 10px 8px 18px;
          line-height: 1;
          font-style: normal;
          position: relative;
          margin-bottom: 10px;
     }
     .ticket_table_01 td em:before{
          content: "";
          display: inline-block;
          height: 14px;
          width: 2px;
          background: #000000;
          position: absolute;
          left: 10px;
          top: 50%;
          margin-top: -7px;
     }
     #ticket_info .ticket_table_01 tr{
          position: relative;
     }
     #ticket_info .ticket_table_01 p.more_btn{
          border: 1px solid #cfcfcf;
          color: #cfcfcf;
          text-align: center;
          padding: 5px;
          margin-bottom: 10px;
          width: calc( 100% - 30px );
          text-decoration: none !important;
          position: absolute;
          right: 15px;
          bottom: 15px;
          cursor: pointer;
     }
     #ticket_info .ticket_table_01 p.more_btn:before{
          display: inline-block;
         content: "";
         width: 5px;
         height: 5px;
         border-top: 1px solid #000;
         border-left: 1px solid #000;
         transform: rotate(225deg);
         margin-right: 10px;
         position: absolute;
          right: 10px;
          top: 50%;
          border-color: #cfcfcf !important;
     }
     #ticket_info .ticket_table_01 p.more_btn.open:before{
         border-bottom: 1px solid #000;
         border-right: 1px solid #000;
         border-top:none;
         border-left: none;
     }
}
/* yoyaku_box
-----------------------------------------*/
#ticket_info .yoyaku_box {
	border-top: 1px solid #d3d3d3;
	border-bottom: 1px solid #d3d3d3;
	margin: 70px 0;
	height: 85px;
	width: 100%;
	display: table;
}
#ticket_info .yoyaku_box p{
	display:table-cell;
	vertical-align: middle;
}
#ticket_info .yoyaku_box p + p{
	padding-left: 25px;
}
#ticket_info .yoyaku_box .text01 {
	font-size: 1.250em;
	font-weight: bold;
	letter-spacing: 1px;
	position: relative;
	padding-left: 15px;
	line-height: 140%;
}
#ticket_info .yoyaku_box .text01 span {
	font-size: 0.667em;
	font-weight: normal;
	color: #9f9f9f;
	display: inline-block;
	margin-top: 5px;
  line-height: 100%;
  word-break: break-all;
}
#ticket_info .yoyaku_box .text01:before{
	content: "";
	display: block;
	height: 36px;
	width: 3px;
	background: #209e8b;
	top: 50%;
	left: 0;
	margin-top: -18px;
	position: absolute;
}
#ticket_info .yoyaku_box .text02 {
	font-size: 1.083em;
	font-weight: bold;
}
#ticket_info .yoyaku_box .text02 span {
	font-size: 2.077em;
	display: inline-block;
  line-height: 110%;
}
#ticket_info .yoyaku_box .text03 {
	letter-spacing: 0.5px;
}
#ticket_info .yoyaku_box .text03 span {
	font-weight: bold;
}
#ticket_info .yoyaku_box .text04 {
	text-align: right;
}
#ticket_info .yoyaku_box .text04 a{
  line-height: 150%;
  padding: 11px 43px 11px 33px;
  height: auto;
  border-radius: 50px;
}



#ticket_info .bana_area{
	margin-top: 90px !important;
}
@media only screen and (max-width: 767px) {
     #ticket_info .yoyaku_box {
     	border: 1px solid #000;
     	margin: 10% 0;
     	height: auto;
     	width: 100%;
     }
     #ticket_info .yoyaku_box p{
     	display:block;
     }
     #ticket_info .yoyaku_box p + p{
     	padding-left: 0;
     }
     #ticket_info .yoyaku_box .text01 {
          background: #000;
          color: #fff;
          text-align:center;
          padding: 10px;
     }
     #ticket_info .yoyaku_box .text01 span {
     	color: #209e8b;
     }
     #ticket_info .yoyaku_box .text01:before{
          height: 18px;
          width: 2px;
          background: #fff;
          top: 50%;
          left: 50%;
          margin-top: -20px;
          margin-left: -27%;
          transform: rotate(45deg);
     }
     #ticket_info .yoyaku_box .text02 {
          text-align: center;
          padding: 20px 0;
          margin: 0 15px 15px;
          border-bottom: 1px solid #cfcfcf;
     }
     #ticket_info .yoyaku_box .text02 a{
          color: #000;
          text-decoration: none;
          display: inline-block;
          margin-top: 5px;
     }
     #ticket_info .yoyaku_box .text03 {
          letter-spacing: 0.5px;
          padding: 0 15px;
          line-height: 180%;
          margin-bottom: 10px;
     }
     #ticket_info .yoyaku_box .text04 {
          padding: 5px 15px 20px;
     }
     #ticket_info .bana_area{
     	margin-top: 10% !important;
     }
     #ticket_info h2 + p {
         margin-top: 30px;
         margin-bottom: 15px;
         padding-left: 0;
     }
}


/*緑*/
a.ticket_btn {
    border-bottom: none;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
    color: #fff !important;
    display: inline-block;
    text-align: center;
    border-radius: 20px;
    background: #209e8b url(/arthall/images/link_icon_btn01.png) no-repeat right 15px center;
    padding: 0 43px 0 33px;
    vertical-align: bottom;
    text-decoration: none !important;
}
a.ticket_btn:before {
    content: normal;
}
@media only screen and (max-width: 767px) {
    a.ticket_btn {
        display: block;
    }
}
