@charset "utf-8";

/**
 *  common
 */
*{
margin:0;
border:0;
padding:0;
}

body{
min-width:1220px;
line-height:1.5;
background-color:#fff;
font-size:62.5%;
font-family:'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
.static body{
min-width:1140px;
}

li{
list-style:none;
}

img{
vertical-align:bottom;
}

/**
 *  header
 */
#header{
background-color:#fff;
text-align:center;
}

#header .inner{
width:1100px;
margin:0 auto;
padding:20px 0;
text-align:left;
zoom:1;
}
#header .inner:after{
clear:both;
content:"";
display:block;
}

#header .logo-product{
float:left;
margin:-10px 10px -10px 0;
}
#header .logo-company{
float:right;
margin:-2px 0 -2px 10px;
}

#header .nav-share{
float:right;
zoom:1;
}
#header .nav-share:after{
clear:both;
content:"";
display:block;
}

#header .nav-share li{
float:left;
height:20px;
overflow:hidden;
}
#header .nav-share li.evernote{
width:75px;
}
#header .nav-share li.twitter{
width:110px;
}
#header .nav-share li.facebook{
width:120px;
}

/**
 *  content
 */
#content{
overflow:hidden;
background-color:#000;
}

.loading #content{
background:#000 url(/sp/meqru/images/ui-loading.gif) no-repeat center center;
}

#content .inner{
text-align:center;
}

.loading #content .inner{
height:720px;
overflow:hidden;
filter:alpha(opacity=0);
-ms-filter:"alpha(opacity=0)";
opacity:0;
}

/* slide */
#slide{
width:1100px;
margin:0 auto;
-webkit-transform:translateZ(0);
-webkit-perspective:1000;
-webkit-backface-visibility:hidden;
}

#slide-nav{
display:table;
width:1100px;
margin:0 auto;
text-align:left;
}
.ltIE8 #slide-nav{
display:block;
}

#slide-nav li{
display:table-cell;
vertical-align:bottom;
}
.ltIE8 #slide-nav li{
display:block;
float:left;
width:13.28571428571429%;
}

#slide-nav li a{
position:relative;
display:block;
padding:30px 5px;
text-align:center;
}
#slide-nav li a.pc,
#slide-nav li a.soft{
padding:20px 5px;
}

#slide-nav li a:after{
content:"";
position:absolute;
bottom:-10px;
left:50%;
z-index:100;
display:block;
width:0;
height:0;
margin-left:-8px;
border-top:11px solid #000;
border-right:8px solid transparent;
border-left:8px solid transparent;
opacity:0;
-webkit-transition:opacity 750ms ease 250ms;
transition:opacity 750ms ease 250ms;
}
#slide-nav li.current a:after{
opacity:1;
}
.ltIE10 #slide-nav li a:after{
display:none;
}
.spec #slide-nav li.current a:after{
display:block;
}

#slide-nav li a span{
position:relative;
display:inline-block;
height:20px;
overflow:hidden;
box-shadow:0 0 0 2px #000 inset, 0 0 1px 3px #000;
background:#fff url(/sp/meqru/images/ui-nav.png) no-repeat 0 0;
-webkit-transition:background-color 250ms ease;
transition:background-color 250ms ease;
}
#slide-nav li.current a span,
#slide-nav li a:hover span,
#slide-nav li a:active span,
#slide-nav li a:focus span{
background-color:#f90;
}
#slide-nav li a.top span{
width:70px;
background-image:url(/sp/meqru/images/ui-top.png);
}
#slide-nav li a.easy span{
width:100px;
background-image:url(/sp/meqru/images/ui-easy.png);
}
#slide-nav li a.simple span{
width:100px;
background-image:url(/sp/meqru/images/ui-simple.png);
}
#slide-nav li a.many span{
width:134px;
background-image:url(/sp/meqru/images/ui-many.png);
}
#slide-nav li a.desk span{
width:140px;
background-image:url(/sp/meqru/images/ui-desk.png);
}
#slide-nav li a.spec span{
width:68px;
background-image:url(/sp/meqru/images/ui-spec.png);
}
#slide-nav li a.pc span{
width:134px;
height:40px;
background-image:url(/sp/meqru/images/ui-pc.png);
}



#slide-nav li a *{
cursor:pointer;
}

#slide-nav li a span{
}

#slide-nav li a span span{
position:absolute;
top:-999em;
left:-999em;
}

#slide-view{
position:relative;
height:640px;
margin:0 auto;
text-align:left;
}
.static #slide-view{
height:auto;
}

#slide-view #slide-view-inner{
}

#slide-view #slide-view-inner #slides{
}

#slide-view #slide-view-inner #slides .slides{
float:left;
width:1100px;
height:640px;
opacity:1;
-webkit-transition:opacity 750ms ease 250ms;
transition:opacity 750ms ease 250ms;
}
.static #slide-view #slide-view-inner #slides .slides{
float:none;
}

#slide-view #slide-view-inner #slides .disabled{
z-index:1;
opacity:.5;
}
.static #slide-view #slide-view-inner #slides .disabled{
opacity:1;
}

#slide-current{
position:absolute;
z-index:100;
left:0;
top:-1px;
display:none;
width:0;
height:0;
border-top:11px solid #000;
border-left:8px solid transparent;
border-right:8px solid transparent;
}

#slide-ui{
position:relative;
width:1100px;
margin:0 auto;
text-align:left;
}
.static #slide-ui{
display:none;
}

#slide-ui a{
position:absolute;
bottom:275px;
z-index:100;
width:54px;
height:90px;
overflow:hidden;
border-radius:4px;
background:transparent url(/sp/meqru/images/ui-nav.png) no-repeat 0 0;
opacity:.55;
-webkit-transition:opacity 250ms ease;
transition:opacity 250ms ease;
}
#slide-ui a.next{
right:-54px;
border-top-left-radius:0;
border-bottom-left-radius:0;
background-image:url(/sp/meqru/images/ui-next.png);
}
#slide-ui a.prev{
left:-54px;
border-top-right-radius:0;
border-bottom-right-radius:0;
background-image:url(/sp/meqru/images/ui-prev.png);
}
#slide-ui a:hover,
#slide-ui a:active,
#slide-ui a:focus{
opacity:1;
}
#slide-ui a.disabled,
#slide-ui a.disabled:hover,
#slide-ui a.disabled:active,
#slide-ui a.disabled:focus{
opacity:.15;
cursor:default;
}

#slide-ui a *{
cursor:pointer;
}

#slide-ui a span{
position:absolute;
top:-999em;
left:-999em;
}

/**
 *  slides
 */
#top,
#easy,
#simple,
#many,
#desk,
#spec{
position:relative;
overflow:hidden;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.slides .panel *{
display:block;
}
.slides .panel a{
position:relative;
}
.ltIE9 .slides .panel a:hover{
filter:alpha(opacity=80);
-ms-filter:"alpha(opacity=80)";
}
.slides .panel a:before,
.slides .panel a:after{
position:absolute;
z-index:4;
content:"";
}
.ltIE9 .slides .panel a:before,
.ltIE9 .slides .panel a:after{
display:none;
}
.slides .panel a:before{
top:18px;
left:20px;
width:13px;
height:20px;
background:transparent url(/sp/meqru/images/ui-arrow.png) no-repeat 0 0;
opacity:1;
-webkit-transition:all 500ms ease;
transition:all 500ms ease;
}
.slides .panel a:hover:before,
.slides .panel a:active:before,
.slides .panel a:focus:before{
left:30px;
}
.slides .panel a.opened:before{
opacity:0;
}
.slides .panel a:after{
top:-19px;
right:-19px;
width:38px;
height:38px;
background:transparent url(/sp/meqru/images/ui-close.png) no-repeat 0 0;
-webkit-transform:scale(1, 1);
transform:scale(1, 1);
opacity:0;
-webkit-transition:all 500ms ease;
transition:all 500ms ease;
}
.slides .panel a:hover:after,
.slides .panel a:active:after,
.slides .panel a:focus:after{
-webkit-transform:scale(1.2, 1.2);
transform:scale(1.2, 1.2);
}
.slides .panel a.opened:after{
opacity:1;
}

#top{
background:transparent url(/sp/meqru/images/bg-top-01.jpg) no-repeat 0 0;
}

#top h2,
#top .lead-01,
#top .lead-02,
#top .dncfp,
#top .specialmovie,
#top .release{
position:absolute;
z-index:2;
}
#top h2{
top:415px;
left:346px;
}
#top .lead-01{
top:67px;
left:40px;
}
#top .lead-02{
top:139px;
left:40px;
}
#top .dncfp{
top:26px;
left:925px;
}
#top .specialmovie{
top:368px;
left:50px;
}
#top .release{
top:418px;
left:880px;
}

#top .lead-01.animation{
-webkit-animation:smooth-regist 12s ease 1s;
animation:smooth-regist 12s ease 1s;
}
@-webkit-keyframes smooth-regist{
  0%   { -webkit-transform:translateY(  0  ); opacity:1; }
  15%  { -webkit-transform:translateY(200px); opacity:1; }
  20%  { -webkit-transform:translateY(200px); opacity:0; }
  25%  { -webkit-transform:translateY(-15px); opacity:0; }
  30%  { -webkit-transform:translateY(  0  ); opacity:1; }
  100% { -webkit-transform:translateY(  0  ); opacity:1; }
}
@keyframes smooth-regist{
  0%   { transform:translateY(  0  ); opacity:1; }
  15%  { transform:translateY(200px); opacity:1; }
  20%  { transform:translateY(200px); opacity:0; }
  25%  { transform:translateY(-15px); opacity:0; }
  30%  { transform:translateY(  0  ); opacity:1; }
  100% { transform:translateY(  0  ); opacity:1; }
}

#top .lead-02.animation{
-webkit-animation:flipin-search 12s ease 5s;
animation:flipin-search 12s ease 5s;
}
@-webkit-keyframes flipin-search{
  0%   { -webkit-transform:perspective(480px) rotateX(   0   ); }
  25%  { -webkit-transform:perspective(480px) rotateX(-720deg); }
  100% { -webkit-transform:perspective(480px) rotateX(-720deg); }
}
@keyframes flipin-search{
  0%   { transform:perspective(480px) rotateX(   0   ); }
  25%  { transform:perspective(480px) rotateX(-720deg); }
  100% { transform:perspective(480px) rotateX(-720deg); }
}

#easy{
background:transparent url(/sp/meqru/images/bg-easy-01.jpg) no-repeat 0 0;
}

#easy h2,
#easy .text,
#easy .panel{
position:absolute;
z-index:2;
}
#easy h2{
top:69px;
left:48px;
}
#easy .text{
top:215px;
left:50px;
width:420px;
height:280px;
line-height:1.75;
overflow:auto;
color:#000;
font-size:140%;
text-shadow:0 0 1px rgba(0,0,0,.25);
}
#easy .panel{
bottom:0;
left:50px;
z-index:3;
width:360px;
}

#easy .area-01,
#easy .area-02{
position:absolute;
overflow:hidden;
}
#easy .area-01{
top:0;
left:600px;
z-index:3;
width:264px;
height:640px;
}
#easy .area-01 .blind-01{
position:absolute;
top:182px;
z-index:5;
}
#easy .area-01 .namecard-01{
position:absolute;
top:-5px;
z-index:4;
}
#easy .area-02{
top:306px;
left:556px;
z-index:6;
width:356px;
height:237px;
background:transparent url(/sp/meqru/images/bg-screen-01.png) no-repeat 0 0;
}
#easy .area-02 .scan-01,
#easy .area-02 .scan-02{
position:absolute;
top:0;
left:0;
z-index:8;
width:356px;
height:237px;
}
#easy .area-02 .namecard-02{
position:absolute;
top:-440px;
left:44px;
z-index:7;
width:264px;
height:438px;
}
#easy .area-02 .blind-02{
position:absolute;
top:0;
left:0;
z-index:9;
}
#easy .area-02 .scan-02{
z-index:10;
}

.static #easy ul{
position:static;
width:auto;
}
.static #easy .panel{
position:absolute;
bottom:0;
left:50px;
z-index:3;
width:360px;
}
.static #easy .panel:first-child{
left:600px;
}
.static #easy .area-01,
.static #easy .area-02{
display:none;
}

#simple{
background:transparent url(/sp/meqru/images/bg-simple-01.jpg) no-repeat 0 0;
}

#simple h2,
#simple .text,
#simple .panel{
position:absolute;
z-index:7;
}
#simple h2{
top:68px;
left:48px;
}
#simple .text{
top:244px;
left:50px;
width:360px;
height:320px;
line-height:1.75;
overflow:auto;
color:#000;
font-size:140%;
text-shadow:0 0 1px rgba(0,0,0,.25);
}
#simple .panel{
bottom:0;
left:50px;
z-index:8;
width:420px;
}

#simple .layer-01,
#simple .layer-02,
#simple .layer-03,
#simple .layer-04{
position:absolute;
top:0;
right:0;
width:610px;
height:430px;
background:transparent url(/sp/meqru/images/bg-simple-01.jpg) no-repeat 0 0;
}
#simple .layer-01{
z-index:3;
background-image:url(/sp/meqru/images/bg-simple-02.jpg);
}
#simple .layer-02{
z-index:4;
background-image:url(/sp/meqru/images/bg-simple-03.jpg);
}
#simple .layer-03{
z-index:5;
background-image:url(/sp/meqru/images/bg-simple-04.jpg);
}
#simple .layer-04{
z-index:6;
background-image:url(/sp/meqru/images/bg-simple-05.jpg);
}

.static #simple .panel{
left:auto;
right:50px;
}
.static #simple .layer-01,
.static #simple .layer-02,
.static #simple .layer-03,
.static #simple .layer-04{
display:none;
}

#many{
background:transparent url(/sp/meqru/images/bg-many-01.jpg) no-repeat 0 0;
}

#many .layer-01,
#many .layer-02,
#many .layer-03,
#many h2,
#many .lead,
#many .panel{
position:absolute;
z-index:2;
}
#many .layer-01,
#many .layer-02,
#many .layer-03{
top:0;
right:0;
bottom:0;
left:0;
}
#many .layer-01{
z-index:2;
background:transparent url(/sp/meqru/images/bg-many-02.jpg) no-repeat 0 0;
}
#many .layer-02{
z-index:3;
background:transparent url(/sp/meqru/images/bg-many-03.jpg) no-repeat 0 0;
}
#many .layer-03{
z-index:4;
background:transparent url(/sp/meqru/images/bg-many-04.jpg) no-repeat 0 0;
}
#many h2,
#many .lead,
#many .panel{
z-index:5;
left:50px;
}
#many h2{
top:63px;
}
#many .lead{
top:135px;
width:400px;
height:250px;
line-height:1.75;
overflow:auto;
color:#000;
font-size:140%;
text-shadow:0 0 1px rgba(0,0,0,.25);
}
#many .panel{
bottom:0;
}

#desk{
background:transparent url(/sp/meqru/images/bg-desk-01.jpg) no-repeat 0 0;
}

#desk h2,
#desk p{
position:absolute;
z-index:2;
}
#desk h2{
top:300px;
left:288px;
}
#desk p{
top:475px;
left:292px;
width:420px;
height:165px;
line-height:1.75;
overflow:auto;
color:#000;
font-size:140%;
text-shadow:0 0 1px rgba(0,0,0,.25);
}

#desk .compact.animation{
-webkit-animation:compact 12s ease 1s;
animation:compact 12s ease 1s;
}
@-webkit-keyframes compact{
  0%   { -webkit-transform:scale( 1,  1); opacity:1; }
  24%  { -webkit-transform:scale(.5, .5); opacity:1; }
  28%  { -webkit-transform:scale(.5, .5); opacity:0; }
  30%  { -webkit-transform:scale( 1,  1); opacity:0; }
  36%  { -webkit-transform:scale( 1,  1); opacity:1; }
  100% { -webkit-transform:scale( 1,  1); opacity:1; }
}
@keyframes compact{
  0%   { transform:scale( 1,  1); opacity:1; }
  24%  { transform:scale(.5, .5); opacity:1; }
  28%  { transform:scale(.5, .5); opacity:0; }
  30%  { transform:scale( 1,  1); opacity:0; }
  36%  { transform:scale( 1,  1); opacity:1; }
  100% { transform:scale( 1,  1); opacity:1; }
}

#spec{
overflow:auto;
background-color:#eee;
text-align:left;
}
.static #spec{
height:auto !important;
}

#spec h2,
#spec h3{
margin-bottom:20px;
}

#spec .note{
padding-left:1.25em;
}
#spec .note li{
position:relative;
margin:.25em 0;
}
#spec .note li span.mark{
position:absolute;
display:block;
margin-left:-1.25em;
}

#body,
#accessory{
margin:0 30px;
}

#body{
padding:30px 0 50px 0;
zoom:1;
}
#body:after{
clear:both;
content:"";
display:block;
}

#body .tbl-spec-01{
border-top:1px solid #999;
border-collapse:collapse;
}
#body .tbl-spec-01 th,
#body .tbl-spec-01 td{
border-bottom:1px solid #999;
padding:.4em 10px;
background-color:#ddd;
font-size:140%;
font-weight:normal;
text-align:left;
vertical-align:top;
}
#body .tbl-spec-01 td{
background-color:#fff;
}
#body .tbl-spec-01 .note{
font-size:80%;
}

#body .table1,
#body .table2{
float:left;
width:48.8%;
}
#body .table2{
float:right;
}
#body .table1 .th1{
width:25%;
}
#body .table2 .th1{
width:29%;
}

#accessory{
min-height:212px;
_height:212px;
padding:0 370px 30px 0;
background:transparent url(/sp/meqru/images/bg-accessory-01.png) no-repeat top right;
font-size:140%;
}

#accessory p{
font-size:125%;
}

#accessory .lead{
margin-bottom:.5em;
}

#accessory .note{
margin-top:1em;
padding-left:0;
font-size:90%;
}

/**
 *  footer
 */
#footer{
padding:1.5em 0;
background-color:#fff;
}

#footer p{
font-size:120%;
text-align:center;
}

/**
 *  141014 soft
 */
#slide-nav li a.soft span{
width:134px;
height:55px;
background-image:url(/sp/meqru/images/ui-soft.png);
}
#easy .softLink{
  background:url(/sp/meqru/images/txt-easy-04.png) no-repeat top left;
  padding-bottom:10px;
}
#easy .softLink a{
  color:#fff;
  font-size:14px;
  font-weight:bold;
  margin-left:18px;
}
#easy .softLink a:hover{
  text-decoration:none;
}
#easy .softLink a:before{
  display:none;
}
/*	soft
-------------------*/
#slide-view #slide-view-inner #slides #soft.slides{
  height:auto;
}
#soft{
  background:#eee;
  padding:26px 0 95px 28px;
  width:1100px;
}
#soft .text_05{
  margin-bottom:21px;
}
#soft h2{
  margin-bottom:36px;
}
#soft .lyt .txt{
  float:left;
}
#soft .lyt .txt .lead{
  font-size:18px;
  font-weight:bold;
  margin-top:30px;
}
#soft .lyt .txt .list{
  font-size:14px;
  margin-top:20px;
  width:640px;
}
#soft .lyt .txt .list li{
  background:url(/sp/meqru/soft/images/bg-bullet.png) no-repeat left 3px;
  padding-left:20px;
}
#soft .lyt .txt .note_01{
  font-size:11px;
  margin:15px 0 0 20px;
}
#soft .lyt .txt .btn{
  margin-top:30px;
}
#soft .btn a img:hover{
  filter:alpha(opacity=80);
  -moz-opacity:0.80;
  -khtml-opacity:0.80;
  opacity:0.80;
  -webkit-transition:opacity 750ms ease 250ms;
  transition: all 0.3s ease 0s;
}
#soft .lyt .img{
  float:right;
  margin-top:11px;
}
#soft .column{
margin-top:60px;
}
#soft .column .col{
  float:left;
  width:520px;
}
#soft .column .col p{
  font-size:14px;
}
#soft .column .col .img{
  margin-bottom:15px;
}
#soft .column .col .note_01{
  font-size:11px;
  margin:10px 0 0 0;
}
#soft .column .col:first-child{
  margin-right:60px;
}
#soft .column .col .text{
  margin:30px 0;
}
#soft .column .col .lyt .txt{
  float:right;
  width:255px;
}
#soft .column .col .lyt .img{
  float:left;
  margin:0;
}
#soft .column .col:first-child .note_02{
  margin:20px 0 0 0;
}
#soft .column .col .note_02{
  font-size:9px;
  line-height:20px;
  margin:15px 0 0 0;
}

#soft .column .col .lyt:after,
#soft .lyt:after,
#soft .column:after{
  content:"";
  clear:both;
  display:block;
}
#soft .ml15{
  margin-left:15px;
}
#soft .mt0{
  margin-top:0 !important;
}
#soft .mt30{
  margin-top:30px !important;
}
#soft .mt10{
  margin-top:10px !important;
}
#soft .right{
  text-align:right;
}
#soft .w50{
  width:50px;
}