@charset "utf-8";

/* ========================================================================
    01. kill browser default
    02. each style
	02. clear style
------------------------------------------------------------------------ */

/* ========================================================================
    01. kill browser default
------------------------------------------------------------------------ */

/* 
    Structure
--------------------------------------------------*/
html{height:100%;}
body{
margin:0;
padding:0;
height:100%;
color:#585243;
font-family:"ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
font-size:13px;
line-height:1.5;
text-align:center;
background:#ffffff url(/sp/scannote/images/cd_note.gif) repeat-x 0 0;
}

/* Heading Module
--------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6{
margin:0;
padding:0;
}

/* Text Module
--------------------------------------------------*/
p{
margin:0;
padding:0;
}

strong{
color:#b00;
font-weight:bold;
}

em{
font-style:normal;
font-weight:bold;
}

address{
margin:0;
padding:0;
font-style:normal;
}

/* Hypertext Module
--------------------------------------------------*/
a:link{
color:#167dcb;
text-decoration:underline;
}

a:visited{
color:#6c8293;
text-decoration:underline;
}

a:hover,
a:active,
a:focus{
color:#00b69a;
text-decoration:underline;
}

/* List Module
--------------------------------------------------*/
ul,
ol,
dl{
margin:0;
padding:0;
list-style:none;
}

ol{
list-style-type:decimal;
}

li,
dt,
dd{
margin:0;
padding:0;
}

li p,
li li,
li dt,
li dd,
li caption,
li th,
li td,
dd p,
dd li,
dd dt,
dd dd,
dd caption,
dd th,
dd td{
font-size:100%;
}

/* Table Module
--------------------------------------------------*/
table{
margin:0;
padding:0;
}

td p,
td li,
td dt,
td dd{
font-size:100%;
}

/* Image Module
--------------------------------------------------*/
img{
display:block;
border:0;
vertical-align:auto;
}
.align-L img{display:inline !important;}
.align-R img{display:inline !important;}
.align-C img{display:inline !important;}

/* Form Module
--------------------------------------------------*/
form,
fieldset{
margin:0;
padding:0;
border:0;
}

legend{
display:none;
}

/* Horizontal Rule
--------------------------------------------------*/
hr{
display:none;
}

/* Get hasLayout
--------------------------------------------------*/
h2, div, ul, li, dl, dt, dd, p{
zoom:1;
}

ol li,
div.image-float p{
zoom:0;
}


/* ========================================================================

    02. each style
	
------------------------------------------------------------------------ */

/* 	str-container
--------------------------------------------------*/
#str-container{width:100%; min-width:900px; text-align:left;}

/* 	str-header
--------------------------------------------------*/
#str-header{
width:900px; margin:0 auto; padding:10px 0 0 0;
}

/* 	mainVisual
--------------------------------------------------*/
#mainVisual{position:relative; width:900px; height:507px; margin:0 auto;}
#mainVisual h2{z-index:2; position:absolute; top:358px; left:0;}
#mainVisual .main-copy{z-index:2; position:absolute; top:28px; left:162px;}
#mainVisual .main-img{z-index:1; position:absolute; bottom:0; left:88px;}

#mainVisual .specialmovie{z-index:2; position:absolute; top:341px; left:603px;}
#mainVisual ul.main-badge{z-index:2; position:absolute; top:391px; left:603px;}
#mainVisual ul.main-badge li{float:left;}

#mainVisual ul.share-btn{z-index:2; position:absolute; top:457px; left:609px;}
#mainVisual ul.share-btn li{float:left;}
#mainVisual ul.share-btn li.Evernote{padding:0 10px 0 0;}
#mainVisual ul.share-btn li iframe{width:110px !important;}

/* 	str-contents
--------------------------------------------------*/
#str-contents{
	width:900px; margin:0 auto;
}


/* 	stepArea
--------------------------------------------------*/
#stepArea{width:100%; height:249px; text-align:center;}
#stepArea img{margin:0 auto;}

#stepArea ul{padding:11px 0 0 30px;}
#stepArea ul li{float:left; width:290px; padding:0 0 10px; text-align:left; background:url(/sp/scannote/images/step_arrow.gif) no-repeat 264px 50%;}
#stepArea ul li.after{width:259px;}
#stepArea ul li img{margin:0;}

/* 	tabArea
--------------------------------------------------*/
#tabArea{margin:0 0 40px; background:url(/sp/scannote/images/tab_body.gif) repeat-y 0 0;}

ul#tabNavi{padding:5px 0 0 10px; background:url(/sp/scannote/images/tab_top.gif) no-repeat 0 0;}
ul#tabNavi li{
float:left;
}
.tabPanel{
padding:0 10px 15px; background:url(/sp/scannote/images/tab_bottom.gif) no-repeat 0 100%;
}
.tabPanel h3{padding:30px 0 20px 20px;}
.tabPanel p{margin:0 20px 20px;}

dl.list-style-01{margin:0 20px 10px; padding:0 0 10px; background:url(/sp/scannote/images/dot_line.gif) repeat-x 0 100%;}
dl.list-style-01.after{padding:0; background:transparent;}
dl.list-style-01 dt{float:left; width:142px;}
dl.list-style-01 dd{float:right; width:685px; font-size:1.1em;}
dl.list-style-01 dd p{margin:0; padding:12px 0 0 0;}

ul.list-style-02{height:128px; margin:0 0 0 13px; padding:0 0 0 17px; background:url(/sp/scannote/images/t01_note_bg.jpg) no-repeat 0 0;}
ul.list-style-02 li{float:left; width:286px; margin:10px 0 0;}
ul.list-style-02 li.after{width:245px;}

dl.list-style-03{width:760px; height:215px; margin:0 0 0 60px; background:url(/sp/scannote/images/t01_box_bg.gif) no-repeat 0 0;}
dl.list-style-03 dt{padding:19px 0 17px; text-align:center;}
dl.list-style-03 dd{float:left; width:253px; text-align:center;}
dl.list-style-03 img{display:inline;}

.box-style-01{padding:25px 50px 0 87px;}
.box-style-01 .fL{float:left;}
.box-style-01 .fR{float:right; margin:40px 0 0 0;}

.spec-table{width:840px; margin:0 0 5px 20px; background:url(/sp/scannote/images/t02_spec_bg.gif) no-repeat 0 0;}
.spec-table th{width:130px; height:46px; text-align:center; vertical-align:middle;}
.spec-table td{width:115px; height:46px; text-align:center; vertical-align:middle;}
.spec-table th img,
.spec-table td img{margin:0 auto 2px auto;}

dl.list-style-04{height:207px; margin:0 20px 20px; padding:0 0 0 13px; background:url(/sp/scannote/images/t02_ex_bg.gif) no-repeat 0 0;}
dl.list-style-04 dt{padding:13px 0 20px 0;}
dl.list-style-04 dd{float:left; width:409px; height:135px; margin:0 10px 0 0; background:url(/sp/scannote/images/t02_ex_dot.gif) no-repeat 100% 0;}
dl.list-style-04 dd.after{width:390px; background:transparent;}
dl.list-style-04 dd img{float:left;}
dl.list-style-04 dd img.fL{margin:0 20px 0 0;}

dl.list-style-05{margin:0 20px 15px; padding:0 0 15px 10px; font-size:1.1em; background: url(/sp/scannote/images/dot_line.gif) repeat-x 0 100%;}
dl.list-style-05.last-child{background:transparent; margin:0 20px 0;}
dl.list-style-05 dt{float:left; width:254px;}
dl.list-style-05 dd{float:right; width:560px;}
dl.list-style-05 dd ul{float:left; width:270px; padding:20px 0 0;}
dl.list-style-05 dd ul li{margin:0 0 20px; padding:0 0 0 10px; border-left:6px #989184 solid;}
dl.list-style-05 dd div{float:right; width:280px; height:98px; margin:20px 0 0; background:url(/sp/scannote/images/t04_note_bg.gif) no-repeat 0 0;}
dl.list-style-05 dd div img{display:inline; float:left; margin:23px 0 0 19px;}
dl.list-style-05 dd div span{display:block; float:right; width:145px; padding:7px 0 0 0;}

#sec03{font-size:1.1em;}

.doc-notice-01{margin:0 0 20px 30px !important;}

/* 	str-footer
--------------------------------------------------*/
#str-footer{
width:100%;
min-width:900px;
padding:30px 0;
background:#585243;
text-align:center;
}
#str-footer address{display:block; width:900px; margin:0 auto; text-align:right;}
#str-footer address img{float:right;}

/* ========================================================================

    03. clear style
	
------------------------------------------------------------------------ */

/* Adjustment
----------------------------------------------------------------- */
.align-C{text-align:center !important;}
.align-R{text-align:right !important;}
.align-L{text-align:left !important;}

.mb00{margin-bottom:0 !important;}
.mb05{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}

.mt00{margin-top:0 !important;}
.mt05{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mr00{margin-right:0 !important;}
.ml00{margin-left:0 !important;}
.ml10{margin-left:10px !important;}
.ml05{margin-left:5px !important;}

/* ----------------------------------------------------------------
    Clearfix
----------------------------------------------------------------- */
/* For modern browsers */
ul#tabNavi,
ul.main-badge,
ul.share-btn,
#stepArea ul,
#str-footer address,
dl.list-style-01,
ul.list-style-02,
dl.list-style-03,
.box-style-01,
dl.list-style-04,
dl.list-style-04 dd,
dl.list-style-05,
dl.list-style-05 dd,
dl.list-style-05 dd div{
content:"";
display:block;
overflow:hidden;
}

ul#tabNavi:after,
ul.main-badge:after,
ul.share-btn:after,
#stepArea ul:after,
#str-footer address:after,
dl.list-style-01:after,
ul.list-style-02:after,
dl.list-style-03:after,
.box-style-01:after,
dl.list-style-04:after,
dl.list-style-04 dd:after,
dl.list-style-05:after,
dl.list-style-05 dd:after,
dl.list-style-05 dd div:after{
clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
ul#tabNavi,
ul.main-badge,
ul.share-btn,
#stepArea ul,
#str-footer address,
dl.list-style-01,
ul.list-style-02,
dl.list-style-03,
.box-style-01,
dl.list-style-04,
dl.list-style-04 dd,
dl.list-style-05,
dl.list-style-05 dd,
dl.list-style-05 dd div{
zoom:1;
}