@media (min-width:1081px) and (max-width:1280px){

	/*世界観*/
#world{
	position: relative;
	width: 100%;
	height:864px;
	background: url(../images/world_bg.jpg) center,center;
}
	/*登場人物*/
#character{
	position: relative;
	width: 100%;
	height:974px;
	background: url(../images/character_bg.jpg) center,center;
}
.character_wrap{
	position: relative;
	width: 840px;
	height:468px;
	background: url(../images/character_card.jpg) bottom,center;
	background-repeat: no-repeat;
	background-size:contain;
	padding-top: 48px;
	margin: 0 auto;
}

.character_img{
	position: absolute;
	right:10px;
	bottom:8px;
}
.character_img img{
	width: 500px;
	vertical-align: bottom;
}
.character_serif{
	position: absolute;
	right: 0;
	bottom:10px;
}
.character_cont{
	width: 480px;
	padding:102px 0 0 50px
}

.character_system{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 5px;
}
.voice img{
	margin: 6px 5px 0 0 ;
	cursor: pointer;
	width:80px;
}

.tab{
	order: 1;
}
.area{
	margin: 0 auto;
	padding: 50px 0 0px 0;
	order: 2;
}

.character_list{
	width: 840px;
	display: flex;
	margin: 0 auto;
	flex-wrap:wrap;
	justify-content: center;
	padding: 20px 0;
}

.EG_size{
	border: 3px solid #3c2f2f;
	box-sizing: border-box;
}
.zoom_icon{
	position: absolute;
	right: 5px;
	bottom: 5px;
	width: 40px;
}

/*ゲーム紹介*/
#game{
	position: relative;
	width: 100%;
	height:740px;
	background: url(../images/game_bg.jpg) center,center;
}
.game_wrap{
	width: 840px;
	display: flex;
	margin: 0 auto;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 41px;
}
.game_img{
	width: 400px;
	height: auto;
}


.screenshots_wrap{
	width: 840px;
	display: flex;
	margin: 0 auto;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 41px;
}

/*追加情報*/
#add{
	position: relative;
	width: 100%;
	height:884px;
	background: url(../images/add_bg.jpg) center,center;
}
.add_wrap{
	width: 840px;
	display: flex;
	margin: 0 auto;
	justify-content: space-between;
	flex-wrap: wrap;
}
.add_cont img{
	width: 400px;
}
.add_cont_info{
	padding-top: 50px;
	width: 400px;
}
.add_cont_info img{
	width: 300px;
	padding-top: 100px;
}
/*製品情報*/
.product_wrap{
	width: 840px;
	margin: 80px auto;
	padding: 80px 0;
	background-color: #fff;
}
.spec{
	width: 780px;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
}
.package_btn{
	width: 780px;
	display: flex;
	justify-content: space-between;
	margin:0 auto;
	align-items: center;
}
.package_benefits img{
	width: 380px;
	padding-bottom: 10px;
}
.package_btn li a{
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background: url(../images/purchise_btn_bg00.jpg);
	width: 380px;
	height:100px;
	margin: 0 auto;
}

.download_btn_red li a{
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background: url(../images/purchise_btn_bg00.jpg);
	width: 780px;
	height:80px;
	margin: 0 auto;
}

.download_btn li a{
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background: url(../images/purchise_btn_bg01.jpg);
	width: 780px;
	height:80px;
	margin: 0 auto;
}

.special_wrap{
	width: 840px;
	margin: 80px auto;
	padding: 80px 70px;
	background-color: #fff;
	box-sizing: border-box;
}

.special_cont{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.special_btn li a{
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background: url(../images/purchise_btn_bg00.jpg);
	width: 700px;
	height:80px;
	margin: 20px auto 0 auto;
}

.special_cont li{
	margin-top: 20px;
	overflow: hidden;
}
.special_cont a{
	position: relative;
}
.spimg_size{
	width: 220px;
	border: 3px solid #3c2f2f;
	box-sizing: border-box;
}
.special_cont::after {
	display: block;
	content:"";
	width: 220px;
	}

}

@media (max-width:1080px){
	/*ヘッダー*/
	header{
		margin-top: -50px;
		width: 100%;
		height: 50px;
		background-color: #fff;
		position: fixed;
		z-index: 5;
	}
	
	.header_wrapper{
		width: 96%;
		height: 50px;
		margin: 0 auto;
		display: flex;
		align-items: center;
		
	}
	
	.shop{
		display: flex;
		align-items: center;
	}

	.shop img{
		width: 80%;
	}
	
	header a{
		display: block;
	}

	#header_logo img{
		width: 100px;
	}

	#header_logo,header ul li{
		display: inline-block;
	}
	
	header li{
		padding-left: 10px;
	}


	#nav_wrap {
			position: fixed;
			z-index: 6;
			top: 50px;
			right: 0;
			color: #000;
			text-align: center;
			transform: translateX(100%);
			transition: all 0.6s;
			width: 100%;
			height: 100%;
			background-color: #fff;
		}
		
		#nav_wrap ul {
			background:#fff;
			margin: 0 auto;
			padding: 0;
			width: 96%;
			display:inherit;
			border-top: solid #7f7f7f 1px;
		}
	
		#nav_wrap ul li {
			font-size: 1.1em;
			list-style-type: none;
			padding: 0;
			width: 100%;
			border-bottom: solid #7f7f7f 1px;
		}

		#nav_wrap ul li a {
			display: block;
			color: #fff;
			padding: 1em 0;
		}

		/* このクラスを、jQueryで付与・削除する */
		#nav_wrap.active {
    transform: translateX(0%);
}
.nav_item img{
	height: 17px;
}

.languages{
	margin-left: 10px;
}
.languages img{
	height: 24px;
}
.languages_list{
	width: 96%;
	height: 540px;
	border: 7px solid #96895b;
	margin: 0 auto;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
.languages_list ul{
	width: 96%;
}
.languages_list li a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 80px;
	margin: 30px auto;
	background: url(../images/purchise_btn_bg00.jpg);
}
.languages_list li img{
	width: 96%;
	max-width: 500px;
}
.languages_list li:nth-child(1){
	background:none;
	text-align: center;
}

/*メニュー開閉ボタン*/
.Toggle,
.Toggle span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.Toggle {
	position: fixed;
	width: 30px;
	height: 24px;
	z-index:30;
	top:12px;
	right:2%;
	cursor:pointer;
}
.Toggle span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #2e2e2e;
}

.Toggle.active {
	position: fixed;
}

.Toggle span:nth-of-type(1) {
	top: 0;
}
.Toggle span:nth-of-type(2) {
	top: 10px;
}
.Toggle span:nth-of-type(3) {
	bottom: 0;
}

.Toggle.active span:nth-of-type(1) {
  -webkit-transform: translateY(10px) rotate(-45deg);
  transform: translateY(10px) rotate(-45deg);
  background-color:#2e2e2e;
}
.Toggle.active span:nth-of-type(2) {
  left: 50%;
  opacity: 0;
  -webkit-animation: active-menu-bar02 .8s forwards;
  animation: active-menu-bar02 .8s forwards;
  background-color:#2e2e2e;
}
.Toggle.active span:nth-of-type(3) {
  -webkit-transform: translateY(-10px) rotate(45deg);
  transform: translateY(-10px) rotate(45deg);
  background-color:#2e2e2e;
}
		
	
	
	/*メインビジュアル*/
	.main{
		width: 100%;
		display: block;
		margin: 50px auto 0 auto;
		padding-bottom: 10px;
		position: relative;
		background: url(../images/main_bg_sp.jpg);
		background-color: #5a524a;
	}
	.main_youtube img,.main_youtube_en img{
		max-width: 540px;
		width: 80%;
		display: block;
		margin: 20px auto 0 auto;
	}
	.main_youtube_en img{
		margin-bottom: 30px;
	}
	.main_d3p_otome_follow img{
		max-width: 300px;
		width: 80%;
		display: block;
		margin: 20px auto;
	}
	.main_special_banner img{
		max-width: 300px;
		width: 80%;
		display: block;
		margin: 20px auto;
	}
	.main_catch{
		position: absolute;
		top: 4%;
		right: 2%;
		z-index: 1;
		width: 14%;
	}
	.main_catch img{
		width: 100%;
	}
	
	.main_logo img,.main_logo_en img{
		max-width: 600px;
		width: 80%;
		display: block;
		margin: -160px auto 0 auto;
	}
	.release img,.release_en img{
		max-width: 600px;
		width: 80%;
		display: block;
		margin: 20px auto 0 auto;
	}
	.main_visual{
		margin: auto;
		pointer-events: none;
	}
	.main_visual img{
		width: 100%;
		vertical-align: bottom;
	}
	
	/*購入はこちらボタン*/
	.purchise_side_btn{
		width: 40%;
		max-width: 300px;
		position: fixed;
		right: 0;
		bottom: 0;
		z-index: 4;
	}
	.purchise_side_btn img{
		width: 100%;
	}
	
	/*お知らせ*/
	.news{
		width: 100%;
		background-color: #fff;
	}
	.news_wrap{
		padding-top: 20px;
		width: 96%;
		margin: 0 auto;
	}
	.news_wrap img{
		width: 100px;
		display: block;
		margin: 0 auto;
	}
	.news_wrap dl{
		display: flex;
		padding: 20px 0;
		border-bottom: dashed #7f7f7f 1px;
	}
	.news_wrap dt{
		display: flex;
		align-items: center;
	}
	.news_wrap dl:last-child {
		border: none;
	}
	.news_wrap dt{
		padding-right: 30px;
	}
	.news_wrap dd{
		width: 100%;
	}
	
	/*各項目見出し*/
	.item_title_left,.item_title_right{
		position: relative;
		width: 80%;
		top: 10px;
		left: 0;
		z-index: 4;
	}
	.item_title_left img,.item_title_right img{
		width: 100%;
	}
	.item_title_left_en{
		position: relative;
		top: 10px;
		left: 0;
		z-index: 4;
	}
	.item_title_left_en img{
		width: 80%;
	}
	
	/*世界観*/
	#world{
		position: relative;
		background: url(../images/world_bg_sp.png) no-repeat;
		background-size:auto;
		background-color: #434a50;
	}
	.world_wrap{
		width: 96%;
		margin: 0 auto;
		padding-top: 20px;
		padding-bottom: 40px;
	}
	.world_wrap img{
		width: 100%;
		max-width: 564px;
		display: block;
		margin: 0 auto;
		padding:40px 0 20px 0;
	}
	/*story*/
	#story{
		position: relative;
		background: url(../images/world_bg_sp.png) no-repeat;
		background-size:auto;
		background-color: #434a50;
	}
	.story_wrap{
		width: 96%;
		margin: 0 auto;
		padding-top: 20px;
		padding-bottom: 40px;
	}
	.world_wrap img{
		width: 100%;
		max-width: 564px;
		display: block;
		margin: 0 auto;
		padding:40px 0 20px 0;
	}
	.story_wrap p{
		display: block;
		margin: 0 auto;
		padding-bottom:30px;
	}
	
	/*登場人物*/
	#character{
		position: relative;
		background: url(../images/character_bg_sp.png) no-repeat;
		background-size:100%,auto;
		background-color: #deccb9;
		display: flex;
		flex-wrap: wrap;
	}
	.character_wrap{
		width: 96%;
		max-width: 640px;
		position: relative;
		background: url(../images/character_card_sp.jpg) top,center;
		background-repeat: no-repeat;
		background-size: 100%,100%;
		background-color: #f2f1e7;
		margin: 0 auto;
		padding-top: 80px;
		padding-bottom: 20px;
		border: 7px solid #96895b;
		box-sizing: border-box;
	}
	
	.character_img{
		position: absolute;
		top:-100px;
		right: 0;
		left: 0;
	}
	.character_img img{
		width: 360px;
		display: block;
		margin: 0 auto;
	}
	.character_serif{
		position: absolute;
		right: 0;
		bottom:10px;
	}
	.character_cont{
		width: 90%;
		margin: 0 auto;
		padding:240px 0 0 0;
		text-shadow:1px 1px 0 #eee, -1px -1px 0 #eee,
				  -1px 1px 0 #eee, 1px -1px 0 #eee,
				  0px 0 0 #eee,  0 0 #eee,
				  0 0 0 #eee, 0 0 0 #eee;
	}
	.character_name{
		position: relative;
		z-index: 1;
	}
	.cv{
		position: relative;
		padding-left: 10px;
		z-index: 1;
	}
	.character_info{
		padding-top: 10px;
		position: relative;
		z-index: 1;
	
	
	}
	.character_system{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 5px;
	}
	.voice img{
		margin: 6px 5px 0 0 ;
		cursor: pointer;
		width:42px;
	}

	.tab{
		order: 1;
	}
	.area{
		margin: 0 auto;
		padding: 50px 0 40px 0;
		order: 2;
	}
	
	.character_list{
		width: 100%;
		display: flex;
		margin: 0 auto;
		flex-wrap:wrap;
		justify-content: center;
		padding: 20px 0;
	}
	.character_list li{
		margin: 10px 2% 0 2%;
		position: relative;
		width: 28%;
		max-width: 154px;
	}
	.character_list li img{
		width: 100%;
	}
	.character_list li::before{
		background-color: rgba(0,0,0,0.3);
		position: absolute;
		top: 0;
		right: 0;
		bottom: 3px;
		left: 0;
		content: ' ';
	}
	.character_list li:hover::before{
		background-color: rgba(0,0,0,0);
		transition: 0.3s;
	}
	.character_EG{
		position: relative;
	}
	.character_EG img{
		vertical-align: bottom;
	}
	.EG_size{
		width: 160px;
		border: 3px solid #3c2f2f;
		box-sizing: border-box;
	}
	.zoom_icon{
		position: absolute;
		right: 5px;
		bottom: 5px;
		width: 40px;
	}
	
	
	.tab li {
	  cursor: pointer;
	  list-style: none;
	  transition: .3s;
	}
	.character_list li.active::before{
		background-color: rgba(0,0,0,0);
	}
	.tab li.active {
	  cursor: auto;
	}
	.area ul {
	  display: none;
	}
	.area ul.show {
	  display: block;
	}
	
	/*近日公開表示用*/
	.comingsoon{
		text-align: center;
		padding:100px 0 100px 0;
	}
	.comingsoon img{
		width: 50%;
		max-width: 300px;
	}

	/*ゲーム紹介*/
	#game{
		position: relative;
		background: url(../images/game_bg_sp.png) no-repeat;
		background-size:100%,auto;
		background-color: #5a524a;
	}
	.game_wrap{
		width: 96%;
		display: flex;
		margin: 0 auto;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 20px 0 40px 0;
	}
	.game_cont{
		width: 48%;
		padding-top: 5%;
	}
	.game_images{
		position: relative;
	}
	.game_img{
		width: 100%;
	}
	.game_info_title{
		position: absolute;
		width: 100%;
		left: 0;
		top: -17%;
	}

	/*screenshots*/
	#screenshots{
		position: relative;
		background: url(../images/add_bg_sp.jpg);
		background-color: #5a524a;
	}
	.screenshots_wrap{
		width: 96%;
		display: flex;
		margin: 0 auto;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 0 0 40px 0;
	}
	.screenshots_images{
		position: relative;
		width: 48%;
		padding-top: 20px;
	}
	.screenshots_img{
		width: 100%;
	}
	.screenshots_info_title{
		position: absolute;
		width: 100%;
		left: 0;
		top: -17%;
	}
	
	/*追加情報*/
	#add{
		position: relative;
		background: url(../images/add_bg_sp.jpg);
		background-color: #5a524a;
	}
	.add_wrap{
		margin: 0 auto;
		width: 96%;
		padding-bottom: 40px;
	}
	.add_cont{
		padding-top: 20px;
	}
	.add_cont img{
		max-width: 570px;
		width: 100%;
		display: block;
		margin: 0 auto;
	}
	.add_cont_info img{
		max-width: 260px;
		padding-top: 20px;
	}
	
	/*製品情報*/
	#product{
		overflow: hidden;
		position: relative;
		background: url(../images/product_bg_sp.jpg);
		background-color: #5a524a;
	}
	.product_wrap{
		width: 96%;
		margin: 20px auto 40px auto;
		padding: 40px 0;
		background-color: #fff;
	}
	.spec{
		width: 96%;
		margin: 0 auto;
	}
	.spec_list{
		display: table;
		margin: 20px auto;

	}
	.spec dl{
		display: flex;
		justify-content:space-between;
	}
	.spec dt{
		width: 110px;
		font-size: 12px;
	}
	.spec dd{
		padding-left: 20px;
		width: 100%;
	}
	.package{
		margin: 0 auto;
		width: 225px;
	}
	#purchise{
		width: 96%;
		margin:40px auto 0 auto;
		text-align: center;
	}
	.purchise_title{
		width: 100%;
		max-width: 300px;
		margin: 0 auto;
		display: block;
	}

	/*productoverview*/
	#productoverview{
		overflow: hidden;
		position: relative;
		background: url(../images/product_bg_sp.jpg);
		background-color: #5a524a;
	}
	.product_wrap_en{
		width: 96%;
		margin: 20px auto 40px auto;
		padding: 40px 0;
		background-color: #fff;
	}

	#purchise p{
		padding-top: 30px;
	}
	#purchise ul{
		padding-top: 20px;
	}
	.purchise_platform{
		padding-top: 40px;
	}
	.purchise_platform{
		height: 26px;
	}
	.package_benefits img{
		width: 100%;
		padding-bottom: 10px;
	}
	.package_btn li a{
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		background: url(../images/purchise_btn_bg00.jpg);
		width: 100%;
		height:80px;
		margin: 10px auto;
	}

	.download_btn_red li a{
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		background: url(../images/purchise_btn_bg00.jpg);
		width: 100%;
		height:80px;
		margin: 0 auto;
	}
	
	.download_btn li a{
		display: flex;
	align-items: center;
	justify-content: center;
		position: relative;
		background: url(../images/purchise_btn_bg01.jpg);
		width: 100%;
		height:80px;
		margin: 0 auto;
	}

	.special_wrap{
		width: 96%;
		margin: 20px auto 40px auto;
		padding: 40px 2%;
		background-color: #fff;
		box-sizing: border-box;
	}

	#special{
		background: url(../images/special_bg.jpg);
		overflow: hidden;
		position: relative;
	}
	
	.special_nav{
		text-align: center;
		margin-bottom: 20px;
		height: 56px;
	}
	.special_nav img{
		height: 100%;
		max-width: 442px;
	}
	
	.special_cont{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.special_cont li{
		margin-top: 20px;
		overflow: hidden;
		width: 48%;
	}
	.special_cont a{
		position: relative;
	}
	.spimg_size{
		width: 100%;
		border: 3px solid #3c2f2f;
		box-sizing: border-box;
	}
	
	.special_btn li a{
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		background: url(../images/purchise_btn_bg00.jpg);
		width: 100%;
		height:80px;
		margin: 20px auto 0 auto;
		font-size: 15px;
	}

	.special_close{
		position: fixed;
		right: 2%;
		bottom: 2%;
		width: 60px;
	}
	.special_close img{
		width: 100%;
	}

	.download_title{
		margin-top: 40px;
		text-align: center;
		height:22px;
	}
	.download_title img{
		height: 100%;
	}
	.download_caption{
		margin-top: 20px;
	}

	/*フッター*/
	footer{
		margin: 0 auto;
		background-color: #272727;
	}
	footer ul{
		padding-top: 20px;
		text-align: center;
	}
	footer li{
		display: inline-block;
		margin: 0 auto;
	}
	.sns_btn li{
		padding: 0 10px;
	}
	.sns_btn li img{
		width: 30px;
	}
	.footer_banner li img{
		width: 100px;
	}
	.pastwork{
		margin: 0 auto;
		width: 300px;
	}
	footer p{
		width: 96%;
		text-align: center;
		padding: 20px 0 60px 0;
		margin: 0 auto;
	}
	
	}
	
	@media (max-width:374px){
	.character_img{
		position: absolute;
		top:0;
		right: 0;
		left: 0;
	}
	.character_img img{
		width: 280px;
		display: block;
		margin: 0 auto;
	}
	.voice img{
		margin: 6px 0 0 0 ;
		cursor: pointer;
		width:44px;
	}
	.EG_size{
		width: 120px;
		border: 3px solid #3c2f2f;
		box-sizing: border-box;
	}
}