@charset "UTF-8";
@import url(textstyle.css);

*{
	margin:0;
	padding:0;
	}

html	{
	height:100%;
	margin-bottom:1px;
	}

/*====================================================================================================
	Clearfix
======================================================================================================*/
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
	}
.clearfix {
	min-height: 1px;
	}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
	}

/*====================================================================================================
	BASE SET
======================================================================================================*/
BODY {
	color:#333333;
	background:#dbf8ff url("../images/community/graffiti/common_bg.jpg") repeat-x;
	padding:0;
	margin:0;
	text-align:center;
	font-family:verdana, Arial, "MS PGothic", sans-serif;
	font-size:12px;
	}


ul,ol,dl		{ list-style:none; }
ul.ulnormal		{ position:relative; }

a:link,
a:visited	{
	color: #003d84;
	text-decoration: underline;
	}

a:active,
a:hover		{
	color: #0059bf;
	text-decoration: none;
	}

br				{ letter-spacing: 0; }
br.blank		{ display:none; }
img				{ margin:0; border:none; }

.clear {
	font-size: 1px;
	line-height: 1px;
	clear: both;
	}

em{
	font-style:normal;
	font-weight:bold;
	}

p				{ margin-top:1em; }


/*====================================================================================================
	Layout:Container
======================================================================================================*/
#Container{
	margin:0 auto;
	position:relative;
	width:1100px;
	background:url("../images/community/graffiti/main_bg.jpg") no-repeat 0 0;
	}

/*====================================================================================================
	Layout:Header
======================================================================================================*/
#Header{
	height:230px;
	text-indent:-9999px;
/*	background:url("../images/community/graffiti/header_bg_tu.jpg") no-repeat 50% 0; */
	}


/* Contents Area
------------------------------------------------------------------------------------------------------*/
#Main{
	margin:0 auto;
	width:800px;
	height:1110px;
	position:relative;
	background:#dbf8fe url("../images/community/graffiti/note.jpg") no-repeat 0 0;
	text-align:left;
	}
#Contents{
	margin:0 auto;
	padding:40px 60px;
	width:680px;
	height:1030px;
	text-align:left;
	}
#Contents_use{
	margin:0 auto;
	padding:40px;
	width:700px;
	background-color:#f4efdb;
	text-align:left;
	}

#Caution_text{
	height:940px;
	overflow:auto;
	}
.graffiti_menu{
	margin:0 auto;
	text-align:center;
}


.graffiti_menu .ag_linkbtn1,
.graffiti_menu .ag_linkbtn2,
.graffiti_menu .ag_linkbtn3,
.graffiti_menu .ag_linkbtn4,
.graffiti_menu .ag_linkbtn5	{ padding:5px; width:320px; float:left; }

.graffiti_menu .ag_linkbtn1 a,
.graffiti_menu .ag_linkbtn2 a,
.graffiti_menu .ag_linkbtn3 a,
.graffiti_menu .ag_linkbtn4 a,
.graffiti_menu .ag_linkbtn5 a{
	display:block;
	text-indent:-9999px;
	outline:none;
	text-decoration: none;
	height:35px;
	}
.graffiti_menu .ag_linkbtn1 a,
.graffiti_menu .ag_linkbtn1 a:link,
.graffiti_menu .ag_linkbtn1 a:visited{
	background:url(../images/community/graffiti/linkbtn_startup.gif) no-repeat 0 0;
	}
.graffiti_menu .ag_linkbtn1 a:hover,
.graffiti_menu .ag_linkbtn1 a:active,
.graffiti_menu .ag_linkbtn1 a:focus{
	background:url(../images/community/graffiti/linkbtn_startup.gif) no-repeat 0 100%;
	}
.graffiti_menu .ag_linkbtn2 a,
.graffiti_menu .ag_linkbtn2 a:link,
.graffiti_menu .ag_linkbtn2 a:visited{
	background:url(../images/community/graffiti/btn_view.gif) no-repeat 0 0;
	}
.graffiti_menu .ag_linkbtn2 a:hover,
.graffiti_menu .ag_linkbtn2 a:active,
.graffiti_menu .ag_linkbtn2 a:focus{
	background:url(../images/community/graffiti/btn_view.gif) no-repeat 0 100%;
	}
.graffiti_menu .ag_linkbtn3 a,
.graffiti_menu .ag_linkbtn3 a:link,
.graffiti_menu .ag_linkbtn3 a:visited{
	background:url(../images/community/graffiti/linkbtn_top.gif) no-repeat 0 0;
	}
.graffiti_menu .ag_linkbtn3 a:hover,
.graffiti_menu .ag_linkbtn3 a:active,
.graffiti_menu .ag_linkbtn3 a:focus{
	background:url(../images/community/graffiti/linkbtn_top.gif) no-repeat 0 100%;
	}
.graffiti_menu .ag_linkbtn4 a,
.graffiti_menu .ag_linkbtn4 a:link,
.graffiti_menu .ag_linkbtn4 a:visited{
	background:url(../images/community/graffiti/btn_app.gif) no-repeat 0 0;
	}
.graffiti_menu .ag_linkbtn4 a:hover,
.graffiti_menu .ag_linkbtn4 a:active,
.graffiti_menu .ag_linkbtn4 a:focus{
	background:url(../images/community/graffiti/btn_app.gif) no-repeat 0 100%;
	}
.graffiti_menu .ag_linkbtn5 a,
.graffiti_menu .ag_linkbtn5 a:link,
.graffiti_menu .ag_linkbtn5 a:visited{
	background:url(../images/community/graffiti/btn_index.gif) no-repeat 0 0;
	}
.graffiti_menu .ag_linkbtn5 a:hover,
.graffiti_menu .ag_linkbtn5 a:active,
.graffiti_menu .ag_linkbtn5 a:focus{
	background:url(../images/community/graffiti/btn_index.gif) no-repeat 0 100%;
	}



.graffiti_menu .xn_linkbtn1,
.graffiti_menu .xn_linkbtn2{ padding:5px; width:300px; float:left; }

.graffiti_menu .xn_linkbtn1 a,
.graffiti_menu .xn_linkbtn2 a{
	display:block;
	text-indent:-9999px;
	outline:none;
	text-decoration: none;
	height:130px;
	}
.graffiti_menu .xn_linkbtn1 a,
.graffiti_menu .xn_linkbtn1 a:link,
.graffiti_menu .xn_linkbtn1 a:visited{
	background:url(../images/community/graffiti/linkbtn_option.jpg) no-repeat 0 0;
	}
.graffiti_menu .xn_linkbtn1 a:hover,
.graffiti_menu .xn_linkbtn1 a:active,
.graffiti_menu .xn_linkbtn1 a:focus{
	background:url(../images/community/graffiti/linkbtn_option.jpg) no-repeat 0 100%;
	}
.graffiti_menu .xn_linkbtn2 a,
.graffiti_menu .xn_linkbtn2 a:link,
.graffiti_menu .xn_linkbtn2 a:visited{
	background:url(../images/community/graffiti/linkbtn_blogparts.jpg) no-repeat 0 0;
	}
.graffiti_menu .xn_linkbtn2 a:hover,
.graffiti_menu .xn_linkbtn2 a:active,
.graffiti_menu .xn_linkbtn2 a:focus{
	background:url(../images/community/graffiti/linkbtn_blogparts.jpg) no-repeat 0 100%;
	}


/* Headline
------------------------------------------------------------------------------------------------------*/
#Contents h1{
	display:block;
	position:relative;
	top:-12px;
	z-index:1;
	width:620px;
	height:66px;
	text-indent:-9999px;
	outline:none;
	}

#Contents_use h2,
#Contents h2{
	margin:0 0 10px;
	width:650px;
	height:28px;
	line-height:20px;					/* do not erase */
	text-indent:-9999px;
	outline:none;
	}

#Contents_use h2.txtttl,
#Contents h2.txtttl	{
	padding:3px 0 0 0;
	height:25px;						/* check padding */
	text-indent:2em;
	color:#685133;
	background:url(../images/community/graffiti/h2ttl00_notext01.gif) no-repeat 50% 50%;
	font-weight:bold;
	font-size:14px;
	}

#Contents h3{
	margin:0 0 10px;
	display:block;
	position:relative;
	width:620px;
	height:30px;
	line-height:20px;					/* do not erase */
	text-indent:-9999px;
	outline:none;
	}

#Contents h4{
	margin:0 0 10px;
	display:block;
	position:relative;
	width:620px;
	height:30px;
	line-height:20px;					/* do not erase */
	text-indent:-9999px;
	outline:none;
	}



/*====================================================================================================
	Layout:Footer
======================================================================================================*/
#Footer{
	margin:0 auto;
	width:800px;
	height:50px;
	background:#fff url("../images/community/graffiti/footer.jpg") no-repeat 0 0;
	text-indent:-9999px;
	text-align:center;
	}

/*====================================================================================================
	Common Style
======================================================================================================*/

div.hrdot{
	height:3px;
	background:url("../images/community/graffiti/line_bg01.gif") repeat left center;
	border:0;
	}

div.topagetop{
	text-align:right;
	padding-right:15px;
	}

.img_right			{ float:right; }
.img_left			{ float:left; }
.img_rightmargin5	{ margin:0 0 0 5px; }
.img_leftmargin5	{ margin:0 5px 0 0; }
.titleimage			{ margin:0 auto 10px; text-align:center;}
.articleimage		{ margin:5px 0; padding:2px; border:1px solid #3ba7e3;}
.articleimage2		{ margin:5px 5px 0 0; padding:2px; border:1px solid #3ba7e3;}
.articleimage3		{ margin:0 5px 0 10px; padding:2px; border:1px solid #3ba7e3;}			/* for float:right */
.articleimage4		{ margin:0 10px 0 5px; padding:2px; border:1px solid #3ba7e3;}			/* for float:left */
.articleimage_nm	{ margin:0; padding:2px; border:1px solid #3ba7e3;}						/* no margin */
.articleimage_nb	{ margin:0 auto; padding:5px 3px; }															/* no border and 5px margin */
.mtop5				{ margin-top:5px; }
.mbottom5			{ margin-bottom:5px; }
.mtop10				{ margin-top:10px; }
.mbottom10			{ margin-bottom:10px; }

.Contents_text{
	padding:0 10px 10px;
	line-height:1.5em;
	}

/* Index Style
------------------------------------------------------------------------------------------------------*/
.indextxttop{
	height:25px;
	background:url(../images/community/graffiti/indexbg_top.gif) no-repeat 50% 50%;
	}
.indextext{
	padding:0 15px;
	width:590px;
	line-height:1.5em;
	background:url(../images/community/graffiti/indexbg_middle.gif) repeat-y 50% 50%;
	}
.indextxtbottom{
	margin:0 0 10px;
	height:25px;
	background:url(../images/community/graffiti/indexbg_bottom.gif) no-repeat 50% 50%;
	}

.boxglay			{ background-color:#eaeaea !important; }
.boxglay_r			{ background-color:#eaeaea !important; border:3px double #a8a8a8; }
.boxblue			{ background-color:#ddf4f4 !important; }
.boxblue_r			{ background-color:#ddf4f4 !important; border:3px double #8ebff2; }
.boxpink			{ background-color:#ffe8f2 !important; }
.boxpink_r			{ background-color:#ffe8f2 !important; border:3px double #ffbcdb; }
.boxyellow			{ background-color:#fff9ce !important; }
.boxyellow_r		{ background-color:#fff9ce !important; border:3px double #fff27c; }
.boxgreen			{ background-color:#d3ffce !important; }
.boxgreen_r			{ background-color:#d3ffce !important; border:3px double #9ebf99; }

