@charset "UTF-8";
/*
* 07_rpa.css
*
*/

/* #mirai.07_rpa
---------------------------------------------------------- */
#mirai #categoryVisual-story-bg h1{
color: #ffffff;
font-size: 50px;
line-height: 1;
font-weight: normal;
font-feature-settings : "palt";
margin-top: 28px;
margin-bottom: 15px;
}

#mirai #categoryVisual-story-bg h2{
color: #ffffff;
font-size: 20px;
line-height: 1;
font-feature-settings : "palt";
}


#mirai #categoryVisual-story-bg {
 background-image: url(../07_rpa/img/mv_pc.jpg);
 background-position: center center;
 background-repeat: no-repeat;
 height: 200px;
 background-size: cover;
}
#mirai .copy {
background-color: #e0e0e7;
font-size: 20px;
color: #1d2088;
}
#mirai h2.ttl {
color: #0048ff;
font-size: 30px;
border-bottom: 2px solid #0D48FF;
display: inline-block;
line-height: normal;
margin-bottom: 1em;
padding-bottom: 0.4em;
margin-top: 0.5em;
}
#mirai .img-block.left {
float: left;
width: 590px;
}
#mirai .img-block.right {
float: right;
width: 247px;
text-align: center;
margin-right: 50px;
}
#mirai h3.h_ttl {
color: #000000;
font-size: 2rem;
border-bottom: 2px solid #DFDFE7;
margin-bottom: 1em;
}

/* .manga common
---------------------------------------------------------- */
ol.manga{
	margin: 0px 0px 6em !important;
	position: relative;
}
ol.manga::after{
content: "";
display: block;
clear: both;
}
ol.manga li{
	margin-bottom: 1em;
	float: left;
}
ol.manga li.right{
float: right;
}
ol.manga li.left{
float: left;
}

/* .manga
---------------------------------------------------------- */
ol.manga.m02 li:nth-child(2){
margin-bottom: 9px;
}
ol.manga.m04 li:nth-child(1){
margin-right: -20px;
margin-bottom: 30px;
}
ol.manga.m04 li:nth-child(2){
	margin-bottom: 30px;
}
ol.manga.m04 li:nth-child(4){
margin-bottom: 28px;
}
ol.manga.m06 li:nth-child(3){
	margin-left: -18px;
	margin-top: -39px;
}
ol.manga.m08 li:nth-child(1){
	position: absolute;
	right: 0;
}


/* links
---------------------------------------------------------- */
.links{
margin-right: -15px; 
}

.links li {
width: 480px;
background-color: #FFFFFF;
vertical-align: top;
position: relative;
display: table;
margin-bottom: 10px;
margin-right: 15px; 
float: left;
}

.links li:nth-child(even){
	margin-right: 0px; 
}
	
#mirai .links li .arw01 {
	display: block;
	padding-right: 0px;
	height: 2.2em;
	background-image: url(../../img/arw.png);
	background-repeat: no-repeat;
	background-position: right 0.2em !important;
}

.links li a{
	font-size: 16px !important;
	line-height: 1.6 !important;
	display: block;
	padding: 1.5em 10px 1.5em 30px;
	font-weight: bold;
}

.links li:hover,
.links li:hover p,
.links li a:hover,
.links li p:hover{
	background-color: #F2F8FC !important;
	color: #2EC5DF !important;
	text-decoration: underline!important;
	cursor: pointer;
}

.links li p{
	display: block;
	padding-top: 20px;
	font-size: 14px !important;
	line-height: 1.6 !important;
	font-weight: normal;
	color: #000000;
	padding-right: 20px;
}



@media screen and (max-width:767px) and (min-width:1px) {
#mirai #categoryVisual-story-bg h1{
font-size: 30px;
}

#mirai section img {
	width: 100%;
}

#mirai section img.sp_50 {
	width: 50%;
}

#mirai .copy {
font-size: 18px;
}

/* .manga common
---------------------------------------------------------- */
ol.manga{
	margin: 0px 0px 6em !important;
	position: relative;
}
ol.manga li{
	margin-bottom: 1em;
	float: none;
	text-align: center;
}
ol.manga li.right{
	float: none;
}
ol.manga li.left{
	float: none;
}
ol.manga.m02 li:nth-child(2){
margin-bottom: 1em;
}
ol.manga.m04 li:nth-child(1){
margin-right: 0px;
margin-bottom: 0em;
}
ol.manga.m04 li:nth-child(2){
margin-bottom: 1em;
}
ol.manga.m04 li:nth-child(4){
margin-bottom: 1em;
}
ol.manga.m06 li:nth-child(3){
	margin-left: 0px;
	margin-top: 0px;
}
ol.manga.m08 li:nth-child(1){
	position: relative;
}

#mirai #categoryVisual-story-bg {
 background-image: url(../07_rpa/img/mv_sp.jpg);
 background-size: cover;
}

/* links
---------------------------------------------------------- */
.links{
margin-right: 0px; 
}

.links li {
	width: 100%;
	float: none;
	height: auto !important;
}

.links li a{
	text-align: left;
	padding-left: 20px;
}

.links li p{
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
	
#mirai .links li .arw01 {
	padding-right: 20px;
	height: auto;
	background-image: url(../../img/arw.png);
	background-repeat: no-repeat;
	background-position: right center !important;
}


}