@charset "UTF-8";

.js-fadeIn{
	opacity: 0;
	transition-duration: 1s;
	transition-property: opacity, transform;
	transform: translate(0, 150px);
}
.is-scrollIn {
	opacity: 1;
	transform: translate(0, 0);
}
.js-fadeIn.left{
	transition-duration: 0.3s;
	transform: translate(-300px, 0);
}
.is-scrollIn.left {
	transform: translate(0, 0);
}
.youtube-wrap{
	max-width: 350px;
	margin: 100px auto 0;
}
.youtube{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.youtube iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

/*-------------------------------------------------------------------------------------
home
--------------------------------------------------------------------------------------*/
#home #Notice{
	max-width: 1220px;
	margin: 0 auto 80px;
	padding: 20px;
	border: 4px solid #fff;
}
#home #Notice h3{
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
#msHeader{
	background: #101010;
}
#home .ticket-sales{
	margin: 0 0 60px;
	text-align: center;
}
#home .ticket-sales span{
	padding: 0 0 5px;
	font-size: 30px;
	font-weight: bold;
	border-bottom: 5px solid #333;
}
#home .ticket-sales span strong{
	font-size: 42px;
}
#home .ticket-sales p{
	margin-top: 20px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}
#home .lead{
	margin: 0 0 30px;
	font-size: 18px;
	text-align: center;
}
#home .bg{
	background: url(../images/bg.png) center center no-repeat;
	-webkit-background-size: cover!important;
	background-size: cover!important;
}

#home #spot-entry{
	margin-top: 60px;
}
#home #spot-entry .contents-inner{
	padding-top: 60px;
	border-top: 1px solid #666;
}

/*-------------------------------------------------------------------------------------
top main visual
--------------------------------------------------------------------------------------*/
#topMainVisual {
	min-width: 980px;
    margin: 0 0 60px;
}
#topMainVisual img {
	width: 100%;
	height: auto;
}

/*-------------------------------------------------------------------------------------
nav
--------------------------------------------------------------------------------------*/
#sitenavi{
	background: none!important;
}
#sitenavi ul{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}
#sitenavi ul li{
	padding: 0 10px;
}
#sitenavi ul li a{
	text-decoration: none;
	transition: 0.6s;
}
#sitenavi ul li a:hover{
	opacity: 0.5;
}
#sitenavi ul li a .thum{
	display: block;
	width: 130px;
	margin: 0 auto 10px;
}
#sitenavi ul li a .txt{
	display: block;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
}

/*-------------------------------------------------------------------------------------
Movie
--------------------------------------------------------------------------------------*/
#movie{
	
}
#movie .movie-list{
	
}
#movie .movie-list ul{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
}
#movie .movie-list ul li{
	width: 33.3%;
	padding: 0 10px;
}
#movie .movie-list ul li video{
	width: 100%;
	height: 100%;
}

/*-------------------------------------------------------------------------------------
Driver
--------------------------------------------------------------------------------------*/
#driver{
	
}
#driver .drivers-list{
	overflow: hidden;
}
#driver .drivers-list ul{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 -15px;
}
#driver .drivers-list ul li{
	width: 50%;
	padding: 15px;
}
#driver .drivers-list ul li .thum{
	position: relative;
}
#driver .drivers-list ul li .thum .rank{
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	padding: 5px 10px;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
	background: #666;
	z-index: 1;
}
#driver .drivers-list ul li .num{
	font-size: 20px;
	font-weight: bold;
}
#driver .drivers-list ul li .flex{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
#driver .drivers-list ul li .left,
#driver .drivers-list ul li .right{
	width: 50%;
}
#driver .drivers-list ul li .name{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
#driver .drivers-list ul li .en{
	font-size: 13px;
	text-align: center;
}

/*-------------------------------------------------------------------------------------
event
--------------------------------------------------------------------------------------*/
#event{
	
}
#event .event-list{
	
}
#event .event-list ul{
	
}
#event .event-list ul li{
	margin: 0 0 30px;
}
#event .event-list ul li .flex{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-align-items: center;
	align-items: center;
}
#event .event-list ul li .flex .thum{
	width: 300px;
}
#event .event-list ul li .flex .box{
	width: calc(100% - 300px);
	padding-left: 20px;
}
#event .event-list ul li .flex .box .title{
	margin: 0 0 20px;
	font-size: 26px;
	font-weight: bold;
}
#event .event-list ul li .flex .box .txt{
	font-size: 16px;
}
#event .event-list ul li .event-more{
	margin-left: 10px;
	text-align: left;
}
#event .event-list ul li .event-more.active{
	content: "close";
}
#event .event-list ul li .more-txt{
	display: none;
}
#event .event-list ul li .more-txt.pc{
	display: inline!important;
}
#event .event-list ul li .more-txt.active{
	display: inline!important;
}
#event .event-list ul li .accordion-content{
	width: calc(100% - 300px);
	margin-left: auto;
	padding-left: 20px;
}
#event .event-list ul li .accordion-content ul li{
	margin: 0;
}

/*-------------------------------------------------------------------------------------
timetable
--------------------------------------------------------------------------------------*/
#timetable{
	
}
#timetable .schedule{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
}
#timetable .schedule .sat,
#timetable .schedule .sun{
	width: 48%;
}
#timetable .schedule .ttl{
	margin: 0 0 10px;
}
#timetable .schedule .schedule-more{
	display: none;
	margin: 20px 0 0;
}
#timetable .schedule .schedule-more table{
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
}
#timetable .schedule .schedule-more table th,
#timetable .schedule .schedule-more table td{
	padding: 8px;
	color: #333;
	font-size: 14px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #d4d4d4;
}
#timetable .schedule .schedule-more table th{
	width: 150px;
	background: #eee;
}
#timetable .schedule .schedule-more table td{
	background: #fff;
}

/*-------------------------------------------------------------------------------------
food
--------------------------------------------------------------------------------------*/
#food .food-map{
	max-width: 640px;
	margin: 30px auto 0;
}

/*-------------------------------------------------------------------------------------
other
--------------------------------------------------------------------------------------*/
#other{
	margin: 60px 0 0;
}

/*-------------------------------------------------------------------------------------
RSS表示
--------------------------------------------------------------------------------------*/

.rssFeedWrap {
    margin: 25px auto 0;
    text-align: center;
    /*width: 48%;*/
}

.rssFeedWrap .updateTitle {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 10px;
}

.rssFeedWrap ul {
    border-top: 1px solid #888888;
    max-height: 310px;
    overflow: auto;
    width: 100%;
}

.rssFeedWrap ul li a {
    display: block;
    padding: 15px 0;
    text-decoration: none !important;
}

.rssFeedWrap ul li:last-child a:after {
    border-bottom: none;
}

.rssFeedWrap ul li {
    display: block;
    font-size: 16px;
    overflow: hidden;
    width: 100%;
	border-bottom: 1px solid #888888;
}

.rssFeedWrap ul li dl {
    margin: 0 0 0 10px;
    text-align: left;
    text-decoration: none !important;
}

.rssFeedWrap ul li dl dt {
    display: inline-block;
    vertical-align: text-top;
    text-decoration: none !important;
    width: 130px;
}

/*.rssFeedWrap ul li dl dt:after {
    content: '\00bb';
    margin-left: 6px;
}*/

.rssFeedWrap ul li dl dd {
    display: inline-block;
    text-decoration: none !important;
    vertical-align: text-top;
    width: -webkit-calc(100% - 140px);
    width: calc(100% - 140px);
}

.rssFeedWrap ul li a:hover dl dd {
    text-decoration: underline !important;
}

/*-------------------------------------------------------------------------------------
other
--------------------------------------------------------------------------------------*/
#other{
	
}
#other .otherlink{
	overflow: hidden;
}
#other .otherlink ul{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin: 0 -8px;
}
#other .otherlink ul li{
	width: 33.3%;
	padding: 8px;
}
#other .otherlink ul li a{
	display: block;
	color: #333;
	text-decoration: none;
	border-radius: 10px;
	background: #fff;
	transition: 0.6s;
}
#other .otherlink ul li a:hover{
	opacity: 0.5;
}
#other .otherlink ul li a span{
	display: block;
}
#other .otherlink ul li a .thum img{
	border-radius: 10px 10px 0px 0px;
}
#other .otherlink ul li a .caption{
	padding: 10px 15px;
}


/*-------------------------------------------------------------------------------------
開催概要
--------------------------------------------------------------------------------------*/
#outline{
	margin: 60px 0 0;
}
.eventOutline {
	padding: 40px;
	color: #333;
	border-radius: 10px;
	background: #fff;
}

.eventOutline .eventOutlineTitle {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 30px;
}

.eventOutline ul {
    margin: 20px auto 0;
}

.eventOutline ul li {
    display: block;
    padding: 5px 0;
    text-decoration: none !important;
}

.eventOutline ul li {
    display: block;
    font-size: 16px;
    overflow: hidden;
    width: 960px;
}

.eventOutline ul li dl {
    margin: 0 20px;
    text-align: left;
}

.eventOutline ul li dl dt {
    display: inline-block;
    vertical-align: text-top;
    width: 130px;
}

.eventOutline ul li dl dd {
    display: inline-block;
    vertical-align: text-top;
    width: 780px;
}
