@charset "utf-8";
/*
Theme Name: a-magic-web
Theme URI: null
Description: The lady of Shalottをモチーフにしたデザイン。
Version: 1.6
Author: Noah Kobayashi
Author URI: http://binarybonsai.com/
Tags: two columns, widgets
*/

/* This file is for a-magic-web.com */
/****************************************************************
Reset
****************************************************************/
body{
	font:13px/123.1 arial,helvetica,clean,sans-serif;
	*font-size:small;
	*font:x-small;
	line-height: 1.4;
}

select,input,button,textarea,button {
	font:99% arial,helvetica,clean,sans-serif;
}

table{
	font-size:inherit;
	font:100%;
}
	
pre,code,kbd,samp,tt{
	font-family:monospace;
	*font-size:108%;
	/*line-height:100%;*/
}


/* YUI 2: Reset CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/****************************************************************
共通
****************************************************************/
body {
	background-color: #f2f2f2;
	color: #191919;
}
a {
	color: #3e3e3e;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.inner {
	width: 900px;
	margin: 0 auto;
}
.clear {
	clear: both
}
/****************************************************************
header
****************************************************************/
#header {
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/header_bg.jpg);
	background-position: 0 0;
	background-repeat: repeat-x;
	width: 100%;
}
#header .inner {
	height: 120px;
	position: relative;
}
#header .inner .h1 {
	overflow: hidden;
	padding: 80px 0 0 0;
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/header_wquote02.png);
	background-position: right bottom;
	background-repeat: no-repeat;
}
#header .h1 h1 {
	padding: 7px 25px 5px 28px;
	float: right;
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/header_wquote01.png);
	background-position: 0 0;
	background-repeat: no-repeat;
} 
#header #logo {
	margin: 35px 0 0 0;
	position: absolute;
}
#header .menu {
	width: 400px;
	position: absolute;
	left: 500px;
	top: 0;
}
#header .menu ul li {
	float: left;
	width: 100px;
}
/****************************************************************
separator 
****************************************************************/
#separator_top {
	clear: both;
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/separator_top_bg.gif);
	background-position: 0 0;
	background-repeat: repeat-x;
}
#separator_top .inner {
	height: 290px;
	position: relative;
	z-index: 1;
}
.main_images01 {
	position: absolute;
	top: 5px;
	z-index: 100;
	display: block;
}
.main_images02 {
	position: absolute;
	top: 314px;
	left: 323px;
	z-index: 110;
	display: block;
}
.main_images03 {
	position: absolute;
	top: 314px;
	left: 823px;
	z-index: 111;
	display: block;
}
#separator {
	clear: both;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/separator_bg.gif) repeat-x 0 0;
}
#separator .inner {
	height: 46px;
}
#separator .inner a {
	float: left;
}
/****************************************************************
slider 
****************************************************************/
.slider {
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/contents_bg.jpg);
	background-position: 0 0;
	background-repeat: repeat-x;
}
.slider .inner {
	width: 828px;
	padding: 35px 36px 8px 36px;
	height: 170px;
	margin-bottom: 15px;
	position: relative;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_bg.gif) no-repeat left bottom;
}
.slider_left {
	position: absolute;
	left: 5px;
	top: 97px;
	cursor:pointer;
}
.slider_right {
	position: absolute;
	left: 870px;
	top: 97px;
	cursor:pointer;
}
.slider .inner ul {
	float: left;
	width: 828px;
}
.slider .inner .container {
	width:100%;
	height:100%;
	overflow:hidden;
}
.slider .inner .container div{
}
.slider ul li {
	display: inline;
	float: left;
}
.slider ul li a {
	display: block;
}
.slider ul li.image01 a{
	padding: 3px 27px 17px 19px;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg01.png) no-repeat 15px 0;
	*background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg.gif) no-repeat 16px 0;
}
.slider ul li.image02 a{
	padding: 3px 15px 17px 3px;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg02.png) no-repeat 0 0;
	*background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg.gif) no-repeat 0 0;
}
.slider ul li.image03 a{
	padding: 3px 3px 17px 15px;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg03.png) no-repeat 6px 0;
	*background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg.gif) no-repeat 12px 0;
}
.slider ul li.image04 a{
	padding: 3px 19px 17px 27px;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg04.png) no-repeat 0 0;
	*background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/slider_image_bg.gif) no-repeat 24px 0;
}
/****************************************************************
contents
****************************************************************/
#contents_top {
}
#contents_top .inner {
	overflow: hidden;
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/contents_top_rssbox02.gif);
	background-position: 0 bottom;
	background-repeat: repeat-x;
	margin: 0 auto 15px auto;
}

/* RSS ---------------------------- */
#contents_top .rss_block {
	width: 225px;
	margin: 0;
	padding: 0 0 17px 0;
	min-height: 300px;
	height: auto !important;
	height: 300px;
	float: left;
}
#contents_top .rss_block div{
	display: none;
}
#contents_top .rss_block div ul {
	margin: 0 13px 0 15px;
}
#contents_top .rss_block div ul li{
	padding: 5px 0 5px 0;
	border-bottom: 1px #CCCCCC dotted;
}
#twitter ul li span {
	font-size: 80%;
	color:#999999;
}
#contents_top .rss_block p{
	margin: 5px 13px 5px 0;
	text-align: right;
}

#contents .inner {
	overflow: hidden;
	padding: 10px 0 0px 0;
}
#contents .inner .main {
	float: right;
	width: 650px;
}
#contents .inner .sub {
	float: left;
	width: 250px;
}
/****************************************************************
blog
****************************************************************/
.post {
	width: 630px;
	overflow: hidden;
	padding: 0 0 5px 20px;
	margin: 0 0 5px 0;
}
.post p {
	margin: 5px 0 10px 2px;
}
.post a {
	color: #827f7b;
}
.post a:hover {
	color: #12b3e1;
}
.post p.meta {
	/*-webkit-border-radius: 5px;
	background: #191919;
	color: #ffffff;
	-moz-border-radius: 5px;*/
	font-style: italic;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 bottom repeat-x;
	display: block;
	margin: 0 0 10px 0;
	padding: 4px 2px 4px 10px;
}
.post .postmetadata{
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 bottom repeat-x;
	font-style: italic;
	margin: 30px 0 0 0;
	padding: 4px 2px 4px 10px;
}
.post h2 {
	font-weight: bold;
	font-size: 190%;
	padding: 40px 0 30px 0;
	margin: 0 0 5px 0;
	/*border-bottom: 2px #191919 solid;*/
}
.post h2 a {
	color: #191919;
}
.post h3 {
	font-weight: bold;
	font-size: 120%;
	margin: 40px 0 5px 0;
	padding: 0 0 7px 0;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 bottom repeat-x;
}
.post h4 {
	font-weight: bold;
	font-size: 95%;
	margin: 15px 0 5px 0;
}
.post blockquote {
	background: #ffffff;
	border: 2px #ece5e0 solid;
	margin: 14px auto;
	padding: 8px 10px 8px 12px;
}	
.command, .display {
	background: #000;
	color: #eee;
	margin: 13px auto;
	padding: 4px 8px;
	overflow: auto;
	width: 608px;
}
.navigation {
	width: auto;
	padding: 0 0 0 0;
	overflow: hidden;
	zoom: 1;
}
.navigation .alignleft {
	padding: 0 0 20px 0;
	float: left;
}
.navigation .alignright {
	padding: 0 0 20px 0;
	float: right;
}
.navigation_notes {
	width: 630px;
	padding: 0 0 0 20px;
	overflow: hidden;
}
.navigation_notes .alignleft {
	padding: 0 0 20px 0;
	float: left;
}
.navigation_notes .alignright {
	padding: 0 0 20px 0;
	float: right;
}
ol.commentlist, h3#comments {
	padding: 0 0 0 20px;
}
#respond {
	width: 630px;
	padding: 0 0 5px 20px;
	margin: 0 0 30px 0;
	font-size: 110%;
}
#respond p {
	margin: 10px 0 10px 0;
}
#respond input {
	padding: 3px;
	width: 300px;
}
#respond textarea {
	padding: 3px;
	width: 610px;
}
#respond h3 {
	font-weight: bold;
}
#respond #submit, #respond #comment_post_ID, #respond #comment_parent {
	width: auto;
}
/****************************************************************
portfolio
****************************************************************/
.pt_section {
	width: 900px;
	position: relative;
	overflow: hidden;
	padding: 0 0 20px 0;
	margin: 0 0 20px 0;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 bottom repeat-x;
}
.pt_section .pt_image {
	width: 600px;
	float: left;
}
.pt_section .pt_image img {
	border: 2px #efebe8 solid;
}
.pt_section .pt_text {
	width: 278px;
	float: right;
	padding: 50px 10px 0 12px;
}
.pt_section h2 {
	width: 270px;
	position: absolute;
	top: 10px;
	left: 610px;
	font-size: 160%;
	font-weight: bold;
}
.pt_section .pt_text h3 {
	margin: 10px 0 0 0;
	font-weight: bold;
	color: #191919;
}
.pt_section .pt_text p {
	margin: 0 0 10px 0;
}
.back_to_p {
	margin: 0 0 20px 0;
}
/* sub */
.sub .widget {
	padding: 10px 10px 0 3px;
}
.sub .widget ul li {
	font-weight: bold;
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 top repeat-x;
	padding: 0 0 7px 0;
}
.sub .widget ul li a {
	display: block;
	margin: 0;
	padding: 10px 3px 5px 3px;
}
.sub .widget .children {
	/*display: none;*/
}
.sub .widget ul li li{
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/list_marker_maru.gif) 0 6px no-repeat;
	border: none;
	padding: 0;
	margin: 0 0 0 18px;
	font-size: 100%;
	font-weight: normal;
}
.sub .widget ul li li a {
	display: block;
	margin: 0;
	padding: 1px 0 1px 15px;
	*height: 1em;
}
.widget p{
	font-size: 170%;
	padding: 10px 0 10px 0;
	margin: 0 0 10px 0;
}
/****************************************************************
profile
****************************************************************/
.profile .post {
	width: 610px;
	overflow: hidden;
	padding: 1px 20px 5px 20px;
	margin: 0 0 30px 0;
}
.profile .post h2 {
	font-weight: bold;
	font-size: 190%;
	margin: 15px 0 5px 0;
	padding: 0 0 0 0;
}
.profile .prf_img {
	width: 134px;
	float: left;
	margin: 0;
	padding: 0 15px 10px 0;
}
.profile .prf_img img {
	*margin: 15px 0 0 0;
	background: #fff;
}
.profile .post h3 {
	font-weight: bold;
	font-size: 110%;
	margin: 5px 0 5px 0;
}
.profile .post p {
	margin: 5px 0 10px 1px;
}
.sub .service {
	background: #fff;
	border: 2px #ece5e0 solid;
	margin: 14px auto;
	padding: 8px 10px 0px 12px;	
}
.sub .service ul li {
	font-weight: bold;
	line-height: 16px;
	margin: 0 0 8px 0;
}
.sub .service ul li img {
	margin: 0 3px -3px 0;
}
/****************************************************************
mail
****************************************************************/
.main_center {
	width: 500px;
	margin: 0 auto;
	padding: 20px 0 20px 0;
	font-size: 110%;
}
.main_center dl dt{
	margin: 10px 0 0 0;
}
.main_center dl dd{
	margin: 10px 0 0 0;
}
.main_center dl.mail2 dd{
	width: 330px;
	margin: 10px 0 0 0;
	padding: 3px;
	border: 1px #ccc solid;
}
.main_center dl.mail2 dd.textarea {
	width: 500px;
	margin: 10px 0 0 0;
	padding: 3px;
	min-height: 8em;
	height: auto !important;
	height: 8em;
	border: 1px #ccc solid;
}
.main_center textarea {
	width: 500px;
	padding: 3px;
}
.main_center input {
	width: 330px;
	padding: 3px;
}
.main_center p input {
	width: 140px;
	padding: 3px;
	margin: 5px 0 0 0;
}
.main_center h2 {
	font-size: 180%;
	padding: 0 0 20px 0;
}
.main_center .error{
	border: 2px #FF3399 solid;
	padding: 5px;
	color: #FF3399;
}
/****************************************************************
footer
****************************************************************/
#footer {
	clear: both;
}
#footer .inner {
	background: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/border_hr_dot.gif) 0 0 repeat-x;
	height: 90px;
	position: relative;
}
#footer .menu {
	padding: 5px 0 0 5px;
}
#footer .menu ul li {
	float: left;
	padding: 0 20px 0 15px;
	background-image: url(http://www.a-magic-web.com/wp-content/themes/a-magic-web/images/footer_marker.gif);
	background-position: 0 5px;
	background-repeat: no-repeat;
}
#footer .copyright {
	position: absolute;
	top: 0px;
	left: 625px;
	width: 270px;
	text-align: right;
}
#footer .links {
	position: absolute;
	top: 20px;
	left: 0;
}
#footer .copyright img, #footer .links img {
	margin: 10px 0 0 10px;
}
/****************************************************************
サイト内検索
****************************************************************/
#cse .gsc-control-cse,
.gsc-control-cse {
  padding: 10px 0 10px 10px;
	width: 620px;
	overflow: hidden;
	margin: 0 0 0 20px;
}
.cse .gsc-branding,
.gsc-branding {
  display: none;
}
.cse .gsc-control-cse div,
.gsc-control-cse div {
  position: normal;
}
/* Selector for entire element. */
.cse .gsc-control-cse:after,
.gsc-control-cse:after {
  content:".";
  display:block;
  height:0;
  clear:both;
  visibility:hidden;
}
.cse .gsc-resultsHeader,
.gsc-resultsHeader {
  border:none;
}
/* Search button */
.cse input.gsc-search-button,
input.gsc-search-button {
}
/* Inactive tab */
.cse .gsc-tabHeader.gsc-tabhInactive,
.gsc-tabHeader.gsc-tabhInactive {
  border-bottom: none;
  color: #666666;
  background-color: #e9e9e9;
  border: 1px solid;
  border-color: #e9e9e9;
  border-bottom: none;
}
/* Active tab */
.cse .gsc-tabHeader.gsc-tabhActive,
.gsc-tabHeader.gsc-tabhActive {
  background-color: #FFFFFF;
  border: 1px solid;
  border-top: 2px solid;
  border-color: #e9e9e9;
  border-top-color: #FF9900;
  border-bottom: none;
}
/* This is the tab bar bottom border. */
.cse .gsc-tabsArea,
.gsc-tabsArea {
  margin-top: 1em;
  border-bottom: 1px solid #e9e9e9;
}
/* Inner wrapper for a result */
.cse .gsc-webResult.gsc-result,
.gsc-webResult.gsc-result {
  padding: .25em;
  margin-bottom: 1em;
}
/* Promotion image */
.cse .gs-promotion.gs-result .gs-promotion-image,
.gs-promotion.gs-result .gs-promotion-image {}
/* Promotion title */
.cse .gs-promotion.gs-result a.gs-title:link,
.gs-promotion.gs-result a.gs-title:link {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:visited,
.gs-promotion.gs-result a.gs-title:visited {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:hover,
.gs-promotion.gs-result a.gs-title:hover {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:active,
.gs-promotion.gs-result a.gs-title:active {
  color: #0000CC;
}
/* Promotion snippet */
.cse .gs-promotion.gs-result .gs-snippet,
.gs-promotion.gs-result .gs-snippet {
  color: #000000;
}
/* Promotion url */
.cse .gs-promotion.gs-result ..gs-visibleUrl,
.gs-promotion.gs-result .gs-visibleUrl {
  color: #008000;
}
.gsc-input input.gsc-input {
	padding: 3px;
	width: 280px;
	background-color: #dddddd;
}
.gsc-control-cse td.gsc-search-button {
	width: auto;
}
.gsc-control-cse td.gsc-clear-button { 
	width: auto;
}
.gsc-control-cse table.gsc-search-box {
	width: auto;
	float: right;
}
.gsc-adBlock iframe {
	width: 610px;
}
#cse-search-form {
	float: right;
	padding: 10px 0 0 0;
	width: 340px;
}