@charset "utf-8";

/*===================================================
    anim
====================================================*/
.loader {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #8ed0ca;
    z-index: 9999;
}

.heroInner .act1 {
	animation: fuwafuwa 4.5s infinite;	
}

@keyframes fuwafuwa {
	0% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-20px);
	}
	100% {
		transform: translateY(0px);
	}	
}

.act1 img {
	opacity: 0;
	animation: fadeSplash 0.3s ease 2.5s 1 forwards;
}

@keyframes fadeSplash {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.9);
		transform: scale(0.9);
	}
	50% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
	}
	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}	
}

.bgBox {
	pointer-events: none;
    width: 100%;
    height: 100%;
    padding: 0;
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
    min-height: 750px;
    transform: translate3d(0, 0, -1px);
    overflow: hidden;
}

.bgBox .bubble {position: absolute; opacity: 0; transition: all .5s ease-out;}
.loaded .bgBox .bubble {transition-delay: 1.5s; opacity: 1;}

.bgBox .bubble.hight {width: 100px;}
.bgBox .bubble.middle {width: 75px;}
.bgBox .bubble.low {width: 50px;}

.bgBox .bubble.bubble01 {animation: fuwafuwaBubble 5s infinite; top: 80%; left: 10%;}
.bgBox .bubble.bubble02 {animation: fuwafuwaBubble 6.5s infinite; top: 48%; left: -2%;}
.bgBox .bubble.bubble03 {animation: fuwafuwaBubble 5.5s infinite; top: 13%; left: 15%;}
.bgBox .bubble.bubble04 {animation: fuwafuwaBubble 6s infinite; top: 37%; left: 20%;}

.bgBox .bubble.bubble05 {animation: fuwafuwaBubble 6s infinite; top: 7%; left: 69%;}
.bgBox .bubble.bubble06 {animation: fuwafuwaBubble 5s infinite; top: 64%; left: 94%;}
.bgBox .bubble.bubble07 {animation: fuwafuwaBubble 6.5s infinite; top: 43%; left: 77%;}
.bgBox .bubble.bubble08 {animation: fuwafuwaBubble 5.5s infinite; top: 85%; left: 76%;}

@keyframes fuwafuwaBubble {
	0% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-15px);
	}
	100% {
		transform: translateY(0px);
	}	
}

.anim {
    opacity: 0;
    -webkit-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
    transform: translateY(30px);
}

.anim.on {
	opacity: 1;
    transform: translateY(0);
}

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

	.bgBox {
		min-height: 450px;
	}

	.bgBox .bubble.hight {width: 80px;}
	.bgBox .bubble.middle {width: 60px;}
	.bgBox .bubble.low {width: 40px;}

	.bgBox .bubble.bubble01 {top: 80%; left: 15%;}
	.bgBox .bubble.bubble02 {top: 42%; left: -4%;}
	.bgBox .bubble.bubble03 {top: 49%; left: 48%;}
	.bgBox .bubble.bubble04 {top: 8%; left: 53%;}
	
	.bgBox .bubble.bubble05 {top: 17%; left: 20%;}
	.bgBox .bubble.bubble06 {top: 30%; left: 85%;}
	.bgBox .bubble.bubble07 {top: 77%; left: 75%;}
	.bgBox .bubble.bubble08 {top: 85%; left: 62%;}

}



/*===================================================
	memu
====================================================*/
.navList {
	font-family: "Titan One", sans-serif;
    position: fixed;
    right: 30px;
    top: 30px;
    text-align: right;
    color: #112E71;
    text-decoration: none;
    line-height: 1;
    letter-spacing: 0.03em;
    z-index: 9;
    font-size: 24px;
}

.navList li {
    margin: 0 0 15px;
}

.navList li:last-child {
    margin: 0;
}

.navList li a {
    text-decoration: none;
}

.navList li.gray a {
	pointer-events: none;
    color: #112E7150;
}

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

	.navList li a:hover {
	    opacity: 0.7;
	}

}

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

	.hamBtn {
		display: block;
	    position: fixed;
	    right: 20px;
	    top: 20px;
	    width: 30px;
	    height: 25px;
	    cursor: pointer;
	    z-index: 9998;
	    transition: all 0.3s ease 0s;

	}

	.hamBtn span {
	    display: block;
	    position: absolute;
	    right: 0px;
	    width: 100%;
	    height: 2px;
	    background: #112E71;
	    transition: all 0.3s ease 0s;
	}

	.hamBtn :nth-of-type(1) {
	    top: 0px;
	}

	.hamBtn :nth-of-type(2) {
	    top: 50%;
	    transform: translateY(-50%);
	}
	
	.hamBtn :nth-of-type(3) {
	    bottom: 0px;
	}

	.hamBtn.open span {
	    background: #fff;
	}

	.hamBtn.open span:nth-of-type(1) {
	    transform: translateY(-50%) rotate(-45deg);
	    top: 50%;
	}

	.hamBtn.open span:nth-of-type(2) {
	    opacity: 0;
	}
	
	.hamBtn.open span:nth-of-type(3) {
	    transform: translateY(50%) rotate(45deg);
	    bottom: 50%;
	}

	.navigation {
	    opacity: 0;
	    pointer-events: none;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    z-index: 9997;
	    position: fixed;
		transition: all 0.5s ease-out;
	}

	.navigation.active {
	    transition: opacity 0.5s ease;
	    pointer-events:auto;
	    opacity:1;
	}

	.navigation .headerNav {
	    background: #112E71;
	    margin: 0 auto;
	    position: fixed;
	    top: 0;
	    width: 100vw;
	    height: 100vh;
	    box-sizing: border-box;
	    transition: all 0.5s ease;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    flex-flow: column;
		font-family: "Titan One", sans-serif;
	}

	.navigation .headerNav li {
		padding: 0;
	    position: relative;
	    margin: 0 0 20px;
	    line-height: 1;
	}

	.navigation .headerNav li:last-child {
		margin: 0;
	}

	.navigation .headerNav li:after {
	    content: none;
	}

	.navigation .headerNav li a{
	    font-size: 20px;
	    color: #fff;
	    text-decoration: none;
	}

	.heroNavLogo {
	    width: 60%;
	    max-width: 250px;
	    margin: 0px 0 40px!important;
	}

	.navigation .snsList,
	.navigation .shareList{
		display: flex;
	}

	.navigation .snsList .menuList,
	.navigation .shareList .shareLink {
		display: flex;
	}

	.navigation .snsList .navListTit,
	.navigation .shareList .navListTit {
	    color: #fff;
	    font-size: 20px;
	    display: flex;
	    align-items: center;
	    margin: 0 45px 0 0;
	    position: relative;
	}

	.navigation .snsList .navListTit:after,
	.navigation .shareList .navListTit:after {
	    content: "";
	    height: 1px;
	    width: 15px;
	    left: calc(100% + 15px);
	    position: absolute;
	    bottom: 0px;
	    z-index: 0;
	    top: 50%;
	    background: #fff;
	}
	
	.navigation .snsList .menuList li,
	.navigation .shareList .shareLink li {
	    margin: 0px 15px 0 0;
	}

	.navigation .snsList .menuList li:last-child,
	.navigation .shareList .shareLink li:last-child {
		margin-right: 0;
	}

	.navigation .snsList .menuList li a,
	.navigation .shareList .shareLink li a{
		font-size: 24px;
	}

	.navigation .snsList .menuList .menu_icon a,
	.navigation .shareList .menu_icon a {
	    display: flex;
	    color: #fff;
	    text-decoration: none;
	    justify-content: center;
	    align-items: center;
	    font-size: 16px;
	}

	.navigation .snsList .menuList .menu_icon a i,
	.navigation .shareList .menu_icon a i {
	    font-size: 20px;
	}
	
}

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

	.heroNavLogo {
		width: 50%;
	}
	
}


/*===================================================
	all
====================================================*/
html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
}

body {
    background: #8ed0ca;
}

.mainWrap {
	font-family: "M PLUS 1p", "Noto Sans JP", sans-serif;
	position: relative;
	line-height: 1.5;
	font-size: 16px;
	color: #222;
}

.mainWrap img {
	display: block;
}

.container {
    position: relative;
}

section {
	margin: 0 auto 160px;
    width: 90%;
    max-width: 1100px;
}

section h3 {
	font-family: "Titan One", sans-serif;
    position: relative;
    text-align: center;
    color: #112E71;
    font-size: 80px;
    line-height: 1;
    margin: 0 0 60px;
    letter-spacing: 0.03em;
}

section .inBox {
    padding: 40px;
    background: #fff;
    box-shadow: 5px 5px #F293AE;
	border-radius: 10px;
}

section .inBox .soon {
	text-align: center;
}

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

	.sp { 
		display: none;
	}

	a {
		-webkit-transition: all 0.3s ease-out;
		transition: all 0.3s ease-out;
	}
	
}

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

	.pc {
		display: none;
	}
	
	html {
	    scroll-padding-top: 60px;
	}

	section {
	    margin: 0 auto 120px;
	    width: 90%;
	}

	section h3 {
		margin: 0 0 30px;
		font-size: 48px;
	}

	section .inBox {
	    padding: 20px;
	}

	section .inBox .soon {}

}


/*===================================================
	hero
====================================================*/
.heroView {
    position: relative;
    width: 100%;
    height: 100svh;
    min-height: 750px;
    margin: 0 0 160px;
}
		
.heroView .heroInner {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 50%;
    max-width: 600px;
}

.heroView .heroInner .mainLogo img {}

.heroView .artistLogo {
    position: absolute;
    width: 125px;
    top: 30px;
    left: 30px;
}

.heroView .sns_wrap {
    position: absolute;
    bottom: 30px;
    right: 30px;
	color: #112E71;
}

.heroView .sns_wrap .menuList {
	display: flex;
}

.heroView .sns_wrap .menuList .menu_icon {
	margin: 0 20px 0 0;
}

.heroView .sns_wrap .menuList .menu_icon:last-child {
	margin: 0;
}

.heroView .sns_wrap .menuList .menu_icon a {
	font-size: 20px;
}

.heroView .sns_wrap .menuList .menu_icon a i {}

.scrollBox {
    position: absolute;
    width: 100%;
    height: 100svh;
    top: 0;
    z-index: 1;
    pointer-events: none;
}
		
.scrollBox .scrollarrow {
    width: 1px;
    height: 60px;
    position: absolute;
    left: 30px;
    bottom: 30px;
    z-index: 1;
    background: #112E71;
    animation: scrollarrow 3s cubic-bezier(.19,1,.22,1) 0.5s infinite;
}

@keyframes scrollarrow{
    0% {clip-path: inset(0 0 100% 0);}
    25% {clip-path: inset(0 0 0 0);}
    75% {clip-path: inset(0 0 0 0);}
    100% {clip-path: inset(100% 0 0 0);}
}

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

	.heroView .artistLogo a img,
	.heroView .sns_wrap .menuList .menu_icon a i {
		-webkit-transition: all 0.3s ease-out;
		transition: all 0.3s ease-out;
	}

	.heroView .artistLogo a:hover img,
	.heroView .sns_wrap .menuList .menu_icon a:hover i {
	    opacity: 0.7;
	}

}

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

	.heroView {
		height: 100svh;
	    min-height: 450px;
	    margin: 0 0 120px;
	}
			
	.heroView .heroInner {
		width: 80%;
		max-width: 450px;
	}

	.heroView .heroInner .mainLogo img {}

	.heroView .artistLogo {
	    width: 100px;
	    top: 20px;
	    left: 20px;
	}
	
	.heroView .sns_wrap {
	    bottom: 20px;
	    right: 20px;
	}

	.heroView .sns_wrap .menuList {}

	.heroView .sns_wrap .menuList .menu_icon {}

	.heroView .sns_wrap .menuList .menu_icon:last-child {}

	.heroView .sns_wrap .menuList .menu_icon a {}

	.heroView .sns_wrap .menuList .menu_icon a i {}
			
	.scrollBox .scrollarrow {
	    left: 20px;
	    bottom: 20px;
	}

}


/*===================================================
	about
====================================================*/
#about {}
#about h3 {}
#about .inBox {}
#about .inBox .aboutTxt {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0.03em;
}
#about .inBox .aboutTxt li {
	margin: 0 0 5px;
}
#about .inBox .aboutTxt li:last-child {
	margin: 0;
}

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

	#about {}
	#about h3 {}
	#about .inBox {}
	#about .inBox .aboutTxt {
		font-size: 16px;
		text-align: left;
	}
	#about .inBox .aboutTxt li {}
	#about .inBox .aboutTxt li:last-child {}

}


/*===================================================
	schedule
====================================================*/
#schedule {}
#schedule h3 {}
#schedule .inBox {}

#schedule .inBox .scheduleTit {
    border-bottom: 1px solid;
    text-align: center;
    padding: 0 0 40px;
    font-size: 28px;
    font-weight: bold;
    margin: 0 0 40px;
    line-height: 1;
    letter-spacing: 0.05em;
}

#schedule .inBox .scheduleListBox {}
#schedule .inBox .scheduleListBox .scheduleList {
	display: flex;
    justify-content: space-between;
    margin: 0 0 40px;
    padding: 0 0 40px;
    border-bottom: 1px solid;
}
#schedule .inBox .scheduleListBox .scheduleList:last-child {
	margin: 0;
}
#schedule .inBox .scheduleListBox .scheduleList .schedule_left {
	padding: 0px 40px 0 0;
	margin: 0 40px 0 0;
	border-right: 1px solid #686b79;
}
#schedule .inBox .scheduleListBox .scheduleList .schedule_left .date {
	font-size: 24px;
	font-weight: bold;
}
#schedule .inBox .scheduleListBox .scheduleList .schedule_left .date .day {
	background: #8ed0ca;
	font-size: 16px;
    padding: 2px 0;
    margin: 5px 0 0;
	width: 100%;
	color: #fff;
	text-align: center;
	font-weight: 900;
	letter-spacing: 0.1em;
	border-radius: 100px;
}

#schedule .inBox .scheduleListBox .scheduleList .scheduleRight {}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail {}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .place {
	font-size: 24px;
    font-weight: bold;
    margin: 0 0 10px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .place .area {
	font-size: 16px;
    border: 1px solid;
    padding: 3px 15px;
    line-height: 1;
    display: inline-block;
    border-radius: 100px;
    margin: 0 10px 0 0;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox {
	margin: 0 0 15px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .open {
	font-size: 14px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time {
	margin: 0 0 2px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time:last-child {
	margin: 0;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time span {
	background: #8ed0ca;
    font-size: 12px;
    padding: 0 10px;
    margin: 0 5px 0 0;
    display: inline-block;
    color: #fff;
    text-align: center;
    letter-spacing: 0.1em;
    border-radius: 100px;
}

#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox {
	padding: 20px 20px 0;
    background: #8ed0ca20;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox:last-child {
	padding: 20px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox .memberTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox .memberTxt {}
#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox span {
	font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
    display: inline-block;
	margin: 5px 0 0;
}

#schedule .inBox .attBox {
	margin: 0 0 35px;
}
#schedule .inBox .attBox:last-child {
	margin: 0;
}
#schedule .inBox .attBox .attTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#schedule .inBox .attBox .attList {}
#schedule .inBox .attBox .attList li {
	font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
    margin: 0 0 5px;
}
#schedule .inBox .attBox .attList li:last-child {
	margin: 0;
}
#schedule .inBox .attBox .attList li a {
	text-decoration: underline;
}

#schedule .inBox .attBox .attMainTit {
	font-size: 18px;
    font-weight: bold;
    margin: 0 0 20px;
    padding: 0 0 20px;
    border-bottom: 1px solid;
}
#schedule .inBox .attBox .attMainTit span {
	display: inline-block;
    font-size: 16px;
    padding: 0 0 0 10px;
}
#schedule .inBox .attBox .attInBox {
	margin: 0px 0 20px;
    padding: 0px 0 20px;
    border-bottom: 1px solid #22222225;
}
#schedule .inBox .attBox .attInBox:last-child {}
#schedule .inBox .attBox .attTxt {}

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

	#schedule .inBox .scheduleListBox .scheduleList .schedule_left .date .day {
		display: block;
	}

	#schedule .inBox .attBox .attList li a:hover {
		opacity: 0.7;
	}

}

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

	#schedule {}
	#schedule h3 {}
	#schedule .inBox {}

	#schedule .inBox .scheduleTit {
		padding: 0 0 20px;
		margin: 0 0 20px;
		line-height: 1.5;
		font-size: 24px;
	}

	#schedule .inBox .scheduleListBox {}
	#schedule .inBox .scheduleListBox .scheduleList {
		display: block;
		margin: 0 0 20px;
		padding: 0 0 25px;
	}
	#schedule .inBox .scheduleListBox .scheduleList:last-child {}
	#schedule .inBox .scheduleListBox .scheduleList .schedule_left {
		padding: 0;
		margin: 0;
		border-right: none;
	}
	#schedule .inBox .scheduleListBox .scheduleList .schedule_left .date {
		font-size: 20px;
		margin: 0 0 5px;
	}
	#schedule .inBox .scheduleListBox .scheduleList .schedule_left .date .day {
		display: inline-block;
		width: auto;
		margin: 0 0 0px 10px;
		font-size: 14px;
		line-height: 1.5;
		padding: 0px 10px;
	}

	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .place {
		font-size: 20px;
		margin: 0 0 5px;
	}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .place .area {
		margin: 0 0 3px;
		font-size: 14px;
	}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .open {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time:last-child {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .scheduleDetail .timeBox .time span {}

	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox {
		font-size: 14px;
	}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox .memberTit {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox .memberTxt {}
	#schedule .inBox .scheduleListBox .scheduleList .scheduleRight .memberBox span {
		font-size: 12px;
	}

	#schedule .inBox .attBox {
		margin: 0 0 20px;
	}
	#schedule .inBox .attBox:last-child {}
	#schedule .inBox .attBox .attTit {
		font-size: 14px;
	}
	#schedule .inBox .attBox .attList {}
	#schedule .inBox .attBox .attList li {
		font-size: 12px;
	}
	#schedule .inBox .attBox .attList li:last-child {}
	#schedule .inBox .attBox .attList li a {}

	#schedule .inBox .attBox .attMainTit {
		font-size: 14px;
	}
	#schedule .inBox .attBox .attMainTit span {
		font-size: 12px;
		display: block;
		padding: 0;
	}
	#schedule .inBox .attBox .attInBox {}
	#schedule .inBox .attBox .attInBox:last-child {}
	#schedule .inBox .attBox .attTxt {
		font-size: 14px;
	}

}


/*===================================================
	ticket
====================================================*/
#ticket {}
#ticket h3 {}
#ticket .inBox  {
	position: relative;
}
#ticket .inBox::before  {
	z-index: 2;
	position: absolute;
	content: "";
	width: 1px;
	height: 100%;
	top: 0;
	left: 0;
	background: #8ed0ca;
}

#ticket .inBox .receptionClosedWrap .op_ticket {
    margin: 0 0 30px;
}

#ticket .inBox .receptionClosedWrap .op_ticket:last-child {
    margin: 0;
}

/*============ accordion ===========*/
#ticket .ticketInfoBox {
	margin: 0 auto 40px;
}
#ticket .op_ticket .ticketList{
    margin-bottom: 20px;
}
#ticket .op_ticket .ticketList:last-child{
    margin-bottom: 0;
}
#ticket .op_ticket .ticketTit{
	background: #112E71;
    color: #fff;
    padding: 20px;
    font-size: 100%;
    font-weight: 500;
    position: relative;
    cursor: pointer;
    transition: 0.5s ease;
}
#ticket .op_ticket .ticketTit .getIcon {
	display: inline-block;
    font-size: 12px;
    background: #fff;
    color: #112E71;
    border-radius: 100px;
    font-weight: bold;
    padding: 0px 10px;
    margin: 0 0 0 10px;
}
#ticket .op_ticket .ticketTit span {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 12px;
    height: 12px;
    transform: rotate(180deg) translateY(50%);
    transition: 0.3s ease;
}
#ticket .op_ticket .ticketTit.open span {
    transform: translateY(-50%);
}
#ticket .op_ticket .ticketTit span:before {
    content: "";
    position: absolute;
    top: 25%;
    width: 100%;
    height: 100%;
    border-top: 1px solid;
    border-right: 1px solid;
    transform: rotate(-45deg);
}
#ticket .op_ticket .ticketDetail{
    display: none;
    padding: 30px 40px;
    background: #112E7115;
}
#ticket .op_ticket .detailList {
    display: flex;
    border-bottom: 1px solid;
    padding: 0 0 15px;
    margin: 0;
    align-items: stretch;
}
#ticket .op_ticket .detailList:first-child{
    border-top: 1px solid;
    padding: 15px 0 15px;
}
#ticket .op_ticket .detailList:last-child{
    margin: 0;
}
#ticket .op_ticket .detailList dt{
    width: 20%;
    padding: 0 40px 0 0;
    display: flex;
    align-items: center;
    font-weight: 500;
    line-height: 1.6em;
}
#ticket .op_ticket .detailList dt:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 1px;
    background: #000;;
}
#ticket .op_ticket .detailList dd{
    width: 80%;
    position: relative;
    padding: 0 0 0 40px;
    display: flex;
    align-items: center;
}
#ticket .op_ticket .detailList dd:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 1px;
    background: #000;
}
#ticket .op_ticket .detailList dd > *{
    margin-bottom:20px;
}
#ticket .op_ticket .detailList dd > *:last-child{
    margin-bottom:0;
}
#ticket .op_ticket .detailList dd .detailInner{
    width:100%;
}
#ticket .op_ticket .detailList dd .detailInner > *{
    margin-bottom:10px;
}
#ticket .op_ticket .detailList dd .detailInner  > *:last-child{
    margin-bottom:0;
}
#ticket .op_ticket .ticketNote {
    margin: 15px 0 0;
    font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
}
#ticket .op_ticket .btnBox {
	display: flex;
    justify-content: center;
	margin: 25px auto 0;
}
#ticket .op_ticket .btnBox:last-child {
	margin: 20px auto 0;
}
#ticket .op_ticket .btnBox .btn {
	width: 100%;
    max-width: 350px;
	margin-right: 20px;
}
#ticket .op_ticket .btnBox .btn a {
	margin: 0 auto;
    display: block;
    padding: 15px;
    background: #112E71;
    border: 1px solid #112E71;
    color: #fff;
    text-align: center;
    border-radius: 100px;
}
#ticket .op_ticket .btnBox .btn:last-child {
	margin-right: 0;
}
#ticket .op_ticket .btnBox .btn:last-child a {}

#ticket .inBox  .seatBox {
	padding: 20px;
    background: #8ed0ca20;
    margin: 0 0 20px;
}
#ticket .inBox .seatBox .seatTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#ticket .inBox .seatBox .seatTit span {
	display: inline-block;
    padding: 0 0 0 10px;
    font-size: 14px;
}
#ticket .inBox .seatBox .seatListBox {}
#ticket .inBox .seatBox .seatListBox .seatList {
	text-indent: -1.5em;
    padding: 0 0 0 1.5em;
    margin: 0 0 5px;
}
#ticket .inBox .seatBox .seatListBox .seatList:last-child {
	margin: 0;
}
#ticket .inBox .seatBox .seatListBox .seatList span {
	display: inline-block;
    margin: 0 5px 0 0;
    background: #8ed0ca;
    color: #fff;
    width: 18px;
    text-align: center;
    font-size: 12px;
    border-radius: 100px;
    text-indent: 0;
}

#ticket .inBox .seatImg {
	margin: 0 auto 20px;
}
#ticket .inBox .seatImg li {
	margin: 0 auto 20px;
}
#ticket .inBox .seatImg li:last-child {
	margin: 0 auto;
}

#ticket .inBox .attBox {
	margin: 0 0 40px;
}
#ticket .inBox .attBox:last-child {
	margin: 0;
}
#ticket .inBox .attBox .attTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#ticket .inBox .attBox .attList {}
#ticket .inBox .attBox .attList li {
	font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
    margin: 0 0 5px;
}
#ticket .inBox .attBox .attList li:last-child {
	margin: 0;
}
#ticket .inBox .attBox .attList li a {
	text-decoration: underline;
}

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

	#ticket .op_ticket .btnBox .btn a:hover {
		background: #fff;
		color: #112E71;
	}

	#ticket .inBox .attBox .attList li a:hover {
		opacity: 0.7;
	}

}

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

	#ticket {}
	#ticket h3 {}
	#ticket .inBox  {}

	#ticket .ticketInfoBox {
		margin: 0 auto 20px;
	}
	#ticket .op_ticket .ticketTit {
	    padding: 15px 50px 15px 15px;
	}
	#ticket .op_ticket .ticketTit .getIcon {}
	#ticket .op_ticket .ticketDetail {
	    padding: 20px;
	}
	#ticket .op_ticket .detailList {
	    display: block;
	    border-bottom: none;
	}
	#ticket .op_ticket .detailList:first-child {
	    border-top: none;
	    padding: 0;
	}
	#ticket .op_ticket .detailList dt {
		width: 100%;
	    padding: 0 0 0 5px;
	    margin: 0 0 10px;
	    line-height: 1;
	    font-weight: bold;
	    border-left: 2px solid;
	}
	#ticket .op_ticket .detailList dd {
	    width: 100%;
	    position: relative;
	    padding: 0;
	}
	#ticket .op_ticket .detailList dd:before {
	    content: none
	}
	#ticket .op_ticket .ticketNote {
		margin: 10px 0 0;
	}
	#ticket .op_ticket .btnBox {
		margin: 20px auto 0;
        flex-wrap: wrap;
	}
	#ticket .op_ticket .btnBox:last-child {}
	#ticket .op_ticket .btnBox .btn {
		margin-right: 0;
	}
	#ticket .op_ticket .btnBox .btn a {}
	#ticket .op_ticket .btnBox .btn:last-child {}
	#ticket .op_ticket .btnBox .btn:last-child a {
		margin: 20px auto 0;
	}

	#ticket .inBox .seatBox {
		font-size: 14px;
		margin: 0 0 10px;
	}
	#ticket .inBox .seatBox .seatTit {}
	#ticket .inBox .seatBox .seatTit span {}
	#ticket .inBox .seatBox .seatListBox {}
	#ticket .inBox .seatBox .seatListBox .seatList {}
	#ticket .inBox .seatBox .seatListBox .seatList:last-child {}
	#ticket .inBox .seatBox .seatListBox .seatList span {}

	#ticket .inBox .seatImg {
		margin: 0 auto 10px;
	}
	#ticket .inBox .seatImg li {
		margin: 0 auto 10px;
	}
	#ticket .inBox .seatImg li:last-child {}

	#ticket .inBox .attBox {
		margin: 0 0 20px;
	}
	#ticket .inBox .attBox:last-child {}
	#ticket .inBox .attBox .attTit {
		font-size: 14px;
	}
	#ticket .inBox .attBox .attList {}
	#ticket .inBox .attBox .attList li {
		font-size: 12px;
	}
	#ticket .inBox .attBox .attList li:last-child {}
	#ticket .inBox .attBox .attList li a {}

}


/*===================================================
	goods
====================================================*/
#goods {}
#goods h3 {}
#goods .inBox  {}

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

	#goods {}
	#goods h3 {}
	#goods .inBox  {}

}


/*===================================================
	special
====================================================*/
#special {}
#special h3 {}
#special .inBox {}

#special .inBox .specialBnr {
	margin: 0 auto 40px;
}

#special .inBox .txtList {
	margin: 0 auto 40px;
}
#special .inBox .txtList li {
	margin: 0 auto 5px;
}
#special .inBox .txtList li:last-child {
	margin: 0 auto;
}

#special .inBox .cardBox {
	width: 100%;
    max-width: 600px;
    margin: 0 auto 40px;
	text-align: center;
}
#special .inBox .cardBox .cardImg {
	margin: 0 auto 20px;
}
#special .inBox .cardBox .cardTxt {
    font-weight: bold;
    font-size: 20px;
    background: linear-gradient(transparent 60%, #fbbfcb 40%);
    display: inline-block;
}

#special .inBox .targetBox {
	padding: 20px;
    background: #8ed0ca20;
}
#special .inBox .targetBox .targetTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#special .inBox .targetBox .targetList {
	margin: 0 0 15px;
}
#special .inBox .targetBox .targetList li {
	text-indent: -1.4em;
	padding: 0 0 0 1.4em;
	margin: 0 0 5px;
}
#special .inBox .targetBox .targetList li:last-child {
	margin: 0;
}
#special .inBox .targetBox .targetList li span{
	display: inline-block;
    margin: 0 5px 0 0;
    background: #8ed0ca;
    color: #fff;
    width: 18px;
    text-align: center;
    font-size: 12px;
    border-radius: 100px;
    text-indent: 0;
}
#special .inBox .targetBox .targetAttList {
	margin: 0 0 15px;
}
#special .inBox .targetBox .targetAttList li {
	font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
    margin: 0 0 5px;
}
#special .inBox .targetBox .targetAttList li:last-child {
	margin: 0;
}
#special .inBox .targetBox .targetAttList li a  {
	text-decoration: underline;
}
#special .inBox .targetBox .targetTxt {
	font-size: 14px;
}

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

	#special .inBox .targetBox .targetAttList li a  {
		text-decoration: underline;
	}

}

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

	#special {}
	#special h3 {}
	#special .inBox {}

	#special .inBox .specialBnr {
		margin: 0 auto 20px;
	}

	#special .inBox .txtList {
		margin: 0 auto 20px;
	}
	#special .inBox .txtList li {}
	#special .inBox .txtList li:last-child {}

	#special .inBox .cardBox {
		margin: 0 auto 20px;
	}
	#special .inBox .cardBox .cardImg {
		margin: 0 auto 10px;
	}
	#special .inBox .cardBox .cardTxt {
		font-size: 13px;
	}

	#special .inBox .targetBox {}
	#special .inBox .targetBox .targetTit {}
	#special .inBox .targetBox .targetList {}
	#special .inBox .targetBox .targetList li {}
	#special .inBox .targetBox .targetList li:last-child {}
	#special .inBox .targetBox .targetList li span{}
	#special .inBox .targetBox .targetAttList {}
	#special .inBox .targetBox .targetAttList li {}
	#special .inBox .targetBox .targetAttList li:last-child {}
	#special .inBox .targetBox .targetAttList li a  {}
	#special .inBox .targetBox .targetTxt {}

}


/*===================================================
	attention
====================================================*/
#attention {}
#attention h3 {}
#attention .inBox {}

#attention .inBox .attBox {
	margin: 0 0 35px;
}
#attention  .inBox .attBox:last-child {
	margin: 0;
}
#attention .inBox .attBox .attTit {
	border-left: 3px solid;
    font-weight: bold;
    line-height: 1.2;
    padding: 0 0 0 10px;
    margin: 0 0 10px;
}
#attention .inBox .attBox .attList {}
#attention .inBox .attBox .attList li {
	font-size: 14px;
    text-indent: -1em;
    padding: 0 0 0 1em;
    margin: 0 0 5px;
}
#attention .inBox .attBox .attList li:last-child {
	margin: 0;
}
#attention .inBox .attBox .attList li a {
	text-decoration: underline;
}

#attention .inBox .attBox .attMainTit {
	font-size: 18px;
    font-weight: bold;
    margin: 0 0 20px;
    padding: 0 0 20px;
    border-bottom: 1px solid;
}
#attention .inBox .attBox .attMainTit span {
	display: inline-block;
    font-size: 16px;
    padding: 0 0 0 10px;
}
#attention .inBox .attBox .attInBox {
	margin: 0px 0 20px;
    padding: 0px 0 20px;
    border-bottom: 1px solid #22222225;
}
#attention .inBox .attBox .attInBox:last-child {}
#attention .inBox .attBox .attTxt {}

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

	#attention {}
	#attention h3 {}
	#attention .inBox {}

	#schedule .inBox .attBox {
		margin: 0 0 20px;
	}
	#attention .inBox .attBox:last-child {}
	#attention .inBox .attBox .attTit {
		font-size: 14px;
	}
	#attention .inBox .attBox .attList {}
	#attention .inBox .attBox .attList li {
		font-size: 12px;
	}
	#attention .inBox .attBox .attList li:last-child {}
	#attention .inBox .attBox .attList li a {}

	#attention .inBox .attBox .attMainTit {
		font-size: 14px;
	}
	#attention .inBox .attBox .attMainTit span {
		font-size: 12px;
		display: block;
		padding: 0;
	}
	#attention .inBox .attBox .attInBox {}
	#attention .inBox .attBox .attInBox:last-child {}
	#attention .inBox .attBox .attTxt {
		font-size: 14px;
	}

}


/*===================================================
	footer
====================================================*/
#footer {
    width: 100%;
    padding: 60px 0 20px;
    position: relative;
    z-index: 10;
    background: #112E71;
}

#footer .footerLogo {
    width: 150px;
    margin: 0 auto 30px;
}

#footer .sns_wrap {}

#footer .sns_wrap .menuList {
    display: flex;
    justify-content: center;
    margin: 0 0 50px;
}

#footer .sns_wrap .menuList li {
	margin: 0 20px 0 0;
}

#footer .sns_wrap .menuList li:last-child {
	margin: 0;
}

#footer .sns_wrap .menuList li a {
	color: #fff;
	font-size: 20px;
}

#footer .sns_wrap .menuList li a i {}

#footer .copylight {
	line-height: 1;
    text-align: center;
    color: #fff;
    font-size: 12px;
}

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

	#footer .footerLogo a img,
	#footer .sns_wrap .menuList .menu_icon a i {
		-webkit-transition: all 0.3s ease-out;
		transition: all 0.3s ease-out;
	}

	#footer .footerLogo a:hover img,
	#footer .sns_wrap .menuList .menu_icon a:hover i {
	    opacity: 0.7;
	}

}

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

	#footer {
		padding: 40px 0 20px;
	}

	#footer .footerLogo {
		width: 100px;
		margin: 0 auto 25px;
	}

	#footer .sns_wrap {}
	
	#footer .sns_wrap .menuList {
		margin: 0 0 30px;
	}

	#footer .sns_wrap .menuList li {}

	#footer .sns_wrap .menuList li:last-child {}

	#footer .sns_wrap .menuList li a {}

	#footer .sns_wrap .menuList li a i {}

	#footer .copylight {}

}