@charset "utf-8";

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

	Copyright (c) 2010, Yahoo! Inc. All rights reserved.
	Code licensed under the BSD License:
	http://developer.yahoo.com/yui/license.html
	version: 3.3.0
	build: 3167

	Font-size Adjustment
	
	10px ----- 77%
	11px ----- 85%
	12px ----- 93%
	13px ----- 100%
	14px ----- 108%
	15px ----- 116%
	16px ----- 123.1%
	17px ----- 131%
	18px ----- 136%
	19px ----- 144%
	20px ----- 152%
	21px ----- 159%
	22px ----- 167%
	23px ----- 174%
	24px ----- 182%
	25px ----- 189%
	26px ----- 197%

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

/**
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE6/7 quirks mode.
 */
body{
	font:13px/1.231 arial,helvetica,clean,sans-serif;
	*font-size:small;
	*font:x-small;
}
select,input,button,textarea{
  font:99% arial,helvetica,clean,sans-serif;
}
table{
  font-size:inherit;
  font:100%;
}
pre,code,kbd,samp,tt{
  font-family:monospace;
  *font-size:108%;
  line-height:100%;
}

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {
    line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display:block;
}
ul, ol{
  list-style: none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    outline: none;
}
a:link {
	color: #0e6eb8;
  text-decoration: underline;
}
a:visited {
	color: #0c60a2;
}
a:hover {
	color: #b80e3a;
	text-decoration: underline;
}
a img{
	border: none;
}

.clearfix:before,.clearfix:after {
	content:" ";display:table
}
.clearfix:after {
	clear:both
}
.clearfix {
	*zoom:1
}

/*--------------------------------------
  header
---------------------------------------*/
.wrapper{
	width: 100%;
	position: relative;
    background: #014099;
	z-index: 0;
}

header{
    position: relative;
    margin: 0 0 -10px 0;
    padding: 60px 0 0;
	background: #014099;
}

header h1{
	max-width: 1045px;
	height: 182px;
	margin: 2vw auto 5vw auto;
	background: url(../img/header.png) no-repeat 30px 0;
	-webkit-background-size: contain;
	background-size: contain;
}

@media screen and (max-width: 1100px) {
	header h1 {
		margin: 0 auto 3vw auto;
		width: 90%;
		height: 170px;
		background: url(../img/header.png) no-repeat 0 0;
		-webkit-background-size: contain;
		background-size: contain;
	}
}
@media screen and (max-width: 700px) {
	header h1 {
		margin: 0 auto 2vw auto;
		width: 90%;
		height: 160px;
	}
}

header h1 img{
	display: block;
	width: 100%;
	height: auto;
}

@media screen and (min-width: 600px) {
	h1 span {
		display: none;
		background: transparent no-repeat left top;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	div.btn-interview a ruby {
		margin-top: 20px;
		width: 15%;
		margin-right: 0.2em;
		line-height: 70%;
	}
	div.btn-interview a ruby rb {
		font-size: 40%;
		letter-spacing: 0.5px;
	}
}

@media screen and (max-width: 599px) {
    header{
        position: relative;
        margin: 0 auto -40px auto;
        padding: 40px 0 0;
    }	
	header h1 {
		width: 70%;
		max-width: auto;
		height: auto;
		margin: 0 auto 12% auto;
		background: none;
	}
}


.lead {
	position: relative;
	margin: 0;
	padding: 0;
}
.lead a:link,
.lead a:visited {
	color: #5bd2ed;
}

.lead_inner {
	position: relative;
    width: 90%;
    max-width: 680px;
    height: 100%;
    margin: 0 auto;
    padding: 0;
}

.lead p{
	margin: 0 0 1em;
	font-size: 90%;
	line-height: 1.45;
	color: #fff;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 599px) {
	.h1{
		width: 80%;
		max-width: auto;
		height: auto;
		margin: -20px auto 20px;
		background: none;
	}
	.h1 img{
		display: block;
		width: 90%;
		height: auto;
	}
	.lead {
		margin: 0;
		padding: 0 0 8% 0;
	}
	.lead_inner {
		position: relative;
		width: 90%;
		max-width: 680px;
		height: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
	}
	.lead p{
		font-size: 85%;
	}
}

.bookmark{
	/*height: 30px;*/
	overflow: hidden;
	padding-top: 20px;
}
.bookmark div{
	float: left;
	margin: 0 20px 5px 0 !important;
}

/*--------------------------------------
  出演者
---------------------------------------*/
.live_act {
	background: url(../img/bg_dot.png) repeat-x 0 1.2vw;
	-webkit-background-size: 8%;
	background-size: 8%;
}
.bg_illust {
	margin-top: 0;
	padding: 35.5vw 0 0 0;
	background: url(../img/illust.png) no-repeat center 1.65vw;
	-webkit-background-size: 100%;
	background-size: 100%;
}
.bg_white {
	background: rgba(255,255,255,0.9);
	margin: 0 0 0 0;
}
.live_act_inner {
	position:relative;
	max-width: 800px;
	margin: 0 auto 0 auto;
}
.live_act h2{
	width: 60%;
	max-width: 394px;
	margin: 0 auto 70px auto;
	padding: 70px 0 0 0;
}
.live_act h2 img{
	width: 100%;
	height: auto;
}
.live_act_list{
	margin-bottom: 6vw;
	position: relative;
	/*overflow: hidden;*/
}
.live_act h3 img{
	width: 100%;
	height: auto;
}
.live_date h3 {
	margin: 0 35px 15px 0;
	width: 50%;
	max-width: 295px;
	float: left;
}
.live_date h3.tit_long {
	width: 79%;
	max-width: 355px;
}
.live_date h3.tit_semilong {
	width: 95%;
	max-width: 336px;
}
.live_date p {
	margin: 10px 0;
	float: left;
	font-size: 108%;
	line-height: 1.6;
}

.live_act a:link,
.live_act a:visited {
	color: #0092b3;
}

div.btn-interview {
	margin: 10px 0 0 0;
}
div.btn-interview a {
	padding: 0;
	display: flex;
	color: #fff!important;
	text-decoration: none;
	background: #01419a;
	letter-spacing: 2px;
	line-height: 100%;
	font-weight: 100;
	align-items: center;
}
div.btn-interview a:hover {
	background: #003988;
}
div.btn-interview a img.thumbnail {
	width: 21%;
}

div.btn-interview a small.new {
	margin: 0 1%;
	padding: 5px 10px;
	display: inline-block;
	color: #f42d56;
	border: solid 1px #f42d56;
	font-size: 80%;
	line-height: 100%;
	letter-spacing: 1.5px;
}

.interview01 a img.int_title {
	padding: 0 0 0 9%;
	width: 60%;
	display: block;
}
.interview02 a img.int_title {
	padding: 0 0 0 9.5%;
	width: 57%;
	display: block;
}
.interview03 a img {
	padding: 0 5% 0 0;
}
.interview03 a img.int_title {
	padding: 0 2% 0 2%;
	width: 60%;
	display: block;
}
.interview03 a img {
	padding: 0 5% 0 0;
}

.interview04 a img.thumbnail,
.interview05 a img.thumbnail {
	padding: 0 1% 0 0;
}
.interview04 a img.int_title {
	padding: 0 0 0 4%;
	width: 69%;
	display: block;
}
.interview05 a img.int_title {
	padding: 0 0 0 1%;
	width: 68%;
	display: block;
}
.interview01 a img.int_title_sp,
.interview04 a img.int_title_sp,
.interview05 a img.int_title_sp {
	display: none;
}
.interview01 a img.thumbnail,
.interview04 a img.thumbnail,
.interview05 a img.thumbnail {
	display: block;
}
.interview01 a img.thumbnail_sp,
.interview04 a img.thumbnail_sp,
.interview05 a img.thumbnail_sp {
	display: none;
}

/*--------------------------------------
  お知らせ
---------------------------------------*/
div.information {
	margin: 20px 0 0 0;
	padding: 20px 5vw 5px 5vw;
	background: #fff;
	border: solid 5px rgba(0,0,0,0.06);
}
div.information h4 {
	margin: 0 0 20px 0;
	font-size: 100%;
	line-height: 1.45;
	text-indent: -0.5em;
}
div.information p {
	margin: 0 0 1em;
	font-size: 90%;
	line-height: 1.45;
}
div.information ul {	
	line-height: 1.4;
}
div.information ul li,
div.ticket_group p {
	margin: 0 0 10px 0.5em;
	font-size: 90%;
}
div.information ul li a {
	display: inline-block;
	word-break: break-all;
}
div.information div.ticket_group {
	margin: 0 0 20px 0;
	padding: 12px 0 3px 0;
	border-top: dotted 1px #ddd;
	border-bottom: dotted 1px #ddd;
}
div.ticket_group p span {
	display: inline-block;
}

@media screen and (min-width: 600px) {
	
	.live_act01{
		float: left;
		width: 48%;
		max-width: 380px;
	}
	.live_act01 img{
		width: 100%;
		height: auto;
	}
	.live_act01 p{
		margin-top: 5px;
		font-size: 160%;
		line-height: 1.2;
		letter-spacing: 0.05rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act02{
		float: right;
		width: 48%;
		max-width: 380px;
        position: relative;
	}
	.live_act02 img{
		width: 100%;
		height: auto;
	}
	.live_act02 p{
		margin-top: 5px;
		font-size: 160%;
		line-height: 1.2;
		letter-spacing: 0.3rem;
		color: #fff;
        color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
		/*padding-left: 1em;
		text-indent: -0.5em;*/
	}
    .live_act02 p span {
        display: inline-block;
    }
	
	.live_act03 {
		float: left;
		width: 31%;
		max-width: 247px;
	}
	.live_act03 img {
		width: 100%;
		height: auto;
	}
	.live_act03 p {
		margin-top: 5px;
		font-size: 123.1%;
		line-height: 1.2;
		letter-spacing: -0.01rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act04{
		float: left;
		width: 31%;
		max-width: 247px;
	}
	.live_act04 img {
		margin: 0 0 0 12%;
		width: 100%;
		height: auto;
	}
	.live_act04 p {
		margin-top: 5px;
		margin-left: 25%;
		font-size: 136%;
		line-height: 1.2;
		letter-spacing: 0.4rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act05 {
		float: right;
		width: 31%;
		max-width: 247px;
	}
	.live_act05 img {
		width: 100%;
		height: auto;
	}
	.live_act05 p {
		margin-top: 6px;
		font-size: 123.1%;
		line-height: 1;
		letter-spacing: 0.07rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act05 p small {
		font-size: 70%;
		display: inline-block;
	}
	.live_act_list .artist_name1 p {
		letter-spacing: 0.05rem!important;
	}
	.live_act_list .artist_name1 p {
		letter-spacing: 0.05rem!important;
	}
	
	
	
	.live_act_cross {
		position: absolute;
        width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 50%;
		top: 38.8%;
        margin: 0 0 0 -2.5%;
        z-index: 1;
	}
	
	.live03_cross {
		left: 50%;
		top: 32%;
	}
	.live_act_cross img,
	.live_act_cross2 img,
	.live_act_cross3 img {
		width: 100%;
		height: auto;
	}
	.live_act_cross2 {
		position: absolute;
         width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 35.2%;
		top: 33.3%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	.live_act_cross3 {
		position: absolute;
        width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 69.8%;
		top: 33.3%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	
	.live_act p.inquiry {
		margin: 0 auto 70px auto;
		text-align: center;
		font-size: 100%;
	}
	
	.live01_cross {
		left: 50%;
		top: 32%;
	}

}

@media screen and (max-width:800px) {
	.bg_illust {
		margin-top: 0;
		padding: 36.5vw 0 0 0;
		background: url(../img/illust.png) no-repeat center 2.8vw;
		-webkit-background-size: 100%;
		background-size: 100%;
	}
	.live_act_cross {
		position: absolute;
        width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 50%;
		top: 45%;
        margin: 0 0 0 -2.5%;
        z-index: 1;
	}
	.live03_cross {
		left: 50%;
		top: 28%;
	}
	.live01_cross {
		left: 50%;
		top: 41%;
	}
	.live_act_cross2 {
		position: absolute;
        width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 37%;
		top: 40%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	.live_act_cross3 {
		position: absolute;
        width: 5%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 68.2%;
		top: 40%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
}
@media screen and (max-width:700px) {
	.live_act {
		background: url(../img/bg_dot.png) repeat-x 0 2.2vw;
		-webkit-background-size: 8%;
		background-size: 8%;
	}
	.bg_illust {
		margin-top: 0;
		padding: 36.5vw 0 0 0;
		background: url(../img/illust.png) no-repeat center 2.6vw;
		-webkit-background-size: 100%;
		background-size: 100%;
	}
	
}

@media screen and (max-width: 599px) {
.live_act {
	background: url(../img/bg_dot.png) repeat-x 0 15vw;
	-webkit-background-size: 8%;
	background-size: 8%;
}
.bg_illust {
	margin-top: 0;
	padding: 62vw 0 0 0;
	background: url(../img/illust.png) no-repeat center 15vw;
	-webkit-background-size: 140%;
	background-size: 140%;
}
.bg_white {
	background: rgba(255,255,255,0.9);
	margin: 0 0 0 0;
	padding: 0 0 20px 0;
}
.live_act_inner {
	position:relative;
	max-width: 800px;
	margin: 0 auto 0 auto;
}
.live_act{
	margin: 0 auto -13%;
}
.live_act h2 {
	width: 75%;
	margin: 0 auto 10vw auto;
	padding: 10vw 0 0 0;
	max-width: 400px;
}
.live_date h3 {
	width: 72%;
	margin: 4vw auto 1vw auto;
	text-align: center;
	float: none;
}
.live_date h3.tit_long {
	width: 85%;
}
.live_date h3.tit_semilong {
	width: 80%;
}
.live_date h3 img {
	margin: 0 auto;
}
.live_date p {
	margin: 10px 0;
	float: left;
	font-size: 100%;
	line-height: 1.6;
}
.live_date p {
	margin: 10px 0 5px 0;
	float: left;
	font-size: 100%;
	line-height: 1.4;
}
.live_act_list{
	margin: 0 5% 13vw 5%;
}
.live_act01{
	float: left;
	width: 49%;
	max-width: 380px;
}
.live_act01 img{
	width: 100%;
	height: auto;
}
.live_act01 p{
	margin-top: 5px;
	font-size: 100%;
	line-height: 1.0;
	letter-spacing: 0.1rem;
	color: #333;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	font-weight: 600;
	text-align: center;
}
.live_act02{
	float: right;
	width: 49%;
	max-width: 380px;
	position: relative;
}
.live_act02 img{
	width: 100%;
	height: auto;
}
.live_act02 p{
	margin-top: 5px;
	font-size: 100%;
	letter-spacing: 0.3rem;
	line-height: 1.0;
	color: #fff;
	color: #333;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	font-weight: 600;
	text-align: center;
	/*padding-left: 1em;
	text-indent: -0.5em;*/
}
.live_act02 p span {
	display: inline-block;
}
.live_act_list .artist_name1 p {
	font-size: 90%!important;
	letter-spacing: 0rem!important;
}


.live_act_cross{
	position: absolute;
	width: 10%;
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	left: 50%;
	top: 38.8%;
	margin: 0 0 0 -5%;
	z-index: 1;
}
.live_act_cross img{
	width: 100%;
	height: auto;
}
      


.live_info{
	clear: both;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding: 45px 0 0;
}
.live_info p{
	margin:  0 0 8px;
    margin-bottom: 0.5em;
	font-size: 180%;
	line-height: 1.5;
	color: #333;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-weight: 600;
}
.live_info p small{
	font-size: 70%;
	font-weight: normal;
}
.live_info li small{
	font-size: 75%;
	font-weight: normal;
}
.live_info li{
    margin-bottom: 1px;
	font-size: 105%;
	line-height: 1.5;
	color: #333;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
	font-weight: 400;
}
.live_info dl {
    display: flex;
    width: 100%;
}
.live_info dl dt {
    display: table-cell;
    width: 22%;
    text-align: center;
    background: #1eb0aa;
    color: #fff;
    padding: 9px 0;
}
.live_info dl dd {
    display: table-cell;
    width: 78%;
    padding: 9px 15px;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.75);
}
.live_info dl dt span,
.live_info dl dd span {
    display: inline-block;
}

div.btn-interview a {
	padding: 0px 0 0 0;
	color: #fff!important;
	text-decoration: none;
	background: #01419a;
	-webkit-background-size: 26px;
	background-size: 26px;
	font-size: 3.35vw;
	letter-spacing: 0;
	line-height: 200%;
	font-weight: 100;
	align-items: center;
}
div.btn-interview a:hover {
	background: #003988;
}
div.btn-interview a img {
	padding: 0 2.5% 0 0;
	width: 28%;
}
div.btn-interview a span {
	padding: 0 0 0 0;
}
div.btn-interview a small.new {
	margin: 0 1% 0 1%;
	padding: 3px 3px;
	display: inline-block;
	color: #f42d56;
	border: solid 1px #f42d56;
	font-size: 60%;
	line-height: 100%;
	letter-spacing: 1.5px;
}
div.btn-interview a ruby {
	margin-top: 8px;
	margin-right: 2px;
	width: 16%;
	line-height: 70%;
}
div.btn-interview a ruby rb {
	font-size: 40%;
	letter-spacing: -0.5px;
}

.interview01 a img {
	padding: 0 0 0 0;
}

.interview01 a img.int_title {
	display: none;
}
.interview01 a img.int_title_sp {
	padding: 0 0 0 5%;
	width: 65%;
	display: block;
}

.interview02 a img {
	padding: 0 0 0 0;
}
.interview02 a img.int_title {
	padding: 0 0 0 1%;
	width: 64%;
	display: block;
}

.interview03 a img.int_title {
	padding: 0 1% 0 0;
	width: 66%;
	display: block;
}

.interview04 a img.thumbnail,
.interview05 a img.thumbnail {
	padding: 0 1% 0 0;
}
.interview04 a img.int_title,
.interview05 a img.int_title {
	display: none;
}
.interview04 a img.int_title_sp {
	padding: 0 3%;
	width: 68%;
	display: block;
}
.interview05 a img.int_title_sp {
	padding: 0 1% 0 1%;
	width: 63%;
	display: block;
}
.interview01 a img.thumbnail,
.interview04 a img.thumbnail,
.interview05 a img.thumbnail {
	display: none;
}
.interview01 a img.thumbnail_sp,
.interview04 a img.thumbnail_sp,
.interview05 a img.thumbnail_sp {
	display: block;
	width: 20%;
}

}

@media screen and (min-width:600px) and ( max-width:800px) {
    .live_act_list {
        padding: 0 5% 6vw 5%;
    }
    .live_info {
        padding: 45px 5% 0;
        box-sizing: border-box;
    }
	.live03_cross {
		left: 50%;
		top: 40%;
	}
	div.btn-interview a {
		padding: 0px 0 0 0;
		color: #fff!important;
		text-decoration: none;
		background: #01419a;
		-webkit-background-size: 26px;
		background-size: 26px;
		font-size: 3.35vw;
		letter-spacing: 0;
		line-height: 200%;
		font-weight: 100;
		align-items: center;
	}
	div.btn-interview a img {
		padding: 0 3.3% 0 0;
		width: 28%;
	}
	div.btn-interview a ruby {
		margin-top: 18px;
		width: 16%;
		margin-right: 0.2em;
		line-height: 70%;
	}
	div.btn-interview a ruby rb {
		font-size: 40%;
		letter-spacing: 0px;
	}
	div.btn-interview a small.new {
		margin: 0 1%;
		padding: 5px 10px;
		display: inline-block;
		color: #f42d56;
		border: solid 1px #f42d56;
		font-size: 50%;
		line-height: 100%;
		letter-spacing: 1.5px;
	}
	
	.interview01 a img.int_title {
		padding: 0 0 0 6%;
		width: 60%;
		display: block;
	}
	.interview02 a img.int_title {
		padding: 0 0 0 5%;
		width: 54%;
		display: block;
	}
.interview05 a img.thumbnail {
	padding: 0 1% 0 0;
}
.interview05 a img.int_title {
	padding: 0 1% 0 1%;
	width: 64%;
	display: block;
}




	
}

@media screen and (max-width:  599px) {
    .live_info {
        padding: 30px 5% 20px;
        box-sizing: border-box;
    }
	.live_info p{
		margin: 0 0 0.8em;
		font-size: 120%;
	}
	.live_info li{
		font-size: 100%;
	}
	
	.bg_illust {
		margin-top: 0;
		padding: 61vw 0 0 0;
		background: url(../img/illust.png) no-repeat center 13.5vw;
		-webkit-background-size: 140%;
		background-size: 140%;
	}
	
	.live_act01{
		float: left;
		width: 49%;
		max-width: 380px;
	}
	.live_act01 img{
		width: 100%;
		height: auto;
	}
	.live_act01 p{
		margin-top: 5px;
		font-size: 93%;
		line-height: 1.0;
		letter-spacing: 0.05rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act02{
		float: right;
		width: 49%;
		max-width: 380px;
        position: relative;
	}
	.live_act02 img{
		width: 100%;
		height: auto;
	}
	.live_act02 p{
		margin-top: 5px;
		font-size: 93%;
		letter-spacing: 0.3rem;
		line-height: 1.0;
		color: #fff;
        color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
		/*padding-left: 1em;
		text-indent: -0.5em;*/
	}
    .live_act02 p span {
        display: inline-block;
    }
	
	.live_act03{
		float: left;
		width: 31%;
		max-width: 170px;
	}
	.live_act03 img{
		width: 100%;
		height: auto;
	}
	.live_act03 p{
		margin-top: 5px;
		font-size: 75%;
		line-height: 1.2;
		letter-spacing: -0.02rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act04{
		float: left;
		width: 31%;
		max-width: 170px;
	}
	.live_act04 img{
		margin: 0 0 0 11%;
		width: 100%;
		height: auto;
	}
	.live_act04 p{
		margin-top: 5px;
		margin-left: 25%;
		font-size: 93%;
		line-height: 1.2;
		letter-spacing: 0.05rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act05{
		float: right;
		width: 31%;
		max-width: 170px;
	}
	.live_act05 img{
		width: 100%;
		height: auto;
	}
	.live_act05 p{
		margin-top: 5px;
		font-size: 85%;
		line-height: 0.9;
		letter-spacing: 0.05rem;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        font-weight: 600;
		text-align: center;
	}
	.live_act05 p small {
		font-size: 65%;
		display: inline-block;
	}
	
	
	
	.live_act_cross{
		position: absolute;
        width: 7%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 51.4%;
		top: 57%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	.live03_cross {
		left: 51.5%;
		top: 48%;
	}
	.live01_cross {
		left: 51.5%;
		top: 48.5%;
	}
	.live_act_cross img,
	.live_act_cross2 img,
	.live_act_cross3 img {
		width: 100%;
		height: auto;
	}
	.live_act_cross2 {
		position: absolute;
        width: 7%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 34%;
		top: 45%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	.live_act_cross3 {
		position: absolute;
        width: 7%;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
		left: 68.6%;
		top: 45%;
        margin: 0 0 0 -5%;
        z-index: 1;
	}
	
	.live_act p.inquiry {
		margin: 20vw auto 20px auto;
		text-align: center;
		font-size: 100%;
		line-height: 1.6;
	}
	.live_act p.inquiry span {
		display: block;
	}
	div.btn-interview a ruby {
		margin-top: 10px;
		width: 16%;
		margin-right: 0.1em;
		line-height: 70%;
	}
	div.btn-interview a ruby rb {
		font-size: 39.5%;
		letter-spacing: 0px;
	}
	
	div.information h4 {
		margin: 0 0 20px 0;
		font-size: 4vw;
		line-height: 1.45;
		text-align: left;
	}
}


@media screen and (min-width: 600px) {
}

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




/*--------------------------------------
  チケット
---------------------------------------*/
.ticket {
  position: relative;
  margin: 0;
  padding: 0;
}

.ticket_inner {
	position:relative;
	width: 90%;
	max-width: 680px;
	height: 100%;
	margin: 0 auto;
	padding: 70px 0 0;
	z-index: 5;
}
.ticket h2{
	width: 60%;
	max-width: 330px;
	margin: 0 auto 30px;
}
.ticket h2 img{
	width: 100%;
	height: auto;
}
.ticket p.link_btn {
	margin-top: 10px;
}
.ticket p.link_btn a {
	position: relative;
	display: block;
	margin: 0 10px;
	padding: 5px;
	text-align: center;
	background-color: #e60a3c;
	color: #fff;
	line-height: 40px;
	font-size: 78%;
	letter-spacing: 0.5rem;
	font-weight: 600;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
	text-decoration: none;
}
.ticket p.link_btn a:hover {
	background-color: #c4002d;
}
.ticket p {
	margin: 0 0 10px 0;
    text-align: center;
    font-size: 150%;
    line-height: 1.4;
	letter-spacing: 0.1rem;
    font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-weight: bold;
	color: #fff;
}
.ticket p span {
    display: block;
	margin: 0 26%;
	padding: 3px 5px 3px 13px;
	border: solid 1px #fff;
	font-size: 85%;
}
.ticket p small {
	font-size: 75%;
	font-weight: normal;
	letter-spacing: 0.5px;
	color: rgba(255,255,255,0.8);
}
.ticket p.ticket_group {
	margin-top: 30px!important;
}


@media screen and (max-width: 599px) {
	.ticket{
		margin: 22vw auto 0 auto;
		padding-bottom: 3.5vw;
	}
    .ticket h2 {
        width: 60%;
        margin: 0 auto 20px auto;
        max-width: 400px;
    }
    .ticket_inner {
		position:relative;
		width: 90%;
		max-width: 680px;
		height: 100%;
		margin: 40px auto 0 auto;
		padding: 30px 0 0 0;
		z-index: 5;
	}

	.ticket p.link_btn a {
		position: relative;
		display: block;
		margin: 0 10px;
		padding: 5px;
		text-align: center;
		background-color: #e60a3c;
		color: #fff;
		line-height: 40px;
		font-size: 78%;
		letter-spacing: 0.3rem;
		font-weight: 600;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		text-decoration: none;
	}
	.ticket p.link_btn a:hover {
		background-color: #c4002d;
	}
	.ticket p {
		margin: 0 0 0.5em 0;
		text-align: center;
		font-size: 130%;
		line-height: 1.5;
		letter-spacing: 0;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		font-weight: bold;
		color: #fff;
	}
	.ticket p span {
		margin: 0 10px 0.5em 10px;
		padding: 2px 5px;
		display: block;
		border: solid 1px #fff;
		font-size: 80%;
		letter-spacing: 0.1rem;
	}
	p.event_date {
		font-size: 4.83vw!important;
		letter-spacing: -0.15px;
		font-feature-settings : "palt";
	}

}


/*--------------------------------------
  footer
---------------------------------------*/

.footer {
    padding: 70px 0 0;
    overflow: hidden;
}
footer {
	position: relative;
	margin: 0;
	padding: 0;
	background: #fff;
}
.footer_inner {
    position: relative;
    z-index: 10;
    padding: 20px 0 0px;
}
.footer_list{
	/*margin: 0 0 30px;
	background-color: #fff;
	overflow: hidden;*/
}
footer ul{
	width: 780px;
	margin: 0 auto;
	padding: 0;
}
footer ul li {
	float: left;
	box-sizing:border-box;
	width: 253px;
	margin: 12px 67px 14px 0;
	padding: 0;
	color: #333;
	font-size: 100%;
	line-height: 1.75;
	color: #333;
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
footer ul li:first-child {
	margin: 15px 67px 14px 0;
}
footer ul li:last-child {
	margin-top: 0;
	margin-right: 0;
	width: 140px;
}

footer ul li div {}
footer ul li a {
	display: block;
	width: auto;
	height: 20px;
	text-align: center;
	line-height: 0;
}
footer ul li img {
	display: inline-block;
	width: 211px;
	height: 34px;
}
footer ul li:nth-child(2) a img{
	float: left;
	width: 210px;
	height: 44px;
	margin: 0;
}
footer ul li:last-child img {
	float: left;
	width: 100px;
	height: 67px;
}
footer ul li p {
	margin: 8px 0 0 0;
	float: left;
	font-size: 70%;
}
footer ul li:nth-child(2) p {
	margin: 13px 0 0 0;
	float: left;
	font-size: 70%;
}
footer ul li:last-child p {
	margin: 25px 0 0 0;
	float: left;
	font-size: 70%;
}
footer ul li div {
	float: right;
}
.natalie_logo{
	text-align: center;
    padding: 50px 0 5px;
}
.natalie_logo img{
	width: 30%;
	max-width: 160px;
	height: auto;
	padding: 0 0 5px 0;
}
.copyright{
	padding: 0 0 40px 0;
	font-size: 65%;
	line-height: 1.45;
	color: #34373b;
	font-family: 'Noto Sans JP',  sans-serif;
	font-weight: 400;
	text-align: center;
}

@media screen and (max-width:  659px) {
    .footer {
		padding: 40px 0 0;
		overflow: hidden;
    }
    footer {
        position: relative;
        margin: 0;
        padding: 0;
		background: #fff;
    }
    .footer_inner {
        position: relative;
        z-index: 10;
        padding: 0;
    }
	
	footer ul{
		padding: 20px 0 30px 0;
		width: auto;
	}
	footer ul li {
		float: none;
		box-sizing:border-box;
		margin: 10px auto;
		padding: 0 0 10px 0;
		color: #333;
		font-size: 100%;
		line-height: 1.75;
		color: #333;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		text-align: center;
	}
	footer ul li:first-child {
		margin: 10px auto;
	}
	footer ul li:nth-child(2) {
		margin: 10px auto;
	}
	footer ul li:last-child {
		margin: 10px auto;
		width: 100px;
		height: auto;
	}
	footer ul li a {
		display: block;
		width: auto;
		height: 20px;
		text-align: center;
		line-height: 0;
	}
	footer ul li img {
		display: inline-block;
		width: 130px;
		height: auto;
	}
	footer ul li:nth-child(2) a img{
		float: none;
		width: 130px;
		height: auto;
		margin: 0;
	}
	footer ul li:last-child img {
		float: none;
		width: 70px;
		height: auto;
	}
	footer ul li p {
		margin: 12px 0 0 0;
		float: none;
		font-size: 70%;
	}
	footer ul li:nth-child(2) p {
		margin: 12px 0 0 0;
		float: none;
		font-size: 70%;
	}
	footer ul li:last-child p {
		margin: 25px 0 0 0;
		float: none;
		font-size: 70%;
	}
	footer ul li div {
		float: none;
		text-align: center;
	}
	.copyright{
		font-size: 70%;
	}
}

@media screen and (min-width:600px) and ( max-width:800px) {
	
	footer ul{
		width: 630px;
		margin: 0 auto;
		padding: 0;
	}
	footer ul li {
		float: left;
		box-sizing:border-box;
		width: 235px;
		margin: 12px 10px 14px 0;
		padding: 0;
		color: #333;
		font-size: 100%;
		line-height: 1.75;
		font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
	}
	footer ul li:first-child {
		margin: 15px 10px 14px 0;
	}
	footer ul li:last-child {
		margin-top: 0;
		margin-right: 0;
		width: 130px;
	}
	
}