@charset "UTF-8";
.column:after,
.list_01:after,
#main #header .inner .sns:after,
#main #header .box:after,
#main #header .inner .logo_01:after,
#main #header .inner .logo_02:after,
#main #header .inner .logo_03:after,
#main #header .inner .sns li:after,
.column .left:after,
.column .right:after {
display: block;
clear: both;
height: 0;
content: "";
}

/*base
-----------------------------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
font-size: 100%;
font-weight: normal;
vertical-align: baseline;
margin: 0;
padding: 0;
border: 0;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
display: block;
}
html {
line-height: 1;
}
blockquote,q {
quotes: none;
}
blockquote:before,blockquote:after,q:before,q:after {
content: "";
content: none;
}
input,
textarea {
margin: 0;
padding: 0;
}
ol,ul {
list-style: none;
}

.column .left {
float: left;
}
.column .right {
float: right;
}

body {
font-family: YuGothic, "游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 20px;
width: 100%;
min-width: 960px;
}
.ie8 body {
font-family: "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
}

a {
color: #000;
}
a:hover {
text-decoration: none;
}

.note_01 {
font-size: 12px;
line-height: 20px;
color: #8c8c8c;
margin-top: 18px;
}

.note_02 {
font-size: 12px;
line-height: 20px;
}
.note_02.type {
color: #8c8c8c;
}
.note_02 li {
position: relative;
margin-top: 10px;
padding-left: 1.5em;
}
.note_02 li .mark {
position: absolute;
top: 0;
left: 0;
display: block;
}
.note_02.num {
margin-top: 30px;
}
.note_02.num li {
padding-left: 2em;
}

strong {
color: #e60012;
}

.small {
font-size: 17px;
}


.center {
text-align: center !important;
}

p.lead {
line-height: 32px;
max-height: 100%;
-webkit-text-size-adjust: 100%;
color: #323232;
margin-top: 33px;
}

p.note {
font-size: 15px;
max-height: 100%;
-webkit-text-size-adjust: 100%;
color: #323232;
}

/*nav
-----------------------------------------*/
#main {
background: none;
}
#main #header {
background: url(/sp/da-1_mobile/images/bar.png) repeat-x bottom;
position: fixed;
z-index: 10;
top: 0;
left: 0;
width: 100%;
min-width: 960px;
height: 100px;
}
#main #header .box {
background: #1676e1;
height: 50px;
margin: 0 auto;
}
#main #header .inner {
width: 960px;
margin: 0 auto;
}
#main #header .inner .logo_01 {
float: left;
padding: 15px 0 0 20px;
}
#main #header .inner .logo_02 {
float: left;
padding: 13px 0 0 287px;
}
#main #header .inner .logo_03 {
float: right;
padding: 15px 20px 0 0;
}
#main #header .inner .sns {
float: right;
margin-top: 10px;
}
#main #header .inner .sns li {
float: left;
}
#main #header .inner .list {
display: table;
width: 960px;
height: 45px;
}
#main #header .inner .list li {
display: table-cell;
}
#main #header .inner .list li a {
display: block;
}

/*content
-----------------------------------------*/
.content {
text-align: center;
}

/*#top
-----------------------------------------*/
#main #top {
background: #fff url(/sp/da-1_mobile/images/top_base2.png) repeat-x center 46%;
width: 100%;
min-width: 960px;
padding: 135px 0 69px;
border-bottom: #c8c8c8 2px solid;
}

#main #top .inner {
width: 960px;
margin: 0 auto;
}

#main #top .inner .icon {
position: relative;
width: 100%;
margin-top: 28px;
margin-bottom: 124px;
}

#main #top p.icon01 {
position: absolute;
left: 281px;
}
#main #top p.icon02 {
position: absolute;
left: 387px;
}
#main #top p.icon03 {
position: absolute;
top: 49px;
left: 387px;
}
#main #top p.text01 {
position: absolute;
top: 102px;
left: 393px;
color: #c00;
font-size: 72.5%;
}

#main #top p.pic {
margin: 23px 0 11px 7px;
}

/*#smartphone
-----------------------------------------*/
#main #smartphone {
background: #fff;
width: 100%;
min-width: 960px;
padding-top: 77px;
border-bottom: #c8c8c8 2px solid;
}

#main #smartphone p.img {
margin-top: 53px;
margin-bottom: 128px;
padding: 0 0 0 48px;
}
#main #smartphone p.lead {
line-height: 26px;
letter-spacing: 1px;
margin-top: 24px;
margin-left: -7px;
}

/*#display-order
-----------------------------------------*/
#main #display-order {
background: #fff url(/sp/da-1_mobile/images/display-order-bg.gif) repeat-x bottom;
width: 100%;
min-width: 960px;
padding: 75px 0 114px;
}

#display-order .inner {
width: 960px;
margin: 0 auto;
}

#display-order .inner .column {
width: 912px;
margin: 0 auto;
padding: 0 0 65px;
}

#display-order .inner .column div.lead {
text-align: left;
padding-left: 25px;
}

#display-order .inner .column div.lead p {
line-height: 32px;
color: #323232;
padding: 45px 0 0 222px;
}
#display-order .inner .column div.lead p + p {
line-height: 26px;
letter-spacing: 1px;
margin: 0 0 0 -2px;
padding: 30px 26px 0 222px;
}

/*#cloud-01
-----------------------------------------*/
#main #cloud-01 {
background: #fff;
width: 100%;
min-width: 960px;
padding: 77px 0 52px 0;
}
#main #cloud-01 p.lead {
line-height: 29px;
letter-spacing: .5px;
margin-top: 21px;
}

/*#cloud-02
-----------------------------------------*/
#main #cloud-02 {
background: #dcebfb;
width: 100%;
min-width: 960px;
padding: 43px 0 52px 0;
}

/*#more
-----------------------------------------*/
#main #more {
background: #fff url(/sp/da-1_mobile/images/more_bg.png) repeat-x bottom;
padding: 110px 0 27px;
}

/*#basic
-----------------------------------------*/
#main #basic {
background: #f2f2f2;
width: 100%;
min-width: 960px;
padding-bottom: 30px;
}
#basic .hdg {
background: #5a5a5a;
height: 50px;
margin-bottom: 53px;
}


#basic .inner {
width: 800px;
margin: 0 auto;
}

#basic .column {
margin-bottom: 53px;
}

#basic .column .right {
padding-top: 28px;
}

#basic table {
font-size: 14px;
line-height: 22px;
text-align: left;
color: #5a5a5a;
width: 430px;
margin-top: 40px;
}

#basic table th {
width: 100px;
}

#basic table td {
width: 330px;
padding-bottom: 16px;
}

.hdg h2 {
padding-top: 10px;
}

#basic h3 {
text-align: left;
}

/*#spec
-----------------------------------------*/
#main #spec {
background: url(/sp/da-1_mobile/images/spec_bg.png) repeat-x bottom #f5f5f5;
width: 100%;
min-width: 960px;
padding-bottom: 26px;
}
#spec .hdg {
background: #5a5a5a;
height: 50px;
}
#spec .hdg h2 {
padding-top: 9px;
}
#spec .inner {
width: 960px;
margin: 0 auto;
}

#spec table {
font-size: 18px;
line-height: 22px;
text-align: left;
color: #5a5a5a;
margin: 28px 0 0 117px;
}

#spec table th {
font-weight: bold;
white-space: nowrap;
width: 117px;
padding: 0;
}

#spec table td {
width: 309px;
padding: 0;
}
#spec table td a {
display: block;
padding: 2px 0 5px;
}
#spec table td em {
font-size: 16px;
font-weight: bold;
font-style: normal;
display: inline-block;
margin: 0 0 2px -6px;
}
#spec table td small {
font-size: 13px;
display: inline-block;
margin: -10px 0 0 4px;
}


/*#how
-----------------------------------------*/
#how {
padding: 129px 0 20px;
border-bottom: 2px solid #828282;
}

#steps {
background: #f5f5f5;
overflow: hidden;
padding: 18px 0 61px;
}
#steps .step {
position: relative;
margin: 0 0 25px;
}
#steps .step .inner {
position: relative;
width: 960px;
margin: 0 auto;
}
#steps .step .inner .img {
position: relative;
z-index: 1;
}
#steps .step .inner .btn {
position: absolute;
z-index: 2;
bottom: 27px;
}
#steps .step .inner .btn.but_pit {
left: 144px;
}
#steps .step .inner .btn.but_meq {
left: 373px;
}
#steps .step .inner .btn.but_biz {
left: 602px;
}
#steps .step .inner .btn.but_da1 {
bottom: 28px;
left: 334px;
}
#steps .step .inner .btn a {
display: block;
}

#steps .step .inner p.lead {
	font-size: 22px;
	text-align: center;
	margin-top: 25px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 2;
}

#steps .step .inner p.text {
	font-size: 14px;
	text-align: center;
	position: absolute;
	bottom: 25px;
	left: 0;
	right: 0;
	z-index: 2;
}

/*#func
-----------------------------------------*/
#func {
padding: 129px 0 20px;
border-bottom: 2px solid #828282;
}
#func h1 {
margin: 0 0 0 -3px;
}

/*#use
-----------------------------------------*/
#use {
background: #f3f8fd;
background:    -moz-linear-gradient(top,  #f3f8fd 0%, #d0e4f9 100%);
background: -webkit-linear-gradient(top,  #f3f8fd 0%,#d0e4f9 100%);
background:         linear-gradient(to bottom,  #f3f8fd 0%,#d0e4f9 100%);
padding: 20px 0 0;

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f8fd', endColorstr='#d0e4f9',GradientType=0 );
}
#use .lead {
line-height: 1.25;
letter-spacing: 1px;
margin-top: 36px;
padding: 0 0 0 10px;
}
#use .note {
	margin-top: 20px;
}
#use .use-pnls {
text-align: left;
padding: 10px 0 0;
}
#use .use-pnl .inner {
position: relative;
margin: 0 auto;
}
#use .use-pnl:after {
display: table;
width: 100%;
content: "";
}
#use .use-pnl .img {
float: left;
}
#use .use-pnl .list {
position: relative;
z-index: 1;
left: -15px;
overflow: hidden;
padding: 172px 0 0;
}
#use .use-pnl .list li {
margin: 0 0 -2px;
}
#use .use-pnl .list li img {
vertical-align: top;
}
#use .use-pnl .list li:first-child {
margin-bottom: 97px;
}
#use .use-pnl .list li a {
display: block;
}
#use .use-pnl .content {
position: absolute;
z-index: 2;
top: 101px;
right: -71px;
}
#use .use-pnl .content .txt {
font-size: 21px;
line-height: 30px;
text-align: left;
position: absolute;
top: 46px;
left: 19px;
width: 470px;
}
#use #add-pnl-root .inner {
width: 834px;
}
#use .use-pnl-child .inner {
width: 816px;
padding: 8px 0 29px;
}
#use .use-pnl-child .list {
left: 9px;
padding: 164px 0 0;
}
.init #use {
position: relative;
}
.init #use .use-pnl-child {
position: absolute;
top: 151px;
left: 0;
display: none;
width: 100%;
}

/*#card_company
-----------------------------------------*/
#card_company {
background: #ffffff;
background:    -moz-linear-gradient(top,  #ffffff 0%, #ececec 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#ececec 100%);
background:         linear-gradient(to bottom,  #ffffff 0%,#ececec 100%);
margin: -13px 0 0;

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ececec',GradientType=0 );
}
#card_company h2 {
padding: 70px 0 20px;
border-bottom: 2px solid #828282;
}
#card_company h3 {
margin: 0;
padding: 39px 0 0;
}
#card_company .lead {
line-height: 27px;
letter-spacing: 1px;
margin-top: 16px;
padding: 0 0 11px 14px;
}
#card_company .img {
padding: 20px 0 0 14px;
}

/*#card_list
-----------------------------------------*/
#card_list {
background: #ffffff;
background:    -moz-linear-gradient(top,  #ffffff 0%, #ececec 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#ececec 100%);
background:         linear-gradient(to bottom,  #ffffff 0%,#ececec 100%);
}
#card_list h2 {
padding: 40px 0 0;
}
#card_list .lead {
line-height: 27px;
letter-spacing: 1px;
margin: 15px 0 10px;
margin-top: 15px;
padding: 0 0 11px 14px;
}
#card_list .note {
	margin-bottom: 10px;
}
#card_list .scroll-area {
width: 960px;
margin: 0 auto;
position: relative;
}
#card_list .scroll-item-inner {
overflow: hidden;
}
#card_list .scroll-item .figure {
float: left;
margin: 0 0 0 71px;
}
#card_list .scroll-item .txt {
position: relative;
float: right;
padding: 52px 0 0;
}
#card_list .scroll-item .txt span {
font-size: 18px;
line-height: 23px;
text-align: left;
position: absolute;
top: 123px;
left: 77px;
}
#card_list .scroll-item-01 .txt span {
top: 123px;
}
#card_list .scroll-item-02 .txt span {
top: 287px;
}
#card_list .scroll-item-03 .txt span {
top: 453px;
}
.init #card_list {
	height: 750px;
	overflow: hidden;
}

#card_list.is-fixed {
	width: 100%;
	min-width: 960px;
	position: fixed;
	top: 100px;
	left: 0;
}

#use .use-pnl .btn-closeWindow {
	width: 38px;
	height: 0;
	padding-top: 38px;
	line-height: 1.5;
	background: url(/sp/da-1_mobile/images/f1_x.png) no-repeat;
	background-position: left top;
	overflow: hidden;
	cursor: pointer;
	position: absolute;
	top: -38px;
	right: 0;
	z-index: 3;
}
#card_list .scroll-item .list {
	padding: 54px 0 0 57px;
	text-align: left;
	width: 500px;
	float: left;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
#card_list .scroll-item .list li {
	position: relative;
	margin-bottom: 112px;
}
#card_list .scroll-item .list li img {
	vertical-align: top;
}
#card_list .scroll-item .list li a {
	display: block;
}
#card_list .scroll-item .list span {
	font-size: 18px;
	line-height: 23px;
	text-align: left;
	display: block;
	position: absolute;
	top: 70px;
	left: 75px;
}
.init #card_list .scroll-area {
	height: 569px;
}
.init #card_list .card_list_pnl {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
}
#card_list .card-pnl > div[class^=arrow_item] {
	position: absolute;
	top: 45px;
	display: none;
}
#card_list .card-pnl > .arrow_item-01 {
	left: 115px;
}
#card_list .card-pnl > .arrow_item-02 {
	left: 158px;
}
#card_list .card-pnl > .arrow_item-03 {
	left: 200px;
}

/*#search
-----------------------------------------*/
#search {
background: #ffffff;
background:    -moz-linear-gradient(top,  #ffffff 0%, #ececec 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#ececec 100%);
background:         linear-gradient(to bottom,  #ffffff 0%,#ececec 100%);
}
#search h2 {
padding: 40px 0 0;
}
#search .lead {
line-height: 26px;
letter-spacing: 1px;
margin-top: 15px;
padding: 0 0 30px 13px;
}

#search.is-fixed {
	width: 100%;
	min-width: 960px;
	position: fixed;
	top: 850px;
	left: 0;
}

/*#lists
-----------------------------------------*/
#lists {
background: #ffffff;
background:    -moz-linear-gradient(top,  #ffffff 0%, #ececec 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#ececec 100%);
background:         linear-gradient(to bottom,  #ffffff 0%,#ececec 100%);
}
#lists .inner {
background: url(/sp/da-1_mobile/images/f5_2.png) right 73% no-repeat;
}
#lists h2 {
padding: 40px 0 0;
}
#lists .lead {
line-height: 26px;
letter-spacing: 1px;
margin-top: 15px;
padding: 0 0 30px 13px;
}
#lists .flt {
overflow: hidden;
width: 960px;
margin: 0 auto;
}
#lists .flt .figure {
float: left;
padding: 0 0 0 70px;
}
#lists .flt .content {
text-align: left;
float: left;
padding: 62px 0 0 6px;
}
#lists .flt .content p {
line-height: 24px;
margin: 4px 0 57px 54px;
}


/*#.footer
-----------------------------------------*/
#main .footer {
background: #1676e1;
width: 100%;
min-width: 960px;
padding-top: 8px;
padding-bottom: 8px;
}

#main .footer .inner {
width: 960px;
margin: 0 auto;
}
#main .footer .inner ul {
font-size: 11px;
line-height: 17px;
max-height: 100%;
text-align: left;
color: #fff;
padding: 0 15px 0 3em;
text-indent: -1.5em;
}
#main .footer p {
font-size: 11px;
line-height: 17px;
text-align: right;
color: #fff;
display: block;
margin-top: 20px;
padding: 0 15px 0 0;
}

#main > .content.is-pdt {
	padding-top: 1894px;
}

/*etc
-----------------------------------------*/
.mt0 {
margin-top: 0 !important;
}

.mt5 {
margin-top: 5px !important;
}

.mt10 {
margin-top: 10px !important;
}

.mt15 {
margin-top: 15px !important;
}

.mt20 {
margin-top: 20px !important;
}

.mt25 {
margin-top: 25px !important;
}

.mt30 {
margin-top: 30px !important;
}

.mt35 {
margin-top: 35px !important;
}

.mt40 {
margin-top: 40px !important;
}

.mt45 {
margin-top: 45px !important;
}

.mt50 {
margin-top: 50px !important;
}

.mobile .bg {
background-attachment: scroll !important;
height: 530px;
}
.mobile .list li {
margin-top: 10px;
}
.mobile .list li a {
font-size: 22px !important;
}
.mobile .list li:hover a {
color: #000;
}
.mobile #main .nav {
position: absolute;
min-width: 640px;
}
.mobile .mainVisual {
margin-top: 95px;
}
