@charset "utf-8";

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

		TWICE ツアー 特設 pc style

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

/* base
------------------------------ */
body {
  background-color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, 'Arial', "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  color: #333333;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.03em;
}
a {
  color: #f86092;
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.sp {
  display: none !important;
}


section { padding: 100px 0;}
section .sectionTit {font-size: 40px; font-weight: 900; margin: 0 0 55px; text-align: center; line-height: 1.5em; color:#f66f9b;letter-spacing: 0.05em; }


/* keyVisual
------------------------------ */
#keyVisual {
	padding: 0;
}
#keyVisual .kv_wrap{ 
	width: 100%;
	height: 100vh;
}
#keyVisual .info{ font-size: 16px;}
#keyVisual .inner { background-image: url("../image/keyvisual_pc_v2.png"); background-size: cover;}
#keyVisual .navWrap .menu li { margin: 0 0 1em; }
#keyVisual .navWrap .menu li a {
	display: inline-block;
	font-size: 50px;
	line-height: 1em;
	text-decoration: none;
	position: relative;
}
#keyVisual .navWrap .menu li p { position: relative; z-index: 2; transition: all .1s ease;}
#keyVisual .navWrap .menu li a::before {
	content: '';
	width: 0;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

/* gnav
------------------------------ */
#gNav {
	width: 100%;
	box-sizing: border-box;
	padding: 20px 5%;
	position: fixed;
	top: 0;
	left:0;
	z-index: 100;
}
.navWrap { display: none}
.header_logo { height: 200px; position: fixed; left: 5%;top: 20px;}
.header_logo svg { height: 100%; fill: #fff; width:200px;}
.small .header_logo{ height: 80px}
.small .header_logo svg { width: 80px;}
.small .header_logo svg{ stroke:#ff8a9d;stroke-width:3;}

#gNav ul { 
	text-align: right;
    position: absolute;
    right: 5%;
    top: 60px;
}
.small #gNav ul{ top:30px;}
#gNav li {
	display: inline-block;
	color: #fff;
	font-weight: 900;
	font-size: 26px;
	letter-spacing: 0.08em;
	margin: 0 30px 0 0;
}
@media all and (-ms-high-contrast:none){
	#gNav li { overflow: hidden;}
}
#gNav li:last-child { margin-right: 0;}
#gNav li a {
	position: relative;
	padding: 3px 0;
	margin-bottom: 10px;
	transition: all .2s ease;
	text-decoration: none;
	color: #fff;
}
.small #gNav li a {
text-shadow: #ff8a9d 1px 1px 0px, #ff8a9d -1px 1px 0px, #ff8a9d 1px -1px 0px, #ff8a9d -1px -1px 0px;
}
 #gNav li a:hover {
 	color:#8fd5e5;
	text-shadow: #fff 1px 1px 0px, #fff -1px 1px 0px, #fff 1px -1px 0px, #fff -1px -1px 0px;
 }
/* schedule
------------------------------ */
#schedule td { padding: 12px 0; vertical-align: middle;}
#schedule td.date {font-size: 36px;font-weight: 500;}
#schedule td.date span { display: inline-block; font-size: 14px; line-height: 1; transform: rotate(90deg);vertical-align: 5px;}
#schedule .area { width: 80px; text-align: center;font-size: 30px;}
#schedule .area a { color:#f66f9b;top:0;position: relative;}
#schedule .area a:hover { top:-5px;}
#schedule .venue { width: 340px;font-size: 30px;font-weight: 500;}
#schedule .date { width: 130px;}
#schedule td.info { font-size: 12px; width: 350px; }

/* ticket
------------------------------ */
.accordion li { margin: 0 0 30px; background: #fff;border-radius: 6px; }
.accordion li .tit {
	font-size: 26px;
	padding: 18px 65px 18px 30px;
	line-height: 1.3em;
	position: relative;
}
#ticket .accordion li .tit{
	padding: 30px 65px 30px 30px;
	font-weight: bold;
}
.accordion li:not(.current) .tit { cursor: pointer;}
/*.accordion li:first-child .tit{ border-top: 1px solid #fff; }*/
.accordion li:not(.current) .tit:hover { color: #f66f9b;}
.accordion li.end .tit:after {
	content: '受付終了';
	display: inline-block;
	color: #e4004a;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	border: 2px solid;
	padding: 4px 20px;
	margin: -21px 0 0 -70px;
	position: absolute;
	top: 50%;
	right: 10%;
}

.accordion li table { margin: 0 0 30px;}
.accordion li th,.accordion li td {padding: 20px 0;border-bottom: 1px solid #ddd}
.accordion li th {
	width:140px;
	font-weight: bold;
	vertical-align: top;
}
.accordion li td {vertical-align: top;}
#ticket .childTicket {
	padding: 10px 0 20px 0;
}
#ticket .childTicket .tit {
	margin: 0 0 20px;
	font-size: 18px;
}
#ticket .childTicket .lead { margin: 0 0 20px;font-weight: bold;}
#ticket .childTicket .attentionList li { margin: 0 0 5px;}
#ticket .childTicket .attentionList li span { font-size: 13px;}
#ticket .accordion .detail{ padding: 0 30px 30px;}
#ticket .attention .bold{ font-size: 1.15em;}
#ticket .attention .inquiry{ background: #eee;padding: 20px;margin: 30px 0 0;}


/* trade
------------------------------ */

#trade .text{ text-align: center;font-size: 18px;}

/* goods */
#goods .inner{ max-width:950px;}
#goods .block_left{ width:65%;margin-right:3%;float: left;}
#goods .block_right{ width: 32%;float: right;}
#goods .block_right img{border-radius: 50%;}
#goods .text{ margin: 0 0 20px;font-size: 18px;}
#goods dl{ 
	margin: 0 0 10px;
	border-radius: 6px;
	font-size: 18px;
}

#goods dt{ font-weight: bold;color:#f66f9b;}
#goods dd{ }
#goods .btn{ margin:30px auto 0;}



/* qa
------------------------------ */
.accordion li .answer { background: transparent;}
#qa .accordion { margin: 0 0 40px;}
#qa .accordion li { margin: 0 0 20px;background: #ffe8eb;border-radius: 6px;}
#qa .accordion li.category {
	background: transparent;
	box-shadow: none;
	border-radius: 0px;
	overflow: hidden;
	font-size: 20px;
	font-weight: bold;
	line-height: 2em;
}
#qa .accordion li .tit { font-size: 18px;}
#qa .accordion li .detail { padding: 0 30px 30px; }
#qa .accordion li .txt{
	padding-left: 50px;
	display: block;
	line-height: 1.6;
}
#qa .accordion li .txt a{ text-decoration: underline}
#qa .accordion li .txt a:hover{ text-decoration: none}

#qa .icon {
	display: inline-block;
	width: 32px;
	color: #fff;
	background: #f66f9b;
	text-align: center;
	line-height: 32px;
	border-radius: 50%;
	float: left;
	font-weight: bold;
}
#qa .answer .icon { background: #fff; font-weight: bold;color: #f66f9b;}

/* footer
------------------------------ */
.links { text-align: center; padding: 60px 0 0; margin : 0 0 20px;}
.links .logo { width: 50px; margin: 0 auto 20px;}
.links a { font-size: 16px; line-height: 1.8; display: inline-block;}
footer a:hover { opacity: 0.5; text-decoration: none!important;}

.accordion li .ticketList li { margin: 0 0 10px;}
.accordion li .ticketList li a {
	display: inline-block;
	position: relative;
	padding-right: 13px;
}
.officialcarrier { width: 373px; margin: 0 auto 30px;}
.officialcarrier dt { font-size: 10px; margin: 0 0 3px;}
.officialcarrier dd {
	width: 175px;
	margin: 0 auto;
	padding: 0 15px;
}


/* 追加公演 */
.moreLive{
  padding:0 0 20px;
}
.moreLive h3{
  padding: 0 0 25px;
  color: #f66f9b;
  font-size: 25px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  letter-spacing: 5px;
}
#schedule .moreLive table{
  border-top: 1px solid #f66f9b;
  border-bottom: 1px solid #f66f9b;
}

.accordion li.moreTicket{
  border: 4px solid #e4004a;
}

.accordion li.moreTicket h3{
  color: #e4004a;
}
.accordion li.moreTicket .tit:after {
	content: '追加公演';
	display: inline-block;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	background:#e4004a;
	border: 2px solid #e4004a;
	padding: 4px 20px;
	margin: -21px 0 0 -70px;
	position: absolute;
	top: 50%;
	right: 30px;
}
.detail table td .indent{
  display: inline-block;
  text-indent: -1em;
  padding: 0 0 0 1em;
  font-size: 0.85em;
  line-height: 1.4em;
}
.moreTicket .btn{
  width: 100%;
  text-align: center;
}
.moreTicket .btn .main{
  display: inline-block;
  width: 48%;
  margin: 2% 1%;
}
.moreTicket .btn .main.large{
  width: 100%;
  max-width:400px;;
}