@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Expletus+Sans');
/* font-family: 'Expletus Sans', cursive; */
@import url('https://fonts.googleapis.com/css?family=Yellowtail');
/* font-family: 'Yellowtail', cursive; */
@import url('https://fonts.googleapis.com/css?family=EB+Garamond');
/* font-family: 'EB Garamond', serif; */



.heading-1 h1{color: #fff; font-size: 18px; line-height: 1.2;margin: 12px 0 0 0;padding: 0;}
.heading-1 h2{color: #fff; font-size: 12px; line-height: 2.0;}
.heading-1 h3{}
.heading-1 h4{}
.heading-1 h5{}
.heading-1 h5{}
.heading-1 p{color: #fff; font-size: 16px; line-height: 1.62;}

.swiper-slide {margin-bottom: 24px;}
.swiper-slide h1 {color: #777777; margin-bottom: 6px; font-size: 14px;}
.swiper-slide h2 {color: #777777; margin-bottom: 6px; font-size: 12px;}
.swiper-slide h3 {color: #c9c9c9; font-size: 24px; font-weight: bold;}

/*
.img{
	background: url(images/sea_bg.jpg)center no-repeat fixed;
	background-size: cover;

	line-height: 2;
*/

	/*
	background-image: url(images/sea_bg.jpg);
  	background-position: center fixed;
  	background-size: cover;
  	width: 100%;
  	height: auto;
  	*/
}

.wrapper{
	background: #81cac4 ;
	background: -moz-linear-gradient(135deg, #7ec9c1 1%, #449fe5 47%, #81cac4 99%);
	background: -webkit-linear-gradient(135deg, #7ec9c1 1%,#449fe5 47%,#81cac4 99%);
	background: linear-gradient(135deg, #7ec9c1 1%,#449fe5 47%,#81cac4 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ec9c1', endColorstr='#0075d6',GradientType=1 );
	color: #fff;
}

.border-btm{
	border-bottom:5px dotted #fff;

}

.bg_clear01{
	background-blend-mode: screen;
	background:rgba(255,33,0,0.1);
}


.shop_button{
	background-color: #e61673;
	border:solid 2px #fff;
	border-radius: 6px;
	padding: 10px 5px;
	display: block;
	color: #e61673;	
}

.shop_button .category{
	color: #fff;	
}


.shop_button .medama_style{
	text-shadow    : 
       2px  2px 1px #fff,
      -2px  2px 1px #fff,
       2px -2px 1px #fff,
      -2px -2px 1px #fff,
       2px  0px 1px #fff,
       0px  2px 1px #fff,
      -2px  0px 1px #fff,
       0px -2px 1px #fff;
}


.link_button{
	background:rgba(255,200,0,0.7);
	border:solid 2px #fff;
	border-radius: 8px;
	padding: 6px 32px;
	color: #333;
	display: block;
	margin: 16px 0;
}

.rsv_button{
	background:rgba(250,123,0,0.9);
	border:solid 2px #fff;
	border-radius: 6px;
	padding: 6px 36px;
	color: #fff;
	display: block;
	margin: 16px 0;
}

.pre_button{
	background:rgba(230,230,230,0.2);
	border:solid 2px #fff;
	border-radius: 8px;
	padding: 6px 32px;
	color: #fa7b00;
	display: block;
	margin: 16px 0;
	pointer-events:none;
}

.btn_area a{
	transition: 0.1s;
	text-decoration: none;
}

.btn_area a:hover{
	color: #fa7b00 !important;
	background:rgba(250,123,0,0.0);
	border:solid 2px #fa7b00;
	border-radius: 5px;
}

.btn_area{
	margin:0 auto;
	text-align: center;
}

.btn_area2 a{
	transition: 0.1s;
	text-decoration: none;
}
.btn_area2 a:hover{
	color: #e61673 !important;
	background:rgba(230,22,115,0.8);
	border:solid 2px #e61673;
	border-radius: 5px;
}
.btn_area2{
	padding-top: 12px;
	margin:0 auto;
	text-align: center;
}

.tokuten{
	padding: 1px 8px;
	background-color: #f1f1f1;
	border-radius: 3px;
	border:solid 2px #333;
	display: inline-block;
	margin-top: 8px;
}



/*news*/




.twitter-timeline { width: 740px !important; }






* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
::before , ::after {
	box-sizing: inherit;
}
button {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	vertical-align: middle;
	text-align: inherit;
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
}

/**************** 以下、ハンバーガーボタンのスタイリング ****************/
.button {
	/* ボタンの配置位置  */
	position: fixed;
	top: 30px;
	right: 15px;
	/* 最前面に */
	z-index: 1000;
	/* ボタンの大きさ  */
	width: 32px;
	height: 32px;
}
/***** 真ん中のバーガー線 *****/
.btn-line {
	display: block;
	/* バーガー線の位置基準として設定 */
	position: relative;
	/* 線の長さと高さ */
	width: 100%;
	height: 5px;
	/* バーガー線の色 */
	background-color: #fff;
	transition: .2s;
	border-radius: 2px;
}
/***** 上下のバーガー線 *****/
.btn-line::before , .btn-line::after {
	content: "";
	/* 基準線と同じ大きさと色 */
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #fff;
	transition: .5s;
	border-radius: 2px;
}
.btn-line::before {
	/* 上の線の位置 */
	transform: translateY(-13px);
}
.btn-line::after {
	/* 下の線の位置 */
	transform: translateY(13px);
}
/***** メニューオープン時 *****/
.btn-line.open {
	/* 真ん中の線を透明に */
	background-color: transparent;
}
.btn-line.open::before , .btn-line.open::after {
	content: "";
	background-color: #999;
	transition: .2s;
}
.btn-line.open::before {
	/* 上の線を傾ける */
	transform: rotate(45deg);
}
.btn-line.open::after {
	/* 上の線を傾ける */
	transform: rotate(-45deg);
}
/**************** ここまで、ハンバーガーボタンのスタイリング ****************/
/**************** 以下、メニューのスタイリング ****************/




.menu-list {
	/* メニューテキスト位置をリスト内中心に */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
}

.menu-list a{
	color: #fff;
	display: block;
	padding-top: 15px;
    height: 100%;
    width: 100%;
    text-decoration: none;
}


.menu-list a:hover {
	color: #000;
	background-color: rgba(255, 255, 255, 0.9);
	cursor: pointer;
	transition: 0.3s;
}

.menu-list_2{
	display: none;
}
/***** メニューオープン時位置0にして画面内に *****/
.menu.open {
	position: absolute;
	left: 0;
}

@media (min-width: 359px) {
	.menu {
	/* メニューを縦に */
	display: flex;
	flex-direction: column;
	/* メニューの位置マイナス指定で画面外に*/
	position: fixed !important;
	right: -100%;
	width: 100%;
	height: 75vh;
	background:rgba(0,0,0,0.9);
	color: #fff;
	transition: 0.3s;
	z-index: 9;

	padding-top: 80px;
	}
}

@media (min-width: 767px) {
	.menu {
	/* メニューを縦に */
	display: flex;
	flex-direction: column;
	/* メニューの位置マイナス指定で画面外に*/
	position: fixed !important;
	right: -100%;
	width: 100%;
	height: 85vh;
	background:rgba(0,0,0,0.9);
	color: #fff;
	transition: 0.3s;
	z-index: 9;
	padding-top: 16px;
	}

	.menu-list a{
	padding-top: 0px !important;

	}
}

/* 600px以上はハンバーガーボタン非表示、ヘッダー固定 */
@media screen and (min-width: 1199px) {
	.button {
		display: none;
	}
	.menu {
		/* メニューを横に */
		display: flex;
		flex-direction: row;
		position: fixed !important;
		top: 0;
		right: 0;
		width: 100%;
		height: 60px;

		padding-top: 0;
	}

	.menu-list a{
	padding-top: 15px !important;
	}


	.menu-list_2{
	/* メニューテキスト位置をリスト内中心に */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	padding: 0 42px;
}

}
/**************** ここまで、メニューのスタイリング ****************/




















.spec_list ul{
	
	
}

.spec_list li{

	font-size: 14px;
	line-height: 1.6;
	border-bottom: dotted 1px #a1a1a1;
}

.spec_list span:first-child {
	color: #666;
	display: inline-block;
	width: 12em;
	padding: 3px 0 3px 40px;
}

.spec_list span:last-child {
	color: #333;
}







@media (min-width: 359px) {
	.header-fixed{
	width: 100%;
	padding: 0 16px !important;
	}

	.header-fixed-gnav-list li{
	font-size: 6px;
	}

}

@media (min-width: 767px) {
	.header-fixed-gnav-list li{
	font-size: 6px;
	}
}
@media (min-width: 1199px) {
	.header-fixed-gnav-list li{
	font-size: 10px;
	}
}

span.japanese{

	display: none;

}

/* headerメディアクエリ 480px以上*/

@media (min-width: 359px) {
	


	.header-fixed-logo{
		width: 180px;
		margin-top: 6px;
	}

	.header-fixed-gnav{
		margin-top: 6px;
	}

	.header-fixed-gnav-list li{
	
		font-size: 14px;

		margin: 3px;

		padding-right: 0.6em;

		border-right: solid 1px #333;

	}

	.header-fixed-gnav-list li:last-child{

		border-right: none;

	}

	#main:before{
	  content:"";
	  display:block;
	  position:fixed;
	  top:0;
	  left:0;
	  z-index:-10;
	  width:100%;
	  height:100vh;
	  background:url(parts/bg001_sp.jpg) center no-repeat;
	  background-size:cover;
	}

}

/* header-fixedメディアクエリ 768px以上*/

@media (min-width: 767px) {

	.header-fixed-gnav-list li{
	
		letter-spacing: 0.1em;
		margin: 6px;

	}

	#main:before{
	  content:"";
	  display:block;
	  position:fixed;
	  top:0;
	  left:0;
	  z-index:-10;
	  width:100%;
	  height:100vh;
	  background:url(parts/bg001_sp.jpg) center no-repeat;
	  background-size:cover;
	}

}

/* header-fixedメディアクエリ 1200px以上*/

@media (min-width: 1199px) {

	.header-fixed-inner{

		width: 1199px;

		margin: auto;

	}

	#main:before{
	  content:"";
	  display:block;
	  position:fixed;
	  top:0;
	  left:0;
	  z-index:-1;
	  width:100%;
	  height:100vh;
	  background:url(parts/bg001.jpg) center no-repeat;
	  background-size:cover;
	}

}

/* 通常のヘッダー */
.header{
	z-index: -100;
	width: 100%;
	padding: 0 0;
	/*padding: 24px 0;*/
	text-align: center;

	background: #f1f1f1; /* Old browsers */

	background: -moz-linear-gradient(0deg, #7ec9c1 1%, #ffffff 47%, #f1f1f1 99%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, #7ec9c1 1%,#ffffff 47%,#f1f1f1 99%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(0deg, #7ec9c1 1%,#ffffff 47%,#f1f1f1 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ec9c1', endColorstr='#7ec9c1',GradientType=1 ) ; /* IE6-9 fallback on horizontal gradient */
	background-size: contain;

	/*
	background: url(images/sea_bg.jpg) no-repeat fixed;
	background-size: cover;
	background-position: right 100% bottom 100%;
	*/

}



.header-logo{

	width: 360px;

	margin: auto;

}

.header-gnav{

	width: 70%;

	margin: 20px auto;

}

.header-gnav-list li{
	
	font-size: 14px;

	font-family: 'Marcellus', serif;

	letter-spacing: 0.05em;

	display: inline-block;

	margin: 3px;

	padding-right: 0.7em;

	border-right: solid 1px #fff;

}

.header-gnav-list li:last-child{

	border-right: none;

}

.header-gnav-list a{
	
	color: #fff;

}

.header-gnav-list li a:hover{

	padding-bottom: 5px;
	
	border-bottom: solid 5px #fff;

	text-decoration: none;

	opacity: 0.8;
	
}


/* headerメディアクエリ 480px以上*/

@media (min-width: 359px) {
	.header-logo{
		padding: 50px 0 100px 0;
		height: auto;
		width: 360px;

	}

	.header-gnav{

		margin-top: 35px;

	}

	.header-gnav-list li{
		font-size: 16px;
		margin: 3px;
	}

}

/* headerメディアクエリ 768px以上*/

@media (min-width: 767px) {

	.header-logo{
		width: 540px;
	}

	.header-gnav{
		margin-top: 35px;
	}

	.header-gnav-list li{
		font-size: 18px;
		letter-spacing: 0.1em;
		margin: 6px;
	}

}

/* header-fixedメディアクエリ 992px以上*/

@media (min-width: 991px) {
	.header-logo{
		width: 780px;
	}

	.header-gnav-list li{
		font-size: 20px;
		margin: 12px;
	}

}

/* コンテンツフェードイン */

/*.fi{

    animation: fadeIn 2s ease 0s 1 normal;

    -webkit-animation: fadeIn 2s ease 0s 1 normal;

}

@keyframes fadeIn {

    0% {opacity: 0}

    100% {opacity: 1}

}

@-webkit-keyframes fadeIn {

    0% {opacity: 0}

    100% {opacity: 1}

}*/



/* intro */

	/*スライダー*/

.bx-wrapper .bx-viewport {
	
	box-shadow: 0 0 0 #000;
	
	border:  0 solid #000;
	
	background: #000;

}

#slider-wrapper {
   
   width: 100%;

}

#slide img{
	
	margin: 0;
	
	padding: 0;
	
}

.intro{
	
	margin-bottom: 24px;
	
}

.intro-headline{
	
	font-size: 24px;
	color:#fff;
	margin-bottom: 24px;

	line-height: 1.5;
	
	font-weight: bold;
	
	text-align: center;

	
}

.intro-summary{
	line-height: 1.6;
	font-size: 14px;
	color:#fff;
	margin-bottom: 24px;
}

.intro-summary_2{
		line-height: 1.5;
		margin-bottom: 24px;
	}

.intro img{
	
	margin: auto;
	
}



}

/* introメディアクエリ 768px以上*/

@media (min-width: 767px) {

	.intro-bg{
		
		padding: 150px 0;
		
	}

	.intro-summary{
	
		line-height: 2;
		margin-bottom: 24px;
	
	}

	.intro-summary_2{
		line-height: 1.5;
		margin-bottom: 24px;
	
	}

	.intro-headline{

		font-size: 48px;

		margin-bottom: 64px;

		width: 70%;

		margin: auto;

		text-align: center;		
	
	}

}


/* content-about */

.about{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg002_2.jpg)center no-repeat fixed;
	background-size: cover;


	line-height: 2;
}


.bg_image_3{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg003.jpg)center no-repeat fixed;
	background-size: cover;

	line-height: 2;
}

@media (min-width: 359px) {
	.about{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg002_3.jpg)center no-repeat fixed;
	background-size: cover;
	line-height: 2;
	}

	.bg_image_3{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg003_3.jpg)center no-repeat fixed;
	background-size: cover;

	line-height: 2;
}


}


@media (min-width: 767px) {
	.about{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg002_2.jpg)center no-repeat fixed;
	background-size: cover;
	line-height: 2;
	}

	.bg_image_3{
	/**/
	content:"";
	display:block;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	/*height:100vh;*/

	background: url(parts/bg003.jpg)center no-repeat fixed;
	background-size: cover;

	line-height: 2;
}


}

.coment{
	
	border-left: solid 5px #fff;
	
	padding-left: 1em; 
	
}


/*SUPPORTER*/
@media (min-width: 359px) {
	.expo_day{
    border-left:solid 3px #fa7b00;
    border-bottom:none;
	}


	.supporter .box{
	width: 100%;
	height: 36em;
	}
}

@media (min-width: 767px) {
	.expo_day{
    border-bottom:dotted 2px #fa7b00;
    border-left:none;
	}

	.hedden_box2_dammy{
	height: 114px;
	}

	.supporter .box{
	width: 100%;
	height: 33em;
	}
}

@media (min-width: 1199px) {
	.expo_day{
    border-bottom:dotted 2px #fa7b00;
    border-left:none;
	}

	.hedden_box2_dammy{
	height: 91px;
	}

	.supporter .box{
	width: 100%;
	height: 37em;
	}

}



.rowheight{
	display: flex;
    flex-wrap: wrap;
}





.medama_style{
	font-size: 40px;
	display: block;
	font-weight: bold;
}
.category{
	font-size: 12px;
	line-height: 1.2;
	height: 36px;
	display: block;
	margin-bottom: 6px;
}




.type h3 span{
	width: 10em;
	text-align: center;
	background-color: #f1f1f1;
	font-size: 10px;
	border:solid 1px #fa7b00;
	border-radius: 2px;
	padding: 1px 10px;
	display: inline-block;
	
}

.type h3{
	margin-bottom: 5px !important;
}





/*NEWS*/

.content-news{
	background-color: rgba(255,255,255,0.8);
}



@media (min-width: 359px) {
	.news-list{
    height: 600px;
	}
}

@media (min-width: 767px) {
	.news-list{
    height: 600px;
	}
}

@media (min-width: 1199px) {
	.news-list{
    height: 570px;
	}
}



@media (min-width: 767px) {

	.news-list li .news-date{
		width: 20%;
	}

	.news-list li .news-headline{
		width: 80%;
	}

}

.content-1{
	background:rgba(20,20,20,0.9);
	width: 100%;	
}

.content-2{
	background: #f9f9f9;
	width: 100%;	
}

.content-3{
	background:rgba(255,255,255,0.2);
	width: 100%;	
}

.content-5{
	background:rgba(0,0,0,0.9);
	width: 100%;	
}

.content-heading-center-2{

	text-align: center;
	
	margin-top: 0;
	
	margin-bottom: 1em;

	margin-bottom: 48px;

	color: #fa7b00;
	
}

.content-heading-center-2 span{

	padding-bottom: 3px;

	border-bottom: solid 2px #fa7b00;

}

.top-campaign{

	border-bottom: solid 1px #94BFE6;

	padding: 16px;

}

.top-campaign-thumbnail{

	margin-bottom: 12px;

}

.top-campaign-title{

	font-weight: bold;

	margin-bottom: 12px;

}

.top-campaign-date{

	margin-bottom: 12px;

}

.top-campaign-summary{

	font-size: 14px;

}

.btn-simple{ /* commonを上書き */
	
	margin: 8px;
	
	padding: 3px;
}

p.summary{

	font-size: 14px;
	
}

a:hover{
	
	opacity: 0.8;
	
}

a img{
	
	transition-property: opacity;
	
	transition-duration: 0.6s;

}

a img:hover{
	
	opacity: 0.6;
	
}

@media (min-width: 359px) {
	
	
	.title{

		width: 80%;
		margin: auto;

	}

	
}


@media (min-width: 767px) {

	.title{

		width: 780px;

		margin: auto;

	}

	.news-list li .news-date{

		width: 20%;
	
	}

	.news-list li .news-headline{

		width: 80%;

	}
	
	.content-about-inner{

		font-size: 18px;

		width: 50%;
	
	}

}
 

@media (min-width: 767px) {

		
	.benefit-row{
		
		width: 767px;
		
		margin: auto;
		
		text-align: center;
	
	}

}

.benefit{

	color: #0075d6;

}

.container-access{

	background-size: contain;

}

.btn-blue{

	background: #0075d6;

	color: #fff;

	border: solid 1px #0075d6;

}

.btn-blue:hover{

	background: #1e73a0;
	
	color: #fff;

}



		* {
			margin: 0;
			padding: 0;
			border: 0;
		}

		#main {
			position: relative;
			overflow: hidden;
		}

		.splash {
			position: absolute;
			z-index: 0;
			border-radius: 50%;
			opacity: 0;
			mix-blend-mode: color;
		}




/*youtube*/
.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
