@charset "utf-8";
body  {
	font: 100% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	background: #666666;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000000;
}
.twoColLiqLtHdr #container { 
	width: 100%;
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left;
} 
.twoColLiqLtHdr #header { 
	background: #fff; 
	padding: 0;
	height: 160px;
} 
.twoColLiqLtHdr #header h1 {
	margin: 0;
	padding: 10px 0;
}


.twoColLiqLtHdr #sidebar1 {
	float: left; 
	width: 80px;
	background: #fff;
	padding: 15px 0;
}
.twoColLiqLtHdr #sidebar1 h3, .twoColLiqLtHdr #sidebar1 p {
	margin-left: 10px;
	margin-right: 10px;
}


.twoColLiqLtHdr #mainContent { 
	margin: 0px 0px 0px 80px;
	border-top: #0075c2 solid 15px;
	border-left: #0075c2 solid 15px;
	min-height: 1360px;
} 
.twoColLiqLtHdr #footer { 
	padding: 0 0px;
	background:#fff;
	
	margin: -24px 0 0 80px;
	border-left: #0075c2 solid 15px;
	height: 80px;
} 
.twoColLiqLtHdr #footer p {
	margin: 0;
	padding: 0px 0;
	text-indent: -9999px;
}

.fltrt {
	float: right;
	margin-left: 8px;
}
.fltlft {
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



div#header h1 {
	position: absolute;
	left: 40px;
	top: 10px;
}

ul#global-nav, ul#global-nav li, ul#global-nav li a {
	margin: 0;
	padding: 0;
	display: block;
}

ul#global-nav {
	position: absolute;
	top:120px;
	left: 120px;
	width:620px;
	height:40px;
	background: url(img/global-nav_bg.png);
	overflow: hidden;
	text-indent: -9999px;
}

ul#global-nav li a {
	width: 140px;
	height: 40px;
}

ul#global-nav li#nav-home {
	position: absolute;
	left: 20px;
	background: url(img/nav-home.png);
}

ul#global-nav li#nav-melankov {
	position: absolute;
	left: 130px;
	background: url(img/nav-melankov.png);
}

ul#global-nav li#nav-howto {
	position: absolute;
	left: 240px;
	background: url(img/nav-howto.png);
}

ul#global-nav li.current#nav-howto {
	background: none;
}

ul#global-nav li#nav-blog {
	position: absolute;
	left: 350px;
	background: url(img/nav-blog.png);
}

ul#global-nav li#nav-links a{
	position: absolute;
	width: 155px;
	left: 460px;
	background: url(img/nav-links.png);	
}

ul#global-nav li#nav-home a:hover {background: url(img/nav-home_a.png);}
ul#global-nav li#nav-melankov a:hover {background: url(img/nav-melankov_a.png);}
ul#global-nav li#nav-howto a:hover {background: url(img/nav-howto_a.png);}
ul#global-nav li#nav-blog a:hover {background: url(img/nav-blog_a.png);}
ul#global-nav li#nav-links a:hover {background: url(img/nav-links_a.png);}

ul#file-mng {
	position: absolute;
	width: 241px;
	height: 90px;
	top: 20px;
	left: 300px;
	background: url(img/file-mng_bg.png);
	overflow: hidden;
	text-indent: -9999px;
}

ul#file-mng, ul#file-mng li, ul#file-mng li a {
	margin: 0;
	padding: 0;
	display: block;
}

ul#file-mng li a {
	width: 145px;
	height: 38px;
}

ul#file-mng li#check-scraps {
	position: absolute;
	left: 85px;
	top: 10px;
	background: url(img/check-scraps.png);
}

button.check-scraps {
	border: 0;
	cursor: pointer;
	text-indent: -9999px;
	background: url(img/download.png) no-repeat;
	position:absolute;
	left: 385px;
	top: 54px;
	width: 145px;
	height: 32px;
	z-index: 1;
}

ul#file-mng li#download {
	position: absolute;
	left: 85px;
	top: 48px;
	height: 32px;
	background: url(img/download.png) no-repeat;
}

ul#file-mng li#check-scraps a:hover {background: url(img/check-scraps_a.png);}
button.check-scraps:hover {background: url(img/download_a.png) no-repeat;}
ul#file-mng li#download a:hover {background: url(img/download_a.png) no-repeat;}

#news-dip {
	position: absolute;
	left: 560px;
	top: 20px;
	width: 360px;
	height: 90px;
	background: url(img/news_bg.png);
	color:#000;
	font-size: 9px;
}
#news-dip ul {padding:25px 0 0 17px;}

#tick {
	position:absolute;
	word-wrap: break-word;
	top:3px;
	left:-2px;
	width:345px;
	height:0;
	font-size: 10px;
}


ul#side-nav, ul#side-nav li, ul#side-nav li a {
	margin: 0;
	padding: 0;
	display: block;
}

ul#side-nav {
	position: absolute;
	top: 200px;
	left: 40px;
	width: 40px;
	height: 1380px;
	background: url(img/side-nav_bg.png);
	overflow: hidden;
	text-indent: -9999px;
}

ul#side-nav li, ul#side-nav li a {
	position: absolute;
	width: 40px;
	height: 180px;
}

ul#global-nav li.spring-10#nav-home, ul#global-nav li.summer-10#nav-home, ul#global-nav li.autumn-10#nav-home,
ul#global-nav li.winter-11#nav-home, ul#global-nav li.special-11#nav-home, ul#global-nav li.summer-11#nav-home,
ul#global-nav li.special-02#nav-home, ul#global-nav li.spring-12#nav-home, ul#global-nav li.summer-12#nav-home,
ul#global-nav li.spring-13#nav-home , ul#global-nav li.winter-13#nav-home {
	left: -9999px;
}

ul#side-nav li.special-11#special-11, ul#side-nav li.winter-11#winter-11, ul#side-nav li.autumn-10#autumn-10,
ul#side-nav li.summer-10#summer-10, ul#side-nav li.spring-10#spring-10, ul#side-nav li.summer-11#summer-11,
ul#side-nav li.special-02#special-02, ul#side-nav li.spring-12#spring-12, ul#side-nav li.summer-12#summer-12,
ul#side-nav li.spring-13#spring-13, ul#side-nav li.winter-13#winter-13 {
	left: -9999px;
}

ul#side-nav li#winter-13 {top: 0px; background: url(img/13-winter.png) no-repeat;}
ul#side-nav li#spring-13 {top: 140px; background: url(img/13-spring.png) no-repeat;}
ul#side-nav li#summer-12 {top: 260px; background: url(img/12-summer.png) no-repeat;}
ul#side-nav li#spring-12 {top: 380px; background: url(img/12-spring.png) no-repeat;}
ul#side-nav li#special-02 {top: 500px; background: url(img/02-special.png) no-repeat;}
ul#side-nav li#summer-11 {top: 620px; background: url(img/11-summer.png) no-repeat;}
ul#side-nav li#special-11 {top: 740px; background: url(img/11-special.png) no-repeat;}
ul#side-nav li#winter-11 {top: 860px; background: url(img/11-winter.png) no-repeat;}
ul#side-nav li#autumn-10 {top: 980px; background: url(img/10-autumn.png) no-repeat;}
ul#side-nav li#summer-10 {top: 1100px; background: url(img/10-summer.png) no-repeat;}
ul#side-nav li#spring-10 {top: 1220px; background: url(img/10-spring.png);}

ul#side-nav li#spring-13 a:hover {background: url(img/13-winter_a.png) no-repeat;}
ul#side-nav li#spring-13 a:hover {background: url(img/13-spring_a.png) no-repeat;}
ul#side-nav li#summer-12 a:hover {background: url(img/12-summer_a.png) no-repeat;}
ul#side-nav li#spring-12 a:hover {background: url(img/12-spring_a.png) no-repeat;}
ul#side-nav li#special-02 a:hover {background: url(img/02-special_a.png) no-repeat;}
ul#side-nav li#summer-11 a:hover {background: url(img/11-summer_a.png) no-repeat;}
ul#side-nav li#special-11 a:hover {background: url(img/11-special_a.png) no-repeat;}
ul#side-nav li#winter-11 a:hover {background: url(img/11-winter_a.png) no-repeat;}
ul#side-nav li#autumn-10 a:hover {background: url(img/10-autumn_a.png) no-repeat;}
ul#side-nav li#summer-10 a:hover {background: url(img/10-summer_a.png) no-repeat;}
ul#side-nav li#spring-10 a:hover {background: url(img/10-spring_a.png);}

div#section-main {
	position:relative;
	left: 35px;
	top: 20px;
	width: 280px;
	font-size: 11px;
	line-height: 1.5em;
	text-align: justify;
	float: left;
	border-right: #aaa solid 2px;
}

div#section-main img {
	box-shadow:2px 2px 5px #888;
}
div#section-main h1 img {
	box-shadow: none;
}

div#section-main-text {border-left: #aaa solid 2px; width: 240px;}

div#section-main h1 {padding:0 0 20px 5px;}
div#section-main p#cover-main {padding:0 0 10px 0;}

div#section-main-text p.main-note, div#section-main-text ul.main-note {margin: 0 0 0 10px;}

div#section-main-sub {
	margin: 0 0 0 45px;
	padding: 10px;
	width: 200px;
}
p.sub-set-cover {margin: 20px 0 0 0px;}
p.sub-set-note {
	border-left: #aaa solid 2px;
	margin: 0px 0 0 0px;
	padding: 0 0 0 10px;
}

img.cover-sub {
	display:block;
	margin: 0 0 25px 0;
}

div#section-side {
	position: relative;
	float: left;
	left: 75px;
	top: 20px;
	width: 500px;
	font-size: 11px;
	line-height: 1.5em;
	/*text-align: justify;*/
}

div.side-article {
	float: left;
	width: 200px;
	margin: 0 30px 0 0;
	border-bottom: 
}

div.scraps-set {
	float: none;
}

div.scraps-set img {
	box-shadow:2px 2px 5px #888;
}

div#section-top h1 {
	padding: 25px 0 33px 25px;
	border-bottom: #0075c2 solid 2px;
}

div#section-howToUse, div#section-melankov {
	background: url(img/how-to-use_bg.png) no-repeat;
	font-size: 11px;
	line-height: 16px;
}

div#section-howToUse-text, section-melankov-text {
	margin: 0 0 0 415px;
	padding: 40px 0 0 0;
	width: 361px;
	text-align: justify;
}

div#section-howToUse-text p, div#section-howToUse-text2 p {margin: 0 0 40px 0;}

p.index {
	font-weight: bold;
	text-align: center;
	font-size: 36px;
}
div#section-howToUse-text2 {
	margin: 0 0 0 415px;
	padding: 40px 0 20px 0;
	width: 361px;
	text-align: justify;
}
div#section-howToUse-text2 img {padding: 0 40px 0 0px;}

img.vaimo {
	position: absolute;
	left: 190px;
	top: 1590px;
	padding: 0;
}

img.vaimo2 {
	position: absolute;
	left: 200px;
	top: 1800px;
}
p.credit {
	position: absolute;
	left: 120px;
	top: 1970px;
}

p span.blue, p span.green, p span.yellow {font-weight: bold;}
p span.blue {color: #0073BF;}
p span.green {color: #2FAE68;}
p span.yellow {color: #ED9608;}

div#section-melankov {
	background: none;
}

div#section-melankov-text {
	margin: 0 0 20px 30px;
	padding: 0px 0 0 0;
	width: 490px;
	text-align: justify;
}
div#section-melankov-text a, div#section-howToUse-text2 a { color: #333; }
div#section-melankov-text a:hover, div#section-howToUse-text2 a:hover {
	color: #0075C2;
}
	

div#section-melankov-text p.index {margin: 60px 0 35px 0;}

span.bold { font-weight: bold; }
span.u-line { text-decoration: underline; }
span.caution { color:#666; }
span.discription {display:none;}

div#section-melankov-text p.h_btn a {
	margin: 5px 0 0 0;
	text-indent: -9999px;
	overflow: hidden;
	display:block;
	width: 110px;
	height: 33px;
	background: url(img/how-to-use_btn.png) no-repeat;
}
div#section-melankov-text p.h_btn a:hover { background: url(img/how-to-use_btn_a.png) no-repeat; }

div#section-link {
	font-size: 11px;
	margin: 40px 0 0px 40px;
	padding: 0 0 20px 0;
	line-height: 2em;
}
div#section-link p { margin: 0 0 3em 0; }
div#section-link  p a {
	text-decoration: none;
	color: #222;
}
div#section-link  p a:hover {
	color:#F39800;
}
#section-link img {
	margin-bottom: 1em;
}

div.scrap, div.scrap-book {
	position: relative;
	/*text-align: right;*/
	/*background: url(img/scrap_chk.png) no-repeat  ;*/
	height:25px;
	width: 83px;
	margin-left: 160px;
}

div.scrap a, div.scrap-side a {
	position: absolute;
	background: url(img/scrap_chk_btn.png) no-repeat;
	width: 66px;
	height: 25px;
	text-indent: -9999px;
	overflow: hidden;
}
div.scrap a:hover, div.scrap-side a:hover {background-position: 0 -25px;}
div.scrap a:active, div.scrap-side a:active {background-position: 0 -50px;}
div.scrap input, div.scrap-side input {
	position: absolute;
	top: 5px;
	right:  0;
}
div.checkmark {
	position: absolute;
	top: 1px;
	left: 70px;
	overflow: visible;
}
div.scrap-book, div.scrap-book-side {background: none;}
div.scrap-book a {
	display: block;
	width: 66px;
	height: 25px;
	background: url(img/delete_btn.png);
	z-index:9999;
	margin: 0 0 0 0px;
	text-indent: 9999px;
	overflow: hidden;
}
div.scrap-book a:hover { background: url(img/delete_btn_a.png);}

div.scrap-side, div.scrap-book-side {
	position: relative;
	height: 25px;
	width: 83px;
	/*padding: 5px 0 0 0;*/
	margin: 5px 0 5px 120px;
	/*text-indent: -9999px;*/
	/*overflow: hidden;*/
}
div.scrap-book, div.scrap-book-side {background: none;}
div.scrap-book a, div.scrap-book-side a {
	display: block;
	width: 66px;
	height: 25px;
	background: url(img/delete_btn.png);
	z-index:9999;
	margin: 0 0 0 15px;
	text-indent: 9999px;
	overflow: hidden;
}
div.scrap-book a:hover, div.scrap-book-side a:hover { background: url(img/delete_btn_a.png);}



.twoColLiqLtHdr body {height: 100%;}

.twoColLiqLtHdr #footer {
	clear:both;
	position:absolute;
	top: 160px;
	bottom:0px;
	height: 100%;
	margin: 0 0 0 80px;
}

.twoColLiqLtHdr #container {
	height: 100%;
}

div#section-side {
	margin: 0 0 40px 0;
}

div#section-main {
	margin: 0 0 40px 0;
}
div#section-melankov-text {
	margin: 0 0 0 30px;
	padding-bottom: 80px;
}

div#section-side.special-11 {
	width: 330px;
}

div.side-article_special-11 {
	position: relative;
	float: left;
	left: 115px;
	top: 20px;
	width: 200px;
	font-size: 11px;
}

div.side-article_special-11 h2 img{
	box-shadow: none;
}

div.scrap-alt a {
	margin-left: 148px;
	text-indent: -9999px;
	overflow: hidden;
	display:block;
	width: 102px;
	height: 25px;
	background: url(img/download-mini.png) no-repeat;
}
div.scrap-alt a:hover { background: url(img/download-mini_a.png) no-repeat; }

h3.sp2011-scrap {
	color: #000001;
	padding-top: 30px;
	width: 470px;
	font-size: 14px;
	line-height: 1.5em;
}
p.sp2011-scrap {
	color: #222222;
	padding-top: 1em;
	width: 470px;
	line-height: 1.5em;
}

p.sub-set-cover-sp {
	padding: 20px 0 10px;
}

a#scrap-all {
	position: absolute;
	top: 9px;
	left: 195px;
	background: url("img/scrap_all_btn.png") no-repeat;
	width: 142px;
	height: 32px;
	overflow: hidden;
	text-indent: -9999px;
}
a:hover#scrap-all {
	background-position: 0 -32px;
}
a:active#scrap-all {
	background-position: 0 -64px;
}

div#social-buttons {
	position: relative;
	margin: 8px 0 5px 0;
}
/*
div.tweet-button {
	position: absolute;
	right: 0;
}*/
div.like-button {
	position: absolute;
	left: 60px;
	top: 0px;
	width: 70px;
	overflow: hidden;
}

img#arrow {
	position: absolute;
	top: 75px;
	left: 390px;
}
