.loading {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100vh;
		background: #000;
		z-index: 9999;
		position: fixed;
		top:0;
		left:0;
		z-index: 9999;
		transition: all .8s;
		
	}
	.loading.clear{
		opacity: 0;
		visibility: hidden;
	}
	#Layer_1 {
	    font-size: 20px;
	    font-weight: bold;
	    animation-name: fadein;
	    animation-duration: 2s;
	    
	}
	
	@keyframes fadein {
		from {
	   		opacity: 0;
	   		transform: translateY(20px);
		}
		to {
	    	opacity: 1;
			transform: translateY(0);
		}
	}

	path {
	    fill-opacity: 0;
	    transition: fill-opacity 0.5s;
	  }

	.done .path_black{
	  fill: #fff;
	  fill-opacity: 0.8;
	}
	.done path {
	  stroke: none;
	}



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

	/*---------------------------------------
	 * MainVisual
	---------------------------------------*/ 
	
	.mainvisual{
		width: 100%;
		height: 100vh;
		display: table;
		background: #F8F8F8;
		
	}
	.mainvisual .inner{
		width: 100%;
		height: 100vh;
		background-image: url(../img/mainvisual_pc.jpg) ;
		background-position:0 0 ;
		background-repeat:no-repeat;
		background-size: cover;
		overflow:auto;
		/*
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		height: 100%;
		*/
	}
	.mainvisual .inner::after {
content : "";
display : block;
height : 0;
clear : both;
}
	
	
	
	/*---------------------------------------
	 * Banner
	---------------------------------------*/ 
	
	.banner{
		width: 100%;
		
	}
	.banner .inner{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 120px 0 0;
	}
	.banner .inner a{
		display: block;
	}
	
	
	/*---------------------------------------
	 * News
	---------------------------------------*/ 
	
	.sec-news{
		
	}
	.sec-news .inner{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 120px 0 0;
	}
	.sec-news .inner .sec-title{
		display: inline-block;
		font-size: 76px;
		transform: rotate(-90deg);
		color: #000000;
		letter-spacing: 7px;
		position: relative;
		left: -40px;
		bottom: -60px;
	}
	.sec-news .inner .sec-title::before{
		content: "";
		display: block;
		width: 130px;
		height: 5px;
		background: #000000;
		position: relative;
		left: -45px;
		top:-10px;
	}
	.sec-news .inner ul{
		margin-left: 190px;
		border-top: 1px solid #CCCCCC;
		margin-bottom: 40px;
	}
	.sec-news .inner ul li{
		border-bottom: 1px solid #CCCCCC;
		padding: 27px 45px;
		font-size: 15px;
		line-height: 1.7;
		letter-spacing: 2px;
	}
	.sec-news .inner ul li dl{
		display: table;
		width: 100%;
	}
	.sec-news .inner ul li dl:hover{
		color: #999999;
	}
	.sec-news .inner ul li dl dt,
	.sec-news .inner ul li dl dd{
		display: table-cell;
	}
	.sec-news .inner ul li .date{
		padding-right: 30px;
	}
	.sec-news .inner .more-link{
		letter-spacing: 2px;
		float: right;
	}
	/*
	.sec-news .inner .more-link a{
		display: table;
		width: auto;
	}
	.sec-news .inner .more-link a div{
		display: table-cell;
		vertical-align: middle;
	}
	.sec-news .inner .more-link a .icon{
		width: 56px;
		height: 56px;
		background: url(/common/img/arrow_right_white.svg) 50% no-repeat #000000;
		background-size: 20px;
		border-radius: 50%;
		border: 2px solid #000000;
	}
	.sec-news .inner .more-link a:hover .icon{
		background: url(/common/img/arrow_right_blk.svg) 50% no-repeat #FFFFFF;
		background-size: 20px;
		border-radius: 50%;
	}
	.sec-news .inner .more-link a .text{
		padding-left: 10px;
	}
	.sec-news .inner .more-link span{
		display: block;
		font-size: 22px;
	}
	.sec-news .inner .more-link span.ja{
		font-size: 12px;
		color: #999999;
		margin-top: 5px;
	}
	*/
	
	
	/*---------------------------------------
	 * About
	---------------------------------------*/ 
	
	.sec-about{
		
	}
	.sec-about .inner{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 200px 0 0;
		display: table;
	}
	.sec-about .inner .outline,
	.sec-about .inner .text{
		width: 50%;
		display: table-cell;
		vertical-align: top;
	}
	
	
	/* Outline
	---------------------------------------*/ 
	
	.sec-about .inner .outline{
		border-right: 1px solid #000000;
		padding-right: 3%;
	}
	.sec-about .inner .date{
		font-size: 28px;
		letter-spacing: 4px;
		color: #000000;
		margin-bottom: 5px;
	}
	.sec-about .inner .sec-title{
		font-size: 66px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 15px;
	}
	.sec-about .inner .place{
		font-size: 22px;
		letter-spacing: 3px;
		margin-bottom: 40px;
	}
	.sec-about .inner .join .ticket{
		padding: 20px 0;
		display: block;
		width: 430px;
		border: 2px solid #000000;
		background: #000000;
		color: #FFFFFF;
		text-align: center;
		position: relative;
	}
	.sec-about .inner .join .ticket span{
		display: block;
		letter-spacing: 3px;
	}
	.sec-about .inner .join .ticket span.en{
		font-size: 22px;
		margin-bottom: 7px;
	}
	.sec-about .inner .join .ticket span.ja{
		font-size: 14px;
	}
	.sec-about .inner .join .ticket:hover{
		background: transparent;
		color:#000000;
	}
	
	
	
	/* Text
	---------------------------------------*/ 
	
	.sec-about .inner .read{
		padding-left: 8%;
	}
	
	.sec-about .inner .read p{
		line-height: 2.5;
		letter-spacing: 1.7px;
		font-size: 17px;
		margin-bottom: 30px;
	}
	.sec-about .inner .read .more-link{
		letter-spacing: 2px;
	}
	
	
	
	/*---------------------------------------
	 * Exhibittors
	---------------------------------------*/ 
	
	.sec-exhibitors{
		
	}
	.sec-exhibitors .inner{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 200px 0 0;
		display: table;
	}
	.sec-exhibitors .inner .sec-title{
		font-size: 76px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 55px;
		margin-left: 45px;
		
	}
	.sec-exhibitors .inner .sec-title::before{
		content: "";
		display: block;
		width: 130px;
		height: 5px;
		background: #000000;
		position: relative;
		left: -45px;
		top:-10px;
	}
	.sec-exhibitors .inner .list{
		font-size: 0;
	}
	.sec-exhibitors .inner .list li{
		width: 30.6%;
		margin: 0 4.1% 3.5% 0;
		display: inline-block;
		vertical-align: top;
	} 
	.sec-exhibitors .inner .list li:nth-child(3n){
		margin-right: 0;
	}
	.sec-exhibitors .inner .list li:nth-child(13){
		display: none;
	}
	.sec-exhibitors .inner .list li .name{
		font-size: 16px;
		letter-spacing: 2px;
		margin-top: 15px;
		line-height: 1.5;
	}
	.sec-exhibitors .inner .more-link{
		letter-spacing: 2px;
		float: right;
	}
	
	
	/*---------------------------------------
	 * Archives
	---------------------------------------*/ 
	
	.sec-archives{
		
	}
	.sec-archives .inner{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 200px 0 0;
		display: table;
	}
	.sec-archives .inner .sec-title{
		font-size: 76px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 55px;
		margin-left: 45px;
		
	}
	.sec-archives .inner .sec-title::before{
		content: "";
		display: block;
		width: 130px;
		height: 5px;
		background: #000000;
		position: relative;
		left: -45px;
		top:-10px;
	}
	.sec-archives .list{
		width: 100%;
		height: 492px;
		
	}
	.sec-archives .list li{
		float: left;
		width: 492px;
		height: 492px;
	}
	.sec-archives .list li p{
		width: 100%;
		height: 100%;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.sec-archives .list li span{
		display: block;
		width: 50%;
		height: 50%;
		float: left;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: cover;
		
	}
	.sec-archives .list li .img{
		/*
		width: 492px;
		height: 492px;
		*/
	}
	.sec-archives .wrap{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 30px 0 0;
		display: table;
	}
	.sec-archives .wrap .more-link{
		letter-spacing: 2px;
		float: right;
	}	
	
}

@media screen and (max-width: 900px) {
	
	/*---------------------------------------
	 * Loading
	---------------------------------------*/ 
	
	#Layer_1 {
		width: 80%;
		display: block;
		margin:  -4em auto 0;
	}
	
	
	/*---------------------------------------
	 * MainVisual
	---------------------------------------*/ 
	
	.mainvisual{
		width: 100%;
		background: #F8F8F8;
	}
	.mainvisual .inner{
		width: 100%;
		/*
		width: 80%;
		max-width: 500px;
		*/
		margin: 0 auto;
	}
	
	
	
	/*---------------------------------------
	 * Banner
	---------------------------------------*/ 
	
	.banner{
		width: 100%;
		
	}
	.banner .inner{
		width: calc(100% - 40px);
		max-width: 500px;
		margin: 0 auto;
		padding: 60px 0 0;
	}
	.banner .inner a{
		display: block;
	}	
	
	
	
	/*---------------------------------------
	 * News
	---------------------------------------*/ 
	
	.sec-news{
		
	}
	.sec-news .inner{
		margin: 0 auto;
		padding: 60px 30px 0;
	}
	.sec-news .inner .sec-title{
		display: inline-block;
		font-size: 48px;
		transform: rotate(-90deg);
		color: #000000;
		letter-spacing: 7px;
		position: relative;
		left: -40px;
		bottom: -40px;
	}
	.sec-news .inner .sec-title::before{
		content: "";
		display: block;
		width: 75px;
		height: 4px;
		background: #000000;
		position: relative;
		left: -25px;
		top:-10px;
	}
	.sec-news .inner ul{
		margin-left: 70px;
		border-top: 1px solid #CCCCCC;
		margin-bottom: 20px;
	}
	.sec-news .inner ul li{
		border-bottom: 1px solid #CCCCCC;
		padding: 20px 0px;
		line-height: 1.4;
		
	}
	.sec-news .inner ul li dl dt{
		margin-bottom: 10px;
	}
	.sec-news .inner ul li .date{
		letter-spacing: 2px;
		font-size: 15px;
	}
	.sec-news .inner ul li .post-title{
		letter-spacing: 1px;
		font-size: 13px;
	}
	.sec-news .inner .more-link{
		letter-spacing: 2px;
		float: right;
	}
	
	
	
	/*---------------------------------------
	 * About
	---------------------------------------*/ 
	
	.sec-about{
		
	}
	.sec-about .inner{
		margin: 0 auto;
		padding: 60px 20px 0;
	}
	.sec-about .inner .outline,
	.sec-about .inner .text{
		
	}
	
	
	/* Outline
	---------------------------------------*/ 
	
	.sec-about .inner .outline{
		border-bottom: 1px solid #000000;
		padding: 0 10px 30px;
		margin-bottom: 20px;
	}
	.sec-about .inner .date{
		font-size: 22px;
		letter-spacing: 4px;
		color: #000000;
		margin-bottom: 5px;
	}
	.sec-about .inner .sec-title{
		font-size: 43px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 10px;
	}
	.sec-about .inner .place{
		font-size: 22px;
		letter-spacing: 3px;
		margin-bottom: 20px;
	}
	.sec-about .inner .join .ticket{
		padding: 15px 0;
		display: block;
		width: 100%;
		border: 2px solid #000000;
		background: #000000;
		color: #FFFFFF;
		text-align: center;
		position: relative;
	}
	.sec-about .inner .join .ticket span{
		display: block;
		letter-spacing: 3px;
	}
	.sec-about .inner .join .ticket span.en{
		font-size: 22px;
		margin-bottom: 7px;
	}
	.sec-about .inner .join .ticket span.ja{
		font-size: 12px;
	}
	.sec-about .inner .join .ticket:hover{
		background: transparent;
		color:#000000;
	}
	
	
	
	/* Text
	---------------------------------------*/ 
	
	.sec-about .inner .read{
		padding: 0 10px;
	}
	
	.sec-about .inner .read p{
		line-height: 2;
		letter-spacing: 2px;
		font-size: 14px;
		margin-bottom: 30px;
	}
	.sec-about .inner .read .more-link{
		letter-spacing: 2px;
		float: right;
	}
	
	
	
	/*---------------------------------------
	 * Exhibittors
	---------------------------------------*/ 
	
	.sec-exhibitors{
		
	}
	.sec-exhibitors .inner{
		margin: 0 auto;
		padding: 60px 20px 0;
		display: table;
	}
	.sec-exhibitors .inner .sec-title{
		font-size: 48px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 55px;
		padding: 0 10px;
		margin-left: 23px;
		
	}
	.sec-exhibitors .inner .sec-title::before{
		content: "";
		display: block;
		width: 65px;
		height: 4px;
		background: #000000;
		position: relative;
		left: -23px;
		top:-10px;
	}
	.sec-exhibitors .inner .list{
		font-size: 0;
	}
	.sec-exhibitors .inner .list li{
		width: calc(50% - 10px);
		margin: 0 20px 4.5% 0;
		display: inline-block;
		vertical-align: top;
	} 
	.sec-exhibitors .inner .list li:nth-child(odd){
		margin-right: 0;
	}
	.sec-exhibitors .inner .list li:first-child{
		width: 100%;
	}
	.sec-exhibitors .inner .list li .name{
		font-size: 13px;
		letter-spacing: 1px;
		margin-top: 5px;
		line-height: 1.5;
	}
	.sec-exhibitors .inner .more-link{
		letter-spacing: 2px;
		float: right;
	}
	
	
	/*---------------------------------------
	 * Archives
	---------------------------------------*/ 
	
	.sec-archives{
		
	}
	.sec-archives .inner{
		margin: 0 auto;
		padding: 60px 20px 0;
		display: table;
		width: 100%;
	}
	.sec-archives .inner .sec-title{
		font-size: 44px;
		color: #000000;
		letter-spacing: 6px;
		margin-bottom: 55px;
		padding: 0 10px;
		margin-left: 23px;
		
	}
	.sec-archives .inner .sec-title::before{
		content: "";
		display: block;
		width: 65px;
		height: 4px;
		background: #000000;
		position: relative;
		left: -23px;
		top:-10px;
	}
	.sec-archives .list{
		width: 100%;
		height: 492px;
		
	}
	.sec-archives .list li{
		float: left;
		width: 492px;
		height: 492px;
	}
	.sec-archives .list li p{
		width: 100%;
		height: 100%;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.sec-archives .list li span{
		display: block;
		width: 50%;
		height: 50%;
		float: left;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.sec-archives .list li .img{
		/*
		width: 492px;
		height: 492px;
		*/
	}
	.sec-archives .wrap{
		width: calc(100% - 40px);
		max-width: 980px;
		margin: 0 auto;
		padding: 25px 0 0;
		display: table;
	}
	.sec-archives .wrap .more-link{
		letter-spacing: 2px;
		float: right;
	}		

	
}