@charset "utf-8";

@import url("bootstrap.css");
@import url("pixim_bootstrap.css");


/* 共通
--------------------------------------------------------- */

body {
	background-color: #e1e1e1;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	font-size: 14px;
	line-height: 1.2em;
	color: #333;
	text-align:center;
}
/*
a{
	color:#333;
	font-style:normal;
	text-decoration:none;
}
a:link {
	color:#333;
	font-style:normal;
	text-decoration:none;
}
a:visited {
	color:#333;
	text-decoration:none;
}
a:hover {
	color: #339966;
	font-style: normal;
	text-decoration: underline;
}
a:active {
	text-decoration:none;
}
*/
.float_l { float:left; }
.float_r { float:right; }
.clear {	clear:both; } 

/* ----------レイアウト---------- */
.wrapper {
	width: 100%;
	background-image: url(../common/head_bg.png);
	background-repeat: repeat-x;
	text-align:center;
}
.container {
	width: 980px;
	background-color: #FFF;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	text-align:left;
}

/* ----------ヘッダ---------- */
.header {
	width: 100%;
	position: relative;
	background: #00A795;
	height: 33px;
}
.header h1 {
	color: #FFF;
	font-size: 12px;
	height: 33px;
	float: left;
	line-height: 33px;
	vertical-align: middle;
	text-indent: 15px;
}
.header h1 a{
	color:#FFF;
	text-decoration:none;
}
.header h1 a:link {
	color:#FFF;
	text-decoration:none;
}
.header h1 a:visited {
	color:#FFF;
	text-decoration:none;
}
.header h1 a:hover {
	color: #FFF;
	text-decoration:none;
}
.header h1 a:active {
	text-decoration:none;
}
.header:after {
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.header:after {
	border-top-color: #00A795;
	border-width: 10px;
	left: 30px;
}

/* ----------ナビ---------- */
.navi_box{
	float: right;
	height: 33px;
	line-height: 33px;
	vertical-align: middle;
}
#navi ul{
	padding : 0;
	list-style: none;
	margin-right: 10px;
}
#navi li{
	float: right;
	margin-right: 10px;
}
#navi a{
	background: url(../common/navi.png) no-repeat left center;
	padding: 2px 0px 3px 18px;
	color: #fff;
	width: 100px;
	text-decoration: none;
	font-size: 14px;
}
#navi a:hover{
	background: url(../common/navi_over.png) no-repeat left center;
}

/* ----------ロゴ---------- */
div.logo_box {
	width: 950px;
	padding-top: 30px;
	padding-right: 15px;
	padding-bottom: 15px;
}
div.logo_box div {
	display: table-cell;
	vertical-align: middle;
}
div.logo_box div.logo {
	padding-right: 15px;
	padding-left: 15px;
}
div.logo_box .name {
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: #999;
	font-size: 16px;
	font-weight: bold;
	color: #666;
	padding-left: 10px;
	white-space:nowrap
}
div.logo_box .name_no_line {
	font-size: 16px;
	font-weight: bold;
	color: #666;
	padding-left: 10px;
	white-space:nowrap
}

div.logo_box .name a
,div.logo_box .name_no_line a{
	color:#666;
	text-decoration:none;
}
div.logo_box .name a:link
,div.logo_box .name_no_line a:link {
	color:#666;
	text-decoration:none;
}
div.logo_box .name a:visited
,div.logo_box .name_no_line a:visited {
	color:#666;
	text-decoration:none;
}
div.logo_box .name a:hover
,div.logo_box .name_no_line a:hover {
	color: #666;
	text-decoration:none;
}
div.logo_box .name a:active
,div.logo_box .name_no_line a:active {
	text-decoration:none;
}

/* IE 6 */
* html div.logo_box div {
	display: inline;
	zoom: 1;
}

/* IE 7 */
*:first-child+html div.logo_box div {
	display: inline;
	zoom: 1;
}

/*\*//*/
* html div.logo_box div {
	display:inline-block;
}
/**/

/* ----------メイン---------- */
.main{
	margin-top: 15px;
	width: 950px;
	margin-right: 15px;
	margin-left: 15px;
	margin-bottom: 50px;
}
.main_box{
	margin-top: 15px;
	margin-bottom: 20px;
	}
.txt_box{
	margin-bottom: 15px;
	padding-right: 5px;
	padding-left: 5px;
	}
	.txt_frame_box01{
	margin-bottom: 15px;
	padding-right: 5px;
	padding-left: 5px;
	border: 1px solid #999;
	}
		.txt_frame_box02{
	margin-bottom: 15px;
	border: 1px solid #999;
	padding: 10px;
	}
	
/* ----------SNS---------- */
.sns {
	margin-right: 6px;
	float: right;
	zoom: 1; /* For IE 6/7 (trigger hasLayout) */
	height: 31px;
	width: 36px;
	margin-top: 4px;
}
.sns_box {
	overflow: hidden;
	margin-right: 15px;
	margin-bottom: 30px;
	height: 39px;
	background-image: url(../common/sns_bg.png);
	background-repeat: no-repeat;
	background-position: right;
}
/* clearfix */
.sns_box:before,
.sns_box:after {
    content: "";
    display: table;
}
.sns_box:after {
    clear: both;
}

/* ----------フッター---------- */
.footer {
	margin-bottom: 10px;	
}
.footer_line{
	color: #FFF;
	padding-left: 15px;
	font-weight: bold;
	letter-spacing: 0.2em;
	margin-bottom: 15px;
	background-color: #00A795;
	height: 30px;
	line-height: 30px;
	}
.profile{
	margin-bottom: 25px;
	width: 950px;
	margin-left: 15px;
	}
.call {
	font-size: 1.8em;
}
.footer_base {
	width: 100%;
	height: 30px;
	text-align: center;
	background-repeat: repeat-x;
	background-color: #00A795;
}
.powered_by_psc {
	padding-top: 8px;
	letter-spacing: 0.1em;
	color: #FFF;
}
.powered_by_psc ul{
	text-align:center;
	padding : 0;
	list-style: none;
	margin-right: 10px;
	padding-left: 10px;
}
.powered_by_psc li{
	display:inline; 
}
.powered_by_psc .pixim a{
	background: url(../common/pixim_logo.png) no-repeat left center;
	padding: 5px 0px 5px 100px;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
}
.powered_by_psc .psc a{
	padding: 5px 0px 5px 5px;
	color: #fff;
	text-decoration: none;
}

/* ----------ページ内移動---------- */
.pagetop{
	float: right;
	padding-right: 15px;
	margin-bottom: 15px;
	}

/* ----------その他---------- */
.hr_dash{
	height: 1px;
	color: #FFFFFF;
	width: 100%;
	border-top-width: 1px;
	border-top-style: dashed;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #666666;
}


/* メニュー
--------------------------------------------------------- */

/* ---------- トップメニュー ---------- */
.top_menu_box{
	text-align: center;
	height: 134px;
	width: 950px;
	text-align: center;
	margin-bottom: 15px;
	background-color: #CCC;
}
#top_menu{
	margin: 0;
	padding: 0;
	width: 100%;
		}
#top_menu ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
	text-align:center;
}
#top_menu li{
  text-indent: -9999px;
	overflow: hidden;
  float:left;
  width: 190px;
  margin: 0;
  padding: 0; 
}
#top_menu a{
	display: block;
	width: 100%;
	height: 134px;
	background-image: url(../img/top/menu_top.png);
	background-repeat: no-repeat;
}
#top_menu01 a{background-position: 0 0;}
#top_menu02 a{background-position: -190px 0;}
#top_menu03 a{background-position: -380px 0;}
#top_menu04 a{background-position: -570px 0;}
#top_menu05 a{background-position: -760px 0;}
#top_menu a:hover{
  background-image: url(../img/top/menu_top.png);
  background-repeat: no-repeat;
}
#top_menu01 a:hover{background-position: 0px -134px;}
#top_menu02 a:hover{background-position: -190px -134px;}
#top_menu03 a:hover{background-position: -380px -134px;}
#top_menu04 a:hover{background-position: -570px -134px;}
#top_menu05 a:hover{background-position: -760px -134px;}

/* ---------- 共通メニュー ---------- */
.menu_box{
	text-align: center;
	height: 60px;
	width: 950px;
	text-align: center;
	margin-bottom: 15px;
	background-color: #CCC;
}
#menu{
	margin: 0;
	padding: 0;
	width: 100%;
		}
#menu ul{
  list-style-type: none;
  margin: 0;
  padding: 0;
	text-align:center;
}
#menu li{
  text-indent: -9999px;
	overflow: hidden;
  float:left;
  width: 190px;
  margin: 0;
  padding: 0; 
}
#menu a{
	display: block;
	width: 100%;
	height: 60px;
	background-image: url(../common/menu.png);
	background-repeat: no-repeat;
}
#menu01 a{background-position: 0px 0px;}
#menu02 a{background-position: -190px 0px;}
#menu02_on a{background-position: -190px -60px;}
#menu03 a{background-position: -380px 0px;}
#menu03_on a{background-position: -380px -60px;}
#menu04 a{background-position: -570px 0px;}
#menu04_on a{background-position: -570px -60px;}
#menu05 a{background-position: -760px 0px;}
#menu05_on a{background-position: -760px -60px;}

#menu a:hover{
  background-image: url(../common/menu.png);
  background-repeat: no-repeat;
}
#menu01 a:hover{background-position: 0px -60px;}
#menu02 a:hover{background-position: -190px -60px;}
#menu02_on a:hover{background-position: -190px -120px;}
#menu03 a:hover{background-position: -380px -60px;}
#menu03_on a:hover{background-position: -380px -120px;}
#menu04 a:hover{background-position: -570px -60px;}
#menu04_on a:hover{background-position: -570px -120px;}
#menu05 a:hover{background-position: -760px -60px;}
#menu05_on a:hover{background-position: -760px -120px;}


/* タイトル
--------------------------------------------------------- */

/* ----------ログインタイトル---------- */
.title_01 h1 {
	background-image: url(../img/login/title.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
	}
.title_01 h2 {
	font-size: 16px;
	padding-left: 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #A0A0A0;
	height: 35px;
	line-height: 35px;
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 25px;
	}
	
/* ----------施設予約タイトル---------- */
.title_02 h1 {
	background-image: url(../img/reserve/title.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
	}
.title_02 h2 {
	font-size: 16px;
	padding-left: 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #2195BE;
	height: 35px;
	line-height: 35px;
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 25px;
	}
	
/* ----------イベントタイトル---------- */
.title_03 h1 {
	background-image: url(../img/event/title.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
	}
.title_03 h2 {
	font-size: 16px;
	padding-left: 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #3EAC4A;
	height: 35px;
	line-height: 35px;
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 25px;
	}
	
	/* ----------マッチメイクタイトル---------- */
.title_04 h1 {
	background-image: url(../img/matchmake/title.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
	}
.title_04 h2 {
	font-size: 16px;
	padding-left: 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #F8B300;
	height: 35px;
	line-height: 35px;
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 25px;
	}
	
	/* ----------予約確認タイトル---------- */
.title_05 h1 {
	background-image: url(../img/reserve_record/title.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
	}
.title_05 h2 {
	font-size: 16px;
	padding-left: 10px;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #E4868E;
	height: 35px;
	line-height: 35px;
	font-weight: bold;
	margin-bottom: 15px;
	margin-top: 25px;
	}

/* 各画面用
--------------------------------------------------------- */

/* TOP
--------------------------------------------------------- */
/* ---------- news ---------- */
.news_box {
	width: 950px;
	margin-bottom: 15px;
}
.news_head{
	width: 100%;
	height: 25px;
	font-weight: bold;
	color: #FFF;
	background-color: #00A795;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #999;
	border-right-color: #999;
	border-left-color: #999;
	line-height: 25px;
	text-indent: 1em;
}
.news_contents{
	width: 950px;
	line-height: 20px;
	font-size: 12px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #999;
	border-left-color: #999;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999;

}
.news_item_box{
	width: 920px;
	margin-left: 15px;
	}
.news_item ul {
   margin:0;
   padding:0;
   list-style:none;
}
.news_item li {
	text-indent: -7em;
	padding-top: 3px;
	padding-bottom: 5px;
	padding-left: 7em;
	padding-right: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ddd;
}
.news_item li span {
   display:inline-block;
   width:7em;
   text-indent:0;
}
.news_item li a {
   text-decoration:none;
   color:#000;
}
.news_item li a:hover {
   text-decoration:underline;
   color:#AB0404;
}

/* ---------- image ---------- */
.image_box{
	width: 950px;
	padding-bottom: 15px;
	}
.image_box_left{
	width: 330px;
	margin-right: 10px;
	float: left;
	}
.image_box_right{
	width: 610px;
	float: right;
	}
.image_box_banner01{
	height: 148px;
	width: 330px;
	margin-bottom: 4px;
	}
.image_box_banner02{
	height: 148px;
	width: 330px;
	}
	
/* ---------- information ---------- */
.info_box {
	width: 950px;
	margin-bottom: 15px;
}
.info_head{
	width: 100%;
	height: 25px;
	font-weight: bold;
	color: #FFF;
	background-color: #00A795;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #999;
	border-right-color: #999;
	border-left-color: #999;
	line-height: 25px;
	text-indent: 1em;
}
.info_contents{
	width: 950px;
	line-height: 20px;
	font-size: 12px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #999;
	border-left-color: #999;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999;

}
.info_item_box{
	width: 920px;
	margin-left: 15px;
	}
.info_item ul {
   margin:0;
   padding:0;
   list-style:none;
}
.info_item li {
	text-indent: -7em;
	padding-top: 3px;
	padding-bottom: 5px;
	padding-left: 7em;
	padding-right: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ddd;
}
.info_item li span {
   display:inline-block;
   width:7em;
   text-indent:0;
}
.info_item li a {
   text-decoration:none;
   color:#000;
}
.info_item li a:hover {
   text-decoration:underline;
   color:#AB0404;
}

/* ---------- 支払い ---------- */
.payment_box{
	width: 950px;
	padding-bottom: 15px;
	}

.payment_title h2 {
	background-image: url(../img/top/top_subtitle_bg.png);
	font-size: 20px;
	height: 50px;
	padding-left: 60px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 50px;
	vertical-align: middle;
	margin-bottom: 15px;
}

/* ログイン
--------------------------------------------------------- */

/* ----------注意事項右---------- */
.right_box_arw {
	font-size:12px;
	position: relative;
	background-color: #efefef;
	padding: 10px;
	line-height: 1.5em;
}
.right_box_arw:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.right_box_arw:after {
	border-right-color: #efefef;
	border-width: 10px;
	top: 30px;
	margin-top: -10px;
}
.right_box_attention ul {
	line-height: 2.5em;
}
.right_box_attention li {
	padding-left: 35px;
	padding-right: 35px;
	background-image: url(../img/login/attention.png);
	background-repeat: no-repeat;
	float: left;
	background-position: left center;
	font-weight: bold;
 }
	
/* ----------フォーム---------- */
.contents_left{
	float: left;
	width: 530px;
	}
.sub_contents{
	background-color: #555;
	float: right;
	width: 400px;
	}
	.submit_box {
	text-align: center;
	width: 100%;
	margin-top: 30px;
}

/* ----------attention_01---------- */
.attention_box{
	margin-top: 15px;
	margin-bottom: 40px;
	background-color: #EFEFEF;
	padding: 10px;
	}
attention_01{
	margin-bottom: 20px;
	padding: 10px;
	text-align: left;
	height: 20px;
	line-height: 2.5em;
} 
attention_01 ul {
width:100%;  
}  
.attention_01 ul li.visitor{
	height: 20px;
	padding-left: 25px;
	display: inline-block;
/display:inline;/*IE7*/  
/zoom:1;/*IE7*/  
	background: url(../img/login/icon01.png) no-repeat left top;
	background-position: 0 0.1em;
	zoom: 1;
	margin-top: 0;
	margin-right: 30px;
	margin-bottom: 0;
	margin-left: 0;
	padding-top: 7px;
} 
.attention_01 ul li.login{
	height: 20px;
	padding-left: 25px;
	display: inline-block;
/display:inline;/*IE7*/  
/zoom:1;/*IE7*/  
	background: url(../img/login/icon02.png) no-repeat left top;
	background-position: 0 0.1em;
	zoom: 1;
	margin-top: 0;
	margin-right: 30px;
	margin-bottom: 0;
	margin-left: 0;
	padding-top: 7px;
} 

/* 施設予約
--------------------------------------------------------- */
/* ----------ステップ---------- */
.step_box {
	text-align: center;
	width: 100%;
	margin-top: 10px;
	position: relative;
	overflow: hidden;
	padding-left: 10px;
}
.step_box ul {
	position:relative;
	left:50%;
	float:left;
}
.step_box li {
	position: relative;
	left: -50%;
	float: left;
	margin-right: 20px;
}
.step {
	width: 900px;
	text-align: center;
	background-color: #930;
}
.steptext_sub {
	float: left;
	clear: both;
	padding-top: 5px;
	width: 125px;
	font-size: 12px;
	text-align: left;
}
.step_on {
	position: relative;
	background: #00A795;
	text-align: center;
	height: 50px;
	width: 125px;
	float: left;
	padding: 5px;
}
.step_on:after {
	left: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.step_on:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #00A795;
	border-width: 10px;
	top: 50%;
	margin-top: -10px;
}
.step_on_end {
	position: relative;
	background: #00A795;
	text-align: center;
	height: 50px;
	width: 125px;
	float: left;
	padding: 5px;
}
.step_off {
	position: relative;
	background: #CCC;
	text-align: center;
	height: 50px;
	width: 125px;
	float: left;
	padding: 5px;
}
.step_off:after {
	left: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.step_off:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #CCC;
	border-width: 10px;
	top: 50%;
	margin-top: -10px;
}
.step_off_end {
	position: relative;
	background: #CCC;
	text-align: center;
	height: 50px;
	width: 125px;
	float: left;
	padding: 5px;
}
.stepnumber {
	font-family: "Arial Black", Gadget, sans-serif;
	color: #FFF;
	font-size: 20px;
	line-height: 1.5em;
}
.steptext {
	font-size: 14px;
	color: #FFF;
}

/* 必須マーク */
.must_img {
    display: inline-block;
    width: 45px;
    height: 18px;
    background-size: 45px 18px;
    margin-right: 5px;
    line-height: 14px;
    vertical-align: text-top;
    background-repeat: no-repeat;
    background-image: url(../img/ico_must.gif);
    background-position: 0 0;
}

.pixim-help-text {
    font-size:small;
    color:#00008b;
}


.group_name {
	min-height: 35px;
	background-repeat: no-repeat;
	background-position: left;
	line-height: 35px;
        border-style:solid;
        border-width: 0px 0px 2px 0px;
        border-color: #E7DFDF transparent;
}