@charset "UTF-8";
/* CSS Document */

/* Reset */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,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;}
body {line-height:1;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
a {margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}
del {text-decoration: line-through;}
abbr[title],dfn[title] {border-bottom:1px dotted;cursor:help;}
table {border-collapse:collapse;border-spacing:0;}
input,select {vertical-align:middle;}
ins {background-color:#ff9;color:#000;text-decoration:none;}
mark {background-color:#ff9;color:#000; font-style:italic;font-weight:bold;}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}


/* Common */
body { color: rgb(51,51,51); font-family: ArialMT, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif; line-height: 1.4; letter-spacing: -0.001em; -webkit-text-size-adjust: none; }

.txtred{ color:#c00; font-weight:bold; }
.txtB { font-weight:bold; }
.icon { vertical-align: text-top; padding: 0 0.2em; }

a.pdfLink {
	display:inline-block;
	padding-left: 22px;
	position: relative;
}
a.pdfLink::before {
	display: inline-block;
	content: "";
	background: url("/appsuica/common/img/ico_pdf_s.png");
	background-size: contain;
	width: 16px;
	height: 16px;
	position: absolute;
	top: 2px;
	left: 0;
}

.mt5 { margin-top: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mb5 { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}

.column { zoom: 1; overflow: hidden; }
.column:after { content: ""; clear: both; display: block; }
.column .contents { margin-bottom: 30px; padding: 0 2%; }
.column h2 {
	font-size: 114%;
	color:#fff;
	margin-bottom: 10px;
	padding: 10px .5em;
	background: rgb(88, 181, 48);
}
.column h3 {
	font-size: 110%;
	color: #392;
	line-height: 1.3;
	margin-bottom: .2em;
	padding: .5em 0 .2em;
	border-bottom: solid 1px #392;
}
.column h4 { margin: 1.5em 0 .5em; padding: .7em; background: #dbdbdb; }
.column h4 span { font-size: 85%; font-weight: normal; display: block; }


/* Header */
#header { width: 100%; }
#keyvisual { width: 100%; margin: 10px 0; background: url(../img/kv_bg.gif); }
#kvbox { width: 320px; height: 180px; margin: 0 auto; position: relative; }
#kvbox h1, #kviphone, #kvlogo { position: absolute; }
#kvbox h1 { width: 210px; height: auto; left: 10px; top: 40px; }
#kviphone { width: 90px; height: auto; right: 5px; top: 5px; }
#kvlogo { width: 170px; height: auto; left: 28px; top: 120px; }
#kvbox h1 img, #kviphone img, #kvlogo img { width: 100%; height: auto; }
#header p { font-size: 85%; line-height: 1.3; text-indent: -1em; color: #FFF; margin: 5px 10px; padding: 0 0 .3em 1em; }


/* localNav */
.localNav * {
	box-sizing: border-box;
}
.localNav {
	margin-top: 20px;
}
.localNav li a {
	display: block;
	margin: 3% auto;
	padding: 15px 10px 15px 35px;
	border-radius: 5px;
	background: #666;
	background: linear-gradient(#f0f0f0, #e1e1e1);
	box-shadow: 3px 3px #ccc;
	color: #333;
	text-align: center;
	text-decoration: none;
	line-height: 1.4;
	position: relative;
}
.localNav li a::before {
	display: inline-block;
	content: "";
	background: url("/appsuica/common/img/ico_arrow_btm_open.png");
	background-size: contain;
	width: 14px;
	height: 8px;
	position: absolute;
	top: 45%;
	left: 4%;
}


/* btnArea */
.btnArea * {
	box-sizing: border-box;
}
.btnArea {
	margin-top: 20px;
}
.btnArea li {
	width: 100%;
	margin: 0 0 10px;
}
.btnArea li.guide {
	border: 3px solid #339922;
	border-radius: 5px;
	padding: 8px 10px;
	overflow: hidden;
}
.btnArea li.guide .guide_image {
	float:left;
	width: 56px;
}
.btnArea li.guide .guide_txt {
	margin-left: 66px;
}
.btnArea li.faqBtn a {
	display: block;
	padding: 15px;
	border-radius: 5px;
	background: #ff7e00;
	color: #FFF;
	font-size: 115%;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	position: relative;
}
.btnArea li.faqBtn a::before {
	display: inline-block;
	content: "";
	background: url("../img/blank_icon_w.png");
	background-size: contain;
	width: 16px;
	height: 16px;
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -8px;
}
.btnArea li.faqBtn a:hover {
	opacity: 0.7;
}


.notes { margin-top: .8em; padding: .6em; border: solid 1px #F60; background: #FFC; }
.notes p { padding-bottom: .5em; border-bottom: solid 1px #F90; color: #C00; line-height: 1.2; font-size: 105%; font-weight: bold; }
.notes ul { padding-top: .5em; }
.notes ul li { text-indent: -1em; padding: 0 0 .3em 1em; line-height: 1.4; }
.notes ul li span { color: #F90; }


.process {margin-top: .5em;}
.process dl,.process .process_arw { height: 320px; padding-bottom: 30px; background: url(../img/purchase_arrow.gif) no-repeat 65px 325px; background-size: 50px 20px; position: relative; }
.process dl#wallet3 { padding-bottom: 0; background: none; }
.process dl dt { width: 180px; height: 320px; position: absolute; left: 0; }
.process dl dt img { width: 180px; height: 320px; }
.process dl dd { padding-left: 190px; }


.appdl { width:100%; height:320px; padding-top:15px; background:#fdeada; border-radius: 8px; text-align:center; box-sizing: border-box; }
.appdl p.title { font-size: 115.4%; font-weight:bold; line-height: 1.4; padding: .5em; }
.appdl p.btn a:hover { opacity: .8; }


#iphone7 { margin-top: 20px; padding: 10px; background: #DFD; }
#iphone7 p.title { font-size: 123%; font-weight:bold; color: #392; margin-bottom: 10px; padding: 0 0 .2em 0; border-bottom: dotted 1px #392; }
#iphone7 p.title span { font-size: 75%; font-weight:nomal; color: #333; display: block; }


#license { padding: 0 2%; }
#license ul { padding-bottom: 5px; }
#license ul li { font-size: 85%; line-height: 1.3; text-indent: -1em; padding: 0 0 .3em 1em; }
