@charset "UTF-8";
/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [HOME]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#home {
		background-color: #FFF2F6;
}
body#home #header:before,
body#home #header:after {
		background-color: #FF6175;
}
@media screen and (min-width: 640px) {
	#content.home {
		background-image: url(../../img/content_back.png);
		background-position: center 700px;
	}
	#content.home div.inner {
		padding-top: 15px;
	}
	#content.home:before {
		content: "";
		width: 100%;
		height: 870px;
		min-width: 960px;
		margin: 0 auto;
		background-image: url(../../img/chara_back.jpg);
		background-repeat: no-repeat;
		background-position: top center;
		background-size: cover;
		display: block;
		position: absolute;
		z-index: 10;
		top: -130px;
		right: 0;
		left: 0;
	}
	#content.home:after {
		content: "";
		width: 100%;
		height: 5px;
		min-width: 960px;
		background-image: url(../img/line_gold.jpg);
		background-repeat: repeat-x;
		background-position: top center;
		box-shadow: 0 -1px 2px rgba(0,0,0,0.2);
		display: block;
		position: absolute;
		z-index: 10;
		top: 740px;
		left: 0;
	}
}



/* ******* #topic ******* */
#content.home #topic {
		padding: 10px 0 4px;
		background-color: #4B2C00;
		background-image: url(../img/pattern_check.png);
		background-repeat: repeat;
		box-shadow: 0 0 5px #000;
		position: relative;
}

#content.home #topic ul:first-child {
		background-color: #FFF;
		position: relative;
}
#content.home #topic ul:first-child:after {
		content: "";
		width: 100%;
		height: 0;
		padding-top: 60.60%;
		display: block;
}
#content.home #topic ul:first-child li {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0.0;
		pointer-events: none;
		-webkit-transition: opacity 0.5s linear;
		transition: opacity 0.5s linear;
}
#content.home #topic ul:first-child li a {
		display: block;
}
#content.home #topic ul:last-child {
		padding-top: 15px;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row nowrap;
		flex-flow: row nowrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		position: relative;
}
#content.home #topic ul:last-child:before {
		content: "";
		width: 100%;
		height: 13px;
		margin: 0 auto;
		background-image: url(../../img/topic_label.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 150px 10px;
		position: absolute;
		top: 1px;
		right: 0;
		left: 0;
}
#content.home #topic ul:last-child:after {
		content: "";
		height: 0;
-		display: block;
		clear: both;
}
#content.home #topic ul:last-child li {
		width: 30%;
		margin: 0 1.5%;
		background-color: #000;
		border-radius: 10px;
		opacity: 0.8;
		will-change: transform, opacity;
		-webkit-transition: opacity 0.5s linear;
		transition: opacity 0.5s linear;
		float: left;
}
#content.home #topic ul:last-child li a {
		border-radius: 10px;
}
#content.home #topic ul:last-child li a img {
		border-radius: 10px;
}

#content.home #topic.topic1 ul:first-child li:nth-child(1),
#content.home #topic.topic2 ul:first-child li:nth-child(2),
#content.home #topic.topic3 ul:first-child li:nth-child(3) {
		pointer-events: auto;
		opacity: 1.0;
}
#content.home #topic.topic1 ul:last-child li:nth-child(1),
#content.home #topic.topic2 ul:last-child li:nth-child(2),
#content.home #topic.topic3 ul:last-child li:nth-child(3) {
		opacity: 1.0;
}

@media screen and (min-width: 640px) {
	#content.home #topic {
		width: 670px;
		height: 600px;
		padding: 5px;
		border-radius: 3px;
	}
	#content.home #topic ul:first-child li {
		width: 660px;
		height: 400px;
	}
	#content.home #topic p {
		margin: 0 0 10px;
	}
	#content.home #topic ul:last-child {
			padding-top: 20px;
	}
	#content.home #topic ul:last-child:before {
			content: "";
			width: 100%;
			height: 20px;
			top: 0px;
	}
}



/* ******* #chara ******* */
#content.home #chara {
		display: none;
}
@media screen and (min-width: 640px) {
	#content.home #chara {
		width: 600px;
		height: 740px; /* #content:before */
		overflow: hidden;
		display: block;
		position: absolute;
		z-index: 10;
		top: 0;
		right: -150px;
	}
	#content.home #chara p:first-child {
		position: relative;
		z-index: 10;
	}
	#content.home #chara p:first-child.h160 {
		top: 40px;
	}
	#content.home #chara p:first-child.h150 {
		top: 20px;
	}
	#content.home #chara p:first-child.h140,
	#content.home #chara p:first-child.h130 {
		top: -10px;
	}
	#content.home #chara p:first-child + p {
		width: 300px;
		margin: 0 auto;
		position: absolute;
		z-index: 15;
		top: 10px;
		right: 0;
		left: 0;
	}
	#content.home #chara p:last-child {
		width: 270px;
		height: 85px;
		padding-top: 25px;
		background-image: url(../../img/chara_balloon.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		text-align: center;
		line-height: 24px;
		position: absolute;
		top: 485px;
		right: 153px;
	}
	#content.home #chara p:last-child strong {
		color: #C10;
		font-size: 2.0rem;
		font-weight: bold;
	}
	#content.home #chara p:last-child a {
		font-size: 1.4rem;
	}
	#content.home #chara p:last-child a:before {
		content: "\f138\ ";
	}
	#wrapper.on #content.home #chara p:first-child {
		-webkit-animation: walkIn 0.5s ease-in 0.5s 1 normal;
		animation: walkIn 0.5s ease-in 0.5s 1 normal;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}
	#wrapper.on #content.home #chara p:first-child + p {
		-webkit-animation: bounceIn 0.5s linear 1.25s 1 normal;
		animation: bounceIn 0.5s linear 1.25s 1 normal;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
		-webkit-transform-origin: center bottom;
		transform-origin: center bottom;
	}
	#wrapper.on #content.home #chara p:last-child {
		-webkit-animation: bounceIn 0.5s linear 1.5s 1 normal;
		animation: bounceIn 0.5s linear 1.5s 1 normal;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
		-webkit-transform-origin: center top;
		transform-origin: center top;
	}
}




/* ******* #lead ******* */
#content.home #lead {
		margin: 10px 20px 40px;
		position: relative;
}
#content.home #lead p {
		margin: 0 0 10px;
		text-align: center;
}

@media screen and (min-width: 640px) {
	#content.home #lead {
		margin: 20px 0 50px;
	}
	#content.home #lead p {
		margin: 0;
	}
	#content.home #lead:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
	}
	#content.home #lead p {
		width: 50%;
		text-align: center;
		float: left;
	}
	#content.home #lead p a {
		display: inline-block;
	}
}



/* ******* #news ******* */
#content.home #news {
		padding: 0 0 10px;
		margin: 0 5px 50px;
    background-color: #243E25;
    border-style: solid;
    border-width: 5px 5px 5px 5px;
    -webkit-border-image: url(../../img/news_frame.jpg) 5 5 5 5 stretch;
    -moz-border-image: url(../../img/news_frame.jpg) 5 5 5 5 stretch;
    -o-border-image: url(../../img/news_frame.jpg) 5 5 5 5 stretch;
    border-image: url(../../img/news_frame.jpg) 5 5 5 5 fill stretch;
}
#content.home #news h3 {
		width: 368px;
		height: 55px;
		margin-bottom: -15px;
		padding: 12px 0 0 30px;
		background-image: url(../../img/news_headback.png);
		background-repeat: no-repeat;
		background-position: center bottom;
		background-size: 368px 55px;
		color: #FFF;
		font-size: 2.4rem;
		position: relative;
		top: -26px;
		left: -21px;
}
#content.home #news h3 small:before,
#content.home #news h3 small:after {
		content: "-";
		margin: 0 10px;
}
#content.home #news h3 + ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
}
#content.home #news h3 + ul li {
		margin: 0 5px 15px;
}
#content.home #news h3 + ul li a {
		padding: 5px 10px;
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			linear-gradient(to bottom,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
		border: solid 1px #FFF;
		border-radius: 20px;
		color: #FFF;
		font-size: 1.4rem;
		text-shadow: 1px 1px 1px #777;
		display: block;
}

#content.home #newsbox ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
}
#content.home #newsbox ul:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
}
#content.home #newsbox ul li {
		width: 230px;
		height: 325px;
		margin: 10px;
		background-color: #FFF;
		box-shadow: 3px 3px 5px rgba(0,0,0,0.7);
		position: relative;
		float: left;

		will-change: transform, opacity;
		-webkit-animation: fadeInDownLittle 0.5s ease 0.0s 1 normal;
		animation: fadeInDownLittle 0.5s ease 0.0s 1 normal;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
}
#content.home #newsbox ul li:nth-child(1) {
		-webkit-animation-delay: 0.1s;
}
#content.home #newsbox ul li:nth-child(2) {
		-webkit-animation-delay: 0.2s;
}
#content.home #newsbox ul li:nth-child(3) {
		-webkit-animation-delay: 0.3s;
}
#content.home #newsbox ul li:nth-child(4) {
		-webkit-animation-delay: 0.4s;
}
#content.home #newsbox ul li p:first-child,
#content.home #newsbox ul li p:first-child + p {
		width: 100px;
		height: 15px;
		color: #FFF;
		line-height: 15px;
		position: absolute;
}
#content.home #newsbox ul li p:first-child {
		font-size: 1.2rem;
		border-radius: 8px;
		text-align: center;
		top: 4px;
		right: 8px;
}
#content.home #newsbox ul li p:first-child + p {
		font-size: 1.4rem;
		top: 5px;
		left: 8px;
}
#content.home #newsbox ul li.new p:first-child + p {
		color: #FFFF10;
}
#content.home #newsbox ul li p:first-child + p + p {
		padding-top: 25px;
		background-color: #1B3141;
}

#content.home #newsbox ul li a {
		display: block;
}
#content.home #newsbox ul li dl {
		padding: 5px 0 0;
}
#content.home #newsbox ul li dl dt {
		height: 66px;
		padding: 0 10px;
		color: #630;
		font-size: 1.6rem;
		text-shadow: 0 0 5px #FF6175;
		line-height: 21px;
}
#content.home #newsbox ul li dl dd {
		height: 75px;
		padding: 0 10px;
		color: #777;
		font-size: 1.4rem;
		line-height: 18px;
}
#content.home #newsbox ul li > a:last-child {
		padding: 0 10px;
		font-size: 1.4rem;
		text-decoration: underline;
		display: block;
}
#content.home #newsbox ul li > a:last-child:before {
		content: "\f2d2\ ";
}

#content.home #newsbox + p a {
		width: 80%;
		margin: 15px auto;
		padding: 15px;
		border: solid 1px #FFF;
		color: #FFF;
		font-size: 2.0rem;
		text-align: center;
		display: block;
		position: relative;
}
#content.home #newsbox + p a:before {
		content: "\f0f6";
		margin-right: 8px;
}
#content.home #newsbox + p a:after {
		content: "";
		width: 0;
		height: 0;
		border-top: solid 0 transparent;
		border-right: solid 0 transparent;
		border-bottom: solid 15px #FFF;
		border-left: solid 15px transparent;
		position: absolute;
		right: 5px;
		bottom: 5px;
}


@media screen and (min-width: 640px) {
	#content.home #news {
		width: 520px;
		height: 911px;
		float: left;
	}
	#content.home #news h3 {
		padding-top: 9px;
	}
	#content.home #news h3 + ul li a {
			padding: 5px 20px;
	}
	#content.home #newsbox ul li dl dt {
			color: #333;
			height: 66px;
			font-size: 1.4rem;
	}
	#content.home #newsbox ul li dl dd {
			color: #777;
			height: 70px;
			font-size: 1.2rem;
	}
}



/* ******* #movie ******* */
#content.home #movie {
		margin: 0 20px 40px;
		background-color: rgba(255,255,255,0.9);
		border: solid 1px rgba(255,191,127,0.2);
		border-radius: 10px;
		box-shadow: 0 0 10px rgba(255,191,127,1.0);
}
#content.home #movie div.box a,
#content.home #movie div.box p {
		animation: fadeIn 0.2s linear 0.0s 1 normal;
		animation-fill-mode: both;
}
#content.home #movie h3 {
		background-color: #FFBF7F;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #FFBF7F;
		font-size: 3.0rem;
		text-align: center;
		text-shadow: 3px 3px 3px #C96;
		position: relative;
		top: -20px;
}
#content.home #movie h3:before {
		content: "\f008";
		margin-right: 8px;
}
#content.home #movie h3 + div {
		width: 90%;
		margin: 0 auto 15px;
		padding-top: 56.25%;
		position: relative;
}
#content.home #movie h3 + div iframe {
		width: 100% !important;
		height: 100% !important;
		box-shadow:
			0 0 0 1px #000,
			0 0 0 2px #FFF;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
}
#content.home #movie h3 + div + p {
		width: 90%;
		margin: 0 auto 15px;
		padding: 5px 0 7px;
		border-radius: 5px;
		box-shadow: 0 0 10px rgba(255,191,127,1.0);
		text-align: center;
		line-height: 21px;
}
#content.home #movie h3 + div + p span {
		color: #FF7F00;
		font-size: 1.2rem;
		display: block;
}
#content.home #movie h3 + div + p strong {
		color: #FF7F00;
		font-size: 1.6rem;
		display: block;1
}
#content.home #movie h3 + div + p small {
		color: #777;
		font-size: 1.4rem;
		display: block;
}

#content.home #movie ul {
		width: 90%:
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
}
#content.home #movie ul li {
		margin: 0 5px 10px;
}
#content.home #movie ul li a {
		padding: 5px 15px;
    background-color: #E57300;
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			linear-gradient(to bottom,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
		border-radius: 20px;
    color: #FFF;
    font-size: 1.4rem;
    text-decoration: none;
		display: block;
}
#content.home #movie ul li a:before {
		margin-right: 8px;
}
#content.home #movie ul li:nth-child(1) a {
		background-color: #E00;
}
#content.home #movie ul li:nth-child(1) a:before {
		content: "\f16a";
}
#content.home #movie ul li:nth-child(2) a:before {
		content: "\f02d";
}
#content.home #movie ul li:nth-child(3) a:before {
		content: "\f021";
}

@media screen and (min-width: 640px) {
	#content.home #movie {
		width: 400px;
		height: 420px;
		margin: 0 0 40px 10px;
		float: left;
	}
}


/* ******* #twitter ******* */
#content.home #twitter {
		margin: 0 20px 40px;
		background-color: rgba(255,255,255,0.9);
		border: solid 1px rgba(127,170,255,0.2);
		border-radius: 10px;
		box-shadow: 0 0 10px rgba(127,170,255,0.7);
}
#content.home #twitter h3 {
		background-color: #7FAAFF;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #7FAAFF;
		font-size: 3.0rem;
		text-align: center;
		text-shadow: 3px 3px 3px #68C;
		position: relative;
		top: -20px;
}
#content.home #twitter h3:before {
		content: "\f099";
		margin-right: 8px;
}
#content.home #twitter h3 + div {
		width: 90%;
		margin: 0 auto 5px;
}
#content.home #twitter h3 + div + p {
		margin: 0 0 10px;
		text-align: center;
}
#content.home #twitter h3 + div + p a {
		padding: 5px 15px;
    background-color: #00ACED;
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			-moz-linear-gradient(top,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
 		background-image:
			linear-gradient(to bottom,
				rgba(255, 255, 255, 0.3) 0%,
				rgba(255, 255, 255, 0.0) 100%);
    border-radius: 20px;
    color: #FFF;
    font-size: 1.4rem;
    text-decoration: none;
    display: inline-block;}
}
#content.home #twitter h3 + div + p a:before {
		content: "\f099";
    margin-right: 3px;
}

@media screen and (min-width: 640px) {
	#content.home #twitter {
		width: 400px;
		margin: 0 0 40px 10px;
		float: left;
	}
}



/* ******* #link ******* */
#content.home #link {
		margin: 0 20px;
		border-radius: 10px;
}
#content.home #link h3 {
		background-color: #FF8A80;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #CC6F66;
		font-size: 3.0rem;
		text-align: center;
		text-shadow: 3px 3px 3px #CC6F66;
		position: relative;
		top: -10px;
}
#content.home #link h3:before {
		content: "\f0c1";
		margin-right: 8px;
}
#content.home #link ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
}
#content.home #link ul li {
		max-width: 45%;
		margin: 2.5%;
		padding: 2px;
		background-color: rgba(255,252,255,0.9);
		border: solid 1px #FF8A80;
		box-shadow: 0 0 10px rgba(255,138,128,1.0);

		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row nowrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
}
#content.home #link ul li a {
		padding: 3px;
		border: dashed 1px #A86200;
		color: #4B2C00;
		font-size: 1.4rem;
		line-height: 21px;
		display: block;
}
#content.home #link ul li a strong {
		padding: 5px 5px 0;
		display: block;
}
#content.home #link ul li a strong br {
		display: none;
}

@media screen and (min-width: 640px) {
	#content.home #link {
		margin: 30px 0 0;
		position: static;
		clear: both;
	}
	#content.home #link h3 {
		margin: 0 20px;
	}
	#content.home #link ul {
			margin: 0 20px;
	}
	#content.home #link ul li {
			max-width: 23%;
			margin: 1%;
	}
	#content.home #link ul li a strong br {
			display: inline;
	}
}




/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [NEWS]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#news {
		background-color: #FFF2F6;
}
body#news #header:before,
body#news #header:after {
		background-color: #FF6175;
}

#content.news h2.simple {
		background-color: #FF6175;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #FF6175;
}

/* ******* Content Style ******* */
#content.news #search {
		margin: 0 0 25px;
		padding: 15px 20px 5px;
		background-color: rgba(255,255,255,0.9);
		border-top: solid 5px #FEE;
		border-bottom: solid 5px #FEE;
}
#content.news #search p:first-child {
		padding: 0 0 5px;
		color: #F00;
		font-size: 1.4rem;
}
#content.news #search input {
		width: 100%;
	  padding: 5px;
		margin: 0 0 8px;
		border-radius: 3px;
		border: solid 1px #A9A9A9;
		border-radius: 3px;
	  font-size: 2.0rem;
		display: block;
}
#content.news #search input + a {
		padding: 5px;
		border-radius: 20px;
		background-color: #FF6175;
		color: #FFF;
		font-size: 1.6rem;
		text-align: center;
		display: block;
}
#content.news #search p {
		padding: 5px 0 0;
}
#content.news #search p br {
		display: none;
}
#content.news #search ul.tag {
		padding: 5px 0 0;
}

#content.news #search ul.year li {
		padding: 0 0 10px;
		float: left;
}
#content.news #search ul.year li a {
		padding: 10px 15px;
		border: solid 2px #FFF;
		border-radius: 3px;
		background-color: #C48DC0;
		color: #FFF;
}
#content.news #search ul.year li.current a {
		background-color: #FF6175;
}

#content.news h4 {
		margin: 20px 10px;
		padding: 5px 10px;
		background-color: #FF6175;
		border-radius: 3px;
		color: #FFF;
}
#content.news h4 + ul {
		margin: 0 20px 40px;
}
#content.news h4 + ul li {
		margin: 0 0 20px;
		padding: 0 0 8px;
		background-color: rgba(255,255,255,0.9);
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
		position: relative;
}
#content.news h4 + ul li p.genre {
		width: 100px;
		margin: 5px 0 0 5px;
		border-radius: 20px;
		text-align: center;
		font-size: 1.4rem;
		float: left;
}
#content.news h4 + ul li p.genre + p {
		margin: 5px 10px 0 0;
		font-size: 1.4rem;
		float: right;
}
#content.news h4 + ul li dl {
		padding: 10px 10px 8px;
		clear: both;
}
#content.news h4 + ul li dl dt {
		margin-bottom: 5px;
		color: #630;
		text-shadow: 0 0 5px #FF6175;
}
#content.news h4 + ul li dl dd {
		padding: 5px 0;
		border-top: solid 1px #EEE;
		border-bottom: solid 1px #EEE;
		font-size: 1.4rem;
}
#content.news h4 + ul li > a:last-child {
		margin: 0 10px;
		font-size: 1.6rem;
		text-decoration: underline;
		display: inline-block;
}
#content.news h4 + ul li > a:last-child:before {
		content: "\f2d2\ ";
}



@media screen and (min-width: 640px) {
	#content.news {
		background-image: url(../../news/img/content_back.png);
		background-position: center 700px;
	}
	#content.news h4 + ul li {
		padding: 5px;
	}
	#content.news h4 + ul li p,
	#content.news h4 + ul li dl {
		margin: 0 15px 0 315px;
	}
	#content.news h4 + ul li p:first-child {
		width: 300px;
		border: solid 1px #630;
		margin: 0;
		float: left;
	}
	#content.news h4 + ul li p.genre {
		width: 150px;
		margin: 0 15px 0 315px;
		position: relative;
		top: 3px;
		float: none;
	}
	#content.news h4 + ul li p.genre + p {
		margin: 0 15px 0 315px;
		position: absolute;
		top: 8px;
		right: 5px;
		float: none;
	}
	#content.news h4 + ul li dl {
		padding: 13px 0 3px;
		clear: none;
	}
	#content.news h4 + ul li dl dd {
		height: 66px;
		padding: 5px;
	}
	#content.news h4 + ul li > a:last-child {
		margin: 0 15px;
	}
	#content.news h4 + ul li:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
	}
}




/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [ABOUT]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#about {
		background-color: #FFF2FE;
}
body#about #header:before,
body#about #header:after {
		background-color: #C48DC0;
}

#content.about h2.simple,
#content.about h4.simple {
		background-color: #C48DC0;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #C48DC0;
}

@media screen and (min-width: 640px) {
	#content.about {
		background-image: url(../../about/img/content_back.png);
		background-position: center 700px;
	}
}


/* ******* Content Style ******* */
#content.about #point,
#content.about #android,
#content.about #free {
		height: 0;
		overflow: hidden;
		opacity: 0.0;
		will-change: opacity;
		-webkit-transition: opacity 0.2s linear;
		transition: opacity 0.2s linear;
}
#content.about #content_point #point,
#content.about #content_android #android,
#content.about #content_free #free {
		height: auto;
		overflow: visible;
		opacity: 1.0;
}
#content.about #content_point h2 + ul li:nth-child(1),
#content.about #content_free h2 + ul li:nth-child(2) {
		opacity: 1.0;
}

#content.about h2 + ul {
		margin: 0 10px 25px;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		-webkit-align-items: top;
		justify-content: center;
		align-items: top;
}
#content.about h2 + ul li {
		width: 48%;
		margin: 0 1%;
		will-change: width, transform, opacity;
		opacity: 0.7;
		-webkit-transition:
				width 0.2s linear,
				opacity 0.2s linear,
				-webkit-transform 0.2s linear;
		transition:
				width 0.2s linear,
				opacity 0.2s linear,
				transform 0.2s linear;
}
#content.about h2 + ul li:first-child {
		width: 100%;
		margin: 0 0 5px;
}

#content.about h3 {
		display: none;
}
#content.about h4.simple {
		margin-bottom: 15px;
}
#content.about p {
		margin: 0 40px 15px;
}
#content.about p br {
		display: none;
}
#content.about p small {
		display: block;
}
#content.about h4 {
		margin-top: 30px;
}

@media screen and (min-width: 640px) {
	#content.about #content_point h2 + ul li:nth-child(1),
	#content.about #content_free h2 + ul li:nth-child(2) {
		width: 45%;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		will-change: width, opacity;
	}
}


/* #point */
#content.about #point p a {
		max-width: 320px;
		margin: 0 auto;
		display: block;
}
#content.about #point ul {
		margin: 0 40px 15px;
}
#content.about #point ul:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
}
#content.about #point ul li {
		width: 48%;
		margin: 1%;
		float: left;
}
#content.about #point ul li a {
		box-shadow:
			0 0 0 2px #FFF,
			0 0 5px 2px rgba(0,0,0,0.2);
		display: block;
}

/* #about */
#content.about #android #howto {
		margin: 0 0 40px;
}
#content.about #android #howto h4 + p {
		margin: 15px 40px 0;
}
#content.about #android #howto div.section {
		margin: 20px 40px;
		padding: 5px 5px 20px;
		background-color: rgba(255,255,255,0.9);
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
#content.about #android #howto div.section h5 {
		padding: 10px;
		background-color: #FF6175;
		color: #FFF;
		font-size: 1.8rem;
		text-align: center;
}
#content.about #android #howto div.section h5.dmm {
		background-color: #EA0000;
}
#content.about #android #howto div.section h5.dlsite {
		background-color: #021865;
}

#content.about #android #howto div.section p {
		margin: 15px 20px 0;
}
#content.about #android #howto div.section h5 + p {
		margin: 5px 0 0;
		padding: 10px 15px;
		background-color: #E5E5E5;
}
#content.about #android #howto div.section p br {
		display: none;
}
#content.about #android #howto div.section ul {
		margin: 10px 20px 0;
}
#content.about #android #howto div.section ul li {
		color: #F00;
}
#content.about #android #howto div.section ul li small:before {
		content: "※";
		margin-right: 5px;
}
#content.about #android #howto div.section ol {
		margin: 10px 20px 0;
}
#content.about #android #howto div.section ol li {
		padding: 10px;
		margin: 20px 0 0;
		border: solid 1px #CCC;
		font-size: 1.6rem;
		position: relative;
}
#content.about #android #howto div.section ol li:before {
		content: "";
		width: 0;
		height: 0;
		margin: 0 auto;
		border-top: solid 10px #CCC;
		border-right: solid 15px transparent;
		border-bottom: solid 10px transparent;
		border-left: solid 15px transparent;
		position: absolute;
		top: -15px;
		right: 0;
		left: 0;
}
#content.about #android #howto div.section ol li:first-child:before {
		display: none;
}
#content.about #android #howto div.section ol li strong {
		color: #EA0000;
}

/* #free */
#content.about #free #download ul {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		-webkit-align-items: top;
		justify-content: center;
		align-items: top;
}
#content.about #free #download ul li {
		margin: 0 40px 15px;
		padding: 5px;
		background-color: rgba(255,255,255,0.5);
		box-shadow: 0 0 5px rgba(0,0,0,0.2);
}
#content.about #free #download ul li:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
}
#content.about #free #download ul li figure figcaption {
		padding: 5px 0;
		text-align: center;
}
#content.about #free #download ul li p {
		width: 48%;
		margin: 0 1% 5px;
		text-align: center;
		float: left;
}
#content.about #free #download ul li p a {
		padding: 5px;
		border-radius: 5px;
		color: #FFF;
		font-family: "GJ-Gothic";
		display: block;
}
#content.about #free #download ul li p.dmm a {
		background-color: #EA0000;
}
#content.about #free #download ul li p.dlsite a {
		background-color: #021865;
}


@media screen and (min-width: 640px) {
	#content.about h2 + ul li,
	#content.about h2 + ul li:first-child {
		width: 27.5%;
		margin: 0;
		opacity: 1.0;
		-webkit-transform: translateY(64px);
		transform: translateY(64px);
	}
	#content.about h4.simple {
			margin-bottom: 25px;
	}
	#content.about p {
		text-align: center;
	}
	#content.about p br {
		display: inline;
	}
	#content.about #point p a {
		max-width: 460px;
		display: inline-block;
	}
	#content.about #point ul li {
		width: 23%;
		margin: 0 1%;
	}
	#content.about #android #howto h4 + p {
		text-align: center;
	}
	#content.about #android #howto div.section {
		margin-right: 100px;
		margin-left: 100px;
	}
	#content.about #android #howto div.section p {
		text-align: left;
	}
	#content.about #android #howto div.section p br {
		display: inline;
	}
	#content.about #free #download ul li {
		width: 400px;
		margin: 10px;
		padding: 5px;
		background-color: rgba(255,255,255,0.8);
		box-shadow: 0 0 5px rgba(0,0,0,0.2);
	}
}




/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [PRODUCT]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#product {
		background-color: #F9FFED;
}
body#product #header:before,
body#product #header:after {
		background-color: #8DC41F;
}

#content.product h2.simple {
		background-color: #8DC41F;
}

@media screen and (min-width: 640px) {
	#content.product {
		background-image: url(../../product/img/content_back.png);
		background-position: center 700px;
	}
}


/* ******* Content Style ******* */
#content.product ul:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
}

#content.product ul.tag li {
		margin: 0 10px 10px 0;
		float: left;
}
#content.product ul.tag li a {
		padding: 3px 8px;
		background-color: #FFD;
		border: solid 3px #FFBF00;
		border-radius: 5px;
		color: #FFBF00;
		font-size: 1.4rem;
		display: block;
}
#content.product ul.tag li a:before {
		content: "\f02c";
		margin-right: 5px;
}
#content.product ul.tag li.clear a {
		content: "\f00d";
		color: #F00;
		background-color: #FDD;
		border: solid 3px #F33;
}
#content.product ul.tag li.clear a:before {
		content: "\f00d";
}

#content.product #search {
		margin: 0 0 25px;
		padding: 15px 20px 5px;
		background-color: rgba(255,255,255,0.9);
		border-top: solid 5px #EFE;
		border-bottom: solid 5px #EFE;
}
#content.product #search p:first-child {
		padding: 0 0 5px;
		color: #F00;
		font-size: 1.4rem;
}
#content.product #search input {
		width: 100%;
	  padding: 5px;
		margin: 0 0 8px;
		border-radius: 3px;
		border: solid 1px #A9A9A9;
		border-radius: 3px;
	  font-size: 2.0rem;
		display: block;
}
#content.product #search input + a {
		padding: 5px;
		border-radius: 20px;
		background-color: #FF6175;
		color: #FFF;
		font-size: 1.6rem;
		text-align: center;
		display: block;
}
#content.product #search p {
		padding: 5px 0 0;
}
#content.product #search p br {
		display: none;
}
#content.product #search ul.tag{
		padding: 5px 0 0;
}

#content.product div.section {
		padding: 0 0 40px;
		background-color: rgba(255,255,250,0.9);
}
#content.product div.section:before {
		content: "";
		height: 5px;
		display: block;
		margin: 0 0 15px;
		background-color: #8DC41F;
		background-image:
			-moz-linear-gradient(left,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
    background-image:
			-webkit-linear-gradient(left,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
		background-image:
			linear-gradient(to right,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
		background-size: 15px 100%;
}

#content.product div.section h3 {
		margin: 10px 20px 15px;
		padding: 0 0 0 10px;
		border-left: solid 8px #FFBF00;
}
#content.product div.section h3 span {
		font-size: 1.4rem;
		display: block;
}
#content.product div.section h3 strong {
		font-size: 2.0rem;
		display: inline;
}
#content.product div.section h3 + p {
		margin: 0 23px 15px;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 3px #4E3107;
}
#content.product div.section dl {
		margin: 0 20px;
}
#content.product div.section dl dt {
		padding: 0 8px;
		background-color: #86BA1D;
		color: #FFF;
		font-size: 1.4rem;
}
#content.product div.section dl dd {
		padding: 5px 8px;
}
#content.product div.section dl + ul {
		margin: 0 20px;
}
#content.product div.section dl + ul li {
		color: #FFF;
		margin: 10px 0 0;
}
#content.product div.section dl + ul li a {
		padding: 5px 10px;
		background-color: #00B4E6;
		border-radius: 5px;
		color: #FFF;
		font-size: 1.6rem;
		display: block;
		position: relative;

		will-change: background-color;
		-webkit-transition:
			background-color 0.2s linear;
		transition:
			background-color 0.2s linear;
}
#content.product div.section dl + ul li a:before {
		content: "\f138";
		margin-right: 6px;
}
#content.product div.section dl + ul li a small {
		position: relative;
		top: -1px;
		left: 2px;
}
#content.product div.section dl + ul li.official a:before {
		content: "\f02d";
}
#content.product div.section dl + ul li.shop a:before {
		content: "\f07a";
}
#content.product div.section dl + ul li.dlsite a:before,
#content.product div.section dl + ul li.dmm a:before {
		content: "\f005";
}
#content.product div.section dl + ul li.dlsite.free a:before,
#content.product div.section dl + ul li.dmm.free a:before {
		content: "\f006";
}
#content.product div.section dl + ul li.dlsite.campaign a:after,
#content.product div.section dl + ul li.dmm.campaign a:after {
		padding: 0 10px;
		content: "DL版 50％OFF‼";
		background-color: #C58FC1;
		color: #FFF;
		position: absolute;
		right: 5px;
		animation: blink 2.0s ease 0.0s infinite normal;
		will-change: opacity;
}
#content.product div.section dl + ul li.dmm a {
		background-color: #EA0000;
}
#content.product div.section dl + ul li.dlsite a {
		background-color: #021865;
}
#content.product div.section dl + ul li a:hover,
#content.product div.section dl + ul li.dmm a:hover,
#content.product div.section dl + ul li.dlsite a:hover {
		background-color: #FFBF00;
}
#content.product div.section ul.tag {
		margin: 15px 20px 0;
}


@media screen and (min-width: 500px) {
	#content.product #search p br {
		display: inline;
	}
}

@media screen and (min-width: 640px) {
	#content.product #search {
		margin: 0 0 40px;
		border-right: solid 5px #EFE;
		border-left: solid 5px #EFE;
	}
	#content.product #search input {
		width: 300px;
		margin: 0 8px;
	  font-size: 1.6rem;
		display: inline-block;
		position: relative;
		top: -1px;
	}
	#content.product #search input + a {
		padding: 0 15px;
		display: inline-block;
	}
	#content.product div.section {
		margin: 0 0 30px;
		padding: 0 0 10px;
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
	}
	#content.product div.section:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
	}
	#content.product div.section h3 + p {
		width: 400px;
		margin: 0 0 0 23px;
		float: left;
	}
	#content.product div.section dl {
		width: 480px;
		margin: 0 20px 0 0;
		float: right;
	}
	#content.product div.section dl dt,
	#content.product div.section dl dd {
		margin: 0 0 10px;
		padding: 0 10px;
	}
	#content.product div.section dl dt {
		width: 80px;
		text-align: center;
		float: left;
	}
	#content.product div.section dl dd {
		width: 400px;
		float: left;
	}
	#content.product div.section dl + ul {
		width: 480px;
		margin: 0 20px 0 0;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: left;
		justify-content: left;
		-webkit-align-items: center;
		align-items: center;
		float: right;
	}
	#content.product div.section dl + ul li {
		width: 48%;
		padding: 0;
		margin: 0 2% 10px 0;
		text-align: center;
		color: #FFF;
	}
	#content.product div.section dl + ul li.dlsite.campaign a:after,
	#content.product div.section dl + ul li.dmm.campaign a:after {
		content: "DL版 50％OFF‼ ▶";
		left: -170px;
		right: auto;
	}
	#content.product div.section dl + ul li.campaign + li.campaign {
		width: 100%;
	}
	#content.product div.section dl + ul li.campaign + li.campaign a {
		width: 49%;
	}

	#content.product div.section ul.tag {
		width: 400px;
		margin: 255px 0 0 20px;
	}
}




/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [SUPPORT]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#support {
		background-color: #FFF9E8;
}
body#support #header:before,
body#support #header:after {
		background-color: #FFBF00;
}

#content.support h2.simple {
		background-color: #FFBF00;
}
#content.support h4.simple {
		background-color: #FFBF00;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #FFBF00;
		text-shadow: 3px 3px 3px #FFBF00;
}

@media screen and (min-width: 640px) {
	#content.support {
		background-image: url(../../support/img/content_back.png);
		background-position: center 700px;
	}
}


/* ******* Content Style ******* */
#content.support .section:before {
		content: "";
		height: 5px;
		display: block;
		background-color: #FFBF00;
		background-image:
			-moz-linear-gradient(left,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
    background-image:
			-webkit-linear-gradient(left,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
		background-image:
			linear-gradient(to right,
				rgba(255,255,255,0.0) 0%,
				rgba(255,255,255,0.0) 50%,
				rgba(255,255,255,0.5) 50%,
				rgba(255,255,255,0.5) 100%
			);
		background-size: 15px 100%;
}
#content.support div.section ol {
		margin: 10px 20px 0;
}
#content.support div.section ol li {
		padding: 10px;
		margin: 20px 0 0;
		border: solid 1px #CCC;
		font-size: 1.6rem;
		position: relative;
}
#content.support div.section ol li:before {
		content: "";
		width: 0;
		height: 0;
		margin: 0 auto;
		border-top: solid 10px #CCC;
		border-right: solid 15px transparent;
		border-bottom: solid 10px transparent;
		border-left: solid 15px transparent;
		position: absolute;
		top: -15px;
		right: 0;
		left: 0;
}
#content.support div.section ol li:first-child:before {
		display: none;
}
#content.support div.section ol li strong {
		color: #EA0000;
}

#content.support h2 + ul {
		margin: 0 0 20px;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
}
#content.support h2 + ul li {
		width: 46%;
		margin: 0 2%;
		position: relative;
		float: left;
}
#content.support h2 + ul li a {
		height: 100%;
		padding: 10px 20px 30px;
		background-color: #C58FC1;
		border-radius: 5px;
		color: #FFF;
		text-align: center;
		display: block;
		position: relative;
}
#content.support h2 + ul li a:after {
		content: "▼";
		color: #FFF;
		display: block;
		position: absolute;
		bottom: 5px;
		right: 0;
		left: 0;
}

#content.support #title {
		margin: 0 0 30px;
}
#content.support #title h3 {
		margin: 0 10px 8px;
		padding: 5px 3px 3px;
		border-bottom: dotted 1px #FF6175;
		color: #630;
		font-size: 1.6rem;
		text-align: center;
		text-shadow: 0 0 5px #FF6175;
}
#content.support #title ul {
		height: 0;
		padding: 3px 0 0; /* li -> box-shadow */
		opacity: 0;
		overflow: hidden;

		-will-change: opacity;
		-webkit-transition:
			opacity 0.2s linear;
		transition:
			opacity 0.2s linear;
}
#content.support #title.on ul {
		height: auto;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: flex-start;
		align-items: flex-start;
		opacity: 1;
}
#content.support #title ul li {
		width: 45%;
		text-align: center;
		margin: 0 1% 10px;
		position: relative;
}
#content.support #title ul li a {
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #4E3107;
		display: block;
}
#content.support #title ul li.current a {
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 3px #FF6175;
}
#content.support #title ul + a {
		margin: 0 10px 30px;
		padding: 5px;
		border-radius: 20px;
		background-color: #FF6175;
		color: #FFF;
		font-size: 1.6rem;
		text-align: center;
		display: block;
}
#content.support #title.on ul + a {
		display: none;
}
#content.support #title ul + a:before {
		content: "\f0c9";
		margin-right: 5px;
}

#content.support h3.visual {
		margin: 0 0 20px;
		padding: 10px 0 0;
		background-color: #FFF;
}
#content.support h3.visual strong {
		padding: 0 10px;
		color: #630;
		font-size: 1.4rem;
		text-align: center;
		display: block;
}

#content.support #recent {
		margin: 0 0 40px;
}
#content.support #recent h4 + ul {
		padding: 20px 20px 0;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
}
#content.support #recent h4 + ul > li {
		margin: 0 25px 15px;
		background-color: rgba(255,255,255,0.9);
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
#content.support #recent h4 + ul > li h5 {
		margin: 0 0 3px;
}
#content.support #recent h4 + ul > li p {
		padding: 0 20px;
		text-align: center;
}
#content.support #recent h4 + ul > li p > small {
		color: #F00;
		font-size: 1.4rem;
		margin: 0 0 0 10px;
		position: relative;
		top: -1px;
		display: block;
}
#content.support #recent h4 + ul > li p > small:before {
		content: "※";
		margin-right: 3px;
}
#content.support #recent h4 + ul > li p a {
		padding: 5px 0;
		background-color: #C58FC1;
		border-radius: 5px;
		color: #FFF;
		font-size: 1.6rem;
		text-align: center;
		display: block;

		will-change: background-color;
		-webkit-transition:
			background-color 0.2s linear;
		transition:
			background-color 0.2s linear;
}
#content.support #recent h4 + ul > li p a:hover {
		background-color: #FFBF00;
}
#content.support #recent h4 + ul > li p a small {
		font-size: 1.4rem;
		position: relative;
		top: -1px;
		display: block;
}
#content.support #recent h4 + ul > li p a:before {
		content: "\f138";
		margin-right: 8px;
}
#content.support #recent h4 + ul > li ul {
		margin: 5px 10px 5px 27px;
		list-style-type: disc;
}
#content.support #recent h4 + ul > li ul li {
		font-size: 1.4rem;
}

#content.support #patch {
		margin: 0 0 40px;
}
#content.support #patch div.section {
		margin: 20px 40px;
		padding: 0 0 20px;
		background-color: rgba(255,255,255,0.9);
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
#content.support #patch h4 + p {
		margin: 15px 40px 0;
}
#content.support #patch h4 + p br {
		display: none;
}
#content.support #patch div.section h5 {
		margin: 0;
		padding: 10px 20px;
		background-color: #FF6175;
		color: #FFF;
		font-size: 1.8rem;
		text-align: center;
}
#content.support #patch div.section h5 + p {
		margin: 15px 20px 0;
}
#content.support #patch div.section h5 + p a {
		padding: 5px;
		background-color: #C58FC1;
		border-radius: 5px;
		color: #FFF;
		font-size: 1.8rem;
		text-align: center;
		display: block;

		will-change: background-color;
		-webkit-transition:
			background-color 0.2s linear;
		transition:
			background-color 0.2s linear;
}
#content.support #patch div.section h5 + p a:hover {
		background-color: #FFBF00;
}
#content.support #patch div.section h5 + p a small {
		font-size: 1.4rem;
		position: relative;
		top: -1px;
		display: block;
}
#content.support #patch div.section h5 + p a:before {
		content: "\f019";
		margin-right: 8px;
}
#content.support #patch div.section h6 {
		margin: 25px 10px 10px;
		padding: 5px 10px 3px;
		border-bottom: dotted 1px #FF6175;
		color: #630;
		font-size: 1.8rem;
		text-shadow: 0 0 5px #FF6175;
}
#content.support #patch div.section h6:before {
		content: "\f0c8";
		margin-right: 5px;
}
#content.support #patch div.section p {
		margin: 0 20px;
		font-size: 1.6rem;
}
#content.support #patch div.section ul {
		margin: 0 20px;
		list-style-type: disc;
		position: relative;
		top: -1px;
		display: block;
}
#content.support #patch div.section ul li {
		margin: 0 21px;
		font-size: 1.6rem;
}

#content.support #qanda {
		margin: 0 0 40px;
}
#content.support #qanda div.section {
		margin: 20px 40px;
		padding: 0 0 20px;
		background-color: rgba(255,255,255,0.9);
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
#content.support #qanda div.section p {
		margin: 40px 20px 0;
		padding: 15px;
		border: solid 1px #CCC;
		border-radius: 3px;
		position: relative;
}
#content.support #qanda div.section p small:last-child {
		margin-top: 10px;
		color: #F00;
		display: block;
}
#content.support #qanda h4 + p {
		margin: 15px 40px 0;
}
#content.support #qanda h4 + p br {
		display: none;
}
#content.support #qanda div.section p:before {
		width: 100%;
		border-radius: 20px;
		color: #FFF;
		font-size: 1.4rem;
		text-align: center;
		display: block;
		position: absolute;
		top: -30px;
		left: 0px;
}
#content.support #qanda div.section p:after {
		content: "";
		width: 0;
		height: 0;
		margin: 0 auto;
		border-right: solid 10px transparent;
		border-bottom: solid 10px transparent;
		border-left: solid 10px transparent;
		position: absolute;
		top: -13px;
		right: 0;
		left: 0;
}
#content.support #qanda div.section p:first-child:before {
		content: "Question";
		background-color: #58C4E1;
}
#content.support #qanda div.section p:last-child:before {
		content: "Answer";
		background-color: #FF6175;
}
#content.support #qanda div.section p:first-child:after {
		border-top: solid 10px #58C4E1;
}
#content.support #qanda div.section p:last-child:after {
		border-top: solid 10px #FF6175;
}


@media screen and (min-width: 450px) {
	#content.support #title ul li {
		width: 46%;
		margin: 0 2% 10px;
	}
}

@media screen and (min-width: 640px) {
	#content.support div.inner:after {
		content: "";
		height: 0;
		display: block;
		clear: both;
	}
	#content.support div.box {
		width: 700px;
		margin: 0 0 30px;
		float: right;
	}
	#content.support h2 + ul {
		width: 700px;
		padding: 0 40px;
		float: right;
/*		display: none; /**/
	}
	#content.support #title {
		width: 240px;
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
		background-color: rgba(255,255,255,0.9);
		float: left;
	}
	#content.support #title ul {
		height: auto;
		padding: 3px 10px 10px;
		opacity: 1.0;
	}
	#content.support #title ul li {
		width: auto;
		margin: 0 10px 10px;
	}
	#content.support #title ul li.current:after {
		content: "";
		width: 0;
		height: 0;
		margin: auto 0;
		border-top: 10px solid transparent;
		border-right: 8px solid transparent;
		border-bottom: 10px solid transparent;
		border-left: 8px solid #FF6175;
		position: absolute;
		top: 0;
		right: -23px;
		bottom: 0;
	}
	#content.support #title ul + a {
		display: none;
	}
	#content.support h3.visual {
		width: 630px;
		margin: 0 30px 30px;
		padding: 10px 10px 0;
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
		-webkit-transform: rotateZ(2deg);
		transform: rotateZ(2deg);
		float: right;
	}
	#content.support #recent  h4 + ul > li {
		width: 46%;
		margin: 0 2%;
		float: left;
	}

	#content.support #qanda h4 + p br {
		display: inline;
	}
	#content.support #qanda div.section p {
		margin: 15px 15px 0 85px;
		position: relative;
	}
	#content.support #qanda div.section p:before {
		width: 50px;
		height: 50px;
		line-height: 50px;
		top: 0px;
		left: -70px;
	}
	#content.support #qanda div.section p:first-child:before {
		content: "Q";
		border-radius: 3px;
		font-size: 3.0rem;
	}
	#content.support #qanda div.section p:last-child:before {
		content: "A";
		border-radius: 3px;
		font-size: 3.0rem;
	}
	#content.support #qanda div.section p:after {
		margin: 0;
		top: 15px;
		right: auto;
		left: -20px;
	}
	#content.support #qanda div.section p:first-child:after {
		border-top-color: transparent;
		border-left-color: #58C4E1;
	}
	#content.support #qanda div.section p:last-child:after {
		border-top-color: transparent;
		border-left-color: #FF6175;
	}
}




/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [CONTACT]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#contact {
		background-color: #FFF5F2;
}
body#contact #header:before,
body#contact #header:after {
		background-color: #FF7F59;
}

#content.contact h2.simple {
		background-color: #FF7F59;
}
#content.contact h3.simple {
		background-color: #FF7F59;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #FF7F59;
		text-shadow: 3px 3px 3px #FF7F59;
}

@media screen and (min-width: 640px) {
	#content.contact {
		background-image: url(../../contact/img/content_back.png);
		background-position: center 700px;
	}
}


/* ******* Content Style ******* */
#content.contact div.section p {
		padding: 15px 40px 0;
		margin: 0 0 5px;
}
#content.contact div.section p:last-child {
		margin-bottom: 30px;
}
#content.contact div.section p strong {
		color: #EA0000;
}
#content.contact h3.simple + p br {
		display: none;
}

#content.contact #form_data table {
		margin: 20px 20px 0;
}
#content.contact #form_data table th {
	  border-left-color: #FF7F59;
		background-color: #FFEBE6;
}


@media screen and (min-width: 640px) {
	#content.contact div.section p:last-child {
		margin-bottom: 50px;
	}
	#content.contact h3.simple + p br {
		display: inline;
	}
	#content.contact #form_data table {
		width: 92%;
		margin: 20px auto;
	}
}


/*━━━━━━━━━━━━━━━━━━━━
▼ CONTENT [APRIL]
━━━━━━━━━━━━━━━━━━━━━*/
/* ******* Base Style ******* */
body#april {
		background-color: #FFF2F6;
}
body#april #header:before,
body#april #header:after {
		background-color: #FF6175;
}

#content.april h2.simple {
		background-color: #FF6175;
}
#content.april h3.simple {
		background-color: #FF6175;
		box-shadow:
			0 0 0 1px #FFF,
			0 0 0 2px #FF6175;
		text-shadow: 3px 3px 3px #FF6175;
}

#content.april p {
		margin: 0 40px 15px;
}
#content.april p br {
		display: none;
}
#content.april p small {
		display: block;
}
#content.april p.info {
		margin: 0px 40px;
}

@media screen and (min-width: 640px) {
	#content.april {
		background-image: url(../../img/content_back.png);
		background-position: center 700px;
	}

	#content.april p {
		text-align: center;
	}
	#content.april p br {
		display: inline;
	}
}


/* ******* Content Style ******* */
#content.april div.section p {
		padding: 15px 40px 0;
		margin: 0 0 5px;
}
#content.april div.section p:last-child {
		margin-bottom: 30px;
}
#content.april div.section p strong {
		color: #EA0000;
}
#content.april h3.simple + p br {
		display: none;
}

#gatya{
	padding: 30px 0px;
    background-image: url(../../april/_img/back.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    margin: 30px 0px;
}

img.gatya_main{
	margin-top: 15px;
}

#gatya_result{
	background-color: rgba(255,255,255,0.5);
    border-radius: 20px;
    padding: 10px;
    margin: 0px 10px 15px;
}

.gatya_box{
	display: inline;
}
.gatya_box img{
	width: 20%;
}

#content.april form p{
	text-align: center;
	margin-bottom: 0px;
}

#content.april input{
	height: auto;
	transition: 0.5s;
}

#content.april input:hover{
	opacity: 0.7;
}

input.try_btn{
	width: 70%;
	border: 0 none;
	padding-top: 20%;
	background: url(../../april/_img/try_btn.png) no-repeat scroll 0 0;
	background-size: contain;
	background-position: bottom;
}

input.again_btn{
	width: 70%;
	border: 0 none;
	padding-top: 20%;
	background: url(../../april/_img/again_btn.png) no-repeat scroll 0 0;
	background-size: contain;
	background-position: bottom;
}

#gatya span.share{
	padding-top: 10%;
}

#gatya span.share img.share_btn{
	width: 65%;
	vertical-align: text-bottom;
}

#gatya span.share a{
	transition: 0.5s;
}

#gatya span.share a:hover{
	opacity: 0.5;
}


@media screen and (min-width: 640px) {
	#content.april input{
		height: auto;
		transition: 0.5s;
	}

	input.again_btn{
		width: 30%;
		padding-top: 10%;
	}

	input.try_btn{
		width: 50%;
		padding-top: 10%;
	}

	#gatya span.share img.share_btn{
		width: 30%;
	}

	#content.april div.section p:last-child {
		margin-bottom: 50px;
	}
	#content.april h3.simple + p br {
		display: inline;
	}
}