@charset "UTF-8";
/* ==========================================================================
   Font Size set
   ========================================================================== */
   
/*
 
   10px   =      77%
   11px   =      85%
   12px   =      93%
   13px   =     100%
   14px   =     108%
   15px   =     116%
   16px   =   123.1%
   17px   =     131%
   18px   =   138.5%
   19px   =   146.5%
   20px   =   153.9%
   21px   =   161.6%
   22px   =     167%
   23px   =     174%
   24px   =     182%
   25px   =     189%
 
*/
 
body {
	font: 13px/1.5 verdana, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
 *font-size: small;
 *font: x-small;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
select, input, button, textarea {
	font: 99% verdana, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
 *font-size: 100%;
}
/* ==========================================================================
   Base styles
   ========================================================================== */

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	line-height: 1.4;
}

::-moz-selection {
 background: #f8e655;
 text-shadow: none;
}
::selection {
	background: #f8e655;
	text-shadow: none;
}
img {
	vertical-align: middle;
}
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	background-color: #ffffff;
}
.wrapper {
	width: 950px;
	margin: 0 auto 0 auto;
	position: relative;
}
.nosel {
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-webkit-user-drag: none;
	-khtml-user-drag: none;
}
.clickable {
	cursor: pointer;
}
.header-container, .main-container {
	background-color: #ffffff;
	min-width: 950px;
}
.btn {
	overflow: hidden;
	display: block;
}
/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* header */
h1 {
	padding-top: 20px;
	position: relative;
	z-index: 10000;
	width: 202px;
}
#to-top {
	position: absolute;
	right: 0;
	top: 20px;
	width: 210px;
	height: 50px;
}
#to-top a {
	width: 210px;
	height: 43px;
	background: url(../img/images/totop.gif) no-repeat 0 0;
	display: block;
}
#to-top a:hover {
	background-position: 0 -43px;
}
/* contents */
.main {
	padding: 22px 0 0 0;
}
h2 {
	margin: 0;
	text-align: center;
}
.main-container {
	padding-bottom: 60px;
}
#top-container {
	position: relative;
	width: 952px;
	height: 472px;
	background: url(../img/top_bg.jpg) no-repeat;
	margin-bottom: 20px;
}
#top-container img, #top-container h2, #top-container h3, #top-container p {
	position: absolute;
	display: block;
}
#top_h2 {
	left: 22px;
	top: 50px;
}
#top_h3 {
	left: 230px;
	top: 110px;
}
#top_p0 {
	left: 280px;
	top: 105px;
}
#top_p1 {
	left: 280px;
	top: 285px;
}
#top_img {
	position: absolute;
	left: 303px;
	top: 260px;
}
#top_img a {
}
#top_p2 {
	left: 322px;
	top: 421px;
}
#top-container p.head {
	left: 270px;
	top: -14px;
}
#top_btn {
	position: absolute;
	left: 638px;
	top: 460px;
	width: 185px;
	height: 28px;
}
#top_btn a.inner {
	width:185px;
	height: 14px;
	background: url(../img/images/top_btn.gif) no-repeat 0 0;
	display: block;
}
#top_btn a.inner:hover {
	background-position: 0 -14px;
}
#btn-posting {
	margin: 0 auto;
	text-align: center;
}
#guideline {
	margin: 30px 0 40px 40px;
}
#guideline div {
	margin-left: 23px;
}
#guideline h3 {
	margin: 0 0 12px 0;
}
#guideline div.season {
	margin-top: 20px;
	margin-bottom: 25px;
}
#guideline div.howto {
	margin-top: 35px;
	margin-bottom: 36px;
	position: relative;
}
#guideline div.howto a{
	display: block;
	position:absolute;
	width: 174px;
	height: 15px;
	background: url(../img/torule.gif) no-repeat;
	left: 446px;
	top: 482px;
}
#guideline div.howto a:hover {
	background-position: 0 -15px;
}
/* footer */
.footer-container {
	background-color: #eeeeee;
}
address {
	width: 454px;
	height: 12px;
	margin: 0 auto 0 auto;
	padding: 10px 0 12px 0;
}
/* subbox */
#subbox {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 9997;
	display: none;
}
#subbox p {
	font-size: 108%;
	margin: 5px 0 0 0;
}
#subbox .bg {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
	background-color: #ffffff;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 9998;
}
#subbox .contents {
	z-index: 9999;
	position: relative;
	margin-top: 80px;
	width: 699px;
	height: 638px;
	background: url(../img/sample/container.png) no-repeat;
}
#subbox .inner {
	margin-left: 30px;
}
#subbox h2 {
	text-align: left;
	font-size: 138.5%;
	padding-top: 35px;
}
#desc-container {
	overflow: auto;
	padding: 0;
	width: 640px;
	height: 122px;
	position: relative;
	line-height: 1.4em;
}
#subbox p.desc {
	padding-top: 4px;
	width: 610px;
}
#subbox .btn-close {
	position: absolute;
	top: 13px;
	left: 672px;
}
#subbox .btn-close a {
	width: 56px;
	height: 56px;
	display: block;
	background: url(../img/sample/btn_close.png) no-repeat 0 0;
}
#subbox .btn-close a:hover {
	background-position: 0 -56px;
}
/*scroll bar*/
.jspVerticalBar {
	width: 20px;
	background: #c7c7c7 !important;
}
.jspArrow {
	height: 20px !important;
	background-color: transparent !important;
}
a.jspArrowUp {
	background: url(../img/sample/arrow_up.gif) no-repeat !important;
}
a.jspArrowUp:hover {
	background-position: 0 -20px !important;
}
a.jspArrowDown {
	background: url(../img/sample/arrow_down.gif) no-repeat !important;
}
a.jspArrowDown:hover {
	background-position: 0 -20px !important;
}
a.jspArrowUp.jspDisabled:hover {
	background-position: 0 -20px !important;
}
a.jspArrowDown.jspDisabled:hover {
	background-position: 0 -20px !important;
}
.jspTrack {
	background: #c7c7c7 !important;
}
.jspDrag {
	background: #dddddd !important;
}
.jspDrag:hover {
	background: #eaeaea !important;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */


/*
 * Image replacement
 */

.ir {
	background-color: transparent;
	border: 0;
	overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}
.ir:before {
	content: "";
	display: block;
	width: 0;
	height: 100%;
}