@charset "UTF-8";

/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼BASIC　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*ALL*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
@font-face {
	font-family:'futura'; /* 任意につけれる */
	src: url(./colega/font/futura.ttf); /* パスを指定 */
  }
  .wf-mplus1p {  }
*{
	margin: 0;padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/* font-family: a-otf-ud-shin-go-pr6n, sans-serif; */

	font-style: normal;
	font-weight: 300;
	line-height: 5px;
	margin: 0;
	padding: 0;
}

html,body{height: 100%;}
section{height: auto;}
a {outline:none;}

body{
  width:100%;
  /*min-width: 1260px;*/
	/*background-color: #0b0b0b;*/
	background-color: rgb(0, 0, 0);
	color: #fff;
	/* font-family: "Mplus 1p"; */
	/* font-family: a-otf-ud-shin-go-pr6n, sans-serif; */

	font-size: 14px;
	line-height: 21px;
}
img{
	display: block;
}

h2{
	text-align: center;
	font-size: 1.4em;
}


.f_futara{
	font-family:'futura'; /* 任意につけれる */
	src: url(./colega/font/futura.ttf) format('truetype'); /* パスを指定 */
  }
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*hr*/
/*▼ボーダー▼*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

/*▽素▽*/
hr{
	/* border: none; */
	width: 95%;
	border-top: 1 solid;
	border-color: #bdbdbd;
}

/*▽基本▽*/
hr.base{
	width: 100%;
	border-top:1px solid;
	border-bottom: 1px solid;
	border-top-color: #252525;
	border-bottom-color: #bfbfbf;
	margin: auto 0;
}

hr.itv{
	/*background-color: #fff;*/
	border: none;
	border-top: 1px dotted #cdcdcd;
}

textarea{
	color: #ffffff;
	background-color: rgba(0, 0, 0, 0.75);
	padding: 10px;
	border: 1px rgb(77, 77, 77) solid;
	line-height: 16px;
	resize: none;
}
td {vertical-align:middle;}

/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*a*/
/*▼リンク▼*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
a{	color: #1cdeae;text-decoration: none;}
a:link{	color: #1cdeae;}
a:hover{color: #b6b6b6;}
/* a:visited{	color: #ffff00;} */
/*a:visited{	color: #7d7d7d;}*/

.img-frame{
	border-radius: 1px;
	box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.75), 0 0 10px rgba(255, 255, 255, 0.8),0 0 10px rgba(255, 255, 255, 0.8);
	background: #444;

}

/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼Project　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/

/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*div*/
/*▼div▼*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

.main-content{
  position: relative;
  width: 100%;

}
@media(max-width:768px){
	.main-content{

	-webkit-overflow-scrolling : touch;
		padding: 0;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.main-content{
	}
}
@media(min-width:1365px){
	.main-content{
	}
}

/* MV */
.content-box_mv{
	position: relative;
	width: 100vw;
	height: 100vh;
  margin: 0 auto;
}

/* WORLD */
.content-box_world{
	position: relative;
	width: 1140px;
	height: 100%;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_world{
	width: 100%;
	padding-bottom: 30px;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_world{
	width: 720px;
	height: 100vh;
  margin: 0 auto;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_world{
	width: 960px;
	height: 100vh;
  margin: 0 auto;
}
}

/* CHARACTER */
.content-box_character{
	position: relative;
	width: 1140px;
	height: 100%;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_world{
	width: 100%;
	padding-bottom: 30px;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_character{
	width: 720px;
	height: 100vh;
  margin: 0 auto;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_character{
	width: 960px;
	height: 100vh;
  margin: 0 auto;
}
}

/* GALLERY */
.content-box_gallery{
	position: relative;
	width: 1140px;
	height: 100%;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_gallery{
	width: 100%;
	padding-bottom: 30px;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_gallery{
	width: 720px;
	height: 100vh;
  margin: 0 auto;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_gallery{
	width: 960px;
	height: 100vh;
  margin: 0 auto;
}
}

/* CHANNEL */
.content-box_channel{
	position: relative;
	width: 1140px;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_channel{
	width: 100%;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_channel{
	width: 720px;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_channel{
	width: 960px;
}
}

/* COLUMN */
.content-box_column{
	position: relative;
	width: 1140px;
	height: 100%;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_column{
	width: 100%;
	padding-bottom: 30px;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_column{
	width: 720px;
	height: 100vh;
  margin: 0 auto;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_column{
	width: 960px;
	height: 100vh;
  margin: 0 auto;
}
}

/* SPECIAL */
.content-box_special{
	position: relative;
	width: 1140px;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_special{
	width: 100%;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_special{
	width: 720px;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_special{
	width: 960px;
}
}

/* STAFF */
.content-box_staff{
	position: relative;
	width: 1140px;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_staff{
	width: 100%;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_staff{
	width: 720px;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_staff{
	width: 960px;
}
}

/* content box */
.content-box{
	position: relative;
	width: 1080px;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box{
	position: relative;
	width: 100%;
  margin: 0 auto;
}
}

/*コンテンツ*/
/*中央寄せ*/
.cont-center{
	position: relative;
	text-align: center;
	margin: 0 auto;
}
/*左寄せ*/
.cont-left{
	position: relative;
	text-align: center;
	margin: 0 auto;
}
/*右寄せ*/
.cont-center{
	position: relative;
	text-align: center;
	margin: 0 auto;
}

/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

/*バナーサイズ*/
/*画像サイズ:1/1*/
.bn_1-1{
	position: relative;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	margin: auto 0;
	user-select: none;
}
@media(max-width:768px){
	.bn_1-1 {
		padding-top: 5px;
		padding-bottom: 10px;
	}
}
.bn_1-1 img{
		width: 100%;
		height: auto;
		}
@media(max-width:768px){
		.bn_1-1 img{
		width: 100%;
		}
	}

/*画像サイズ:1/2*/
.bn_1-2{
	position: relative;
	display: inline-block;
	width: 48%;
	text-align: center;
	/* padding-left: 2%; */
	margin: 2px 2px;
	vertical-align: middle;
}
@media(max-width:768px){
	.bn_1-2{
		width: 100%;
		left: 0;
		right: 0;
		margin: auto;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.bn_1-2{
		width: 49%;
		margin: 2px 2px;
	}
}
@media(min-width:1365px){
}
.bn_1-2 img{
	width: 100%;
	-webkit-filter: none;
  -moz-filter: none;
  filter: none;
}
.bn_1-2 img:hover {
	width: 100%;
}

/*画像サイズ:1/3*/
.bn_1-3{
	position: relative;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
	width: 32.4%;
	padding-left: 3px;
	margin: 5px 3px;
}
@media(max-width:768px){
	.bn_1-3{
		width: 100%;
		left: 0;
		right: 0;
		margin: auto;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.bn_1-3{
		width: 32.3%;
		padding-left: 3px;
		margin: 4px 2px;
	}
}
@media(min-width:1365px){
}
.bn_1-3 img{
	width: 100%;
	-webkit-filter: none;
  -moz-filter: none;
  filter: none;
}
.bn_1-3 img:hover {
	width: 100%;
	-webkit-filter: contrast(75%) brightness(120%);
	-moz-filter: contrast(75%) brightness(120%);
	filter: contrast(75%) brightness(120%);
}

.bn_1-4{
	text-align: center;
	display: inline-block;
	width: 24%;
	padding-left: 7px;
	margin: 4px 2px;
}
@media(max-width:768px){
	.bn_1-4{
		width: 49%;
		left: 0;
		right: 0;
		margin: auto;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.bn_1-4{
		width: 24%;
		padding-left: 7px;
		margin: 4px 1px;
	}
}
.bn_1-4 img{
	width: 100%;
	-webkit-filter: none;
  -moz-filter: none;
  filter: none;
}
.bn_1-4 img:hover {
	width: 100%;
	-webkit-filter: contrast(75%) brightness(120%);
	-moz-filter: contrast(75%) brightness(120%);
	filter: contrast(75%) brightness(120%);
}

.sp-wide{
	width: 100%;
}

.fnone img:hover {
	-webkit-filter: none;
	-moz-filter: none;
	filter: none;
}


/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼TOP　G-nav▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

.nav-li{
	display: block;
	float:left;
	/* height: 60px; */
	text-align: center;
	text-indent: -9999px;

  }
  @media(max-width:1100px){
	.nav-li{
		left: -20px;
		text-align: left;
		margin-top: 10px;
		margin-bottom: 10px;
		border-bottom: solid 1px #838383;
	}
}

  .nav-li a{
	display: block;
	height: 28px;
	width: 100%;
  }

.rd-gnav{
	margin: 6px;
	float:right;
  }
  @media(max-width:1100px){
	.rd-gnav{
		display: none;
	}
}
.rd-gnav_sp{
	display: none;
  }
  @media(max-width:1100px){
	.rd-gnav_sp{
		position: relative;
		display: block;
		margin: 6px;
		float:right;
	}
}

.rd-gnav--logo{
	margin: 6px 8px 0px 10px;
	float:left;
  }

.rd-gnav--frame{
	position: fixed;
	top:0;
	width: 100%;
	z-index: 99;
	right:0; left:0;
	margin: auto;
	background: linear-gradient(0deg, rgba(28,61,158,0.0),rgba(28,61,158,1.0));
  }

.hvr-float{
	padding: 10px;
}

.rd-gnav--bottom{
	background-repeat: no-repeat;
}

.nav-top{width:77px;background-image: url(../sumomo-cafe/img/g_nav/rd_top.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-world{width:115px;background-image: url(../sumomo-cafe/img/g_nav/rd_world.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-chara{width:165px;background-image: url(../sumomo-cafe/img/g_nav/rd_character.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-gallery{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_gallery.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-channel{width:139px;background-image: url(../sumomo-cafe/img/g_nav/rd_channel.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-column{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_column.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-special{width:121px;background-image: url(../sumomo-cafe/img/g_nav/rd_special.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}
.nav-staff{width:96px;background-image: url(../sumomo-cafe/img/g_nav/rd_staff.png);}

.nav-top:hover{width:77px;background-image: url(../sumomo-cafe/img/g_nav/rd_top-hov.png);background-position: 0 bottom;}
.nav-world:hover{width:115px;background-image: url(../sumomo-cafe/img/g_nav/rd_world-hov.png);background-position: 0 bottom;}
.nav-chara:hover{width:165px;background-image: url(../sumomo-cafe/img/g_nav/rd_character-hov.png);background-position: 0 bottom;}
.nav-gallery:hover{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_gallery-hov.png);background-position: 0 bottom;}
.nav-channel:hover{width:139px;background-image: url(../sumomo-cafe/img/g_nav/rd_channel-hov.png);background-position: 0 bottom;}
.nav-column:hover{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_column-hov.png);background-position: 0 bottom;}
.nav-special:hover{width:121px;background-image: url(../sumomo-cafe/img/g_nav/rd_special-hov.png);background-position: 0 bottom;}
.nav-staff:hover{width:96px;background-image: url(../sumomo-cafe/img/g_nav/rd_staff-hov.png);background-position: 0 bottom;}


@media(max-width:768px){.nav-top{width:77px;background-image: url(../sumomo-cafe/img/g_nav/rd_top.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-world{width:115px;background-image: url(../sumomo-cafe/img/g_nav/rd_world.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-chara{width:165px;background-image: url(../sumomo-cafe/img/g_nav/rd_character.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-gallery{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_gallery.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-channel{width:139px;background-image: url(../sumomo-cafe/img/g_nav/rd_channel.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-column{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_column.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-special{width:121px;background-image: url(../sumomo-cafe/img/g_nav/rd_special.png);-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;}}
@media(max-width:768px){.nav-staff{width:96px;background-image: url(../sumomo-cafe/img/g_nav/rd_staff.png);}}

@media(max-width:768px){.nav-top:hover{width:77px;background-image: url(../sumomo-cafe/img/g_nav/rd_top-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-world:hover{width:115px;background-image: url(../sumomo-cafe/img/g_nav/rd_world-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-chara:hover{width:165px;background-image: url(../sumomo-cafe/img/g_nav/rd_character-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-gallery:hover{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_gallery-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-channel:hover{width:139px;background-image: url(../sumomo-cafe/img/g_nav/rd_channel-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-column:hover{width:134px;background-image: url(../sumomo-cafe/img/g_nav/rd_column-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-special:hover{width:121px;background-image: url(../sumomo-cafe/img/g_nav/rd_special-hov.png);background-position: 0 bottom;}}
@media(max-width:768px){.nav-staff:hover{width:96px;background-image: url(../sumomo-cafe/img/g_nav/rd_staff-hov.png);background-position: 0 bottom;}}


/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼TOP　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
.g-nav ul li{ 	
    display: inline;
 } 

.g-nav{
	position: fixed;
	/* background-color: rgba(0, 0, 0, 0.7); */
	width: 100%;
	height: 54px;
	margin: 0 auto;
	/* z-index: 1; */
	/* mix-blend-mode: overlay; */
}
@media(max-width:768px){
	.g-nav{
	background-color: none;
	z-index: 1;
	}
}

.g-nav-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	/* max-width: 1140px; */
	padding-top: 10px;
	padding-left: 2%;
}

 .g-nav ul{
	list-style: none;
	display: flex;
	justify-content: space-between;
	padding: 0;
	margin: 0;
  }
  .g-nav li{
	box-sizing: border-box;
	padding: 15px 0;
	text-align: center;
	flex-grow: 1;
  }


/* タイトルロゴ */


/* スクロール */
.mv-scr{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 69.3px 40px 0 40px;
	border-color: #ffffff transparent transparent transparent;

	position: absolute;
	bottom: 7%;
	right:0px;
	left:0px;
	margin: auto;
	mix-blend-mode: overlay;

	}

.info-content_color{
	/* background-color: rgba(74, 94, 115,0.9); */
	background-color: rgba(31, 76, 151,0.9);
	-webkit-filter: blur(0px);
	filter: blur(0px);
}
.info-content_color{
	content: '';
	/* background: transparent url(../images/pattern.png) repeat top left; */
	background-size: 2px 2px;
	background-position: 0 0, 1px 1px;
	background-image:
	linear-gradient(45deg,  rgba(31, 76, 151,0.75) 25%, rgba(31, 76, 151,0.75) 25%, transparent 25%,
	transparent 75%, rgba(31, 76, 151,0.75) 75%, rgba(31, 76, 151,0.75) 75%),
	linear-gradient(-135deg, rgba(31, 76, 151,0.75) 25%, rgba(31, 76, 151,0.75) 25%, transparent 25%,
	transparent 75%, rgba(31, 76, 151,0.75) 75%, rgba(31, 76, 151,0.75) 75%);

}

.notes-content_color{
	background-color: rgba(54,72,27,0.9);
	-webkit-filter: blur(0px);
	filter: blur(0px);
}
.notes-content_color{
	content: '';
	/* background: transparent url(../images/pattern.png) repeat top left; */
	background-size: 2px 2px;
	background-position: 0 0, 1px 1px;
	background-image:
	linear-gradient(45deg,  rgba(54,72,27,0.75) 25%, rgba(54,72,27,0.75) 25%, transparent 25%,
	transparent 75%, rgba(54,72,27,0.75) 75%, rgba(54,72,27,0.75) 75%),
	linear-gradient(-135deg, rgba(54,72,27,0.75) 25%, rgba(54,72,27,0.75) 25%, transparent 25%,
	transparent 75%, rgba(54,72,27,0.75) 75%, rgba(54,72,27,0.75) 75%);

}

.footer-content_color{
	/* background-color: rgba(74, 94, 115,0.9); */
	background-color: rgba(0, 0, 0,0.9);
	-webkit-filter: blur(0px);
	filter: blur(0px);
}
.footer-content_color{
	content: '';
	/* background: transparent url(../images/pattern.png) repeat top left; */
	background-size: 2px 2px;
	background-position: 0 0, 1px 1px;
	background-image:
	linear-gradient(45deg,  rgba(0,0,0,0.75) 25%, rgba(0,0,0,0.75) 25%, transparent 25%,
	transparent 75%, rgba(0,0,0,0.75) 75%, rgba(0,0,0,0.75) 75%),
	linear-gradient(-135deg, rgba(0,0,0,0.75) 25%, rgba(0,0,0,0.75) 25%, transparent 25%,
	transparent 75%, rgba(0,0,0,0.75) 75%, rgba(0,0,0,0.75) 75%);
}



.info-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
}


.info-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
}




	
.info-box{
	/* background: rgba(25, 25, 43, 0.5); */
	background: rgba(49, 49, 49, 0.8);
	border: solid 1px #ffffff;
	height: 400px;
	overflow-x: hidden;
	overflow-y: hidden;
	mix-blend-mode: normal;
	margin: 10px;
}

.info-box h1{
	font-weight: bold;
	/* background: rgba(25, 25, 43, 0.5); */
	background: rgba(0, 0, 128,0.5);
	padding: 10px;
	border-bottom: solid 1px rgba(255, 255, 255,0.5);
	margin-left: -22px;

	mix-blend-mode: screen;
}
.info-box_text{
	text-align: left;
	padding: 10px;
	padding-left: 20px;
	border-bottom: dotted 1px rgba(255, 255, 255,0.5);
	margin-right: 20px;
	
	/* background-blend-mode: multiply; */
}

.twitter-box{
	margin-left: -22px;
	overflow-y: hidden;

}


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

.info-bg{
	position: relative;
	width: 100%;
	/* height: 100vh; */
	margin: 0 auto;
	/* background-color: #0b0b0b; */
	background: none,url(../sumomo-cafe/img/top/mv.jpg);
	overflow: hidden;
	background-repeat: no-repeat;
    background-position: 50% 50%;
	background-attachment:fixed;
	background-size:cover;
}
.info-bg:before{
	content: "";
	position: absolute;
	display: block;
	background: inherit;
	background-color: rgba(0, 0, 128,0.5);
	-webkit-filter: blur(20px);
	filter: blur(20px);
	top: -20px;
	bottom: -20px;
	left: -20px;
	right: -20px;
	z-index: 0;
}

/* .info-bg{
	color: #fff;
	position: relative;
	background: rgba(51,51,51,0.5);
	width: 100%;
	margin-bottom: 16px;
	border: solid 1px #cc0000 ;
	-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
	overflow-x: hidden;
	overflow-y: hidden;
} */
/* @media(max-width:768px){
	.info-bg{
		width: 98%;
		margin-left: 3px;
		margin-bottom: 4px;
	}
} */



.prof-bg{
	position: relative;
	width: 100%;
	margin: 0 auto;
	/* background: none,url(../sumomo-cafe/img/mv.jpg);
	overflow: hidden;
	background-repeat: no-repeat;
    background-position: 50% 50%;
	background-attachment:fixed;
	background-size:cover; */
}
.prof-bg:before{
	background-image: url(../sumomo-cafe/img/mv.jpg);
	background-position: center;
	background-size: cover;
	display: block;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100vw;
	height: 100vh;
	content: "\A";
	z-index: -1;
}

@media(max-width:768px){
	.prof-bg{
		height: auto;
		background: none;
		background-color: none;
		background-image: none;
		z-index: none;
	}
	.prof-bg::before{
		/* background-image: url(../sumomo-cafe/img/mv-sp.jpg);
		background-position: center;
		background-size: cover;
		display: block;
		position: fixed;
		top: 0%;
		left: 0%;
		width: 100vw;
		height: 100vh;
		content: "\A";
		z-index: -1; */
	}
	.prof-bg img{
		width: 100%;
	}
}

.prof-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
	padding-top: 30px;
	padding-bottom: 30px; 
}

.prof-content h1{
	font-weight: bold;
	font-size: 3em;
	text-align: left;
	padding: 10px;
	padding-bottom: 40px;
	margin-left: 20px;
}


	
.prof-box{
	height: 600px;
	overflow-x: hidden;
	overflow-y: hidden;
	/* mix-blend-mode: overlay; */
}

.prof-box h1{
	font-weight: bold;
	text-align: left;
	padding: 10px;
	border-bottom: solid 1px rgba(255, 255, 255,0.5);
	margin-left: 20px;
}



.mv-bg{
	position: relative;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	/* background-image: url(../sumomo-cafe/img/mv_cafe.jpg); */
	
	/* position: fixed; */
	top: 0%;

	/* background-color: #0b0b0b; */
	/* background-image: url(../sumomo-cafe/img/mv.jpg);
	overflow: hidden;
	background-repeat: no-repeat;
    background-position: 50% 50%;
	background-attachment:fixed;
	background-attachment:-webkit-fixed;
	background-size:cover; */
}
.mv-bg::before{
	background-image: url(../sumomo-cafe/img/mv_cafe.jpg);
	background-position:top;
	background-size: cover;
	display: block;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100vw;
	height: 100vh;
	content: "\A";
	z-index: -1;
	z-index: 0;
}

@media(max-width:768px){
	.mv-bg{
		height: auto;
		background: none;
		background-color: none;
		background-image: none;
		z-index: none;
	}
	.mv-bg::before{
		background-image: url(../sumomo-cafe/img/mv_cafe-sp.jpg);
		background-position: center;
		background-size: cover;
		display: block;
		position: fixed;
		top: 0%;
		left: 0%;
		width: 100vw;
		height: 100vh;
		content: "\A";
		z-index: -1;
	}
	.mv-bg img{
		width: 100%;
	}
}

.mv-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
	padding-top: 60px;
	padding-bottom: 10px;
}


.goods-content{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
	padding-top: 20px;
	padding-bottom: 10px;
}



.mv-logo{
	position: fixed;
	/* z-index: 5; */
	right: 30px;
	top: 5vh;
	margin: 0 auto;
}
@media(max-width:768px){
	.mv-logo{
		position: relative;
		right: auto;
		top: auto;
		width: 90%;
		padding-top: 40vh;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 160px;
		}
		.mv-logo_t img{
			width: 100%;
		}
	}

.mv-logo_img{
	width: 33vw;
}
@media(max-width:768px){
	.mv-logo_img{		width: 100%;}
}

.mv-copy{
	position: fixed;
	/* z-index: 5; */
	left: 10%;
	bottom: 12vh;
	margin: 0 auto;
}
@media(max-width:768px){
	.mv-copy{
		position: relative;
		left: auto;
		top: auto;
		width: 90%;
		padding-top: 0px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 0px;
		}
		.mv-date_t img{
			width: 100%;
		}
	}

.mv-copy_img{
	width: 33vw;
}
@media(max-width:768px){
	.mv-copy_img{		width: 100%;}
}


.mv-date{
	position: fixed;
	/* z-index: 5; */
	right: 30px;
	bottom: 30px;
	margin: 0 auto;
}
@media(max-width:768px){
	.mv-date{
		position: relative;
		left: auto;
		right: auto;
		top: auto;
		width: 90%;
		padding-top: 0px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
		}
		.mv-xf_t img{
			width: 100%;
		}
	}

.mv-date_img{
	width: 50vw;
}
@media(max-width:768px){
	.mv-date_img{		width: 100%;}
}


.mv-link{
	position: relative;
	display: inline-block;
	color: #ecf0f1;
  }


.mv-link img{
	transition: 0.5s ;
}
.mv-link:hover img{
	opacity: 0.9 ;
}




.content-box_movie{
	position: relative;
	width: 1140px;
  margin: 0 auto;
}
@media(max-width:768px){
.content-box_movie{
	width: 100%;
	z-index: 0;
}
}
@media(max-width:1278px) and (min-width: 769px){
.content-box_movie{
	width: 720px;
}
}
@media(max-width:1364px) and (min-width: 1279px){
.content-box_movie{
	width: 960px;
}
}

.movie-content{
	width: 100%;
	padding-top: 40px;
	padding-bottom: 65px
}
@media(max-width:768px){
	.movie-content{
		width: 95%;
		left: 0;
		right: 0;
		padding-top: 20px;
		padding-bottom: 40px;
		margin: auto;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.movie-content{
	}
}
@media(min-width:1365px){
}



.mov-size{
	padding-top: 3px;
	width:1140px;
	height:643px;
}
@media(max-width: 768px){
	.mov-size{
		/*display: inline-block;*/
		padding-top: 5px;
		width: 100%;
		height: 33vh;
	}
	.mov-size img{
		width: 100%;
		height: auto;
	}
}
@media(max-width:1278px) and (min-width: 769px){
	.mov-size{
		padding-top: 4px;
		width: 720px;
		height: 409px;
	}
	.mov-frame img{
		width: 100%;
		height: auto;
	}
}
@media(max-width:1364px) and (min-width: 1279px){
	.mov-size{
		padding-top: 5px;
		width: 860px;
		height: 542px;
	}
	.mov-size img{
		width: 100%;
		height: auto;
	}
}
@media(min-width:1365px){
}



.goods-header{
	position: relative;
	margin: 0 auto;
	text-align: center;
	max-width: 1140px;
	padding-top: 80px;
	line-height: 2.2em;
}
@media(max-width:768px){
	.goods-header{
		padding-top: 60px;
	}
}

.goods-header h1{
	font-weight: bold;
	color: #1cdeae;
	text-shadow: 2px 2px 0 #fff,
	-2px 2px 0 #fff,
	2px -2px 0 #fff,
	-2px -2px 0 #fff;
	font-size: 2em;
	text-align: left;
	padding: 10px;
	padding-bottom: 0px;
	margin-left: 20px;
}

.goods-box{
	position: relative;
	display: inline-block;
	/* width: 100%; */
	text-align: center;
	/* padding-left: 2%;
	margin: 2px 2px; */
	vertical-align: middle;

	/* background: rgba(25, 25, 43, 0.5); */
	/* background: rgba(49, 49, 49, 0.8); */
	/* border: solid 1px #ffffff;
	overflow-x: hidden;
	overflow-y: hidden;
	mix-blend-mode: normal; */
	/* margin: 10px; */
}

.goods-box_h{
	font-size: 1.5em;
	background:  rgba(31, 76, 151,0.9);
	padding: 15px;
	line-height: 1.2em;
	mix-blend-mode: screen;
}
@media(max-width:768px){
	.goods-box_h{
	padding: 15px 5px;
	}
}
.item-box_h{
	font-size: 1.5em;
		background: rgba(255, 255, 255, 0.25);

	padding: 15px;
	line-height: 1.2em;
	mix-blend-mode: screen;
}
@media(max-width:768px){
	.item-box_h{
	padding: 15px 15px;
	}
}
.cafe-box_h{
	font-size: 1.5em;
		background: rgba(218,235,137, 0.25);

	padding: 15px;
	line-height: 1.2em;
	mix-blend-mode: screen;
}
@media(max-width:768px){
	.cafe-box_h{
	padding: 15px 15px;
	}
}





.goods-box_text{
	text-align: left;
	padding: 10px;
	margin: 10px;
}


.goods-new {
    width: 150px;
    padding: 10px 10px;
    background: rgba(212, 49, 49, 0.9);
	color: #fff;
	font-weight: bold;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 9px;
    left: -41px;
    text-transform: uppercase;
	transform: rotate(315deg);
	z-index: 1;
}


.event-btn {
	/* position: absolute; */
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  text-align: center;
  font-size: 1.5em;
  font-weight: bold;
  padding: 1.2em 3.0em;
  max-width: 60%;
  background: #1cdeae;
  text-decoration: none;

}@media(max-width:768px){
	.event-btn {
		font-size: 1.2em;
  		padding: 1.0em 1.2em;
	}
}

a.event-btn{
  color: #ffffff;
}

.event-btn:hover {
	color: #ffffff;
  background: #fc3c3c;
  text-decoration: none;
}

.event-btn:visited {
	color: #ffffff;
	/*background: #ef5f77;*/
	text-decoration: none;
}

a.footer_tw{
	color: #ffffff;
	background: #00acee;
	padding: 20px 100px;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.3em;
	border-radius: 4px;

  }
  
  .footer_tw:hover {
	color: #ffffff;
	background: #84d7f9;
  }

  a.footer_x{
	color: #ffffff;
	background: #000000;
	border: #838383 1px solid;

	padding: 20px 100px;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.3em;
	border-radius: 4px;

  }
  
  .footer_x:hover {
	color: #ffffff;
	background: #393939;
	border: #838383 1px solid;
  }

  a.footer_hp{
	color: #ffffff;
	background: rgb(31, 76, 151);
	padding: 20px 42px;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.3em;
	border-radius: 4px;

  }
  
  .footer_hp:hover {
	color: #ffffff;
	background: rgb(114, 146, 201);

  }
  
  




/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*▼content共通　CSS▼*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

/* ページヘッダー */
.rd-header_bg{
	position: relative;
	top:0;
	left:0;
	width: 100vw;
	height: 120px;
	margin: 0 auto;
	overflow: hidden;
	background:
	url(../sumomo-cafe/img/top/mv_b.jpg);
	background-position: 50% 50%;
	background-attachment: fixed;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	margin-left: calc(((100vw - 100%) / 2) * -1);
	margin-right: calc(((100vw - 100%) / 2) * -1);
}
/* @media(max-width:768px){
	.rd-header_bg{
		margin-left:0;
		margin-right:0;
	}
} */

.rd-header{
	width: 1140px;
	position: relative;
	top: 60px;
	margin: 0 auto;
	mix-blend-mode: multiply;
}

@media(max-width:1278px) and (min-width: 769px){
	.rd-header{
		width: 720px;
	}
	}
	@media(max-width:1364px) and (min-width: 1279px){
	.rd-header{
		width: 960px;
	}
	}

/* コンテンツフレーム */
.content-frame{
	position: relative;
	/* display: block; */
	width: 100%;
	/* background: rgba(0,0,0,0.8); */
	/* background-image: url(../sumomo-cafe/img/frame-bg.jpg); */
	background-repeat: repeat;
	background-size: 100px 100px,;
	/* background-color: #ffffff; */
	/*border: solid 1px #333333;*/
	/* padding: 20px; */
	margin-bottom: 60px;
	margin-top: 20px;
	/* mix-blend-mode: overlay; */
}
/* @media(max-width:768px){
	.content-frame{
		
		position: relative;
		left: 2.5vw;
		width: 95vw;
		margin-top: 21px;
		margin-bottom: 30px;
	}
} */
.content-frame h2{
	font-weight: bold;
	font-size: 18px;
	padding: 10px 0px;
	margin-top: 20px;
	margin-bottom: 20px;
	border-bottom:  dotted 1px #ffff00;
}
.content-frame h3{
	font-weight: bold;
	font-size: 16px;
	padding: 10px 0px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.content-frame p{
	padding: 10px 0px;
	margin-bottom: 20px;
}
.content-frame table{
	width: 90%;
	margin: 30px;
	margin-bottom: 40px;
}
@media(max-width:768px){
	.content-frame table{
		margin: 5px;
		width: 95%;
	}
}
.content-frame tr{
	width: 100%;
	padding: 5px 0;
	margin: 5px 0;
	border: solid 1px #cccccc;
}
.content-frame th{
	padding: 10px 20px;
	margin: 0 20px;
	width: 20%;
	font:bold;
	/* color: #ffff00; */
	text-align: center;
	/* border-bottom: dotted 1px #cccccc; */
	border-right: dotted 1px #cccccc;
	background-color: rgba(255, 255, 255, 0.3)
}@media(max-width:768px){
	.content-frame th{
		width: 50%;
	}
}
.content-frame td{
	/* border-bottom: dotted 1px #ffffff; */
	padding: 10px 20px;
	width: 80%;
}@media(max-width:768px){
	.content-frame td{
		width: 50%;
	}
}
.content-frame ul{
	width: 90%;
	padding: 5px 0;
	margin: 0 auto;
}

.img_1-1_m{
	text-align:center;
	margin: auto;
	width: 48%;
	padding: 20px;
}


.rd_btn{
	position: relative;
	display: block;
	background:
		linear-gradient(
			-45deg,
		rgba(255, 255, 255, 0.5) 25%,
		rgba(255, 255, 0, 0.5) 25%, rgba(255, 255, 0, 0.5) 50%,
		rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.5) 75%,
		rgba(255, 255, 0, 0.5) 75%, rgba(255, 255, 0, 0.5));
	background-position: 0 100px;
	background-size: 20px 20px;
	background-repeat: repeat;
	border: solid 1px #ffff00;
	border-radius: 2px;
	width: 75%;
	padding: 15px 40px;
	margin: 40px auto;
}
.rd_btn::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 0;
	border-bottom: 24px solid #ffff00;
	border-left: 24px solid transparent;
  }
  @media(max-width:768px){
	.rd_btn:after {
		content: "";
		position: absolute;
		bottom: 0;
		right: 0;
		width: 0;
		height: 0;
		border-bottom: 12px solid #ffff00;
		border-left: 12px solid transparent;
	}
}

  .rd_btn:hover{
	background:
	linear-gradient(
		-45deg,
	rgba(255, 255, 255, 0.75) 25%,
	rgba(255, 255, 0, 0.75) 25%, rgba(255, 255, 0, 0.75) 50%,
	rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%,
	rgba(255, 255, 0, 0.75) 75%, rgba(255, 255, 0, 0.75));
	background-position: 0 100px;
	background-size: 20px 20px;
	background-repeat: repeat;
	border: solid 1px #cc0000 ;
	-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}
.rd_btn:hover::after{
	border-bottom: 24px solid #cc0000;
	border-left: 24px solid transparent;
	-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}

/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*▼world　CSS▼*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
.world-bg{
	position: relative;
	overflow-y: scroll;
	overflow-x: hidden;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	background:
		linear-gradient(
			-45deg,
		rgba(255, 255, 255, 0.5) 25%,
		rgba(255, 255, 0, 0.5) 25%, rgba(255, 255, 0, 0.5) 50%,
		rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.5) 75%,
		rgba(255, 255, 0, 0.5) 75%, rgba(255, 255, 0, 0.5)),
		url(../sumomo-cafe/img/top/mv_b.jpg);
	background-position: 0 100px,50% 50%;
	background-attachment: scroll ,fixed;
	background-size: 20px 20px, cover;
	background-repeat: repeat,no-repeat;
	z-index: 0;
}
.world-bg img{
	/* width: 100%; */
}

.world_frame-box{
	margin-bottom:30px;
	border: solid 1px #333333;
}


@media(max-width:768px){
	.world-bg{
		/* width: none; */
	}
}


/* 世界観 */
.world_world{
	position: relative;
	width: 100%;
	border: solid 1px #333333;
	/*height: 85vh;*/
	/*max-height: 760px;*/
	background-image:url(../sumomo-cafe/img/world/world_world.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: cover;
}
.world_world img{
	/* width: 100%; */
}
@media(max-width:768px){
	.world_world{
		max-height: 9999px;
		height: 100%;
		background-image:url(../sumomo-cafe/img/world/world_world.jpg);

		background-size: 100% auto;
		background-position: right top;
		background-size: cover;
		background-repeat: no-repeat;

	}
	.world_world img{
		width: 100%;
		height: auto;
	}
}

/* あらすじ */
.world_story{
	/*display:none;*/
	position: relative;
	width: 100%;
	/*height: 85vh;*/
	/*max-height: 760px;*/
	border: solid 1px #333333;
	background-image:url(../sumomo-cafe/img/world/world_story.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: cover;
}
.world_story img{
	/* width: 100%; */
}
@media(max-width:768px){
	.world_story{
		display: block;
		max-height: 9999px;
		height: 100%;
		background-image:url(../sumomo-cafe/img/world/world_story.jpg);

		background-size: 100% auto;
		background-position: right top;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.world_story img{
		width: 100%;
		height: auto;
	}
}

/* 企画意図 */
.world_concept{
	/*display:none;*/
	position: relative;
	width: 100%;
	/*height: 85vh;*/
	/*max-height: 760px;*/
	border: solid 1px #333333;
	background-image:url(../sumomo-cafe/img/world/world_concept.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: cover;
}
.world_concept img{
	max-width: 100%;
}
@media(max-width:768px){
	.world_concept{
		display: block;
		max-height: 9999px;
		height: 100%;
		background-image:url(../sumomo-cafe/img/world/world_concept.jpg);

		background-size: 100% auto;
		background-position: right top;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.world_concept img{
		max-width: 100%;
		height: auto;
	}
}
/* 用語 */
.world_keyword{
	/*display:none;*/
	position: relative;
	width: 100%;
	/*height: 85vh;*/
	/*max-height: 760px;*/
	border: solid 1px #333333;
	background-image:url(../sumomo-cafe/img/world/world_keyword.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: cover;

}
.world_keyword img{
	max-width: 100%;
}
@media(max-width:768px){
	.world_keyword{
		display: block;
		max-height: 9999px;
		height: 100%;
		background-image:url(../sumomo-cafe/img/world/world_keyword.jpg);

		background-size: 100% auto;
		background-position: right top;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.world_keyword img{
		width: 100%;
		height: auto;
	}
}

.world_keyword-box{
	position: relative;
	display: inline-block;
	width: 45%;
	margin: 2px 20px;
	vertical-align: top;
}
@media(max-width:768px){
	.world_keyword-box{
		width: 100%;
		/*margin: 0px 5px 0px 5px ;*/
		left: 0;
		right: 0;
		margin: auto;
	}
}

.keyword-bold{
	font-weight: bold;
	margin: 2px;
	vertical-align: top;
	border-bottom: dotted 1px #ffffff;
	margin-left: -8px;
	margin-bottom: 5px;
}

/* テキストボックス */
.world_textbox{
	position: relative;
	overflow-y: hidden;
	width: 100%;
	/* height: 100%; */
	/*max-height: 85vh;*/
	/*top: 50%;*/
	/*bottom: 0;*/
	/*left: 0;*/
	/*-webkit-transform: translateY(-50%);*/
	/*transform: translateY(-50%);*/
	padding: 20px 40px 20px 40px;
	text-align: left;
	background-color: rgba(0, 0, 0, 0.65);
	background-position: top bottom;
}
@media(max-width:768px){
	.world_textbox{
		position: relative;
		max-height: 9999px;
		top: 0;
		left: 0;
		padding: 20px;
		padding-top: 20px;
		padding-bottom: 60px;
		-webkit-transform: translateY(0%);
		transform: translateY(0%);
	}
}

/* header */
.world-header{
	/*position: absolute;*/
	top: 0;
	right: 0;
	padding: 20px;
	z-index: 1;
}
@media(max-width:768px){
	.world-header{
		left: 0;
		padding: 10px;
		padding-top: 0px;
	}
	.world-header img{
		width: auto;
		height: 60px;
	}
}

/* WORLDスイッチ */
.world-switch{
	position: fixed;
	top: 140px;
	right: 3%;
	/* padding: 10px; */
	z-index: 1;
	width:6%;
}
@media(max-width:768px){
	.world-switch{
		display: none;
	}
}

.world-switch_sp{
	display: none;
}
@media(max-width:768px){
	.world-switch_sp{
		display: inherit;
		position: fixed;
		bottom: 5vw;
		right: 2vw;
		/* padding: 10px; */
		z-index: 1;
		right: 0;
		width: 10vw;
	}
}


/*画像サイズ:1/3*/
.bn_wrd{
	position: relative;
	text-align: center;
	display: inline-block;
	width: 100%;
	/* margin: 5px 3px; */
	border: solid 1px #ffff00;
}
@media(max-width:768px){
	.bn_wrd{
		width: 100%;
	}
}
@media(max-width:1364px) and (min-width: 769px){
	.bn_wrd{
		width: 100%;
	}
}
@media(min-width:1365px){
}
.bn_wrd a{
	display: block;
}

.bn_wrd img{
	width: 100%;
	-webkit-filter: none;
  -moz-filter: none;
  filter: none;
}
.bn_wrd::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 0;
	border-bottom: 24px solid #ffff00;
	border-left: 24px solid transparent;
  }

.bn_wrd:hover, .bn_wrd.active{
	border: solid 1px #cc0000 ;
	-webkit-filter: contrast(75%) brightness(120%);
	-moz-filter: contrast(75%) brightness(120%);
	filter: contrast(75%) brightness(120%);
}
.bn_wrd:hover::after,.bn_wrd.active::after{
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 0;
	border-bottom: 24px solid #cc0000;
	border-left: 24px solid transparent;
	-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}


/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼CHANNEL　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
.video{
	width:100%;
	padding-bottom: 56.25%;
	height:0px;
	position: relative;
	}
	.video iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}





/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼フッター　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */


.rd-info__wide-frame{
	width:1140px;
	margin: 0 auto;
	position: relative;
  }

footer{
	background: #293849;
	text-align: center;
	padding:8px;
  color:#fff;
}

.footer-nav, .footer-nav li,.footer-nav li a{
  color:#fff !important;
  font-weight: bold;
}

.footer-nav{
  margin:0 auto;
  justify-content:center !important;
  -webkit-justify-content:center !important;
}

.footer-nav li{
  /*float:left;*/
}

/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼見出し　CSS▼*/
/*△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽△▽*/
/*▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲▼▲ */

.cf:before,
.cf:after{
  content:"";
  display: table;
}
.cf:after{
  clear:both;
}
/*IE6,7対策 （haslayout対策）*/
.cf{
  *zoom:1;
}

.w-100{
	width: 100%;
}




  #nav-drawer {
	position: relative;
	top: 8px;
	right: 5px;
	margin: 0 auto;
  }

  /*チェックボックス等は非表示に*/
  .nav-unshown {
	display:none;
  }

  /*アイコンのスペース*/
  #nav-open {
	display: inline-block;
	width: 30px;
	height: 22px;
	vertical-align: middle;
  }

  /*ハンバーガーアイコンをCSSだけで表現*/
  #nav-open span, #nav-open span:before, #nav-open span:after {
	position: absolute;
	height: 3px;/*線の太さ*/
	width: 25px;/*長さ*/
	border-radius: 3px;
	background: rgba(255,255,2255,.75);
	display: block;
	content: '';
	cursor: pointer;
	z-index: 9999;
  }
  #nav-open span:before {
	bottom: -8px;
  }
  #nav-open span:after {
	bottom: -16px;
  }

  /*閉じる用の薄黒カバー*/
  #nav-close {
	display: none;/*はじめは隠しておく*/
	position: fixed;
	z-index: 99;
	top: 0;/*全体に広がるように*/
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
  }

  /*中身*/
  #nav-content {
	overflow: auto;
	position: fixed;
	overflow: hidden;
	text-align: left;
	top: 0;
	right: 0;
	z-index: 9998;/*最前面に*/
	width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 300px;/* 最大幅（調整してください） */
	height: 100%;
	background: #333333;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(105%);
	transform: translateX(105%);/*左に隠しておく*/
  }

  /*チェックが入ったらもろもろ表示*/
  #nav-input:checked ~ #nav-close {
	display: block;/*カバーを表示*/
	opacity: .5;
  }

  #nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(0,0,0,.15);
  }