@charset "utf-8";
/* CSS Document */

html {
	overflow-y:scroll;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, a, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	list-style: none;
	text-decoration: none;
}
dt {
	font-weight: bold;
	font-size: 18px;
}
* {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	border: none;
}
strong {
	color: #e8ac4d;
	font-weight: normal;
}

@media screen and (max-width: 640px) {
dt {
	font-weight: bold;
	font-size: 16px;
}
}
dd {
	display: block;
}

/* ----------------------------------
	img
---------------------------------- */
img {
	margin: 0 auto;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: middle;
	max-width: 100%; /*Fluid Image*/
	height: auto; /*Fluid Image*/
}
.ie8 img {
	width: auto; /*Fluid Image*/
}
/* ----------------------------------
	html,body
---------------------------------- */

html {
	height: 100%;
}
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;
	-webkit-text-size-adjust: 100%; /*文字サイズの自動調整機能のキャンセル*/
	-ms-text-size-adjust: 100%; /*文字サイズの自動調整機能のキャンセル*/
	font-size: 22px;
	color: #000;
	line-height: 1.6em;
	text-align: left;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden; /* for Android 2.x */
}

@media screen and (min-width: 641px) {
body:before {
	/*background: url(../img/img_common_bg.jpg) repeat center top;*/
	background: none\9;
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 150%;
	content: "";
	z-index: -2;
}
body {
	background-color: #cbcbca;
}
/*body:after {
	background: url(../img/img_common_sd.png) repeat-y center top;
	background: none\9;
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 150%;
	content: "";
	z-index: -1;
}*/
}

@media screen and (max-width: 640px) {
body {
	background-color: #f4f1ec;
}
html {
	/*height:auto;*/
}
body {
	/*height:auto;*/
	font-size: 16px;
	letter-spacing: -0.001em;/*iOS4でのテキスト隙間への対応*/
	line-height: 1.5em;
}
}
/* ----------------------------------
	link
---------------------------------- */

a {
	color: #000;
}
a:hover {
	color: #000;
	text-decoration: underline;
}
@media screen and (min-width: 641px) {
.anchor {
	padding-top: 50px;
	margin-top: -50px;
}
}
@media screen and (max-width: 640px) {
.anchor {
	padding-top: 50px;
	margin-top: -50px;
}
}

/* ----------------------------------
	clearfix
---------------------------------- */
.clearfix:after {
	content: " ";
	display: block;
	height: 0.1px;
	font-size: 0;/*firefox対策*/
	line-height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */


/* -----------------------------------------------------
	wrapper
----------------------------------------------------- */
#wrapper {
	-webkit-backface-visibility: hidden; /* for Android 2.x */
	z-index: 20;
	/*min-height: 100%;*/
}

@media screen and (min-width: 641px) {
#wrapper {
	margin: 0 auto;
	width: 100%;
	min-width: 1200px;
	background-repeat: no-repeat;
	background-position: center 55px;
	position: relative;
	z-index: 1;
	background-image: url(../img/img_common_sd.png), url(../img/img_common_bg.jpg);
	background-repeat: repeat-y, repeat;
}
#start #wrapper {
	background-image: url(../img/img_green_bg.jpg), url(../img/img_common_sd.png), url(../img/img_common_bg.jpg);
	background-repeat: no-repeat, repeat-y, repeat;
}
#advance #wrapper,
#camera1 #wrapper,
#camera2 #wrapper,
#camera3 #wrapper,
#character #wrapper {
	background-image: url(../img/img_yellow_bg.jpg), url(../img/img_common_sd.png), url(../img/img_common_bg.jpg);
	background-repeat: no-repeat, repeat-y, repeat;
}
#companion #wrapper {
	background-image: url(../img/img_pink_bg.jpg), url(../img/img_common_sd.png), url(../img/img_common_bg.jpg);
	background-repeat: no-repeat, repeat-y, repeat;
}
#control1 #wrapper,
#control2 #wrapper {
	background-image: url(../img/img_blue_bg.jpg), url(../img/img_common_sd.png), url(../img/img_common_bg.jpg);
	background-repeat: no-repeat, repeat-y, repeat;
}
body .fixedBg {
	display: none;
	content: " ";
	width: 100%;
	height: 100%;
	position: fixed;
	left: auto;
	left: 0px\9;
	top: 55px;
	z-index: 0;
}
:root body .fixedBg {
 left: auto\0/;
}
}

@media screen and (max-width: 640px) {
	#wrapper {
		margin: 0 auto;
		width: 100%;
		background-repeat: no-repeat;
		background-position: center 55px;
		position: relative;
	}
	#start #wrapper {
		background-image: url(../img/img_green_bg_sp.jpg);
		background-repeat: no-repeat;
	}
	#advance #wrapper,
	#camera1 #wrapper,
	#camera2 #wrapper,
	#camera3 #wrapper,
	#character #wrapper {
		background-image: url(../img/img_yellow_bg_sp.jpg);
		background-repeat: no-repeat;
	}
	#companion #wrapper {
		background-image: url(../img/img_pink_bg_sp.jpg);
		background-repeat: no-repeat;
	}
	#control1 #wrapper,
	#control2 #wrapper {
		background-image: url(../img/img_blue_bg_sp.jpg);
		background-repeat: no-repeat;
	}
	body .fixedBg {
		display: none;
		content: " ";
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0px;
		top: 55px;
		z-index: 1;
	}
}
#story #wrapper {
	/*background-image: none;*/
}
@media screen and (max-width: 640px) {
body #wrapper {
	background-size: cover;
}
}

/* -----------------------------------------------------
	contents
----------------------------------------------------- */
@media screen and (min-width:641px) {

#contents {
	margin: 0px auto 0px;
	padding: 190px 0px 30px 0px;
	width: 1000px;
	min-width: 300px;
	/*width: 880px;*/
	height: auto;
	text-align: left;
	position: relative;
	left: 0px;
	top: 0px;
	z-index: 2;
}
}

@media screen and (max-width: 640px) {
#contents {
	margin: 0px auto;
	padding: 120px 20px 30px 20px;
	width: auto;
}
}
#contents .vaT {
	vertical-align: top;
}
.note {
	color: #3c87b8 !important;
}
.smallFont {
	font-size: 84%;
	line-height: 115%;
}

/* -------------------------------------------------------------------
header
-------------------------------------------------------------------- */
#header {
	position: fixed;
	top: 0px;
	left: 0px;
	-webkit-backface-visibility: hidden; /* for Android 2.x */
	width: 100%;
	height: 55px;
	padding: 0;
	background: url(../img/img_bg_header.png) repeat-x 50% 0px;
	/* box-shadow */
	-webkit-box-shadow: 40px -20px 20px 30px rgba(0,0,0,0.3);
	-moz-box-shadow: 40px -20px 20px 30px rgba(0,0,0,0.3);
	box-shadow: 40px -20px 20px 30px rgba(0,0,0,0.3);
	-pie-box-shadow: 20px 0px 20px 0px #000000;
	/*behavior: url(../shared/js/PIE.htc);*//*CSS3 PIE実行*/
	z-index: 100;
}
#header_inner {
	position: relative;
	left: 0px;
	top: 0px;
	width: 100%;
	padding: 0px;
	margin: 0 auto;
}

#header .simple-menu {
	margin: 0;
	padding: 0;
	display: block;
	width: 50px;
	height: 55px;
	text-indent: -99999px;
	text-align: left;
	overflow: hidden;
	position: absolute;
	left: 8px;
	top: 0px;
	background: url(../img/img_nav_icon.png) no-repeat 0px 50%;
	cursor: pointer;
	-webkit-backface-visibility: hidden; /* for Android 2.x */
}

@media screen and (min-width: 641px) {
#header {
	min-width: 1200px;
}
#header_inner {
	width: 1200px;
	margin: 0px auto;
}
}


/* -------------------------------------------------------------------
footer
-------------------------------------------------------------------- */

#footer {
	width: 100%;
	height: 54px;
	padding: 0;
	background-color: #333;
	color: #fff;
	background: url(../img/img_bg_footer.png) repeat-x 50% 0px;
	/* box-shadow */
	box-shadow: rgba(0, 0, 0, 0.360784) 0px -3px 5px -1px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.360784) 0px -3px 5px -1px;
	-moz-box-shadow: rgba(0, 0, 0, 0.360784) 0px -3px 5px -1px;
	/*behavior:url(../shared/js/PIE.htc);CSS3 PIE実行*/
	z-index: 90;
	position: absolute;
	left: 0px;
	bottom: 0px;
}

#story #footer {
	position: relative;
	left: auto;
	bottom: auto;
}

#story #footerBtm {
	width: 100%;
	height: 0px;
	position: relative;
	overflow: hidden;
}

#story #footerBtm p {
	width: 100%;
	height: 1000px;
	background-color: #7c7c7c;
	font-size: 0px;
	line-height: 0;
	text-indent: -99999px;
	position: absolute;
	left: 0px;
	top: 0px;
}

@media screen and (min-width:641px) {
#footer {
}
}
/*---footer navi---*/

ul#page_nav {
	/*width:90%; */
	margin: auto;
	padding-top: 8px;
	font-weight: bold;
	vertical-align: middle;
	zoom: 1;
	position: relative;
}
ul#page_nav:after {
	height: 0;
	display: block;
	clear: both;
	visibility: hidden;
	content: " ";
	line-height: 0;
}

ul#page_nav a:link,
ul#page_nav a:visited {
	color: #fff;
	text-decoration: none;
}
ul#page_nav a:hover,
ul#page_nav a:active {
	color: #fff;
	text-decoration: underline;
}

/*641px以上*/
@media screen and (min-width:641px) {
ul#page_nav {
	/*width:940px;*/
	width: 1200px;
	font-size: 26px;
}
}

ul#page_nav li.page_prev,
ul#page_nav li.page_menu {
	padding: 0px 0px 0px 20px;
	float: left;
	text-align: left;
}

ul#page_nav li.page_menu a {
	margin: 0;
	padding: 0;
	display: block;
	width: 50px;
	height: 55px;
	text-indent: -99999px;
	text-align: left;
	overflow: hidden;
	position: absolute;
	left: 0px;
	top: 0px;
	background: url(../img/img_nav_icon.png) no-repeat 0px 50%;
	cursor: pointer;
	-webkit-backface-visibility: hidden; /* for Android 2.x */
}
ul#page_nav li.page_prev a {
	display: inline-block;
	background-image: url(../img/img_arrow_prev.png);
	background-repeat: no-repeat;
	background-position: 0px 46%;
	padding-left: 42px;
	margin-top: -10px;
	min-height: 44px;
	padding-top: 5px;
}
ul#page_nav li.page_next {
	padding: 0px 20px 0px 0px;
	float: right;
	text-align: right;
}
ul#page_nav li.page_next a {
	display: inline-block;
	background-image: url(../img/img_arrow_next.png);
	background-repeat: no-repeat;
	background-position: 100% 46%;
	padding-right: 42px;
	margin-top: -10px;
	min-height: 44px;
	padding-top: 5px;
}

@media screen and (max-width: 640px) {
ul#page_nav {
	padding-top: 12px;
}
ul#page_nav li.page_prev {
	padding-left: 8px;
}
ul#page_nav li.page_next {
	padding-right: 8px;
}

ul#page_nav li.page_prev a {
	margin-top: 0px;
	padding-top: 3px;
	min-height: 30px;
	zoom: 0.8;
}
ul#page_nav li.page_next a {
	margin-top: 0px;
	padding-top: 3px;
	min-height: 30px;
	zoom: 0.8;
}
}
/*-- footerlink --*/
#footer a {
	font-size: 22px;
	color: #fff;
}
#footer a:hover {
	color: #fff;
	text-shadow: 0px 0px 3px 0px #FFFFFF;
	text-decoration: underline;
}


/* -----------------------------------------------------
	title
----------------------------------------------------- */

#header h1 {
	padding-top: 10px;
	padding-left: 58px;
	padding-right: 58px;
	text-align: center;
	vertical-align: center;
	font-size: 100%;
	font-weight:bold;
	color: #fff;
}
#header h1 img {
	margin-top: -5px;
}
#contents h1 {
	height: 70px;
	width: auto;
	margin: 50px 0 20px;
	padding-left: 20px;
	vertical-align: middle;
}
.h1text {
	font-size: 30px;
	display: inline-block;
	width: 625px;
	height: 70px;
	/*padding-top:20px;*/
	padding-top: 22px;
	padding-left: 15px;
}

@media screen and (min-width: 641px) {
#header h1 {
	font-size: 30px;
	letter-spacing: 0.07em;
}
}

@media screen and (max-width: 640px) {
#header h1 {
	padding-top: 14px;
	font-size: 18px;
	white-space: nowrap;
	letter-spacing: 0.0em;
}
}


/* -----------------------------------------------------
	section
----------------------------------------------------- */
.section01 {
	clear: both;
	margin-bottom: 56px;
	zoom: 1;
}
.section01:after {
	height: 0;
	display: block;
	clear: both;
	visibility: hidden;
	content: " ";
	line-height: 0;
}

.section02 {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, arial, helvetica;
	clear: both;
	margin-bottom: 40px;
	zoom: 1;
}
.section02:after {
	height: 0;
	display: block;
	clear: both;
	visibility: hidden;
	content: " ";
	line-height: 0;
}
.section02 p {
	margin-bottom: 1.4em;
}


/* -----------------------------------------------------
	heading
----------------------------------------------------- */
.heading01Y,
.heading01R {
	padding: 10px 40px 10px 40px;
	font-size: 30px;
	line-height: 105%;
	font-weight: bold;
	text-align: center;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	-webkit-box-shadow: 1px 1px 4px #333;
	-moz-box-shadow: 1px 1px 4px #333;
	-ms-box-shadow: 1px 1px 4px #333;
	-o-box-shadow: 1px 1px 4px #333;
	box-shadow: 1px 1px 4px #333;
	display: inline-block;
	margin-bottom: 20px;
}
.heading01Y {
	color: #000;
	background: url(../img/img_heading01y_bg.jpg) repeat center center;
}
.heading01R {
	color: #fff;
	background: url(../img/img_heading01r_bg.jpg) repeat center center;
}
.heading02,
.heading03Y01,
.heading03Y02,
.heading03Y03,
.heading03R01,
.heading03R02,
.heading03R03 {
	padding: 0px 0px 0px 30px;
	font-size: 26px;
	line-height: 115%;
	margin-bottom: 10px;
}
.heading02 {
	background: url(../img/img_heading02_bg.png) no-repeat 0px 2px;
}
.heading03Y01 {
	background: url(../img/img_heading03y01_bg.png) no-repeat 0px 2px;
}
.heading03Y02 {
	background: url(../img/img_heading03y02_bg.png) no-repeat 0px 2px;
}
.heading03Y03 {
	background: url(../img/img_heading03y03_bg.png) no-repeat 0px 2px;
}
.heading03R01 {
	background: url(../img/img_heading03r01_bg.png) no-repeat 0px 2px;
}
.heading03R02 {
	background: url(../img/img_heading03r02_bg.png) no-repeat 0px 2px;
}
.heading03R03 {
	background: url(../img/img_heading03r03_bg.png) no-repeat 0px 2px;
}

@media screen and (max-width: 640px) {
.heading01Y,
.heading01R {
	padding: 6px 10px 6px 10px;
	font-size: 18px;
	line-height: 105%;
}
.heading02,
.heading03Y01,
.heading03Y02,
.heading03Y03,
.heading03R01,
.heading03R02,
.heading03R03 {
	background-size: contain;
	padding: 0px 0px 0px 30px;
	font-size: 18px;
	line-height: 115%;
}
.heading02 {
	background: url(../img/img_heading02_bg.png) no-repeat 0px 0px;
}
.heading03Y01 {
	background: url(../img/img_heading03y01_bg.png) no-repeat 0px 0px;
}
.heading03Y02 {
	background: url(../img/img_heading03y02_bg.png) no-repeat 0px 0px;
}
.heading03Y03 {
	background: url(../img/img_heading03y03_bg.png) no-repeat 0px 0px;
}
.heading03R01 {
	background: url(../img/img_heading03r01_bg.png) no-repeat 0px 0px;
}
.heading03R02 {
	background: url(../img/img_heading03r02_bg.png) no-repeat 0px 0px;
}
.heading03R03 {
	background: url(../img/img_heading03r03_bg.png) no-repeat 0px 0px;
}
}

/* -----------------------------------------------------
	image
----------------------------------------------------- */
@media screen and (min-width: 641px) {
#spacer01,
#spacer02,
#spacer03,
#spacer04,
#spacer05,
#spacer06,
#spacer07,
#spacer08,
#spacer09,
#spacer10 {
	display: none !important;
}
}
.img_center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.image01 {
	width: 500px;
	float: right;
	margin-left: 16px;
}
.image01 img {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 100%;
}

@media screen and (max-width: 640px) {
.image01 {
	width: 100%;
	float: none;
	margin: 0px 0px 24px 0px;
}
}

.image02 {
	width: 100%;
	margin-bottom: 32px;
}
.image02 img {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 100%;
}

/* -----------------------------------------------------
	text
----------------------------------------------------- */
.lead01 {
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 1.6em !important;
}
#contents p {
	margin: 0px 0px 1.0em 0px;
}
@media screen and (min-width: 641px) {
.box-left {
	width: 480px;
	float: left;
}
}


/* -----------------------------------------------------
	table
----------------------------------------------------- */
.table01,
.table02 {
	margin: 0px;
	padding: 0px;
	width: 100%;
	border-collapse: collapse;
	border: none;
}
.table01 tr th,
.table01 tr td,
.table02 tr th,
.table02 tr td {
	padding: 16px 32px 12px;
	vertical-align: top;
	font-size: 100%;
	line-height: 1.7;
	text-align: left;
}
.table01 tr th,
.table02 tr th {
	background: #f8ac41 url(../img/img_tbl_line.png) no-repeat left top;
	font-weight: bold;
}
.table01 tr td,
.table02 tr td {
	background: #fff url(../img/img_tbl_line.png) no-repeat right top;
	font-weight: normal;
}
.table01 tr:first-child th,
.table01 tr:first-child td,
.table02 tr:first-child th,
.table02 tr:first-child td {
	background-image: none;
}
.table02 tr th,
.table02 tr td {
	position: relative;
}
@media screen and (min-width: 641px) {
.table01,
.table02 {
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
}
}
@media screen and (max-width: 640px) {
.table01 thead,
.table01 tbody,
.table01 tfoot,
.table01 tr,
.table01 th,
.table01 td,
.table02 thead,
.table02 tbody,
.table02 tfoot,
.table02 tr,
.table02 th,
.table02 td {
	display: block;
	width: 100%\9;
	float: left\9;
}
.table01 tr th,
.table02 tr th {
	padding: 10px 16px 0px;
	background: none;
}

.table01 tr td,
.table02 tr td {
	padding: 10px 16px 10px;
	background: none;
}

.table01 tr th,
.table01 tr td {
	position: relative;
}
.table01 .number01 th,
.table01 .number02 th,
.table01 .number03 th,
.table01 .number04 th,
.table01 .number05 th,
.table01 .number06 th,
.table01 .number07 th,
.table01 .number08 th,
.table01 .number09 th,
.table01 .number10 th,
.table01 .number11 th,
.table01 .number12 th,
.table01 .number13 th,
.table01 .number14 th,
.table01 .number15 th {
	padding-left: 50px;
}
.table01 .number01 td,
.table01 .number02 td,
.table01 .number03 td,
.table01 .number04 td,
.table01 .number05 td,
.table01 .number06 td,
.table01 .number07 td,
.table01 .number08 td,
.table01 .number09 td,
.table01 .number10 td,
.table01 .number11 td,
.table01 .number12 td,
.table01 .number13 td,
.table01 .number14 td,
.table01 .number15 td {
	padding-left: 50px;
}
.table01 .number01 th:before,
.table01 .number02 th:before,
.table01 .number03 th:before,
.table01 .number04 th:before,
.table01 .number05 th:before,
.table01 .number06 th:before,
.table01 .number07 th:before,
.table01 .number08 th:before,
.table01 .number09 th:before,
.table01 .number10 th:before,
.table01 .number11 th:before,
.table01 .number12 th:before,
.table01 .number13 th:before,
.table01 .number14 th:before,
.table01 .number15 th:before {
	position: absolute;
	left: 10px;
	top: 10px;
	background-color: #f00;
	-webkit-border-radius: 26px;
	-moz-border-radius: 26px;
	-ms-border-radius: 26px;
	-o-border-radius: 26px;
	border-radius: 26px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 26px;
	height: 26px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 26px;
	text-align: center;
	display: inline-block;
 /display: inline;
}
.table01 .number01 th:before {
	content: '1';
}
.table01 .number02 th:before {
	content: '2';
}
.table01 .number03 th:before {
	content: '3';
}
.table01 .number04 th:before {
	content: '4';
}
.table01 .number05 th:before {
	content: '5';
}
.table01 .number06 th:before {
	content: '6';
}
.table01 .number07 th:before {
	content: '7';
}
.table01 .number08 th:before {
	content: '8';
}
.table01 .number09 th:before {
	content: '9';
}
.table01 .number10 th:before {
	content: '10';
}
.table01 .number11 th:before {
	content: '11';
}
.table01 .number12 th:before {
	content: '12';
}
.table01 .number13 th:before {
	content: '13';
}
.table01 .number14 th:before {
	content: '14';
}
.table01 .number15 th:before {
	content: '15';
}

.table01 span.number01:before,
.table01 span.number02:before,
.table01 span.number03:before,
.table01 span.number04:before,
.table01 span.number05:before,
.table01 span.number06:before,
.table01 span.number07:before,
.table01 span.number08:before,
.table01 span.number09:before,
.table01 span.number10:before,
.table01 span.number11:before,
.table01 span.number12:before,
.table01 span.number13:before,
.table01 span.number14:before,
.table01 span.number15:before {
	position: absolute;
	left: 10px;
	top: 10px;
	background-color: #f00;
	-webkit-border-radius: 26px;
	-moz-border-radius: 26px;
	-ms-border-radius: 26px;
	-o-border-radius: 26px;
	border-radius: 26px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 26px;
	height: 26px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 26px;
	text-align: center;
	display: inline-block;
}
.table01 span.number01:before {
	content: '1';
}
.table01 span.number02:before {
	content: '2';
}
.table01 span.number03:before {
	content: '3';
}
.table01 span.number04:before {
	content: '4';
}
.table01 span.number05:before {
	content: '5';
}
.table01 span.number06:before {
	content: '6';
}
.table01 span.number07:before {
	content: '7';
}
.table01 span.number08:before {
	content: '8';
}
.table01 span.number09:before {
	content: '9';
}
.table01 span.number10:before {
	content: '10';
}
.table01 span.number11:before {
	content: '11';
}
.table01 span.number12:before {
	content: '12';
}
.table01 span.number13:before {
	content: '13';
}
.table01 span.number14:before {
	content: '14';
}
.table01 span.number15:before {
	content: '15';
}
}
.table02 .number01 th,
.table02 .number02 th,
.table02 .number03 th,
.table02 .number04 th,
.table02 .number05 th {
	padding-left: 80px;
}
.table02 .number01 th:before,
.table02 .number02 th:before,
.table02 .number03 th:before,
.table02 .number04 th:before,
.table02 .number05 th:before {
	position: absolute;
	left: 20px;
	top: 10px;
	background-color: #448aca;
	-webkit-border-radius: 43px;
	-moz-border-radius: 43px;
	-ms-border-radius: 43px;
	-o-border-radius: 43px;
	border-radius: 43px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 43px;
	height: 43px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 43px;
	text-align: center;
	display: inline-block;
 /display: inline;
}

.table02 .number01 th:before {
	content: '1';
}
.table02 .number02 th:before {
	content: '2';
}
.table02 .number03 th:before {
	content: '3';
}
.table02 .number04 th:before {
	content: '4';
}
.table02 .number05 th:before {
	content: '5';
}

.table02 span.number01:before,
.table02 span.number02:before,
.table02 span.number03:before,
.table02 span.number04:before,
.table02 span.number05:before {
	position: absolute;
	left: 20px;
	top: 10px;
	background-color: #448aca;
	-webkit-border-radius: 43px;
	-moz-border-radius: 43px;
	-ms-border-radius: 43px;
	-o-border-radius: 43px;
	border-radius: 43px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 43px;
	height: 43px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 43px;
	text-align: center;
	display: inline-block;
}
.table02 span.number01:before {
	content: '1';
}
.table02 span.number02:before {
	content: '2';
}
.table02 span.number03:before {
	content: '3';
}
.table02 span.number04:before {
	content: '4';
}
.table02 span.number05:before {
	content: '5';
}
@media screen and (max-width:640px) {
.table02 .number01 th,
.table02 .number02 th,
.table02 .number03 th,
.table02 .number04 th,
.table02 .number05 th {
	padding-left: 50px;
}
.table02 .number01 td,
.table02 .number02 td,
.table02 .number03 td,
.table02 .number04 td,
.table02 .number05 td {
	padding-left: 50px;
}
.table02 .number01 th:before,
.table02 .number02 th:before,
.table02 .number03 th:before,
.table02 .number04 th:before,
.table02 .number05 th:before {
	position: absolute;
	left: 10px;
	top: 15px;
	background-color: #448aca;
	-webkit-border-radius: 26px;
	-moz-border-radius: 26px;
	-ms-border-radius: 26px;
	-o-border-radius: 26px;
	border-radius: 26px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 26px;
	height: 26px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 26px;
	text-align: center;
	display: inline-block;
 /display: inline;
}
.table02 span.number01:before,
.table02 span.number02:before,
.table02 span.number03:before,
.table02 span.number04:before,
.table02 span.number05:before {
	position: absolute;
	left: 10px;
	top: 15px;
	background-color: #448aca;
	-webkit-border-radius: 26px;
	-moz-border-radius: 26px;
	-ms-border-radius: 26px;
	-o-border-radius: 26px;
	border-radius: 26px;
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
	width: 26px;
	height: 26px;
	margin: 0px;
	color: #fff;
	font-size: 1em;
	line-height: 26px;
	text-align: center;
	display: inline-block;
}
}

.table03 {
	margin: 0px;
	padding: 0px;
	width: 100%;
	border-collapse: collapse;
	border: none;
}
@media screen and (min-width: 641px) {
.tableW {
	width: 100%;
}

.tableW:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.table03 {
	-webkit-box-shadow: 1px 1px 4px #666;
	-moz-box-shadow: 1px 1px 4px #666;
	-ms-box-shadow: 1px 1px 4px #666;
	-o-box-shadow: 1px 1px 4px #666;
	box-shadow: 1px 1px 4px #666;
}

.tbL {
	width: 490px;
	float: left;
}

.tbR {
	width: 490px;
	float: right;
}
.table03 tr th {
	padding: 16px 0px 12px;
	vertical-align: top;
	font-size: 0px;
	line-height: 0;
	text-align: center;
}
.table03 tr th img {
	height: 40px;
}
.table03 tr td {
	padding: 16px 20px 12px;
	vertical-align: top;
	font-size: 100%;
	line-height: 1.7;
	text-align: left;
}
.table03 tr th {
	background: #f8ac41 url(../img/img_tbl_line.png) no-repeat left top;
	font-weight: bold;
}
.table03 tr td {
	background: #fff url(../img/img_tbl_line.png) no-repeat right top;
	font-weight: normal;
}
.table03 tr:first-child th,
.table03 tr:first-child td {
	background-image: none;
}

}
@media screen and (max-width: 640px) {
.table03 {
	width: 100%;
}
.table03 thead,
.table03 tbody,
.table03 tfoot,
.table03 tr,
.table03 th,
.table03 td {
	display: block;
	width: 100%\9;
	float: left\9;
}
.table03 tr th {
	padding: 10px 16px 0px;
}
.table03 tr td {
	padding: 10px 16px 10px;
}
.table03 tr th {
	vertical-align: top;
	font-size: 0px;
	line-height: 0;
	text-align: left;
}
.table03 tr th img {
	height: 40px;
}
.table03 tr td {
	vertical-align: top;
	font-size: 100%;
	line-height: 1.7;
	text-align: left;
}
}

/* -----------------------------------------------------
	list
----------------------------------------------------- */
ul.disc li {
	list-style-type: none;
	margin: 0px;
	padding: 0px 0px 0px 28px;
	background: url(../img/img_ic_circle.png) no-repeat 0px 0.3em;
	margin-top: 5px;
	word-wrap: break-word;
	word-break: break-all;/* webkit */
}

@media screen and (max-width:640px) {
ul.disc li {
	margin-bottom: 10px;
	padding-left: 22px;
	/*background-position: 0px 0.25em;*/
	background-size: 16px 16px;
}
}

/* -----------------------------------------------------
	カラー太字
----------------------------------------------------- */
.strong {
	font-weight: bold;
	color: #e9aa4d;
}


/* -----------------------------------------------------
	PS4・PC / スマホ での表示切替指定
----------------------------------------------------- */
@media screen and (min-width:641px) {
.pcNone {
	display: none !important;
}
}

@media screen and (max-width:640px) {
.spNone {
	display: none !important;
}
}


/* -----------------------------------------------------
	レイアウト調整
----------------------------------------------------- */
.mg_text_b {
	margin-bottom: 1.2em !important;
}
.mg_t0 {
	margin-top: 0px !important;
}
.mg_t0 .clearfix {
	margin-top: 0px !important;
}
.mg_t5 {
	margin-top: 5px !important;
}
.mg_t15 {
	margin-top: 15px !important;
}
.mg_t10 {
	margin-top: 10px !important;
}
.mg_t20 {
	margin-top: 20px !important;
}
.mg_t30 {
	margin-top: 30px !important;
}

@media screen and (min-width:641px) {
.pc_mg_t0 {
	margin-top: 0px !important;
}
.pc_mg_t10 {
	margin-top: 10px !important;
}
.pc_mg_t20 {
	margin-top: 20px !important;
}
}

@media screen and (max-width:640px) {
.sp_mg_t-20 {
	margin-top: -20px !important;
}
.sp_mg_t-10 {
	margin-top: -10px !important;
}
.sp_mg_t0 {
	margin-top: 0px !important;
}
.sp_mg_t10 {
	margin-top: 10px !important;
}
.sp_mg_t20 {
	margin-top: 20px !important;
}
.sp_mg_t30 {
	margin-top: 30px !important;
}
}
.mg_t40 {
	margin-top: 40px !important;
}
/*-左-*/
.mg_l10 {
	margin-left: 10px !important;
}


/* -----------------------------------------------------
	webfont指定              		scefont 3.7
----------------------------------------------------- */
@font-face {
	font-family: "sce3.7w1";
	src: url("../../shared/fonts/sce3.7w1.eot");
	src: url("../../shared/fonts/sce3.7w1.eot?#iefix") format("embedded-opentype"), url("../../shared/fonts/sce3.7w1.woff") format("woff"), url("../../shared/fonts/sce3.7w1.ttf") format("truetype"), url("../../shared/fonts/sce3.7w1.svg#sce3.7w1") format("svg");
	font-weight: normal;
	font-style: normal;
	font-stretch: normal
}
@font-face {
	font-family: "sce3.7w2";
	src: url("../../shared/fonts/sce3.7w2.eot");
	src: url("../../shared/fonts/sce3.7w2.eot?#iefix") format("embedded-opentype"), url("../../shared/fonts/sce3.7w2.woff") format("woff"), url("../../shared/fonts/sce3.7w2.ttf") format("truetype"), url("../../shared/fonts/sce3.7w2.svg#sce3.7w2") format("svg");
	font-weight: normal;
	font-style: normal;
	font-stretch: normal
}
.ps-button-icon {
	font-family: "sce3.7w1", Arial, sans-serif;
	font-size: 24px;
	padding: 0 3px;
	vertical-align: -1px;
	font-weight: normal !important;
	line-height: 0.9em;
}

/*-- スマホ用 --*/
@media screen and (max-width:640px) {
.ps-button-icon {
	vertical-align: middle;
	display: inline-block;
 /display: inline;
	zoom: 1;
	margin-top: -10px;
}
}
.ps-button-iconL {
	font-family: "sce3.7w1", Arial, sans-serif;
	font-size: 24px;
	padding: 0 2px;
	font-weight: normal !important;
}
.web-font-S {
	color: #493C35;
}




/* -----------------------------------------------------
	#sidr
----------------------------------------------------- */
#sidr {
	-webkit-backface-visibility: hidden; /* for Android 2.x */
	position: fixed;
	left: -400px;
	top: 0px;
	z-index: 1;
	width: 400px;
	height: 100%;
	overflow: auto;
	border: none;
}
#sidr:after,
#sidr #pie-shadow {
	content: " ";
	width: 0px;
	height: 100%;
	overflow: hidden;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 9999;
}
#sidr #pie-shadow {
	width: 1px; /* for IE8 */
	right: -1px; /* for IE8 */
	behavior:url(../shared/js/PIE.htc); /*CSS3 PIE実行*/
}
#sidr .scrollgeneric {
	line-height: 1px;
	font-size: 1px;
	position: absolute;
	top: 0;
	left: 0;
}
#sidr .vscrollerbar {
	width: 8px;
	background: #666666;
}
#sidr .vscrollerbarbeg {
	width: 8px;
	height: 0px;
	background: #cccccc;
	margin: 0pxpx;
}
#sidr .vscrollerbarend {
	width: 8px;
	height: 0px;
	background: #999999;
}
#sidr .vscrollerbase {
	width: 8px;
	background: #666666;
	margin: 0px;
}
#sidr .vscrollerbasebeg {
	width: 8px;
	height: 10px;
	background: #666666;
}
#sidr .vscrollerbaseend {
	width: 8px;
	height: 1px;
	background: #666666;
	margin-top: -1px;
}
#sidr .hscrollerbase {
	height: 8px;
	background-color: #666666;
}
#sidr .hscrollerbar {
	height: 8px;
	background-color: #666666;
}
#sidr .vscrollerbar, .hscrollerbar {
	padding: 0px;
	z-index: 2;
}
#sidr_mcontentwrapper {
	z-index: 100 !important;
}
#sidr_scrollwrapper {
	z-index: 10 !important;
}
#sidr {
	background-image: url(../img/img_nav_bg.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	background-size: cover;
}
#sidr ul {
	background: none;
	margin: 0;
	border: none;
}
#sidr ul li {
	border-bottom: 4px solid #fff;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.6;
}

#sidr ul li:first-child a {
	padding: 0px !important;
}
#sidr ul li.bg_story {
	background: url(../img/img_nav_sp.png) repeat center center;
}

#sidr ul li.bg_started {
	background: url(../img/img_nav_sg.png) repeat center center;
}

#sidr ul li.bg_control1,
#sidr ul li.bg_control2 {
	background: url(../img/img_nav_sb.png) repeat center center;
}

#sidr ul li.bg_screen,
#sidr ul li.bg_camera1,
#sidr ul li.bg_camera2,
#sidr ul li.bg_camera3,
#sidr ul li.bg_chara {
	background: url(../img/img_nav_sy.png) repeat center center;
}

#sidr ul li.bg_companion {
	background: url(../img/img_nav_spk.png) repeat center center;
}

#sidr ul li a, #sidr ul li span {
	display: block;
	color: #fff;
	padding: 4px 0px 4px 30px;
}

#sidr ul li.bg_camera1 a,
#sidr ul li.bg_camera2 a,
#sidr ul li.bg_camera3 a,
#sidr ul li.bg_chara a,
#sidr ul li.bg_camera1 span,
#sidr ul li.bg_camera2 span,
#sidr ul li.bg_camera3 span,
#sidr ul li.bg_chara span {
	padding-left: 60px;
}


@media screen and (min-width:641px) {
#sidr ul li a:hover,
#sidr ul li.active a,
#sidr ul li#sidr-class-active a,
#sidr ul li#sidr-class-active span {
	background: url(../img/img_nav_sover.png) repeat center center;
	text-decoration: none;
}

#sidr ul li.bg_chara {
	letter-spacing: -0.1em;
}
}

@media screen and (max-width: 640px) {
#sidr {
	width: 260px;
}
#sidr ul li {
	font-size: 90% !important;
	line-height: 100% !important;
	border-bottom-width: 2px;
}
#sidr ul li:first-child {
	text-align: center !important;
}
#sidr ul li:first-child img {
	max-width: 100% !important;
}
#sidr ul li a,  #sidr ul li span {
	padding: 9px 15px !important;
	text-decoration: none;
}
#sidr ul li.bg_camera1 a,
#sidr ul li.bg_camera2 a,
#sidr ul li.bg_camera3 a,
#sidr ul li.bg_chara a,
#sidr ul li.bg_camera1 span,
#sidr ul li.bg_camera2 span,
#sidr ul li.bg_camera3 span,
#sidr ul li.bg_chara span {
	padding-left: 30px !important;
}
}
/* -----------------------------------------------------
	alert for landscape
----------------------------------------------------- */
#landscapeAlertOuter {
	display: none;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 99999;
}
#landscapeAlertOverlay {
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 90000;
	background: #000000;
	opacity: 0.7;
	width: 100%;
	height: 200%;
}
#landscapeAlertMes {
	position: fixed;
	left: 50%;
	top: 10%;
	z-index: 99999;
	width: 40%;
	margin-left: -20%;
	margin-top: 0px;
}
#landscapeAlertMes img {
	width: 100%;
	height: auto;
}



/* -----------------------------------------------------
	top.html
----------------------------------------------------- */
#top #top_visual {
	overflow: hidden;
}
#top #contents {
	margin: 0px auto;
	min-width: 300px;
	background-image: url(../img/img_home_bg.jpg);
	background-repeat: repeat;
	background-position: 50% 0px;
}

#top #top_hint {
	width: auto;
	height: auto;
	margin: 0 auto;
	padding: 20px 20px 0px 20px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	-o-border-radius: 8px;
	border-radius: 8px;
	background: #e53fb4;
	background: -webkit-gradient(linear, left top, left bottom, from(#e53fb4), to(#ab50df));
	background: -moz-linear-gradient(top, #e53fb4, #ab50df);
	background: -ms-linear-gradient(top, #e53fb4, #ab50df);
	background: -o-linear-gradient(top, #e53fb4, #ab50df);
	background: gradient(top, #e53fb4, #ab50df);
	position: relative;
}
#top #top_hint p {
	color: #fff !important;
}
.img_QRcode {
	float: right;
	margin: 0 0 0 10px;
	display: block;
}

@media screen and (min-width:641px) {
#top #contents {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 1200px;
	margin: 0px auto 0px auto;
	padding-top: 55px;
	width: 1200px;
	height: auto;
}
#top #contents_inner {
	padding: 30px 100px 0px;
}
#top .box {
	margin: 0 auto;
	padding: 0px 0px 20px 0px;
	width: auto;
}
#top #top_visual {
	width: 100%;
	margin: 0px;
	padding: 0px;
}

}

@media screen and (max-width: 640px) {
#top {
	background-image: url(../img/img_home_bg.jpg);
	background-repeat: repeat;
	background-position: 50% 0px;
}

#top #contents {
	padding: 55px 0px 90px 0px;
	width: auto;
	height: auto;
}
#top #top_visual {
	display: block;
	text-align: left;
	text-indent: 0px;
	width: 100%;
	margin-bottom: 24px;
}
#top #top_visual img {
	width: 100%;
	height: auto;
}
#top .disc {
	/*display: none;*/
}

#top #contents_inner {
	margin: 0px 20px 0px;
}
#top #contents_inner img {
	width: 100%;
	height: auto;
}
#top #top_visual {
	width: 100%;
}
}

#contents #copyright {
	font-size: 74%;
	line-height: 1.8em;
	margin-top: 50px;
	color: #000000 !important;
}
#contents #copyright p {
	line-height: 1.4em;
	margin-bottom:1em;
}


@media screen and (max-width: 640px) {
#contents #copyright {
	font-size: 10px;
	line-height: 1.8em;
	margin: 30px 0px 0px;
}
}



/* -----------------------------------------------------
	story.html
----------------------------------------------------- */
@media screen and (min-width: 641px) {
#story #contents {
	padding: 55px 0px 0px 0px;
	width: 1200px;
	font-size: 0px;
	line-height: 0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
}

@media screen and (max-width: 640px) {
#story #contents {
	padding: 55px 0px 0px 0px;
	font-size: 0px;
	line-height: 0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
}

#story #contents img {
	width: 100%;
}

/* -----------------------------------------------------
	start.html
----------------------------------------------------- */
#start .heading01L {
	width: 334px;
	background: url(../img/img_heading01_y_bg.png) no-repeat 0px 0px;
}

#start .table01 {
	margin-bottom: 30px;
}

#start .startBox p img {
	margin-left: 5px;
	margin-right: 5px;
	vertical-align: middle;
}

@media screen and (min-width: 641px) {
#start .image01 {
	padding-top: 190px;
	padding-bottom: 24px;
}
#start .table01 th {
	width: 32%;
}
#start .startBox {
	width: 987px;
	background: url(../img/img_companion_box_bg.png) no-repeat center center;
	background-size: 100% 100%;
}
#start .startBox p {
	padding: 32px 40px 22px;
	font-size: 100%;
	line-height: 1.6;
	vertical-align: text-bottom;
}
#start .startBox p span {
	padding-right: 30px;
	font-size: 125%;
	font-weight: bold;
}
#start .startBox p img {
	height: 30px;
}

}

@media screen and (max-width: 640px) {
#start .startBox {
	width: 100%;
	background: url(../img/small/img_companion_box_bg.png) no-repeat center center;
	background-size: 100% 100%;
}
#start .startBox p {
	padding: 20px;
	font-size: 100%;
	line-height: 1.6;
}
#start .startBox p span {
	font-size: 125%;
	font-weight: bold;
	display: block;
}
#start .startBox p img {
	height: 24px;
}
}

/* -----------------------------------------------------
	control1.html
----------------------------------------------------- */

@media screen and (min-width: 641px) {
#control1 .table01 th {
	width: 30%;
}
#control1 .image02 {
	padding-bottom: 32px;
	width: auto;
	margin-left: -100px;
	margin-right: -100px;
}
#control1 .image02 img {
	width: 100%;
}
}

@media screen and (max-width: 640px) {
#control1 #contents {
	padding-top: 55px;
}
#control1 .scrollFixed {
	position: fixed;
	left: 0px;
	box-sizing: border-box;
	width: 100%;
	min-width: 320px;
	margin-left: 0px !important;
	margin-right: 0px !important;
	z-index: 10;
}
#control1 #fixed01 {
	box-sizing: border-box;
	min-width: 320px;
	margin-left: -20px;
	margin-right: -20px;
	margin-bottom: 32px;
	background: url(../img/bg_pop.png) repeat center center;
}
#control1 #fixed01 img {
	width: 100%;
}
}


/* -----------------------------------------------------
	control2.html
----------------------------------------------------- */
#control2 .table01 {
	width: 100%;
}

@media screen and (min-width: 641px) {
#control2 .image01 {
	padding-top: 72px;
	padding-bottom: 24px;
}
#control2 .section02 .image01 {
	padding-top: 40px;
	padding-bottom: 24px;
}
#control2 .box-left .heading01 {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 1000px;
}
#control2 .table01 th {
	width: 32%;
}
}

@media screen and (max-width: 640px) {
}


/* -----------------------------------------------------
	advance.html
----------------------------------------------------- */
@media screen and (min-width: 641px) {
#advance img.iconA {
	margin-left: 5px;
	margin-right: 5px;
	height: 30px;
	vertical-align: middle;
}
}

@media screen and (max-width: 640px) {
#advance img.iconA {
	margin-left: 5px;
	margin-right: 5px;
	height: 24px;
	vertical-align: middle;
}
}

/* -----------------------------------------------------
	camera1.html
----------------------------------------------------- */

@media screen and (min-width: 641px) {
#camera1 .table02 th {
	width: 25%;
}
#camera1 .image02 {
	padding-bottom: 20px;
}
}

@media screen and (max-width: 640px) {
#camera1 #contents {
	padding-top: 55px;
}
#camera1 .scrollFixed {
	position: fixed;
	left: 0px;
	box-sizing: border-box;
	width: 100%;
	min-width: 320px;
	margin-left: 0px !important;
	margin-right: 0px !important;
	z-index: 10;
}
#camera1 #fixed01 {
	box-sizing: border-box;
	min-width: 320px;
	margin-left: -20px;
	margin-right: -20px;
	margin-bottom: 32px;
	background: url(../img/bg_pop.png) repeat center center;
}
#camera1 #fixed01 img {
	width: 100%;
}
}

/* -----------------------------------------------------
	camera2.html
----------------------------------------------------- */
@media screen and (min-width: 641px) {
#camera2 .table03 tr th {
	width: 70px;
}
}

@media screen and (max-width: 640px) {
}


/* -----------------------------------------------------
	camera3.html
----------------------------------------------------- */
#camera3 .camera3Ul {
	padding-top: 20px;
	padding-bottom: 20px;
}

#camera3 .camera3Ul:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
#camera3 .camera3Ul li img {
	width: 100%;
}


@media screen and (min-width: 641px) {
#camera3 .camera3Ul {
	background: url(../img/img_arrow_camera3.png) no-repeat center center;
}

#camera3 .camera3Ul li {
	width: 450px;
	float: right;
}

#camera3 .camera3Ul li:first-child {
	float: left;
}
}

@media screen and (max-width: 640px) {
#camera3 .camera3Ul {
	background: url(../img/small/img_arrow_camera3.png) no-repeat center center;
}

#camera3 .camera3Ul li {
	width: 100%;
}

#camera3 .camera3Ul li:first-child {
	padding-bottom: 100px;
}
}


/* -----------------------------------------------------
	character.html
----------------------------------------------------- */

@media screen and (min-width: 641px) {
#character .image02 {
	padding-bottom: 20px;
}
#character .table03 tr th {
	width: 25%;
}
#character .table03 tr th img {
	margin: 0px 5px;
}
}

@media screen and (max-width: 640px) {
#character #contents {
	padding-top: 55px;
}
#character .scrollFixed {
	position: fixed;
	left: 0px;
	box-sizing: border-box;
	width: 100%;
	min-width: 320px;
	margin-left: 0px !important;
	margin-right: 0px !important;
	z-index: 10;
}
#character #fixed01 {
	box-sizing: border-box;
	min-width: 320px;
	margin-left: -20px;
	margin-right: -20px;
	margin-bottom: 32px;
	background: url(../img/bg_pop.png) repeat center center;
}
#character #fixed01 img {
	width: 100%;
}
#character .table03 tr th img {
	margin-right: 10px;
}
}

/* -----------------------------------------------------
	variety.html
----------------------------------------------------- */
#companion .companionUl {
	padding-bottom: 40px;
}

#companion .companionUl:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
#companion .companionUl li img {
	width: 100%;
}


@media screen and (min-width: 641px) {
#companion .companionUl li {
	width: 490px;
	float: right;
}

#companion .companionUl li:first-child {
	float: left;
}
#companion .companionBox {
	width: 987px;
	background: url(../img/img_companion_box_bg.png) no-repeat center center;
	background-size: 100% 100%;
}
#companion .companionBox p {
	padding: 32px 40px 22px;
	font-size: 100%;
	line-height: 1.6;
	vertical-align: text-bottom;
}
#companion .companionBox p span {
	padding-right: 30px;
	font-size: 125%;
	font-weight: bold;
}
}

@media screen and (max-width: 640px) {
#companion .companionUl li {
	width: 100%;
}

#companion .companionUl li:first-child {
	padding-bottom: 20px;
}
#companion .companionBox {
	width: 100%;
	background: url(../img/small/img_companion_box_bg.png) no-repeat center center;
	background-size: 100% 100%;
}
#companion .companionBox p {
	padding: 20px;
	font-size: 100%;
	line-height: 1.6;
}
#companion .companionBox p span {
	font-size: 125%;
	font-weight: bold;
	display: block;
}
}
