@charset "UTF-8";

/*style*/
.mt_5per{margin-top:5%;}
.mb_5per{margin-bottom:5%;}
.fs_08em{font-size: 0.8em;}
.ta_l{text-align:left;}

/*section*/
section.topimg{position:relative;}
#app_download_title{
	position:absolute;
	top:15%;
	left:4%;
	color: #1919a9;
}
#app_download_title h1{
	margin: -5% 0 3% 0;
    font-size: 18px;
    text-align: left;
}

#app_download_title p.title_p{
	margin-bottom: 15%;
    font-size: 26px;
    font-weight: bold;
    text-align: left;
}
.point_1perwaribiki{
    width: 56%;
    text-align: center;
    padding: 2%;
    background-color: #dc0434;
    color: #FFF;
    margin: 2% 0;
    border-radius: 5px;
    font-weight: bold;
}
p.download{display:block;text-align: left;}
p.download a img{width:60%;}
p.download span{font-size:12px;}

.hide {display: none;}

.main {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.main h2 {
	margin: 6% 0;
    font-size: 1.4em;
}

.main h3 {
	margin-top: 10px;
	text-align:center;
}

.det {
	padding: 0 1%;
}

.det1,
.det2,
.det3,
.det4 {
    width: 96%;
    padding: 3% 2% 3% 2%;
    float: left;
    text-align: center;
    background-color: #111184;
    color: #FFF;
    font-size: 1.4em;
    font-weight: bold;
    line-height: 1.3;
}

.mt_5per.mb_5per{text-align:left;line-height:1.3;}

section div.det ul li{display: inline-block;}

.redb {
	color: #FF0000;
	font-weight: bold;
}

.greenb { 
	color: #00A651;
	font-weight: bold;
}

.magentab { 
	color: #E2195B;
	font-weight: bold;
}

.orangeb { 
	color: #FD8C13;
	font-weight: bold;
}

.cp {
	width: 306px;
	margin: -5px auto 0 auto;
	border-left: 2px solid #FFBC06;
	border-right: 2px solid #FFBC06;
	border-bottom: 2px solid #FFBC06;
	background: #FFFCDA;
-webkit-border-radius: 5px;
	text-align: left;
}

.cp1 {
	width: 280px;
	padding: 15px 5px 5px 5px;
	margin: -10px auto 5px auto;
	border: 1px solid #F26D7D;
	background: #FFFFFF;
-webkit-border-radius: 5px;
}

.cp2 {
	width: 280px;
	padding: 15px 5px 5px 5px;
	margin: -10px auto 15px auto;
	border: 1px solid #00A54F;
	background: #FFFFFF;
-webkit-border-radius: 5px;
}

.cp h4 {
	margin-left: 5px;
}

.app_dla {
	margin: 10px 0 5px 0;
}

.app_dli {
	margin: 5px 0 15px 0;
}

.txt_pb {
color:#ED145B;
	font-weight: bold;
}

.txt_gb {
color:#007236;
	font-weight: bold;
}

.att_txt {
	margin-top: 3px;
font-size:9px;
color:#9E0B0E;
}


.app_box {
	width: 100%;
	margin: 15px auto;
	border-top: 2px solid #7E82EC;
	border-bottom: 2px solid #7E82EC;
	text-align: left;
	background: #EBECFB;
}

h4.app_title {
	padding: 6px 0;
    font-size:14px;
	font-weight: bold;
	text-align: center;
	color: #818181;
}

.app_navi ul {
-webkit-border-radius: 8px;
}

.app_box ul {
	padding: 0 0 10px 10px;
	text-align: center;
}

.app_box li {
	width: 150px;
	float: left;
background: -moz-linear-gradient(bottom, #7377ED, #D0D1FC);
background: -webkit-gradient(linear, center bottom, center top, from(#7377ED), to(#D0D1FC));
}

.app_box ul li a {
display: block;
	padding: 7px 0;
	color: #ffffff;
font-size:12px;
}

.app_box ul li:hover {
opacity: 0.5;
}

.app_box ul li.app_r {
	border-right: 1px solid #B4B4B4;
}

.app {
	background: #F8F8F8;
	margin:0 10px 5px 10px;
	padding:5px 0;
	border: 1px solid #5C61F9;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}


/* renewal */

.cp_re {
	width: 306px;
	margin: 0 auto;
	padding: 5px 0 3px 0;
	border-left: 2px solid #00B3FF;
	border-right: 2px solid #00B3FF;
	border-bottom: 2px solid #00B3FF;
	background: #AAE7FF;
-webkit-border-radius: 5px;
	text-align: left;
}

.cp_line {
    font-size:14px;
	width: 280px;
	padding: 15px 5px 5px 5px;
	margin: -10px auto 5px auto;
	border: 1px solid #00B3FF;
	background: #FFFFFF;
-webkit-border-radius: 5px;
}

.cp_re img {
	margin: 5px 0 0 5px;
}

a .txt_re {
    font-size:14px;
	font-weight: bold;
}


/* kitty */

.ki_cp {
	width: 306px;
	margin: -8px auto 0 auto;
	padding: 5px 0 3px 0;
	border-left: 2px solid #FF9BF0;
	border-right: 2px solid #FF9BF0;
	border-bottom: 2px solid #FF9BF0;
	background: #FDE1EF;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

.ki_cp p {
	width: 97%;
	margin: 10px auto 5px auto;
	padding: 2px 0 0 0;
    font-size:11px;
	text-align: center;
	background: #FFFFFF;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

.ki_txt {
	width: 94%;
    font-size:11px;
	margin: -13px auto 0 auto;
	padding: 13px 3px 3px 5px;
	border: 1px solid #F53CB9;
	background: #FFFFFF;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
	text-align: left;
}

.ki_cp h4 {
	text-align: center;
}

.ki_cp div.title_copy {
font-size:9px;
	text-align: right !important;
	margin: 2px 5px 0 0;
}


.sub {
	padding:10px 0 0 0;
	margin:0;
	font-size:14px;
	}
	

.sub ul{
	list-style:none;
	margin: 0;
	padding-top: 5px;
	background:#FBF7E4;
	}
	
.sub ul li.navi_1{
	text-align:left;
	margin:0 5px 5px 5px;
	padding:5px 5px 5px 10px;
	background:#FBF7E4 url(../img/icon_1.png) no-repeat 0 3px;
	border-bottom:1px dotted #999999;
	}
	
.sub ul li.navi_2{
	text-align:left;
	margin:0 5px 15px 5px;
	padding:5px 5px 5px 10px;
	background:#FBF7E4 url(../img/icon_3.png) no-repeat 0 3px;
	}
	
.sub ul li.navi_2 span {
	color:#FF0000;
	font-weight:700;
	}
	
.example {
	margin-top:10px;
	}	
	
.example ul {
	list-style:none;
	margin:15px 0;
	padding:0px;
	}
	
.example ul li{
	margin-bottom:10px;
	}
		
		
.app_cpn {
	margin-bottom:10px;
	padding:0;
	}

/*アコーディオン割引に関する注意*/
.opener {
	width: 89%;
    background: url(../img/im_arrow_close.png) no-repeat #EAEAEA 3% 50%;
    background-size: 14px auto;
    padding: 10px 5px 10px 30px;
    font-size: 16px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-bottom: 3px solid #CCC;
    margin: 0 0 15px 0;
    cursor: pointer;
}
.active {
	width: 89%;
    background: url(../img/im_arrow_over.png) no-repeat #EAEAEA 3% 50%;
    background-size: 14px auto;
    padding: 10px 5px 10px 30px;
    font-size: 16px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-bottom: 3px solid #CCC;
    margin: 0 0 15px 0;
    cursor: pointer;
}

.contentsBox{
	line-height:1.3;
}

span.c_title{
	width: 100%;
	font-size: 18px;
    font-weight: bold;
    border-bottom: 1px solid #333333;
    display: inline-block;
}

span.c_box{
	padding: 1% 0%;
    background-color: #0066FF;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    display: block;
    margin: 1% 0;
    color: #FFF;
    text-align: center;
}