@charset "utf-8";
@media screen and (min-width : 801px) {
#headertop{
	height:18px;
	width:100%;
	background-image:url(../../images/headertop-back.jpg);
	background-repeat:repeat-x;
	background-position:0 0;
	margin:0;
	padding:0;
	position:fixed;
	top:0;
	z-index:1000;
}
h1{
	font-size:11px;
	position:absolute;
/*	right:50%;
	margin:0 -480px 0 0;
	text-align:right; 20180313メニュー変更により削除*/
	left:50%;
	margin:0 0 0 -520px;
	text-align:left;
	font-weight:normal;
	padding:2px 0 0 0;
	color:#fff;
}
*:first-child+html #headertop{
	height:18px;
	width:100%;
	background-image:url(../../images/headertop-back.jpg);
	background-repeat:repeat-x;
	background-position:0 0;
	margin:0 -320px 0 0;
	padding:0;
	position:fixed;
	top:0;
	z-index:1000;
}
*:first-child+html h1{
	font-size:11px;
	position:absolute;
/*	right:50%;
	margin:0 -480px 0 0;
	text-align:right; 20180313メニュー変更により削除*/
	left:50%;
	margin:0 0 0 -520px;
	text-align:left;
	font-weight:normal;
	padding:2px 0 0 0;
	color:#fff;
}
#header {
	width: 100%;
	position: fixed;
	z-index: 999;
	background-image: url(../../images/header_back.png);
	background-repeat: repeat-x;
	top:18px;
}
*:first-child+html #header {
	width: 100%;
	position: fixed;
	z-index: 999;
	background-image: url(../../images/header_back.png);
	background-repeat: repeat-x;
	top:18px;
}

#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:518px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:30px #f15749 solid;
}

ul.selectimage{
	margin:30px 0 20px 0;
	padding:0;
	list-style:none;
	font-size:14px;
	line-height:130%;
}
ul.selectimage li.le{
	float:left;
	width:310px;
	height:384px;
	margin:0 15px 0 0;
	padding:0;
	list-style:none;
}
ul.selectimage li.ri{
	float:right;
	width:310px;
	height:384px;
	margin:0;
	padding:0;
	list-style:none;
}

ul.top-content{
	margin:20px 0 50px;
	padding:0;
	list-style:none;
}
ul.top-content li{
	float:left;
	width:480px;
	height:316px;
	margin-top:60px;
	padding:0;
	list-style:none;
}
h2{
	background-image: url(../../images/tile.gif);
	background-repeat: repeat;
	padding: 12px 10px 7px 10px;
	font-size: 24px;
	font-weight: bold;
	line-height:30px;
	margin:0;
	width:460px;
	text-align:left;
}
h2.mj{
	background:none;
	font-size:22px;
	font-weight:normal;
	color:#000;
	padding-left:18px;
	padding-bottom:10px;
	border-bottom:3px solid #000;
	width:942px;
	text-align:left;
	margin:30px 0 0 0;
}
h3{
	font-size:22px;
	font-weight:normal;
	color:#000;
	padding-left:18px;
	padding-bottom:10px;
	border-bottom:3px solid #000;
	width:942px;
	text-align:left;
	margin:90px 0 0 0;
}
*:first-child+html h3{
	font-size:22px;
	font-weight:normal;
	color:#000;
	padding-top:10px;
	padding-left:18px;
	padding-bottom:10px;
	border-bottom:3px solid #000;
	width:942px;
	text-align:left;
	margin:30px 0 0 0;
}

ul.top-content li p{
	font-size: 14px;
	line-height: 24px;
	text-align:left;
}
ul.top-content li img{
	display:block;
	margin:auto;
	padding:0;
}

.royal{
	width:960px;
	height:auto;
	margin:40px 0 40px 0;
	padding:0;
}
.royaltxt{
	width:960px;
	height:auto;
	margin:0;
	font-size:14px;
	line-height:150%;
}

.futureshop2x{
	width:900px;
	height:150px;
	margin:100px 0 50px 0;
	padding:120px 30px 30px 30px;
	background-image:url(../../images/FutureShop2X_in_top.jpg);
	background-repeat: no-repeat;
	list-style:none;
	font-size:16px;
	line-height:180%;
}
.futureshop2x span.st{
	font-size:20px;
	font-weight:bold;
}

.cpapps{
	width:900px;
	height:150px;
	margin:100px 0 50px 0;
	padding:120px 30px 30px 30px;
	background-image:url(../../images/apps_in_top.jpg);
	background-repeat: no-repeat;
	list-style:none;
	font-size:16px;
	line-height:180%;
}
.cpapps span.st{font-size:20px;font-weight:bold;}
.cpapps a:link{ text-decoration:underline; color:#f15749;}
.cpapps a:visited{ text-decoration:underline; color:#f15749;}
.cpapps a:hover{ text-decoration:none; color:#FF6F6F;}

.new-info{
	margin-bottom:10px;
	padding:0px;
}
.infoinquire{
	overflow:auto;
	height:480px;
	border:none;
	margin-bottom:90px;
	padding:0px;
}

.infomation-box{
	width:960px;
	height:auto;
	margin-top:10px;
	margin-bottom:20px;
	padding:0px;
}

.table-new{
	width:92px;
	margin:auto;
	padding-top:15px;
	text-align:center;
	border-bottom:1px dotted #999;
	vertical-align:top
}
.table-date{
	width:143px;
	padding-top:12px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top
}
.table-date .category01{
    background-color: #f15749;
    color: #ffffff;
    padding: 1px 8px 1px 8px;
}
.table-date .category02{
    background-color: #666666;
    color: #ffffff;
    padding: 1px 8px 1px 8px;
}

.table-sentence{
	width:725px;
	padding-top:12px;
	padding-bottom:8px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top;
	display:block;
}
.table-sentence a:link{ text-decoration:underline; color:#f15749; display:block;}
.table-sentence a:visited{ text-decoration:underline; color:#f15749; display:block;}
.table-sentence a:hover{ text-decoration:none; color:#FF6F6F; display:block;}

.table-sentence2{
	width:725px;
	padding-top:12px;
	padding-bottom:8px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top;
	display:block;
    min-height: 3em;
}
.table-sentence2 a:link{ text-decoration:underline; color:#f15749;}
.table-sentence2 a:visited{ text-decoration:underline; color:#f15749;}
.table-sentence2 a:hover{ text-decoration:none; color:#FF6F6F;}

.shoponly{
	background-image: url(../../images/shoponly.jpg);
	background-repeat:no-repeat;
	padding: 30px 10px 0px 220px;
	font-size: 28px;
	line-height:30px;
	margin:50px 0 40px 0;
	width:710px;
	height:170px;
	text-align:left;
	line-height:160%;
}

.seminar{
	margin:40px 0px 20px 0px;
	text-align:center;
	font-size:16px;
}
.seminar a{ text-decoration:underline; color:#333;}
.seminar a:hover{ text-decoration:none; color:#F63;}

.mjimage{
	margin:20px 0 auto;
}
.mjtxt{
	width:960px;
	height:auto;
	margin:30px 0 70px 0;
	font-size:14px;
	line-height:150%;
}
.mjtxt a:link{ text-decoration:underline; color:#f15749;}
.mjtxt a:visited{ text-decoration:underline; color:#f15749;}
.mjtxt a:hover{ text-decoration:none; color:#FF6F6F;}

.top-info{
	margin:40px auto -30px auto;
	text-align:center;
	display:block;
}
.movietitle{
	width:960px;
	height:auto;
	margin:80px 0 0 0;
	padding-top:10px;
	font-size:14px;
	line-height:180%;
	border-top:double 10px #673602;
}
.top-youtube{
	margin:40px auto 0px auto;
	text-align:center;
	display:block;
}
.top-youtube iframe{
	width:900px;
	height:506px;
}
}
@media screen and (max-width:800px) and (min-width: 0px) {
#headertop{
	height:36px;
	width:100%;
	background-color:#f15749;
	margin:0;
	padding:0;
	text-align:center;
	position:fixed;
	top:32px;
	z-index:1000;
}
h1{
	font-size:11px;
	position:absolute;
	right:auto;
	text-align:center;
	margin:0;
	font-weight:normal;
	padding:2px 0 0 0;
	color:#fff;
}
*:first-child+html #headertop{
	height:36px;
	width:100%;
	background-color:#f15749;
	margin:0 -320px 0 0;
	padding:0;
	text-align:center;
	position:fixed;
	top:33px;
	z-index:1000;
}
*:first-child+html h1{
	font-size:11px;
	position:absolute;
	right:auto;
	margin:0;
	text-align:center;
	font-weight:normal;
	padding:2px 0 0 0;
	color:#fff;
}
#header {
	width: auto;
	position:fixed;
	background-image: none;
	top:0;
}
*:first-child+html #header {
	width: auto;
	position:fixed;
	background-image: none;
	top:0;
}

#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:540px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:30px #f15749 solid;
}

ul.selectimage{
	margin:30px auto 20px auto;
	padding:0;
	list-style:none;
	font-size:14px;
	line-height:130%;
}
ul.selectimage li.le{
	float:left;
	width:310px;
	height:384px;
	margin:0 15px 20px 0;
	padding:0;
	list-style:none;
}
ul.selectimage li.ri{
	float:left;
	width:310px;
	height:384px;
	margin:0 0 20px 0;
	padding:0;
	list-style:none;
}

ul.top-content{
	margin:20px 0 20px;
	padding:0;
	list-style:none;
}
ul.top-content li{
	float:none;
	width:96%;
	height:auto;
	margin-top:0px auto;
	padding:0;
	list-style:none;
}
h2{
	background-image: url(../../images/tile.gif);
	background-repeat: repeat;
	padding: 12px 10px 7px 10px;
	font-size: 20px;
	font-weight: bold;
	line-height:30px;
	margin:40px auto 30px auto;
	width:96%;
	text-align:left;
}
h2.mj{
	background:none;
	font-size:20px;
	font-weight:normal;
	color:#000;
	padding-left:6px;
	padding-bottom:10px;
	border-bottom:3px solid #000;
	width:96%;
	text-align:left;
	margin:10px 0 30px 0;
}
h3{
	width:96%;
	color:#000;
	text-align:center;
	font-size:18px;
	font-weight:400;
	margin:40px auto 30px auto;
	padding-bottom:10px;
	border-bottom:2px solid #000;
	line-height:1.4;
}
*:first-child+html h3{
	font-size:20px;
	font-weight:400;
	color:#000;
	padding-bottom:10px;
	border-bottom:2px solid #000;
	width:96%;
	text-align:center;
	margin:0 auto;
}

ul.top-content li p{
	font-size: 14px;
	line-height: 24px;
	text-align:left;
}
ul.top-content li img{
	display:block;
	margin:auto;
	padding:0;
}

.royal{
	width:100%;
	height:auto;
	margin:0px auto;
	padding:0;
}
.royaltxt{
	width:96%;
	height:auto;
	margin:20px auto 70px auto;
	font-size:14px;
	line-height:180%;
}

.futureshop2x{
	width:100%;
	height:auto;
	margin:30px 0 50px 0;
	padding:0;
	background-image:none;
	font-size:16px;
	line-height:180%;
}
.futureshop2x span.st{
	background-image: url(../../images/tile.gif);
	background-repeat: repeat;
	font-size:20px;
	font-weight:bold;
}

.cpapps{
	width:100%;
	height:auto;
	margin:30px 0 50px 0;
	padding:0;
	background-image:none;
	font-size:16px;
	line-height:180%;
}
.cpapps span.st{
	background-image: url(../../images/tile.gif);
	background-repeat: repeat;
	font-size:20px;
	font-weight:bold;
}
.cpapps a:link{ text-decoration:underline; color:#f15749;}
.cpapps a:visited{ text-decoration:underline; color:#f15749;}
.cpapps a:hover{ text-decoration:none; color:#FF6F6F;}

.new-info{
	margin-bottom:10px;
	padding:0px;
}
.infoinquire{
	overflow:auto;
	width:90%;
	height:640px;
	border:none;
	margin:0 auto 90px auto;
	padding:0px;
}

.infomation-box{
	width:100%;
	height:auto;
	margin:10px auto 20px auto;
	padding:0px;
}

.table-new{display:none;}
.table-date{
	width:25%;
	padding-top:10px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top
}
.table-date .category01{
    background-color: #f15749;
    color: #ffffff;
    padding: 1px 6px 1px 6px;
}
.table-date .category02{
    background-color: #666666;
    color: #ffffff;
    padding: 1px 6px 1px 6px;
}

.table-sentence{
	width:100%;
	padding-top:10px;
	padding-bottom:6px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top;
	display:block;
}
.table-sentence a:link{ text-decoration:underline; color:#f15749; display:block;}
.table-sentence a:visited{ text-decoration:underline; color:#f15749; display:block;}
.table-sentence a:hover{ text-decoration:none; color:#FF6F6F; display:block;}

.table-sentence2{
	width:100%;
	padding-top:10px;
	padding-bottom:6px;
	text-align:left;
	border-bottom:1px dotted #999;
	vertical-align:top;
	display:block;
}
.table-sentence2 a:link{ text-decoration:underline; color:#f15749;}
.table-sentence2 a:visited{ text-decoration:underline; color:#f15749;}
.table-sentence2 a:hover{ text-decoration:none; color:#FF6F6F;}

.shoponly{
	background-image: url(../../images/tile.gif);
	background-repeat: repeat;
	padding: 12px 6px 7px 6px;
	font-size: 20px;
	margin:20px 0 60px 0;
	width:96%;
	height:auto;
	text-align:left;
	line-height:160%;
}

.seminar{
	margin:40px 0px 20px 0px;
	text-align:center;
	font-size:16px;
}
.seminar a{ text-decoration:underline; color:#333;}
.seminar a:hover{ text-decoration:none; color:#F63;}

.mjimage{
	margin:20px 0 20px 0;
}
.mjtxt{
	width:100%;
	height:auto;
	margin:30px 0 0 0;
	font-size:14px;
	line-height:130%;
}
.mjtxt a:link{ text-decoration:underline; color:#f15749;}
.mjtxt a:visited{ text-decoration:underline; color:#f15749;}
.mjtxt a:hover{ text-decoration:none; color:#FF6F6F;}

.top-info{
	margin:40px auto 20px auto;
	text-align:center;
	display:block;
}
.movietitle{
	width:100%;
	height:auto;
	margin:0;
	padding-top:10px;
	font-size:14px;
	line-height:180%;
	border-top:double 10px #673602;
	border-bottom:double 10px #673602;
}
.top-youtube{
	margin:40px auto 60px auto;
	text-align:center;
	display:block;
	position:relative;
    width: 96%;
    padding: calc(506 / 900 * 96%) 0 0;
}
.top-youtube iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

}
@media screen and (max-width:640px) and (min-width: 0px) {
#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:460px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:30px #f15749 solid;
}
ul.selectimage li.le{
	float:none;
	margin:0 auto 20px auto;
}
ul.selectimage li.ri{
	float:none;
	margin:0 auto 20px auto;
}

}
@media screen and (max-width:560px) and (min-width: 0px) {
#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:420px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:30px #f15749 solid;
}
}
@media screen and (max-width:480px) and (min-width: 0px) {
#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:360px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:30px #f15749 solid;
}
}
@media screen and (max-width:440px) and (min-width: 0px) {
#content {
	width: 100%;
	height: auto; /* 値が小さいとスクロール時にトップの画像が隠れ切らない */
	position: relative;
	top:308px; /* ずれるとトップの画像下部に隙間などが発生 */
	background-color: #FFF;
	border-top:15px #f15749 solid;
}
}

.logo_flow_wrap {
    display: flex;
    width: 100%;
    height: 140px;
    overflow: hidden;
    margin: 10px 0 30px;
}
.logo_flow_wrap .logo_flow_image {
	width: auto;
	height: 100%;

	&:first-child {
	    animation: slide1 60s -30s linear infinite;
	}
	&:last-child {
	    animation: slide2 60s linear infinite;
	}
}

@keyframes slide1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes slide2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.logo_wrap,
.logo_wrap02 {
	width: 960px;
	margin: 0 auto;
}

.logo_wrap02 {
	margin: 0 auto 30px;
}
.logo_wrap ul,
.logo_wrap02 ul {
	display: flex;
	flex-wrap: wrap;
}
.logo_wrap ul li {
	margin: 16px 30px;
}
.logo_wrap02 ul li {
	margin: 16px 20px;
}
.logo_wrap02 ul li:nth-child(5n) {
	margin-right: 0;
}
.logo_wrap ul li:first-child,
.logo_wrap ul li:nth-child(5n+1),
.logo_wrap02 ul li:first-child,
.logo_wrap02 ul li:nth-child(5n+1)
 {
	margin-left: 0;
}
.logo_wrap ul li:nth-child(5n){
	margin-right: 0;
}
.logo_wrap .logo_image,
.logo_wrap img {
	width: 130px;
	height: auto;
}
.logo_wrap02 .logo_image,
.logo_wrap02 img {
	height: 76px;
	width: auto;
}
.logo_wrap02 .logo_image_h86 {
	height: 86px;
	width: auto;
}

@media screen and (max-width: 800px) and (min-width: 0px) {
	.logo_flow_wrap {
		height:  90px;
	}
	.logo_flow_wrap .logo_flow_image {
		max-width: initial;
	}
	.logo_wrap,
	.logo_wrap02 {
		width: 100%;
		margin: 0;
	}
	.logo_wrap02 {
		margin: 0 0 2% 0;
	}
	.logo_wrap ul,
	.logo_wrap02 ul {
		padding: 0 10%;
	}
	.logo_wrap ul li,
	.logo_wrap ul li:first-child,
	.logo_wrap ul li:nth-child(5n),
	.logo_wrap ul li:nth-child(5n+1),
	.logo_wrap02 ul li,
	.logo_wrap02 ul li:first-child,
	.logo_wrap02 ul li:nth-child(5n),
	.logo_wrap02 ul li:nth-child(5n+1) {
		width: 46%;
		margin: 0;
		text-align: center;
	}
	.logo_wrap02 ul li,
	.logo_wrap02 ul li:first-child,
	.logo_wrap02 ul li:nth-child(5n),
	.logo_wrap02 ul li:nth-child(5n+1) {
		margin-top: 2%;
	}
	.logo_wrap02 ul li:first-child,
	.logo_wrap02 ul li:nth-child(2) {
		margin-top: 0;
	}
	.logo_wrap ul li:nth-child(2n),
	.logo_wrap02 ul li:nth-child(2n) {
		margin-left: 8%;
	}
	.logo_wrap .logo_image,
	.logo_wrap img,
	.logo_wrap02 .logo_image,
	.logo_wrap02 img {
		width: 75%;
		height: auto;
	}
}