@charset "utf-8";

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

		TWICE ツアーcandypop特設 pc style

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

/* base
------------------------------ */
.sp { display: none;}
body {
	font-family: BlinkMacSystemFont, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.8;
	letter-spacing: 0.01em;
}
a:not([class]):hover { text-decoration: underline; }
section { background: #fff; padding: 60px 0; margin: 0 0 100px;}
section .sectionTit { font-size: 60px; }
.btn .sub:hover { background: #f84276; color: #fff; }
header #btnIco.visible { top: 30px; }

/* keyVisual
------------------------------ */
#keyVisual { padding: 50px 0 0; margin-bottom: -60px;}
#keyVisual #loopSlide { margin: 0 0 30px; height: 360px; }
#keyVisual .tourLogo { width: 100%; margin: 0 auto 45px; line-height: 1.3;}
#keyVisual .tourLogo .tourName { font-family: 'Montserrat', sans-serif; color: #fff; font-size: 8vh;}
/*#keyVisual .tourLogo .tourName svg { width: 80%; fill: #fff;}
#keyVisual .tourLogo .tourName svg path { fill: #fff; }*/
#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;
}
#keyVisual .navWrap .menu li:nth-child(1) a::before { background: #4cc1d7; }
#keyVisual .navWrap .menu li:nth-child(2) a::before { background: #ff7638; }
#keyVisual .navWrap .menu li:nth-child(3) a::before { background: #945dce; }
#keyVisual .navWrap .menu li:nth-child(4) a::before { background: #f84276; }
#keyVisual .navWrap .menu li a:hover::before { width: 100%; }
header #btnIco img{ width: 85px;}
#keyVisual .scroll { display: none; }

/* loop animation */
@keyframes infinitescroll {
	0% { transform: translate3d(0, 0, 0);}
	100% { transform:translate3d(-1920vh, 0, 0);}
}
.loop {
	top: 0;
	left: 0;
	animation: infinitescroll 130s linear infinite forwards;
	width: 3840vh;
	height: 55vh;
	transition: all 1s;
}
.loop li {
	width: 80vh;
	height: 100%;
	float: left;
	opacity: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-sizing: border-box;
}

/* schedule
------------------------------ */
#schedule { padding-top: 100px; }
#schedule th {
	color: #ff66c9;
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	border-bottom: 1px solid #ddd;
	padding: 0 0 15px;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
}
#schedule td { border-top: 1px solid #ddd; padding: 15px 0; vertical-align: middle;}
#schedule td.date {
	color: #ff66c9;
	font-size: 35px;
	line-height: 1.3em;
	font-weight: bold;
}
#schedule td.date span {
	display: block;
	width: 75%;
	margin: 0 auto;
	padding: 1px 0 2px;
	vertical-align: middle;
	background: #4cc1d7;
	color: #fff;
	font-size: 11px;
	letter-spacing: 0.1em;
	line-height: 1em;
	border-radius: 10px;
}
#schedule .area { width: 120px; text-align: center;}
#schedule .venue { width: 190px;}
#schedule .open { width: 180px; text-align: center; }
#schedule .date { font-family: 'Montserrat', sans-serif;width: 100px; text-align: center;}
#schedule td.info { font-size: 12px; line-height: 1.5; }

/* ticket
------------------------------ */
#ticket .ticketType { border-bottom: 1px solid #ccc;}
#ticket .ticketType:first-of-type { border-top: 1px solid #ccc; }
#ticket .ticketType .ticketTit {
	font-size: 26px;
	padding: 30px 215px 30px 0;
	line-height: 1.3em;
	position: relative;
}
#ticket .ticketType:not(.normal) .ticketTit { color: #888;}
#ticket .ticketType:not(.normal) .ticketTit:after{
	content: '受付終了';
	display: inline-block;
	color: #f66;
	font-size: 18px;
	font-weight: bold;
	line-height: 30px;
	border: 2px solid;
	padding: 8px 20px;
	margin: -24px 0 0 -70px;
	position: absolute;
	right: 9%;
	top: 50%;
}
#ticket .ticketType:not(.normal) .ticketTit:hover { color: #f84276;}
#ticket .ticketType:not(.normal) .ticketTit:before {
	width: 12px;
	height: 12px;
	top: 50%;
	margin-top: -8px;
}
#ticket .ticketType table { margin: 0 0 30px; }
#ticket .ticketType th,#ticket .ticketType td { border: 1px solid #ccc; padding: 20px;}
#ticket .ticketType th {
	width: 200px;
	background: #eee;
	font-weight: bold;
	text-align: right;
	padding: 10px;
}
#ticket .ticketType td { }
#ticket .ticketList { margin: 0 0 20px; }
#ticket .ticketList li { margin: 0 0 10px; }
#ticket .ticketList li a { display: inline-block; position: relative; padding-right: 10px;}
#ticket .ticketList li a::after {
	content: "";
	width: 0.5em;
	height: 0.5em;
	border-top: 2px solid;
	border-right: 2px solid;
	margin: -0.25em 0 0;
	position: absolute;
	right: 0;
	top: 50%;
	transform: rotate(45deg);
}
#ticket .ticketList li a .subTxt { margin: 0 0 0 1em; }
#ticket .ticketList + .txt { font-size: 12px; }
#ticket .entry { padding: 0 0 20px; }
#ticket .entry .btn { margin-bottom: 10px; }

#ticket .trade { margin: 60px 0 50px;}
#ticket .trade .tit {
	margin: 0 0 30px;
	width: 100%;
	font-size: 25px;
	line-height: 1.3em;
	text-align: center;
	font-weight: bold;
}
#ticket .trade figure { width: 70%; line-height: 0; margin: 0 auto 20px;}
#ticket .trade .txt { margin: 0 0 20px;}
#ticket .trade .txtLink { text-align: center; margin: 0 0 20px;}
#ticket .trade .txtLink a { text-decoration: underline;}

/* special
------------------------------ */
#goods .comingsoon { text-align: center;}
#goods .comingsoon img { width: 600px;}

/* special
------------------------------ */
#special { padding-bottom: 1px; }
section#special { margin-bottom: 0;}
#special .lead { margin: 0 0 65px; text-align: center; }
#special .contents { margin-bottom: 80px;}
#special .contents .contentsIcon { font-size: 40px; top: -80px; left: -20px; }
#special .contents .contentsIcon .initial { display: inline-block; margin-right: -2px; }
#special .contents .contentsIcon .num { font-size: 77px; padding: 0px 0 0 8px;}
#special .contents .prize { margin: 25px 0px; width: 86%;}
#special .contents .prize th { width: 89px; padding: 0 23px 0 0; font-weight: bold; vertical-align: baseline;}
#special .contents .prize td { vertical-align: top; margin: 0 0 25px;}
#special .contents .prize td dl { background: rgba(255,255,255,0.3); padding: 10px; margin: 0 0 25px;}
#special .contents .prize td dt {
	float: left;
	display: inline-block;
	position: relative;
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
}
#special .contents .prize td dt p{
	width: 100%;
	position: absolute;
	color: #fff;
	top: 45%;
	left: 77%;
	z-index: 10;
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
}
#special .contents .prize td dt.rank {
	width: 60px;
	text-align: center;
	height: 30px;
	line-height: 30px;
}
#special .contents .prize td dt img { width: 60px;}
#special .contents .prize td dd {
	padding: 0 65px 0 78px;
	position: relative;
	font-weight: bold;
	width: 100%;
	height: 60px;
	line-height: 60px;
	margin: 0 0 10px;
}
/*special .contents .prize td dd:nth-last-of-type(3) { margin: 0 0 5px;}*/
#special .contents .prize td dd:nth-last-of-type(2),#special .contents .prize td dd:last-of-type {
	font-weight: normal; height: 30px; line-height: 30px;
}
#special .contents .prize td dd:nth-last-of-type(2){ margin: 0 0 10px;}
#special .contents .prize td dd:last-of-type { margin: 0px;}
#special .contents .prize td dd p{
	width: 70px;
	position: absolute;
	top: 5px;
	right: 0;
	font-size: 13px;
	text-align: center;
	line-height: 1.5;
}
#special .contents .prize td dd p .winningNum { width: 100%; display: block; line-height: 1.2;}
#special .contents .prize td dd p .winningNum span {
	font-size: 27px;
	font-family: 'Montserrat', sans-serif;
}
#special .contents .subTxt { text-indent: -1em; padding: 10px 0 0 1em; display: block;}
#special .imageList li.img1 { width: 185px; top: -42px; right: -50px;}
#special .imageList li.img2 { width: 120px; top: 58px; right: -110px;}
#special .imageList li.img3 { width: 120px; top: 167px; left: -114px;}
#special .imageList li.img4 { width: 76px; top: -76px; left: -76px;}
#special .imageList li.img5 { width: 186px; top: 267px; left: -185px;}
#special .imageList li.img6 { width: 61px; top: 188px; right: -50px;}
#special .imageList li.img7 { width: 130px; bottom: -42px; right: -41px;}
#special .imageList li.img8 { width: 60px; bottom: 65px; left: -84px;}
#special .imageList li.img9 { width: 80px; bottom: -87px; left: -112px;}
#special .imageList li.img10 { width: 120px; bottom: 48px; left: -96px;}
#special .imageList li.img11 { width: 108px; bottom: -30px; right: -33px;}
#special .imageList li.img12 { display: none; width: 120px; bottom: 189px; left: -87px;}
#special .imageList li.img13 { width: 88px; top: 28px; right: -66px;}
#special .imageList li.img14 { display: none; width: 176px; bottom: 109px; right: -77px;}
#special .imageList li.img15 { width: 126px; top: -53px; right: 28px;}
#special .imageList li.img16 { width: 137px; bottom: 190px; right: -113px;}
#special .imageList li.img17 { width: 80px; bottom: 6px; right: -117px;}
#special .imageList li.img18 { width: 101px; top: 62px; right: -80px;}
#special .imageList li.img19 { width: 120px; bottom: 7px; left: -95px;}
#special .imageList li.img20 { width: 115px; top: -9px; right: -32px;}
#special .imageList li.img21 { width: 99px; top: 46px; right: -48px;}
#special .imageList li.img22 { width: 89px; top: 209px; left: -67px;}
#special .imageList li.img23 { width: 122px; bottom: 186px; left: -96px;}
#special .imageList li.img24 { width: 162px; top: 290px; right: -73px;}
#special .imageList li.img25 { width: 83px; bottom: 99px; left: -80px;}
#special .imageList li.img26 { width: 105px; bottom: 110px; right: -73px;}
#special .imageList li.img27 { width: 110px; top: 73px; left: -103px;}
#special .imageList li.img28 { width: 58px; top: -119px; right: -28px;}
#special .imageList li.img29 { width: 90px; bottom: 24px; right: -73px;}
#special .imageList li.img30 { width: 68px; bottom: 0; left: -100px;}
#special .imageList li.img31 { width: 143px; bottom: -76px; left: -70px;}


/* footer
------------------------------ */
.links { text-align: center; padding: 80px 0 20px;}
.links .logo { width: 50px; margin: 0 auto 20px;}
.links a { padding: 6px 0; font-size: 12px; line-height: 1.8; display: inline-block;}

.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;
}
