@charset "utf-8";

/*==================================================
	Base
==================================================*/
html,body,div,p,h1,h2,h3,h4,h5,h6,address,blockquote,pre,ul,ol,li,dl,dt,dd,table,caption,col,colgroup,thead,tbody,tfoot,tr,th,td,form,fieldset,legend,label,img,iframe,object,span,a,em,strong,sub,sup,del,ins{
margin:0;
padding:0;
}

div,ul,ol,dl,dt,dd{
zoom:1;
}

body{
line-height:1.5;
font-size:75%;
font-family:"ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
}

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;}

ul{
list-style:none;
}

img{
border:0 none;
vertical-align:bottom;
}


/*==================================================
	#header
==================================================*/
#header{
position:relative;
margin:0 auto 5px;
width:840px;
height:145px;
background:url("/sp/shotnote/images/bg-header-01.gif") repeat-x 0 0;
}

#header p{
position:absolute;
top:20px;
left:20px;
}

#header #top{
position:absolute;
top:33px;
left:192px;
}

#header #manual{
position:absolute;
top:68px;
left:64px;
}

#header .lan_btn{
	position:absolute;
	top:118px;
	left:642px;
	width: 194px;
}

/*==================================================
	#content
==================================================*/
#content{
margin:0 auto;
padding:0 20px;
width:800px;
}

#content .date{
margin-bottom:20px;
text-align:right;
font-weight:bold;
color:#b80000;
}


/*==================================================
	main-visual
==================================================*/
/* 	main-visual-01
--------------------------------------------------*/
#content .main-visual-01{
position:relative;
height:550px;
background:url("/sp/shotnote/images/bg-main-visual-01.jpg") no-repeat 100% 82px;
padding-bottom:30px;
}

#content .main-visual-01 h2,
#content .main-visual-01 h3,
#content .main-visual-01 p,
#content .main-visual-01 li{
position:absolute;
}
#content .main-visual-01 .img-01{
top:10px;
left:0;
}
#content .main-visual-01 .img-02{
top:81px;
left:0;
}
#content .main-visual-01 .btn-01{
top:147px;
left:0;
}
#content .main-visual-01 .btn-02{
position:absolute;
top:147px;
left:247px;
}
#content .main-visual-01 .hdg-10{
top:286px;
left:0;
}
#content .main-visual-01 .btn-03{
top:318px;
left:0;
}
#content .main-visual-01 .btn-04{
top:318px;
left:200px;
}

/*
#content .main-visual-01 .img-20{
top:430px;
left:9px;
}
#content .main-visual-01 .img-22{
top:430px;
left:200px;
}
*/

#content .main-visual-01 .hdg-11{
top:261px;
left:430px;
}

#content .main-visual-01 .img-23{
	top:336px;
	left:422px;
}
#content .main-visual-01 .img-15{
	top:455px;
	left:428px;
}

#content .main-visual-01 .img-25{
	top:455px;
	left:515px;
}

#content .main-visual-01 .img-26{
	top:455px;
	left:620px;
}

#content .main-visual-01 .img-32{
	top:455px;
	left:715px;
}

#content .main-visual-01 .btn-13{
top:405px;
left:0;
}
#content .main-visual-01 .btn-14{
top:477px;
left:20px;
}

#content .main-visual-01 .btn-15{
	top:515px;
	left:428px;
}

#content .main-visual-01 .btn-16{
	top:514px;
	left:505px;
}

#content .main-visual-01 .btn-17{
	top:514px;
	left:630px;
}



/* 	main-visual-02
--------------------------------------------------*/
#content .main-visual-02{
position:relative;
padding-top:20px;
height:490px;
background:url("/sp/shotnote/images/bg-main-visual-02.jpg") no-repeat 0 0;
}

#content .main-visual-02 ul li{
position:absolute;
}

#content .main-visual-02 ul #txt-01{top:119px;}
#content .main-visual-02 ul #txt-02{top:229px;}
#content .main-visual-02 ul #txt-03{top:22px;left:557px;}
#content .main-visual-02 ul #txt-04{top:114px;left:557px;}
#content .main-visual-02 ul #txt-05{top:197px;left:557px;}
#content .main-visual-02 ul #txt-06{top:265px;left:557px;}
#content .main-visual-02 ul #txt-07{top:358px;left:557px;}
#content .main-visual-02 #txt-08{position:absolute;top:332px;}
#content .main-visual-02 #txt-09{position:absolute;top:440px;}


/*==================================================
	List
==================================================*/
/* 	btn-list-01
--------------------------------------------------*/
#content .btn-list-01{
margin-bottom:20px;
}
#content .btn-list-01{
padding-left:90px;
}
#content .btn-list-01 li{
float:left;
padding-right:13px;
}
#content .btn-list-01 li.last{
padding-right:0;
}

/*==================================================
	section
==================================================*/
/* 	section-01~03
--------------------------------------------------*/
#content .section-01{
margin-bottom:40px;
padding:20px;
background:url("/sp/shotnote/images/bg-section-01.gif") no-repeat 0 100%;
}

#content .section-01 .col-01,
#content .section-03 .col-01{
margin-right:-30px;
width:790px;
}

#content .section-01 .col-01 .block,
#content .section-03 .col-01 .block{
margin-right:30px;
width:365px;
}

#content .section-02{
margin-bottom:40px;
padding-bottom:20px;
background:url("/sp/shotnote/images/bg-section-02.gif") no-repeat 0 100%;
}

#content .section-02 .block{
text-align:center;
}

#content .section-03{
margin-bottom:40px;
padding:20px;
}

#content .section-03 .col-01 .block{
text-align:center;
}

/* 	flow
--------------------------------------------------*/
#content .flow{
overflow:hidden;
margin-bottom:40px;
}

#content .flow li{
float:left;
}

/* 	lineup
--------------------------------------------------*/
#content .lineup{
position:relative;
margin-bottom:12px;
height:1090px;
background:url("/sp/shotnote/images/bg-lineup-01.gif") no-repeat 0 0;
}

#content .lineup h3,
#content .lineup p{
position:absolute;
}

#content .lineup .img-21{
top:21px;
left:419px;
}
#content .lineup .btn-06{
top:66px;
left:35px;
}
#content .lineup .btn-07{
top:66px;
left:419px;
}
#content .lineup .btn-08{
top:324px;
left:35px;
}
#content .lineup .btn-09{
top:324px;
left:419px;
}
#content .lineup .btn-15{
top:591px;
left:419px;
}
#content .lineup .btn-16{
top:591px;
left:35px;
}
#content .lineup .btn-17{
top:858px;
left:35px;
}
#content .lineup .img-16{
top:111px;
left:67px;
}
#content .lineup .img-17{
top:111px;
left:427px;
}
#content .lineup .img-18{
top:370px;
left:41px;
}
#content .lineup .img-19{
top:370px;
left:422px;
}
#content .lineup .img-28{
top:636px;
left:427px;
}
#content .lineup .img-29{
top:636px;
left:67px;
}
#content .lineup .img-30{
top:902px;
left:98px;
}
#content .lineup .img-30{
top:902px;
left:98px;
}

/*
#content .lineup h3{
position:relative;
padding-left:36px;
z-index:2;
}

#content .lineup .note{
position:relative;
overflow:hidden;
margin-bottom:37px;
padding-left:35px;
z-index:3;
}

#content .lineup .note li{
float:left;
}

#content .lineup .cover-01{
margin:-80px 0 47px;
padding-left:35px;
}

#content .lineup .cover-02{
overflow:hidden;
margin-top:-21px;
padding-left:153px;
}

#content .lineup .cover-02 li{
float:left;
padding-left:33px;
}
*/

/* 	notice
--------------------------------------------------*/
#content .notice{
margin-bottom:10px;
font-size:86%;
color:#666;
}

#content .notice li{
position:relative;
padding-left:1.6em;
font-size:86%;
color:#666;
zoom:1;
}

#content .notice li span{
position:absolute;
top:0;
left:0;
}

#content .main-visual-01 .notice li {
color:#FF0000;
font-weight:bold;
} 

/* 	col
--------------------------------------------------*/
#content .col-01{
overflow:hidden;
margin-right:-20px;
width:820px;
}

#content .col-01 .block{
float:left;
margin-right:20px;
width:390px;
}

#content .col-02{
overflow:hidden;
}

#content .col-02 .block{
float:left;
}

#main .col-01{
width:720px;
}

#main .col-01 .block1{
float:left;
width:95px;
}

#main .col-01 .block2{
float:left;
width:65px;
}

/* 	share-btn
--------------------------------------------------*/
#content .share-btn-01{
margin-bottom:10px;
}
#content .share-btn-01:after{ display:block;clear:both;content:''; }

#content .share-btn-01 li{
padding-right:10px;
float:left;
}

/* 	link
--------------------------------------------------*/
#content .link{
margin-bottom:20px;
text-align:right;
}

#content .link a{
display:inline-block;
padding-left:20px;
background:url("/sp/shotnote/images/icon-01.gif") no-repeat 0 0.3em;
}


/*==================================================
	#footer
==================================================*/
#footer{
position:relative;
margin:0 auto;
width:840px;
height:51px;
background:url("/sp/shotnote/images/bg-footer-01.gif") repeat-x 0 0;
}

#footer p{
position:absolute;
top:21px;
left:324px;
}


/*==================================================
	Ajust
==================================================*/
.pr05{padding-right:5px !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;}


/*==================================================
	iPhone
==================================================*/
.text-iphone{
display:none;
}

@media only screen and (max-device-width:480px){
.text-iphone{
display:block;
}
}

/*==================================================
	GALAXY Tab
==================================================*/
/* 	gtab-visual-01
--------------------------------------------------*/
#content .gtab-visual-01{
position:relative;
height:460px;
background:url("/sp/shotnote/images/bg-gtab-main-01.jpg") no-repeat 100% 0;
}

#content .gtab-visual-01 h2,
#content .gtab-visual-01 h3,
#content .gtab-visual-01 p,
#content .gtab-visual-01 li{
position:absolute;
}
#content .gtab-visual-01 .hdg-01{
top:77px;
left:40px;
}
#content .gtab-visual-01 .hdg-02{
top:316px;
left:0;
}
#content .gtab-visual-01 .img-01{
top:349px;
left:421px;
}
#content .gtab-visual-01 .img-02{
top:352px;
left:204px;
}
#content .gtab-visual-01 .btn-01{
top:352px;
left:0;
}
#content .gtab-visual-01 .btn-02{
top:352px;
left:204px;
}


/* 	gtab-btn-01
--------------------------------------------------*/
#content .gtab-btn-01{
margin-bottom:25px;
text-align:center;
}


/*==================================================
	Clear
==================================================*/
#content .btn-list-01{
zoom:1;
}
#content .btn-list-01:after,
#main .col-01:after{
display:block;
clear:both;
height:0;
visibility:hidden;
content:".";
font-size:0;
}
