@charset "utf-8";
body{background:#ccc;font-size:1em;color:#333;text-align:left;line-height:1.0;margin:0;padding:0;}
body article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;margin:0;padding:0;}

.tf-wrapper{
	max-width:1280px;
	margin:0 auto;
	font-family:"source-han-sans-japanese", sans-serif;
	font-weight:300;
	font-style:normal;
	position:relative;
	text-align:left;
	font-size:1.2em;

	:focus{outline:0;}
	p{margin:0;padding:0;}
	ol,ul{list-style:none;margin:0;padding:0;}
	table{border-collapse:separate;border-spacing:0;}
	caption,th,td{font-weight:normal;text-align:left;}
	blockquote:before,blockquote:after,q:before,q:after{content:"";}
	blockquote,q{quotes:"" "";}
	h1,h2,h3,h4,h5,h6{clear:both;font-weight:normal;margin:0;padding:0;}
	hr{border:0;background-color:#ccc;margin:0;padding:0.5px;}
	a,a:focus,a:active,a:hover,form button,form button:focus,form button:active,form button:hover{display:block;box-sizing:border-box;width:100%;height:100%;text-decoration:none;cursor:pointer;}
	.clearfix::after{content:"";display:block;clear:both;}
	img{width:100%;vertical-align:bottom;border:0;}
	@media screen and (min-width:760px) { /* PC === */
  	.pc{display:block !important;}
  	.sp{display:none !important;}
	}
	@media screen and (max-width:759.98px) { /* SP  === */
  	.pc{display:none !important;}
  	.sp{display:block !important;}
  	br.pc{display:none !important;}
	}
	ul.asterisk li {font-size:100%;list-style-type:none;text-indent:-1em;margin-left:15px;}
	ul.asterisk li:before {display:inline;content:"※";}
}

/* TF HEADER NAVI ==================== */
.tf-wrapper nav{
	background-color:#F2F2F2;
	position:relative;
	z-index: 100;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-wrapper nav{
		height:80px !important;
		margin:300px auto 0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  ===  PARALLAX  ==================================== */
	.tf-wrapper nav{
		height:50px !important;
		margin:0 auto 0;
	}
}
.tf-wrapper nav h1{
	background-color:#000;
	background: linear-gradient(115deg, #000 0%, #000 88%, #F2F2F2 12%, #F2F2F2 100%);
  display:flex;
  align-items: center;
  float:left;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-wrapper nav h1{
		width:290px;
		height:100%;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-wrapper nav h1{
		min-width:180px;
		height:50px;
	}
}
.tf-wrapper nav h1 a,
.tf-wrapper nav h1 a:hover{
	display:flex;
	flex-direction:column;
  justify-content:center;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-wrapper nav h1 img{
		max-width:75%;
		margin-left:25px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-wrapper nav h1 img{
		width:130px;
		margin-left:15px;
	}
}
/* MENU ==================== */
@media screen and ( min-width:760px ) { /* PC === */
	.nav-wrapper{
		width:100%;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.nav-wrapper{
		top: 0;
		left: 0;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav{
		height:100%;
		float:right;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.header-nav{
		width: 80%;
		height: 100vh;
		right:0;
		background-color:#000;
		position: fixed;
		display: none;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav .nav-list{
		margin-top: 20px;
  }
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.header-nav .nav-list{
		margin:30px 0 0 30px;
  }
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav .nav-list li{
		height:40px;
		min-height:100%;
		display:flex;
		flex-direction:column;
  	justify-content:center;
		float:left;
		margin-right:60px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
  .header-nav .nav-list li{
    padding:10px 0;
   }
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav .nav-list li a,
	.header-nav .nav-list li a:hover{
		height:40px;
		min-height:100%;
		display:flex;
		flex-direction:column;
	  justify-content:center;
		color: #000;
	}
	.header-nav .nav-list li a:hover{
		color: #000;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.header-nav .nav-list li a{
		text-decoration: none;
		padding:5px 10px 10px 10px;
		color: #fff;
	}
	.header-nav .nav-list li a:hover{
		color: #fff;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav .nav-icon-products{
		background-image:url('../img/nav-icon-products.png');
		background-size:25px;
		background-position:0 center;
		background-repeat:no-repeat;
		text-indent:30px;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.header-nav .nav-list li.nav-icon-x{
		width:40px;
		margin-right:20px;
		background-color: #000;
		clip-path: circle(40%);
	}
	.header-nav .nav-list li.nav-icon-x img{
		width:40%;
		margin:0 auto;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.header-nav .nav-list li.nav-icon-x img{
		display: none !important;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-insignia-sp{
		display: none;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-insignia-sp{
		width:150px;
		margin-left:40px;
		position: absolute;
		bottom:100px;
	}
	.tf-insignia-sp div{
		width:150px;
		margin:0 auto;
	}
	.tf-insignia-sp img{
		margin-top:20px;
	}
}

/* HAMBURGER MENU ==================== */
@media screen and ( max-width:759.98px ) { /* SP  === */
	.burger-btn{
		display: block;
		width:50px;
		height:50px;
		float: right;
		position: relative;
		z-index: 3;
		/* codepenの挙動のため */
		background-color:transparent;
		border:none;
		cursor: pointer;
		background-color: #000;
	}
	.bar{
		width: 30px;
		height: 2px;
		display: block;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		background-color: #fff;
	}
	.bar_top{
		top: 20px;
	}
	.bar_bottom{
		bottom: 20px;
	}
	.burger-btn.close{
		background-color: #F2F2F2;
	}
	.burger-btn.close .bar_top,
	.burger-btn.close .bar_bottom{
		transition: transform .3s;
		background-color: #000;
	}
	.burger-btn.close .bar_top{
		transform: translate(-50%,5px) rotate(20deg);
	}
	.burger-btn.close .bar_bottom{
		transform: translate(-50%,-3px) rotate(-20deg);
	}
}

/* PARALLAX ==================== */
.tf-wrapper nav,
#front-banner-slider a{
  inline-size: 100%;
	block-size: calc(100% + var(--_translate));
	object-fit: cover;
	animation: parallax linear both;
  animation-timeline: scroll(root);
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-wrapper nav,
	#front-banner-slider a{
		--_translate: 300px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  ===  PARALLAX  ==================================== */
	.tf-wrapper nav,
	#front-banner-slider a{
		--_translate: 0;
	}
}
#front-banner-thumbs{
	position:absolute;
	top:55.8%;
	display:flex;
	flex-direction:column;
  justify-content:center;
  cursor: pointer;
}
.content{
}
@keyframes parallax {
  from {
    translate: 0 calc(var(--_translate) * -1) 0;
  }
  to {
    translate: 0 var(--_translate) 0;
  }
}

/* FRONT BANNER ==================== */
.front-banner{
	position:absolute;
}
@media screen and ( min-width:760px ) { /* PC === */
	.front-banner{
		width:1280px;
		height:480px;
		top:-300px;
		left:50%;
		transform: translate(-50%);
		-webkit-transform: translate(-50%);
		-ms-transform: translate(-50%);
	}
}
@media screen and ( max-width:759.98px ) { /* SP  ===  PARALLAX  ==================================== */
	.front-banner{
		width:100%;
		height:auto;
		top:0;
	}
}
#front-banner-slider{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	position:absolute;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-slider{
		top:80px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-slider{
		top:50px;
	}
}
#front-banner-slider a{
	display:block;
	max-width:100%;
	max-height:100%;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-slider a{
		margin-top:300px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  ===  PARALLAX  ====================================*/
	#front-banner-slider a{
		margin-top:0;
	}
}
#front-banner-thumbs{
	position:absolute;
	width:100%;
	background-color:#000;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-thumbs{
		top:560px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-thumbs{
		top:440px;
	}
}
#front-banner-thumbs .banner-thumbs{
	font-size: 0.9em;
	line-height:1.2;
	position:relative;
	border-right:1px solid #4d4d4d;
}
#front-banner-thumbs .banner-thumbs:last-child{
	border: none;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-thumbs .banner-thumbs{
		padding:10px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-thumbs .banner-thumbs{
		padding:5px;
	}
}

#front-banner-thumbs img{
	float:left;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-thumbs img{
		width:50px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-thumbs img{
		width:48px;
	}
}
#front-banner-thumbs span{
	position:absolute;
	top:50%;
	transform: translate(0,-50%);
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-thumbs span{
		left:70px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-thumbs span{
		left:60px;
		font-size: 0.7em;
	}
}
#front-banner-thumbs .slick-slide span{
	color:#fff !important;
}
#front-banner-thumbs .slick-slide span:hover,
#front-banner-thumbs .slick-current span{
	color:#C71528 !important;
}
@media screen and ( min-width:760px ) { /* PC === */
	#front-banner-thumbs .slick-slide span{
		display:block;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	#front-banner-thumbs .slick-slide{
		width:15% !important;
		transform: transform all 0.3s ease;
	}
	#front-banner-thumbs .slick-current{
		width:40% !important;
		transform: transform all 0.3s ease;
	}
	#front-banner-thumbs .slick-slide span{
		display:none;
	}
	#front-banner-thumbs .slick-current span,
	#front-banner-thumbs .slick-current span:hover{
		display:block;
		width:60%;
	}
}
#front-banner-thumbs .slick-track {
	transform:unset!important;
}
.slider-dots {
  width: 100%;
  height:0;
  position:absolute;
  z-index: 10;
  margin: 0;
  padding: 0;
  text-align: center;
  list-style: none;
  li {
    display: inline-block;
    margin: 0;
  }
  button {
    position:relative;
    width: 100%;
    height: 3px;
    background-color:#000;
    border:0;
    overflow:hidden;
    padding:0;
    margin:0;
    &:after {
      position:absolute;
      top: 0;
      left: 0;
      content: "";
      display: block;
      height: 3px;
    }
  }
}
@media screen and ( min-width:760px ) { /* PC === */
	.slider-dots li{
		width: calc( 20% - 0px ); /* プログレスバーの横幅はスライドの枚数に合わせて調整 */
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.slider-dots li{
		width: 15%;
	}
	.slider-dots li.slick-active{
		width: 40%;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.slider-dots {
		top:535px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.slider-dots {
		top:443px;
	}
}
.slider-dots {
  .slick-active {
    button:after {
      background-color: #C71528;
      animation: progress 5.5s linear forwards;
    }
  }
}
@keyframes progress {
  from {
    width: 0%;
  }
  to {
    width: 100%;
  }
}
.prev-arrow,
.next-arrow {
	text-align:center;
	display:flex;
	flex-direction:column;
  justify-content:center;
  position:absolute;
  z-index:10;
  margin:0;
  padding:0;
  line-height:1;
  cursor: pointer;
}
@media screen and ( min-width:760px ) { /* PC === */
	.prev-arrow,
	.next-arrow {
		width:40px;
		height:160px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.prev-arrow,
	.next-arrow {
		width:25px;
		height:120px;
	}
}
.prev-arrow {
  left:0;
}
.next-arrow {
  right:0;
}
.front-banner .prev-arrow,
.front-banner .next-arrow{
	background-color:rgb(255, 255, 255, 0.5);
	color:#C71528 !important;
}
@media screen and ( min-width:760px ) { /* PC === */
	.front-banner .prev-arrow,
	.front-banner .next-arrow{
		top:50%;
  	-webkit-transform:translateY(-50%);
  	transform:translateY(-50%);
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.front-banner .prev-arrow,
	.front-banner .next-arrow{
		font-size: 0.7em;
		top:0;
  	-webkit-transform:translateY(100%);
  	transform:translateY(100%);
	}
}

/* CONTENT ==================== */
.tf-content{
	background-color: #F2F2F2;
}
@media screen and (min-width: 760px) { /* PC === */
	.tf-content{
		max-width:1280px;
		margin-top:249px;

	}
}
@media screen and (max-width: 759.98px) { /* SP  === */
	.tf-content{
		width:100%;
		margin-top:450px;
	}
}
.tf-content section{
	margin:0 auto;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-content section{
		max-width:1050px;
		padding:100px 0 0 0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-content section{
		max-width:100%;
		padding:50px 20px 0 20px;
	}
}
.tf-content h2{
	height:30px;
	background-image:url('../img/nav-icon-products.png');
	background-size:30px;
	background-position:0 center;
	background-repeat: no-repeat;
	text-indent:35px;
	font-weight:normal !important;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-content h2{
		font-size:1em !important;
		line-height:1.5;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-content h2{
		font-size:0.8em !important;
		line-height:2.0;
	}
}
.tf-content h2 span{
	font-family:"din-2014", sans-serif !important;
	font-weight:700 !important;
	font-style:italic !important;
	font-size:1.3em !important;
	padding-right:20px;
}

/* NEW ITEM ==================== */
.new-item-title{
	position:relative;
}
@media screen and ( min-width:760px ) { /* PC === */
	.new-item-title div{
		position:absolute;
		right:0;
		bottom:0;
		height:30px;
		display:flex;
		flex-direction:column;
  	justify-content:center;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.new-item-title div{
		margin-top:20px;
	}
}
.new-item-list{
	margin-top:20px;
	display: flex;
	flex-wrap: wrap; /* 折り返しを許可 */
  gap: 20px; /* 間隔 */
  box-sizing: border-box;
}
@media screen and ( min-width:760px ) { /* PC === */
 	.item-thum{
 		flex: 0 0 calc(25% - 15px); /* 4つずつ横並び（余白分を引く） */
  }
}
@media screen and ( max-width:759.98px ) { /* SP  === */
 	.item-thum{
 		flex: 0 0 calc(50% - 10px); /* 2つずつ横並び（余白分を引く） */
  }
}
.item-thum p.series-name{
	font-family:"din-2014", sans-serif !important;
	font-weight:700 !important;
	font-style:italic !important;
}
@media screen and ( min-width:760px ) { /* PC === */
	.item-thum p.series-name{
		margin:10px 0;
		/* 5列 font-size:0.9em; */
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.item-thum p.series-name{
		margin:10px 0 5px 0;
		font-size:0.7em;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.item-thum p{
		line-height:1.2 !important;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.item-thum p{
		font-size:0.7em;
	}
}
.item-thum p a{
	color:#C71528;
}
.basic-button {
  margin:60px auto 0;
  text-align:center;
}
@media screen and ( min-width:760px ) { /* PC === */
	.basic-button {
		width:370px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.basic-button {
		width:300px;
	}
}
.basic-button a,
.basic-button a:hover,
.basic-button a:active {
	padding:10px 0;
  color:#fff;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  clip-path: polygon(5% 0%, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
  background: linear-gradient(135deg, #C71528 0%, #C71528 50%, #683D8A 50%, #683D8A 100%);
}

/* SEARCH FORM ==================== */
.search-form div{
	margin:-40px auto 0;
	padding:0;
}
@media screen and ( min-width:760px ) { /* PC === */
	.search-form div{
		max-width:720px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.search-form div{
		max-width:100%;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.search-form dt{
		width:160px;
		height:40px;
		float:left;
		clear:both;
		margin:10px 10px 0 0;
		display:flex;
		flex-direction:column;
  	justify-content:center;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.search-form dt{
		width:160px;
		margin:20px 0 10px 0;
	}
}
.search-form dd{
	padding:0;
}
@media screen and ( min-width:760px ) { /* PC === */
	.search-form dd{
		width:550px;
		margin:10px 0;
		float:left;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.search-form dd{
		width:100%;
		margin:0;
	}
}
.tf-content input{
	width:100%;
	height:40px;
	box-sizing:border-box;
	font-size:1em;
	text-align:center;
	color:#333;
	border:2px solid #999;
}
.common-keywords li{
	float:left;
	margin:0 10px 10px 0;
	
}
.common-keywords li a{
	color:#666;
	border:2px solid #999;
	background-color:#E5E5E5;
	border-radius: 10px;
	padding:10px 20px;
	display:flex;
	flex-direction:column;
  justify-content:center;
}
.tf-content select{
	width:100%;
	height:40px;
	box-sizing:border-box;
	font-size:1em;
	text-align:center;
	color:#333;
	border:2px solid #999;
}
select.pro_release_year,
select.pro_release_month{
	float:left;
}
@media screen and ( min-width:760px ) { /* PC === */
	select.pro_release_year,
	select.pro_release_month{
		width:270px;
	}
	select.pro_release_year{
		margin-right:10px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	select.pro_release_year,
	select.pro_release_month{
		width:100%;
		float:left;
  	width:calc(50% - 5px);
	}
	select.pro_release_year:nth-child(n+1),
	select.pro_release_month:nth-child(n+1){
  	margin-right:5;
 	}
 	select.pro_release_year:nth-child(2n),
	select.pro_release_month:nth-child(2n){
  	float:right;
  	margin-right:0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-content form button{
		margin-top:30px !important;
	}
}
.tf-content form button,form button:focus,form button:active,form button:hover{
	width:100%;
	margin-top:20px;
	padding:10px 0;
	background-color:#000;
	box-sizing:border-box;
	font-size:1em;
	text-align:center;
	color:#fff;
	border:0;
	cursor:pointer;
}

/* SERIES BUTTON ==================== */
.series-button{
	background-color:#000;
	text-align: center;
}
@media screen and ( min-width:760px ) { /* PC === */
	.series-button{
		padding:60px 100px;
		margin-top:100px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.series-button{
		padding:30px 10px;
		margin-top:70px;
	}
}
.series-button span{
	display: inline-block;
}
@media screen and ( min-width:760px ) { /* PC === */
	.series-button span{
		margin:0 20px;
		height:120px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.series-button span{
		margin:0 10px;
		height:50px;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.series-button span img{
		width:100%;
		height:100%;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.series-button span img{
		width:auto;
		height:100%;
	}
}

/* MOVIES ==================== */
@media screen and ( min-width:760px ) { /* PC === */
	.movie{
		padding-top:100px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie{
		padding-top:50px;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.movie h2{
		width:1050px;
		margin:0 auto;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie h2{
		width:92%;
		margin:0 auto;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.movie-slider{
		margin-top:40px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie-slider{
		margin-top:20px;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.movie-slider .movie-data{
		margin:0 30px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie-slider .movie-data{
		margin:0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie-slider .movie-data div{
		width:100%;
	}
}
.movie-slider .movie-data iframe{
	aspect-ratio: 16 / 9;
}
.movie-slider .movie-data p{
	margin-top:10px;
}
@media screen and ( min-width:760px ) { /* PC === */
	.movie-slider .movie-data iframe{
		width:100%;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie-slider .movie-data iframe,
	.movie-slider .movie-data p{
		width:90%;
		margin-left:-7%;
	}
}
.movie-slider .movie-data p{
	margin-top:10px;
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie-slider .movie-data p{
		font-size:0.7em;
		word-break:normal;
	}
}
.movie .prev-arrow,
.movie .next-arrow{
	background-color:#683D8A;
	color:#fff;
}
@media screen and ( min-width:760px ) { /* PC === */
	.movie .prev-arrow,
	.movie .next-arrow{
		top:36%;
  	-webkit-transform:translateY(-35.99%);
  	transform:translateY(-35.99%);
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.movie .prev-arrow,
	.movie .next-arrow{
		font-size: 0.7em;
		top:26%;
  	-webkit-transform:translateY(-30%);
  	transform:translateY(-30%);
	}
}

/* RECENT NEWS ==================== */
.recent-news dt{
	font-family:"din-2014", sans-serif !important;
	font-weight:700 !important;
	font-style:italic !important;
	line-height: 1.5;
	color:#C71528;
	min-height:100%;
}
@media screen and ( min-width:760px ) { /* PC === */
	.recent-news dt{
		width:280px;
		float:left;
		margin:15px 0;
		padding:0 20px 0 0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.recent-news dt{
		width:100%;
		margin:15px 0 5px 0;
		position:relative;
	}
}
.recent-news dt span{
	display: block;
	width:140px;
	font-family:"source-han-sans-japanese", sans-serif;
	font-weight:300;
	font-style:normal;
	font-size:0.8em;
	color:#333;
	background-color: #E5E5E5;
	text-align:center;
	padding:2px 0;
}
@media screen and ( min-width:760px ) { /* PC === */
	.recent-news dt span{
		float:right;
		margin-left:20px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.recent-news dt span{
		position:absolute;
		top:0;
		left:120px;
	}
}
.recent-news dd{
	line-height: 1.5;
}
@media screen and ( min-width:760px ) { /* PC === */
	.recent-news dd{
		width:760px;
		float:right;
		margin:15px 0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.recent-news dd{
		width:100%;
		margin:0 0 10px 0;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.recent-news dd span{
		display:block;
		width:20px;
		height:20px;
		float:right;
		padding:2px 0;
		margin-left:30px;
		background-color: #683D8A;
		clip-path: circle(40%);
		font-size:0.5em;
		text-align:center;
		color:#fff;
		display:flex;
		flex-direction:column;
  	justify-content:center;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.recent-news dd span{
		display:none;
	}
}
.recent-news dd a,
.recent-news dd a:hover{
	color:#333;
}
.recent-news hr{
	width:100%;
}

/* TF FOOTER ==================== */
.tf-footer{
	margin:0 auto;
	padding:100px 20px;
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-footer{
		max-width:1050px;
		position:relative;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-footer{
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-copyright{
		width:50%;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-copyright{
		width:10
		0%;
		margin:40px auto 0;
	}
}
.tf-copyright small{
	display:block;
	width:100%;
	font-size:0.7em;
	margin-bottom:5px;
}
.tf-copyright{
	margin-bottom:20px !important;
}
.tf-copyright small span{
	font-size:1.8em;
	vertical-align:-7px;
	line-height:0.3;
}
@media screen and ( min-width:760px ) { /* PC === */
	.footer-right{
		width:50%;
		height:100%;
		float:left;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.footer-right{
		width:100%;
		margin-top:20px;
	}
}
.footer-right a,
.footer-right a:hover{
	color:#333;
}
.btn-takaratomymall{
	text-align:center;
	background-color: #fff;
	border-radius:40px;
}
@media screen and ( min-width:760px ) { /* PC === */
	.btn-takaratomymall{
		width:500px;
		height:80px;
		position:absolute;
		right:0;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.btn-takaratomymall{
		width:100%;
		height:80px;
		margin: 0 auto;
	}
}
.btn-takaratomymall p{
	float:left;
	border-right:1px solid #333;
	padding:0 15px 0 40px;
	min-height: 100%;
	display:flex;
	flex-direction:column;
  justify-content:center;
}
.btn-takaratomymall span{
	min-height: 100%;
	display:flex;
	flex-direction:column;
  justify-content:center;
}
.btn-takaratomymall img{
	padding:0 40px 0 15px;
	float:left;
}
@media screen and ( min-width:760px ) { /* PC === */
	.btn-takaratomymall img{
		width:300px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.btn-takaratomymall img{
		width:220px;
	}
}
@media screen and ( min-width:760px ) { /* PC === */
	.tf-insignia{
		width:140px;
		position:absolute;
		right:20px;
		bottom:100px;
	}
}
@media screen and ( max-width:759.98px ) { /* SP  === */
	.tf-insignia{
		width:140px;
		margin:60px auto 0;
	}
}