@charset "UTF-8";

/*	Common  */

header h2{
	margin-top: 0%;
}

.search{
	width: 190PX;
	height: 46PX;
	text-align: center;
	border: solid 1px red;
	box-sizing: border-box;
}

.watch {
	width: 100%;
	height: auto;
   	padding-bottom: 6%;
	overflow: hidden;
	background-image: url(../images/generation/watch.png);
	background-size: 100%;
}

.watch .main{
	width: 100%;
	float: left;
}

.box {
	float: left;
	text-align: center;
	margin: 3% 2%;
	padding-bottom: 4%;
	width: 96%;
	background-color: rgba(51, 153, 255, 0.59);
	border-radius: 20px;
}

.watch .box h3{
	margin: 2% 20% 0%;
	text-align: center;
	font-size: 1.5em;
	border-radius: 20px;
	width: 60%;
	padding: 5px 0 1px;
}
/*↑paddingをプラス*/

.page-description{
	text-align: center;
    background-color: #fff;
    width: 40%;
    margin: 2% auto 0%;
    border-radius: 10px;
}

.content {
	width: 94%;
	margin: 2% 3% 0% 3%;
	float: left;
	background-color: rgba(255, 255, 255, 0.92);
	border-radius: 20px;
	color: #000000;
	z-index: 2;
}
.content .content_info ul {
    /* margin-left: -4%; */
    list-style: none;
}

.content p {
	height: auto;
	text-align: left;
}

.content .amazon-info{
	margin: 0 0 10px 0;
}

.content .links{
	padding: 0;
	margin: 0;
}

.content .links li{
	list-style: none;
}

.content .links img{
	margin: 0;
	width: auto !important;
}

article h2{
	width: 100%;
	background: #3399ff;
	margin: 0;
	border-top: solid 5PX blue;
	border-bottom: solid 5PX blue;
}


/*text2016
------------------------------------------------*/

	

p.intro {
	font-weight: bold;
	font-size: 1.1em;
	color: red;
	z-index: 10000;
}

.generation {
	width: 27vw;
	height:auto;
	margin: 200px -4px 0px 163px;
}
	
.generation2 {
	width: 9vw;
	height: auto;
	margin: 300px 0px 37px 965px;
	position: fixed;
	top: 0;
	left:0;
}

div.menu {
	margin-left: 0px;
	margin-bottom: 1em;
}

.fixed {
	position: fixed;
	top: 10px;
	width: 230px;
	z-index: 10000;
}



.text-main {
	float: left;
	width: 100%;
	margin-bottom: 2%;
	background: linear-gradient(0deg, rgba(255, 102, 0, 0.37), rgba(247, 214, 9, 0.37), rgba(12, 203, 231, 0.5)), url(images/bg-cherrybrossam.jpg);
	background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImcyNCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0EzRjdGQiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0Y5RkJBMyIgb2Zmc2V0PSIwLjUiLz48c3RvcCBzdG9wLWNvbG9yPSIjRkJDQkEzIiBvZmZzZXQ9IjEiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnMjQpIiAvPgo8L3N2Zz4=);
	background-size: cover;
}

.main-left {
	float: left;
	width: 100%;
	height: auto;
}

.article-back {
	background-color:rgba(255,255,255,0.2);

}


/*---------出来事---------*/
.watch .box .event {
	background-color: #fd9751;
}
h3 .event{
	display: table-cell;
  vertical-align: bottom;
}
/*---------流行語---------*/
.watch .box .trend-word {
	background-color: #e6cd0e;
}

/*---------おもちゃ---------*/
.watch .box .toy {
	background-color: #52fb59;
}

/*---------映像作品---------*/
.watch .box .moves {
	background-color: #e02bd1;
}

/*---------書籍---------*/
.watch .box .books {
	background-color: #78e67f;
}

/*---------ヒット曲---------*/
.watch .box .hit-music {
	background-color: #fd86af;
}

/*---------おすすめ---------*/
.watch .box .recommend{
	background-color: #fef166;
}

.watch h3{
	text-align: center;
	width: 80%;
	margin: 2% auto 0;
	font-size: 2em;
	background-color: #ffffff;
	border-radius: 10px;
	padding: 4px 10px 0;
}
/*↑paddingをプラス*/

.demo1 {
	border: solid 4PX #f75353;
}

.demo2 {
	border: solid 4PX #fd6504;
}

.demo3 {
	border: solid 4PX #ffd200;
}

.demo4 {
	border: solid 4PX #95fd51;
}

.demo5 {
	border: solid 4PX rgb(1, 233, 123);
}

.demo6 {
	border: solid 4PX #2196F3;
}

.demo7 {
	border: solid 4PX #9b21fb;
}

.demo8 {
	border: solid 4PX #f7427e;
}


.section th, section td{ 
	padding: 10px; 
	border: 1px 
	solid #ddd; 
}
.section th{
	border: 1px solid #336699; 
}



#container-generation {
	margin: 0 auto;  
	width: 980px;
	height:auto;
  	background: linear-gradient(0deg, #f60, #3399ff),
  	url(images/bg-cherrybrossam.jpg);
  	background-size: cover;
	overflow: hidden;
	padding: 0 0 50PX;
	
}

.tamago {
	margin: -3vw 0vw -7vw -7vw;
	overflow: auto;
}



.linear {
	width: 10em;
	margin: -3vw 0vw -12vw -11vw;
	overflow: auto;
}

.home-description{
	background-color: #fffeef;
	overflow: hidden;
	border: solid 1pX #336699;
}

.home-aisatu{
	display: block;
	text-align: left;
	padding: 0 2%;
}

.character-message{
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
	padding: 0 20px;
}
.jenetaro-box{
	align-items: center;
	display: flex;
	justify-content: flex-start;
}

.jenetaro-box .hukidasi-p{
	position: relative;
	padding: 20px;
	width: 40%;
	min-width: 115px;
	height: auto;
	line-height: 1.5;
	color: #19283C;
	text-align: left;
	background: #F6F6F6;
	border: 3px solid #19283C;
	border-radius: 15px;
	margin-left: 20px;
	z-index: 0;
}
.jenetaro-box .hukidasi-p:before {
	content: "";
	position: absolute;
	top: 50%; left: -8px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 9px 9px 0;
	border-color: transparent #F6F6F6 transparent transparent;
	z-index: 0;
}
.jenetaro-box .hukidasi-p:after {
	content: "";
	position: absolute;
	top: 50%; left: -12px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent #19283C transparent transparent;
	z-index: -1;
}


/* right */
.sirokuma-box{
	align-items: center;
	display: flex;
	justify-content: flex-end;
	width: 100%;
}
.sirokuma-box .hukidasi-p{
	position: relative;
	padding: 20px;
	width: 40%;
	min-width: 115px;
	height: auto;
	line-height: 1.3;
	color: #19283C;
	text-align: left;
	background: #F5A9F2;
	border: 3px solid #19283C;
	border-radius: 15px;
	margin-right: 20px;
	z-index: 0;
}
.sirokuma-box .hukidasi-p:before {
	content: "";
	position: absolute;
	top: 50%; right: -8px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 0 9px 9px;
	border-color: transparent transparent transparent #F5A9F2;
	z-index: 0;
}
.sirokuma-box .hukidasi-p:after {
	content: "";
	position: absolute;
	top: 50%; right: -12px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #19283C;
	z-index: -1;
}

.button {
	text-align: center;
	font-size: 1.5em;
	background-color: rgba(255, 255, 255, 0.97);
	border: 2px solid #61a3e3;
	width: 40%;
	margin: 0% 30% 2%;
	float: left;
	border-radius: 20px;
}

.button a {
	display: block;
	width: 100%;
	color: black;
	text-decoration: none;
	font-weight: bold;
	border-radius: 20px;
	padding: 1% 0%;
}

.button a:hover {
	background-color: #e2fbff;
}

.pager {
	display: flex;
	height: 100%;
	justify-content: space-between;
	max-width: 940px;
	margin: 20px auto 0;
	padding: 0 20px;
}

.pager a:hover {
	background-color:#04e3ff;
	border-radius: 20px;
}



.pager .back {
	width: auto;
	float: right;
	padding: 1% 2%;
	background-color: #C1B970;
	display: block;
	border-radius: 20px;
	text-decoration: none;
	font-size: 1.5em;
	text-align: center;
	color: black;
	font-weight: 600;
}

.pager .back:hover {
	background-color:rgb(163, 200, 134);
}

.pager .next {
	width: auto;
	padding: 1% 2%;
	background-color: #22b5e9;
	display: block;
	border-radius: 20px;
	text-decoration: none;
	font-size: 1.5em;
	text-align: center;
	color: black;
	font-weight: 600;
}

.pager .next:hover {
	background-color:#04e3ff;
}




.entrance {
	text-align: right;
	position: relative;
}
.entrance img {
	width: 5.2%;
	height: auto;
	vertical-align: bottom;
	bottom: 0px;
	right: 6%;
	opacity: 1;
	position: fixed;
}
.thumMenuBox{
	text-align:center;
}

.bana ,.bana2{
    display: inline-block;
    width: 24.2%;
    height: auto;
    margin: 0 0 30px 3px;
}

/***************** 20250206長谷部追加 *****************/
.box250206 {
	box-sizing: border-box;
	float: none;
	text-align: center;
	margin: 20px 2% 0;
	padding: 20px 10px;
	width: 96%;
	background-color: rgba(51, 153, 255, 0.59);
	border-radius: 20px;
}

.watch .box250206 h3 {
	margin: 0 auto;
	text-align: center;
	font-size: 1.5em;
	border-radius: 20px;
	width: 60%;
	padding: 5px 0 1px;
}

/*---------出来事---------*/
.watch .box250206 .event {
	background-color: #fd9751;
}

/*---------流行語---------*/
.watch .box250206 .trend-word {
	background-color: #e6cd0e;
}

/*---------おもちゃ---------*/
.watch .box250206 .toy {
	background-color: #52fb59;
}

/*---------映像作品---------*/
.watch .box250206 .moves {
	background-color: #e02bd1;
}

/*---------書籍---------*/
.watch .box250206 .books {
	background-color: #78e67f;
}

/*---------ヒット曲---------*/
.watch .box250206 .hit-music {
	background-color: #fd86af;
}

/*---------おすすめ---------*/
.watch .box250206 .recommend {
	/* background-color: #fef166; */
}
.watch .box250206 .recommend .box-items__title{
	background-color: #2c2983;
	border-radius: 5px;
	color: #ffffff;
	font-size: 30px;
}

/*---------おすすめ---------*/
.watch .box250206 .Showa-retro-goods {
	background-color: #ff1616;
}

/*---------デザイン制作---------*/
.watch .box250206 .leave {
	background-color: #fe5603;
	border-radius: 0;
	font-size: 28px;
	width: 100%;
}
.watch .box250206 .leave span{
	color: #ffffff;
}

.box250206 section{
	float: none;
	width: auto;
}

.box250206 .box-items{
	margin-top: 20px;
}

.box250206 .box-items:first-child{
	margin-top: 0;
}

.box250206 .box-items__contents {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 2%;
	margin-top: 20px;
}

.box250206 .content_m250206 {
	margin-top: 20px;
	background-color: rgba(255, 255, 255, 0.92);
	border-radius: 20px;
	color: #000000;
	padding: 20px;
	z-index: 2;
}

.box250206 .content_m250206 h4{
	margin: 0;
}

.box250206 .content_m250206 .content_contents{
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
}
.box250206 .content_m250206 .content_img{
	margin-right: 20px;
	padding: 0;
	width: 30%;
}

.box250206 .content_m250206 .content_info {
	border-bottom: none;
	flex: 1;
	text-align: left;
}

.box250206 .content_m250206 .content_info ul {
	/* margin-left: -4%; */
	list-style: none;
}

.box250206 .content_m250206 img {
	height: auto;
}

.box250206 .content_m250206 p {
	height: auto;
	margin: 0;
}

.box250206 .content_m250206 .p2 {
	height: auto;
	margin: 0;
}

.box250206 .content_m250206 .amazon-info {
	margin: 1em 0 10px 0;
}

.box250206 .content_m250206 .links {
	padding: 0;
	margin: 0;
	text-align: center;
}

.box250206 .content_m250206 .links li {
	list-style: none;
}

.box250206 .content_m250206 .links img {
	margin: 0;
}

.box250206 .box-items__contents .content {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	margin: 0;
	justify-content: center;
	width: 32%;
}


.box250206 .content > img {
	margin: 20px;
	height: auto;
}

.box250206 .content h4 {
	border-bottom: 1px solid;
	font-size: 18px;
	margin: 0;
	padding: 20px 0;
	text-align: center;
	width: 100%;
}

.box250206 .content div {
	border-bottom: 1px solid;
	width: 100%;
}
.box250206 .content_img{
	align-items: center;
	display: flex;
	padding: 20px 0;
	justify-content: center;
}
.box250206 .content_img img{
	margin: 0;
	max-width: 65%;
	height: auto;
}
.box250206 .content .content_info {
	border-bottom: none;
	box-sizing: border-box;
	flex: 1;
	height: 100%;
	padding: 0 10px 20px;
}

.leave-box{
	float: none;
	margin-top: 20px;
}
.leave-box__title{
	background: #fe5603 !important;
	border-radius: 0 !important;
	margin: 0 !important;
	width: 100% !important;
}
.leave-box__title span{
	color: #ffffff;
}
.leave-box__contents{
	padding: 60px 20px 20px;
	background: url(../images/pat01.png) repeat-x 0 0 #5da7df;
}
.leave-box__items,
.leave-box__items li{
	list-style: none;
}
.leave-box__items{
	display: flex;
	flex-wrap: wrap;
	gap: 20px 2.5%;
	margin: 0;
	padding: 0;
}
.leave-box__items li{
	background: #ffffff;
	text-align: center;
	width: 18%;
}
.leave-box__items a{
	background: none !important;
	display: block;
	transition: opacity .3s 0s ease-out;
}
.leave-box__items a:hover{
	opacity: .5;
}
.leave-box__items img{
	max-width: 100%;
}
.price-box{
	background: #5da7df !important;
}
.price-box__title{
	background: #320e14 !important;
	border-radius: 0 !important;
	color: #ffffff;
	margin: 0 !important;
	padding: 10px 0 !important;
	width: 100% !important;
}
.price-box__contents{
	background: #5da7df;
	padding-bottom: 20px;
	position: relative;
}
.price-box__contents img{
	max-width: 100%;
}
.price-box__click{
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	top: 10px;
	width: 22%;
}
.price-box__click a{
	transition: opacity .3s 0s ease-out;
}
.price-box__click a:hover{
	background: none;
	opacity: 0.5;
}
.price-box__movies,
.price-box__movies li{
	list-style: none;
}
.price-box__movies{
	display: flex;
	flex-wrap: wrap;
	gap: 20px 2.5%;
	margin: 0;
	padding: 0 20px;
}
.price-box__movies li{
	background: #ffffff;
	width: 18%;
}
.price-box__movies a{
	display: block;
	transition: opacity .3s 0s ease-out;
}
.price-box__movies a:hover{
	opacity: .5;
}
.price-box__movies img{
	width: 100%;
}


.global-footer{
	display: flex;
	flex-wrap: wrap;
}

.footer-bottom {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 10px 0;
}

.footer-bottom small {
	float: none;
	padding-left: 0;
	text-align: center;
}

.footer-bottom img{
	margin-left: 10px;
	padding-right: 0;
}

@media screen and (max-width: 764px) {
	.breadcrumb{
		padding: 0 20px;
	}
	.page-description{
		width: 90%;
	}
	.watch > h3{
		font-size: 25px;
		width: 90%;
	}
	.watch .box250206 h3 {
		width: 100%;
	}
	.box250206 .box-items__contents .content{
		width: 100%;
	}
	.box250206 .content_m250206 .content_img {
		margin-right: 0;
		width: 100%;
	}
	
	.box250206 .content_m250206 .content_info {
		margin-top: 20px;
		width: 100%;
	}
	.box250206 .content_m250206 .content_info:first-child{
		margin-top: 0;
	}
	.leave-box__items li{
		background: none;
		text-align: center;
		width: 48%;
	}
	.price-box__movies li{
		background: none;
		text-align: center;
		width: 48%;
	}
	.price-box__movies a:hover{
		background: none;
	}
	.price-box__movies img{
		width: auto;
	}
}



