@charset "shift_jis";

/* ----------------------------------------- *
   Memo
 * ----------------------------------------- *
 * Base font size - 16px

	10px 	63%
	11px 	69%
	12px 	75%
	13px 	82%
	14px 	88%
	15px 	94%
	16px 	100%
	17px 	107%
	18px 	113%
	19px 	119%
	20px 	125%
	21px 	132%
	22px 	138%
	23px 	144%
	24px 	150%
	25px 	157%
	26px 	163%

 * 行間（font-size:16px  line-height:1.6）
	1行	16 x 1.6	25.6
	2行	16 x 1.6 x 2	51.2
	3行	16 x 1.6 x 3	76.8
	4行	16 x 1.6 x 4	121.6
	5行	16 x 1.6 x 5	128
 * ----------------------------------------- */



/******************** ▼全体の設定 ********************/

/* ---------------- Fluid-img ---------------- */
img {
	width:auto;
	max-width:100%;
	width:auto\9; /* ie8 */
}
/* ---------------- Fluid-img end ---------------- */

/* ---------------- Setting ---------------- */
html,body {
	scrollbar-track-color:#c3d825;
	scrollbar-face-color:#165e83;
	scrollbar-shadow-color:#165e83;
	scrollbar-darkshadow-color:#165e83;
	scrollbar-highlight-color:#165e83;
	scrollbar-3dlight-color:#165e83;
	scrollbar-arrow-color:#c3d825;
}

body {
	font-family:"メイリオ",Meiryo,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,"MS P ゴシック",sans-serif;
	line-height:1.6;
	font-size:100%;
	background:#e9e7c6 url(bg-left.jpg) no-repeat fixed bottom left;
	color:#383c3c;
}

#PAGETOP {
	margin:0 auto;
	background:url(bg-right.jpg) repeat-y fixed bottom right;
}

body, #contents, #footer {
	text-align:center;
	margin:0 auto;
}

/*反転時の背景色 */
::selection {
	background:#fff044;
}
	/* 反転時の背景色 Firefox対応*/
	::-moz-selection {
		background:#fff044;
	}
/* ---------------- Setting end ---------------- */

/******************** ▲全体の設定 ********************/



/* ---------------- Header ---------------- */
#header {
	background-color:#ff208a;
	width:100%;
	height:60px;
	margin:0;
	background:url(bg-01.png) fixed repeat-x 0% 0% #ff208a;
}

#title {
	font-family: 'Corben',cursive;
	font-size:20px;
	line-height:1.6;
	padding-top:15px;
	color:#ffffff;
	width:960px;
	margin:0 auto;
	letter-spacing:1px;
	text-align:left;
}
/* ---------------- Header end ---------------- */



/* ---------------- Menu ---------------- */
#top{
	width:960px;
	height:350px;
	margin:0 auto;
	background:url(top-01.jpg) no-repeat 0% 0%;
}

#top .logo {
	float:left;
	text-align:left;
	padding:20px 0 0 30px;
}

#menu {
	float:right;
}

#menu ul {
	list-style-type:none;
	text-align:center;
}

#menu ul li {
	margin:0 15px;
	float:left;
}
	#menu ul li a {
		font-family: 'Rock Salt', cursive;
		font-size:18px;
		display:block;
		color:#ffffff;
		width:131px;
		height:76px;
		background:url(menu-off.png) no-repeat;
		padding-top:55px;
		transition:0s;
	}
	#menu ul li a:hover {
		background:url(menu-on.png) no-repeat;
	}

#menu:after { content:""; display:block; height:0; clear:both; visibility:hidden; }
/* ---------------- Menu end ---------------- */



/* ---------------- Contents ---------------- */
#contents {
	text-align:left;
	width:960px;
	margin:0 auto;
	background:url(bg-03.png) no-repeat 95% 98% #e9e7c6;
	padding-bottom:20px;
}

#main {
	margin:0;
	padding:10px;
	overflow:hidden;
	width:640px;
	float:left;
}

#main-1colum {
	margin:0;
	padding:10px;
	overflow:hidden;
}

#sub {
	margin:0;
	padding:10px;
	width:280px;
	float:left;
	overflow:hidden;
}
#contents:after { content:""; display:block; height:0; clear:both; visibility:hidden; }
/* ---------------- Contents end ---------------- */


/* ---------------- Footer ---------------- */
#footer {
	position:relative;
	color:#ffffff;
	letter-spacing:2px;
	font-size:82%;
	height:120px;
	width:100%;
	margin:0;
	padding-top:50px;
	padding-bottom:10px;
	background-color:#165e83;
		/* IE10 Consumer Preview */ 
		background-image: -ms-linear-gradient(top, #FF3182 0%, #165E83 100%);
		/* Mozilla Firefox */ 
		background-image: -moz-linear-gradient(top, #FF3182 0%, #165E83 100%);
		/* Opera */ 
		background-image: -o-linear-gradient(top, #FF3182 0%, #165E83 100%);
		/* Webkit (Safari/Chrome 10) */ 
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF3182), color-stop(1, #165E83));
		/* Webkit (Chrome 11+) */ 
		background-image: -webkit-linear-gradient(top, #FF3182 0%, #165E83 100%);
		/* W3C Markup, IE10 Release Preview */ 
		background-image: linear-gradient(to bottom, #FF3182 0%, #165E83 100%);
		/* for PIE */ 
		-pie-background: linear-gradient(bottom, #165E83 0%, #FF3182 100%);
	behavior: url(PIE.htc);
}

#footer ul {
	width:960px;
	margin:0 auto;
	list-style:none;
	color:#9ea1a3;
	padding:0;
}

#footer ul li {
	float:left;
	padding:1px 15px;
	border-left:1px solid #383c3c;
}
	#footer ul li a { color:#ffffff; border-radius:0px; }
	#footer ul li a:hover { border-bottom:1px dashed #ffffff; text-decoration:none; }
	#footer ul li.li-first {
		border-left:0px;
	}
	#footer ul li.li-last {
		float:right;
		border-left:0px;
	}

#footer ul:after { content:""; display:block; height:0; clear:both; visibility:hidden; }

#footer hr {
	width:960px;
	margin:10px auto;
}

#fc2_footer {
   background-color:#165e83;
   margin-bottom:0;
}
/* ---------------- Footer end ---------------- */



/* 段落設定 */
p { margin:5px 10px; }
#main p { margin:5px 0px 20px 60px; }
#main-1colum p { margin:5px 60px 20px 60px; }
#sub p { margin:10px 0px 20px 40px; }
#footer p {
	width:930px;
	height:51px;
	padding:0 15px;
	margin:0 auto;
	background:url(top-logo-m.png) no-repeat 98% 0%;
}

/* 画像表示 */

/* リンク設定 */
a {
	text-decoration:none;
	color:#ff3182;
}
	a:hover {
	color:#9ea1a3;
	text-decoration:underline;
	}

/* 見出し */
h2, h3, h4, h5, h6 { letter-spacing:1px; }

h2 {
	font-family:'Cabin Sketch', cursive;
	font-size:60px;
	color:#ff3182;
	padding:18px 0 8px 28px;
	margin:50px 0 0 0;
	border-bottom:0px dotted #ffffff;
	line-height:1;
	background:url(h-bg.png) no-repeat left top;
}

h3 {
	margin:20px 0 15px 60px;
	font-weight:bold;
	color:#165e83;
	display:inline-block;
	border-bottom:6px dotted #165e83;
}

#contents #main h2:first-child,
#contents #sub h2:first-child,
#contents #main-1colum h2:first-child { margin:10px 0 0 0; }

/* 水平線 */
hr {
	border:solid #383c3c;
	border-width:1px 0 0 0;
	height:1px;/* for IE6 */
	clear:both;/* for IE6 */
	margin:20px 0;
}

/* フォントスタイル関連 */
b, .b { font-weight:bold; }
i, .i { font-style:italic; }
u, .u { text-decoration:underline; }
s, strike, .s, .strike { text-decoration:line-through; }
big, .big { font-size:124%; letter-spacing:1px; }
small, .small { font-size:88%; letter-spacing:1px; }
tt, .tt { font-family:monospace; }
em, .em { font-style: normal; font-weight:bold; color:#165e83; }
strong, .strong { font-weight:bold; color:#ff3182; line-height:2; padding:0 3px;
		border-bottom:2px solid #ff3182; }
del, .del { text-decoration:line-through; }
ins, .ins { text-decoration:underline; }

/* リスト共通 */
ul, ul.mark, ul.mark-img { padding:5px; }
	li { padding:3px; }
dl {
	margin:0;
	width:700px;
	clear:both;
}

dt {
	float:left;
	width:90px;
	clear:both;
	margin:0;
	padding:5px 0px;
	font-weight:normal;
}

dd {
	width:580px;
	margin:8px 0 8px 100px;
	padding:5px 15px;
	border-left:3px solid #ff3182;
}


/* 引用文 */

/* テーブル */

/* フォーム */
form { font-size:88%; }
input, textarea {
	background-color:#165e83;
	border:1px solid #383c3c;
	color:#ffffff;
	padding:2px 5px;
	letter-spacing:1px;
	line-height:1.4;
}
	input[type="text"]:focus, textarea:focus { background-color:#b7e4e2; color:#383c3c; }

textarea { width:480px; }
input[type="text"] { width:300px; margin-bottom:10px; }
input[type="submit"] { width:100px; }

/* リスト */
ul {
	margin:5px 0px 20px 60px;
	list-style-type:none;
}

li { margin:5px 0; }



/******************** ▼個別クラス指定 ********************/
.center { text-align:center; margin:0 auto; }
.right { text-align:right; margin-left:auto; }
.left { text-align:left; margin-right:auto; }

/* インデント */
.indent { display:block; padding-left:30px; }

/* ノートっぽい罫線 */
.note {
	line-height:23px; /* 値を変えない */
	background-image: url(note.png);
	margin-bottom:25px;
}

/* 装飾ボックス */
.box1 { 
	position:relative;
	color:#ffffff;
	padding:10px 15px;
	background-color:#165e83;
	margin:0;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-o-border-radius:10px;
	-ms-border-radius:10px;
	border-radius:10px;
	behavior: url(PIE.htc);
}
	span.box1 { margin:5px 0 20px 60px; }
.box2 { 
	position:relative;
	border:6px double #165e83;
	padding:10px 15px;
	background-color:#c3d825;
	margin:0;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-o-border-radius:10px;
	-ms-border-radius:10px;
	border-radius:10px;
	behavior: url(PIE.htc);
}
	p.box2 { margin:0; }

/* 色指定 */
.color1 { color:#ff3182; } /* ビビッドピンク */
.color2 { color:#165e83; } /* ナイトブルー */
.color3 { color:#ffb326; } /* オレンジ */
.color4 { color:#e9e7c6; } /* ベージュ */
.color5 { color:#9ea1a3; } /* 錫色 */
.color6 { color:#fff044; } /* イエロー */
.color7 { color:#c3d825; } /* 黄緑 */
.color8 { color:#b7e4e2; } /* 水色 */
/******************** ▲個別クラス指定 ********************/



/******************** ▼ページ別設定 ********************/
#detail-list, #about_link {
	margin:5px 60px 20px 60px;
}
#about_link img { margin:0px 10px 10px 0px; }

/* Yoxview内のサムネ設定 */
.yoxview img {
	margin:0px 15px 15px 0;
	border:5px solid #c1c1a5;
	position:relative;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-o-border-radius:10px;
	-ms-border-radius:10px;
	border-radius:12px;
	behavior: url(PIE.htc);
}
	.yoxview img:hover {
		border:5px solid #ff3182;
	}

div.prof, div#link { margin:5px 0px 20px 60px; }

div.icon {
	float:left;
	width:120px;
	margin:0;
}

div.text {
	float:left;
	margin:0;
}

div.text ul { margin:-5px 0 20px 25px; padding:0; }
div.text ul li { margin:2px auto; }

div.prof:after { content:""; display:block; height:0; clear:both; visibility:hidden; }

#powered { letter-spacing:1px; font-size:82%; }
/******************** ▲ページ別設定 ********************/



/******************** ▼横幅768px以上の設定 ********************/
@media screen and (min-width : 768px){



}
/******************** ▲横幅768px以上の設定 ********************/



/******************** ▼横幅1024px以上の設定 ********************/
@media screen and (min-width : 1024px){

#contents {
	width:960px;
}

}
/******************** ▲横幅1024px以上の設定 ********************/