﻿@charset "utf-8";

/* =======================================================================
	BASE_STYLE
======================================================================= */
html {height:100%;box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, code, form, fieldset, legend, input, textarea, 
p, blockquote, th, td{margin:0;padding:0;}
a {outline: none; color:#0055AC;}
img { border:none }
h1,h2,h3,h4,h5,h6 {	font-size:100%;	font-weight:normal;}
body{
	font-family: 'Roboto', sans-serif;
	font-size:15px;
	line-height: 1.6;
	color:#111;
	background:#FFF;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
	word-wrap:
	break-word;
}
/* Clearfix */
.cf:after {
	content: "";
	clear: both;
	display: block;
}

/* HEADER
----------------------------------------------------------------------- */
header{background:#000;}
header .header-inner{
	width:90%;
	height:60px;
	line-height:60px;
	margin:0 auto;
}
.header-inner h1 img{
	width:23%;
	height:auto;
}

/* MAIN
----------------------------------------------------------------------- */
section.gray{background:#f5f5f5;}
h3{
	font-size:20px;
	line-height:1.4;
	font-weight:bold;
	text-align:center;
	background:url(../images/h3-bg.png) bottom center no-repeat;
	padding-bottom:15px;
	margin-bottom:25px;
}
h4 br{display:none;}
p br{display:none;}
.btnArea{
	text-align:center;
	display:block;
	margin-top:30px;
}
.btnArea p{
	font-size:15px;
	font-weight:bold;
	line-height:1.4;
	background:none;
	margin-bottom:8px;
}
.btnArea p br{
	display:block;
}
.btnArea img{
	width:90%;
	height:auto;
}

/* MAINVISUAL */
main #mvArea{
	width:100%;
	min-height:660px;
	height:100%;
	background:url(../images/mv-bg.jpg) #000014 top center no-repeat;
	padding:5% 0;
}
#mvArea .mvArea-inner{
	width:90%;
	position:relative;
	margin:0 auto;
}
.mvArea-inner h1{
	position:absolute;
	top:5px;
	left:0;
}
.mvArea-inner h1 img{
	width:65%;
	height:auto;
}
.mvArea-inner .mvArea-left{display:none;}
.mvArea-inner .mvArea-right{
	width:100%;
	color:#FFF;
	text-align:center;
	padding-top:13%;
}
.mvArea-right img{
	width:93%;
	height:auto;
}
.mvArea-right span{
	font-size:12px;
	line-height:1.4;
	display:block;
	margin-top:10px;
}
.mvArea-right ul.features{
	width:100%;
	list-style-type: none;
	margin:20px 0;
}
.mvArea-right ul.features li{
	width:100%;
	font-size:14px;
	font-weight:bold;
	background: rgba(0,0,0,0.7);
	border:1px #9C947E solid;
	padding:6px 0;
	margin:8px 0;
}

/* CATEGORY */
main #categoryArea{
	width:100%;
	color:#FFF;
	border-top:1px #404040 solid;
	border-bottom:1px #404040 solid;
	background:#000;
}
#categoryArea ul{
	width:100%;
	text-align:center;
	list-style-type: none;
	margin:8px auto 6px auto;
}
#categoryArea ul li{
	float:left;
	width:20%;
	font-size:13px;
	border-left:1px #404040 solid;
}
#categoryArea ul li:first-child{
	border:none;
}
#categoryArea img{
	width:45%;
	height:auto;
	display:block;
	margin:4px auto;
}

/* FEATUREAREA */
main #featureArea{
	width:90%;
	padding:10% 0;
	margin:0 auto;
}
main #featureArea ul{
	width:100%;
	list-style-type: none;
	margin:20px auto;
}
#featureArea ul li{
	width:100%;
	text-align:center;
	background:#f3f3f3;
	padding:20px 25px;
	margin-top:15px;
}
#featureArea ul li h5{
	font-size:18px;
	font-weight:bold;
	margin:15px 0 10px 0;
}
#featureArea ul li img{
	width:30%;
	height:auto;
}
#featureArea ul li:last-child{
	margin-right:0;
}
#featureArea ul li p{
	font-size:14px;
	text-align:left;
}
#featureArea .payment{
    width: 100%;
    margin:20px auto;
}
.payment .item{
	text-align:center;
	outline:none;
}

/* PLATFORMAREA */
main #platformArea{
	width:90%;
	padding:10% 0;
	margin:0 auto;
}
#platformArea p.platforms-img{margin:20px 0 10px 0;}
p.platforms-img img{
	width:100%;
	height:auto;
}
#platformArea ul{
	width:100%;
	list-style-type: none;
}
#platformArea .platform-item{
	font-size:16px;
	background:url(../images/platform-po.png) left no-repeat;
	background-size: 6%;
	padding:0 0 0 35px;
	margin:3px 0 0 10px;
}
#platformArea .platform-head1{
	font-size:18px;
	font-weight:bold;
	line-height:1.3;
	height:40px;
	background:url(../images/platform-pc.png) left no-repeat;
	background-size: 11%;
	padding:10px 0 0 50px;
	margin:0 0 8px 10px;
}
#platformArea .platform-head2{
	font-size:18px;
	font-weight:bold;
	line-height:1.3;
	height:40px;
	background:url(../images/platform-sp.png) left no-repeat;
	background-size: 6%;
	background-position:3px 0;
	padding:8px 0 0 35px;
	margin:15px 0 8px 10px;
}
#platformArea .platform-head3{
	font-size:18px;
	font-weight:bold;
	line-height:1.3;
	height:40px;
	background:url(../images/platform-tablet.png) left no-repeat;
	background-size: 8%;
	padding:10px 0 0 38px;
	margin:15px 0 8px 10px;
}
.platform-head1 br,
.platform-head2 br,
.platform-head3 br{display:none;}

#platformArea .advantage{
	width:100%;
	border-top:1px #aaa solid;
	border-bottom:1px #aaa solid;
	padding:15px 0;
	margin:20px auto;
}
.advantage br{display:none;}

/* FOOTER
----------------------------------------------------------------------- */
footer{
	font-size:12px;
	color:#888;
	background:#000;
	border-top:3px #FF0000 solid;
}
footer .footer-inner{
	width:90%;
	padding:15px 0 30px 0;
	margin:0 auto;
}
footer .footer-inner p{margin-top:15px;}
footer .footer-inner b{
	font-size:13px;
	display:block;
	margin-bottom:5px;
}
footer .footer-inner a{
	font-size:13px;
	color:#fff;
	text-decoration: none;
	margin:5px 5px 5px 0;
}
.footer-inner .footerArea1{
	border-bottom:1px #333 solid;
	padding:0 0 10px 0;
}
.footer-inner .footerArea1 img{
	width:20%;
	height:auto;
	margin:2%;
}
.footer-inner .footerArea2{
	border-bottom:1px #333 solid;
	padding-bottom:15px;
}
.footer-inner .footerArea2 p{
	float:left;
	width:65%;
}
.footer-inner .footerArea2 img{
	float:right;
	width:30%;
	height:auto;
	margin-top:15px;
}
.footer-inner .footerArea3 p br{
	display:block;
}
.footer-inner .footerArea3 a{
	height:40px;
	line-height:40px;
}

/* 個人情報保護方針
----------------------------------------------------------------------- */
main #privacyArea{
	width:90%;
	padding:8% 0;
	margin:0 auto;
}
#privacyArea dl{
	width:100%;
	text-align:left;
	margin:0 auto 30px auto;
}
#privacyArea dl dt{
	font-size:16px;
	font-weight:bold;
	margin:30px 0 10px 0;
}
#privacyArea dl dd{}

/* 特定商取引法
----------------------------------------------------------------------- */
main #tokushoArea{
	width:90%;
	padding:8% 0;
	margin:0 auto;
}
#tokushoArea table{
	width:100%;
	text-align:left;
	border-collapse:collapse;
	border-spacing:1px;
	background:#FFF;
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	border-left: solid 1px #ccc;
	margin:30px auto 0 auto;
}
#tokushoArea table th{
	width:100%;
	display:block;
	font-weight:normal;
	text-align:left;
    background:#f8f8f8;
	border-top: solid 1px #ccc;
	padding:2.5% 4%;
	margin:0;
}
#tokushoArea table td{
	width:100%;
	display:block;
	border-top: solid 1px #ccc;
	padding:4.5% 4%;
	margin:0;
}
#tokushoArea b{
	display:block;
	margin:10px 0;
}
