@media screen and (max-width: 767px) {
	body {
		color: #ffffff;
	}
	
	section#character-sm {
		padding: 0 15px;

	}
	#character-sm .list {
		padding-bottom: 30px;

	}
	#character-sm .img-2 {
		overflow: hidden;
		margin: 0 -4px 5px;
	}
	#character-sm .img-2-inner {
		padding: 0 4px;
		box-sizing: border-box;
		float: left;
		width: 50%;
	}
	#character-sm .img-2-inner img {
		max-width: 100%;
	}
	article {
		padding: 0 5px;
	}

	/*header*/
	#character {
		margin-top: 135px;
	}
	.character {
		color: #952932;
		text-decoration: none;
	}

	.main-vidual {
		text-align: center;
		border-bottom: 1px solid #333;
		padding-bottom: 34px;
	}
	.main-vidual img {
		max-width: 100%;
	}
	/*main*/

	.character-anna {
		display:flex; 
		padding-top: 100px;
		margin-bottom: 38px;
	}

	.top-border {
		border-top: 1px solid #333333;
		padding-top: 5px;
	}
	.character-kyouju {
		display:flex; 
		border-top: 1px solid #333333;
		padding-top: 50px;
		margin-bottom: 38px;
	}

	.menu-left {
		width: 50%;
		float: left;
	}

	.menu-right {
		width:50%;
		float: right;

	}

	.character-img {
		width: 78%;
		float: right;
		margin-right: 20px;
		margin-bottom: 14px;
	}

	.clearfix:after {
		display: block;
		clear: both;
		content: "";
	}


	.character-introduction {
		padding-left: 7%;
		padding-right:14%;
		line-height: 230%;
		letter-spacing: -1px;


	}
	.intro {
		font-weight: bold; 
		padding-top: 4px;

	}


	.character-name {
		font-size: 18pt;
		font-style: oblique;
		color: #93262f;
		margin: 5px 0 0;

	}

	/*common上書き確認*/


	.img-box {
		position: relative;
		border-bottom: solid 1px #333333;
		width: 100%;
	}
	.inner-box {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		width: 100%;
	}
}


@media screen and (min-width: 768px) {
	body {
		color: #ffffff;
	}

	/*header*/
	#character {
		margin-top: 135px;
	}
	.character {
		color: #952932;
		text-decoration: none;
	}

	.main-vidual {
		width: 100%;
		height: 383px;
		background: 
		url("../images/common/anna_kidnapper.png") no-repeat center center / 630px 275px,
		url("../images/character/character_pc.png") no-repeat center 116px / 605px 100px;
		border-bottom: 1px solid #333;
	}
	.main-vidual img {
		display: none;
	}

	/*main*/

	.character-anna {
		display:flex; 
		padding-top: 100px;
		margin-bottom: 33px;
	}
	.character-kyouju {
		display:flex; 
		border-top: 1px solid #333333;
		padding-top: 50px;
		margin-bottom: 38px;
	}

	.menu-left {
		width: 50%;
		float: left;
	}

	.menu-right {
		width:50%;
		float: right;
	}

	.character-img {
		width: 78%;
		float: right;
		margin-right: 20px;
		margin-bottom: 18px;
	}

	.clearfix:after {
		display: block;
		clear: both;
		content: "";
	}

	.character-introduction {
		padding-top: 110px;
		padding-left: 7%;
		padding-right:18%;
		line-height: 230%;
		letter-spacing: -1px;
	}

	.intro {
		font-weight: bold; 
		padding-top: 8px;
		padding-left: 4px;

	}
	
	.character-name {
		font-size: 30pt;
		font-style: oblique;
		color: #93262f;
		margin: 20px 0px;
	}
}