@charset "UTF-8";

/* ---------------------------------------------------------
	CSS Document Common
--------------------------------------------------------- */

html, body {
/*	background: #fff;
*/	
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	text-align: center;
	font-size: 13px;
	font-family: HiraKakuPro-W3, "ヒラギノ角ゴ Pro W3", "メイリオ", "KozGoPro-Regular", "小塚ゴシック Pro", "Meiryo", "ＭＳ Ｐゴシック", "osaka";
	line-height: 1.5;
	color: #332d23;
  margin-bottom:1px;
  height:100%;
}

form, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd {
	margin: 0;
	padding: 0;
	list-style: none;
}

.f_left {
	float: left;
}

.f_right {
	float: right;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	overflow: visible;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
	height: 1px;
	overflow: hidden;
}

button {
    width: auto;
    padding:0;
    margin:0;
    background:none;
    border:0;
    font-size:0;
    line-height:0;
    overflow:visible;
    cursor:pointer;
}
em{
	font-style:normal;}

/* ---------------------------------------------------------
	CSS Document Link
--------------------------------------------------------- */

a {
	text-decoration: none;
}

a:hover 
,button:hover{
	opacity: 0.7;
/*	background-color:#bbe9ff;*/
}

a:active {
	outline: none;
}

a:focus {
	outline: none;
}

a:hover img {
	opacity: 0.7;
	filter: Alpha(opacity=70);
}

#calender a:hover {
	opacity: 0.8;
	background-color:#bbe9ff;
}


/* ---------------------------------------------------------
	CSS Document Layout
--------------------------------------------------------- */

#container {
	width: 980px;
	margin: 0 auto;
	overflow: hidden;
	text-align: left;
}
#container>h1{
	margin-bottom: 8px;
}

/* ---------------------------------------------------------
	CSS Document step1
--------------------------------------------------------- */

#step1 {
	margin:0 25px 20px 14px;
	border-bottom:2px solid #a1a8ab;
}

#step1 h2 {
	float: left;
	width: 215px;
	height: 34px;
	overflow: hidden;
	margin: 0 30px 6px 16px;
	padding: 0 0 0 14px;
	font-size: 18px;
	line-height: 38px;
	color: #333;
	border-left: 10px solid #b1b1b1;
}

#step1 select {
	float: left;
	width: 640px;
	overflow: hidden;
	background: #fef8c9;
	line-height: 1.8;
}

span.customSelect {
	font-weight:bold;
	height: 34px;
	line-height: 34px;
	background: #fef8c9;
	font-size: 18px;
	font-family: HiraKakuPro-W3, "ヒラギノ角ゴ Pro W3", "メイリオ", "KozGoPro-Regular", "小塚ゴシック Pro", "Meiryo", "ＭＳ Ｐゴシック", "osaka";
	color: #332d23;
	background:url(/activity/okinawa/search/img/customSelect-arrow.gif) no-repeat center right;
	padding-left:10px;
}

/* ---------------------------------------------------------
	CSS Document step2
--------------------------------------------------------- */

#step2 {
	padding-bottom: 1px;
	border-bottom: solid 2px #43bfeb;
}

#step2 h2 {
	width: 215px;
	height: 34px;
	overflow: hidden;
	padding: 0 0 0 15px;
	background: #43bfeb;
	font-size: 15px;
	line-height: 38px;
	color: #fff;
}
#step2 h2:after {
	content: "";
	display: block;
	width: 100%;
	height: 3px;
	background: #43bfeb;
}

/* ---------------------------------------------------------
	CSS Document calendar_list
--------------------------------------------------------- */

#pnlCalendar {
	position: relative;
}

#pnlCalendar .month {
	width: 100%;
	position: absolute;
	top: 10px;
}

#pnlCalendar .month .prev {
	float: left;
}

#pnlCalendar .month .next {
	float: right;
}

#pnlCalendar .month a {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	width: 90px;
	border: solid 1px #ccc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background: #f5f5f5;
	vertical-align: middle;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 15px;
	line-height: 28px;
	color: #000;
}

.calendar_list .f_right ,
.calendar_list .f_left {
	width: 48%;
}

p.current {
	width: 482px;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	line-height: 50px;
}

/* ---------------------------------------------------------
	CSS Document week
--------------------------------------------------------- */

ul.week {
	*border-bottom: solid 1px #cecece;
	border-right: solid 1px #cecece;
}

ul.week:after {
	background: #cecece;
}

ul.week li {
	float: left;
	width: 14%;
	padding-top: 3px;
	border-top: solid 1px #cecece;
	border-left: solid 1px #cecece;
	text-align: center;
	font-weight: bold;
	font-size: 15px;
	line-height: 18px;
}

ul.week li:first-child {
	background: #ffd2e8;
	color: #f00;
}

ul.week li:last-child {
	background: #b2e9fc;
	color: #004fe0;
}

/* ---------------------------------------------------------
	CSS Document day
--------------------------------------------------------- */

ul.day {
	border-right: solid 1px #cecece;
}

ul.day li a {
	display: block;
	height: 72px;
	text-decoration: none;
}

ul.day li {
	float: left;
	width: 14%;
	height: 72px;
	border-bottom: solid 1px #cecece;
	border-left: solid 1px #cecece;
	text-align: center;
	font-size: 15px;
	line-height: 18px;
}

ul.day li span.date {
	display: block;
	padding-top: 1px;
	font-weight: bold;
	font-size: 13px;
	color: #000;
}
ul.day li span.red {
	display: block;
	padding-top: 1px;
	font-weight: bold;
	font-size: 13px;
	color:#ff0000 !important;
}

ul.day li:nth-child(1) span.date ,
ul.day li:nth-child(8) span.date ,
ul.day li:nth-child(15) span.date ,
ul.day li:nth-child(22) span.date ,
ul.day li:nth-child(29) span.date ,
ul.day li:nth-child(36) span.date {
	color: #f00 !important;
}

ul.day li:nth-child(7n) span.date {
	color: #004fe0 !important;
}

ul.day li span.zan {
	display: block;
	font-weight: bold;
	font-size: 15px;
	color: #000;
}

ul.day li span.tel {
	display: block;
	margin: 0 3px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background: #99c918;
	font-size: 13px;
	color: #fff;
}

ul.day li span.rest {
	display: block;
	margin: 0 3px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background: #eb533a;
	font-size: 13px;
	color: #fff;
}

ul.day li span.ok {
	display: block;
	margin: 0 3px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background: #0096e0;
	font-size: 13px;
	color: #fff;
}

ul.day li span.rek {
	display: block;
	margin: 0 3px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background: #0096e0;
	font-size: 10px;
	color: #fff;
}

ul.day li span.price {
	display: block;
	margin-top: 5px;
	font-size: 10px;
	line-height: 11px;
	color: #000;
}

ul.day li span.price strong {
	font-size: 12px;
}

ul.day li sub {
	display: block;
	font-size: 10px;
	line-height: 11px;
	color: #696969;
}

ul.day li span.empty {
	display: block;
	height: 72px;
	background: #eee;
}


/* ---------------------------------------------------------
	CSS Document comment
--------------------------------------------------------- */

.comment {
	margin-top: 20px;
	font-size: 15px;
}

.comment strong {
	color: #f00;
}

/* ---------------------------------------------------------
	CSS Document back
--------------------------------------------------------- */

.back {
	margin: 20px 0;
	text-align: center;
	font-size: 15px;
}

.back a {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	width: 222px;
	height: 43px;
	text-decoration: none;
	font-weight: bold;
	line-height: 43px;
	margin-top: 13px;
	border:1px solid #9a9a9a;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	transition: all .3s;
	-webkit-transition: all .3s;
	font-size:14px;
	color:#333;
	background: #c5c5c5; /* Old browsers */
	background: -moz-linear-gradient(top,  #c5c5c5 0%,#d5d5d5 98%); /* FF3.6+ */
	background: -webkit-linear-gradient(top,  #c5c5c5 0%,#d5d5d5 98%); /* Chrome10+,Safari5.1+ */
	background: -ms-linear-gradient(top,  #c5c5c5 0%,#d5d5d57 98%); /* IE10+ */
	background: linear-gradient(to bottom,  #c5c5c5 0%,#d5d5d5 98%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c5c5c5', endColorstr='#d5d5d5',GradientType=0 ); /* IE6-9 */
}

/* ---------------------------------------------------------
	form-box
--------------------------------------------------------- */
.reserv-form-box{
	font-size:14px;
	margin:8px 0 0 9px;
	text-align: left;
	}
	.reserv-form-box>.reserv-form{
		display: table;
		table-layout: fixed;
		border-top:1px solid #ccc;
		border-left:1px solid #ccc;
		border-right:1px solid #ccc;
	}
	.reserv-form-box>.reserv-form dt{
		width: 182px;
		padding: 9px 14px;
		letter-spacing: 1px;
		display: table-cell;
		background: #eef9fd;
		font-weight: bold;
		vertical-align: middle;
	}
	.reserv-form-box>.reserv-form dt em{
		float: right;
		background: #e01d03;
		color: #fff;
		padding: 0 3px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		font-size:12px;
		font-weight: normal;
	}
	.reserv-form-box>.reserv-form dd{	
		display: table-cell;
		vertical-align: middle;
		width: 709px;
		padding: 7px 20px;
	}
	.reserv-form-box .last{
		border-bottom:1px solid #ccc;
	}

.reserv-form-box>.reserv-form .price-form span{
	/*width:235px;*/
	display:inline-block;
	margin-right:3px;
	}
	.reserv-form-box>.reserv-form .price-form em{
		font-size:18px;
		margin-right:3px;
	}
.reserv-form-box>.reserv-form .small-text{
	font-size:10px;
	margin-bottom: 1px;
	}
	.reserv-form-box>.reserv-form .small-text a{
		text-decoration:underline;
	}
.reserv-form-box>.reserv-form .red{
	color:#f00000;
	font-size:12px;
}
.reserv-form-box>.reserv-form .option em{
	background: #575757;
}
.reserv-form-box>.reserv-form ul>li{
	display:inline-block;
	margin-right:20px;
}

.btn-blue a{
	width: 177px;
	height: 20px;
	padding:3px 10px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	display:block;
	color: #fff;
	background: #008ece; /* Old browsers */
	background: -moz-linear-gradient(top, #008ece 0%, #007c9c 100%); /* FF3.6+ */
	background: -webkit-linear-gradient(top, #008ece 0%,#007c9c 100%); /* Chrome10+,Safari5.1+ */
	background: -ms-linear-gradient(top, #008ece 0%,#007c9c 100%); /* IE10+ */
	background: linear-gradient(to bottom, #008ece 0%,#007c9c 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008ece', endColorstr='#007c9c',GradientType=0 ); /* IE6-9 */
}

.btn-orange{
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	padding: 5px 12px;
	transition: all .3s;
	-webkit-transition: all .3s;
	font-size:20px;
	width: 300px;
	height: 53px;
	font-weight: bold;
	background: #ffa800; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffa800 0%, #de6207 98%); /* FF3.6+ */
	background: -webkit-linear-gradient(top,  #ffa800 0%,#de6207 98%); /* Chrome10+,Safari5.1+ */
	background: -ms-linear-gradient(top,  #ffa800 0%,#de6207 98%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffa800 0%,#de6207 98%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa800', endColorstr='#de6207',GradientType=0 ); /* IE6-9 */
}

/* ---------------------------------------------------------
	form
--------------------------------------------------------- */
.reserv-form-box>.reserv-form label {
	cursor: pointer;
}
.reserv-form-box>.reserv-form .input-text{
	width: 379px;
	margin-right:16px;
	padding:6px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
.reserv-form-box>.reserv-form .select{
	width: 102px;
	height:22px;
	padding-left:20px;
}
.reserv-form-box>.reserv-form .radio label{
	margin-right: 15px;
	padding-right:10px;
}
.reserv-form-box>.reserv-form textarea{
	width: 688px;
	height:54px;
	padding:6px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	line-height:1.6;
}


/* ---------------------------------------------------------
	error page
--------------------------------------------------------- */

.radio.error label{
	background: #fad7d2;
}
.error .select{
	background: #fad7d2;
	border:1px solid #eb6877;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.error .input-text{
	background: #fad7d2;
	border:1px solid #eb6877;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
/*エラー吹き出し*/
.error-text{
	font-size:15px;
	color:#e01d03;
	margin: 8px 0 0 9px;
}
.error-box>p{
	position: relative;
	font-size:12px;
	color:#e01d03;
	border:3px solid #e01d03;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	display:inline-block;
	padding:3px 9px 3px 30px;
	background: url(/activity/okinawa/search/img/ico-error.png) no-repeat 9px 4px;
	margin-bottom: 8px;	
	box-shadow: 3px 3px 7px #404040;
	-webkit-box-shadow: 3px 3px 7px #404040;
	-moz-box-shadow: 3px 3px 7px #404040;
	}
	.error-box>p:after, .error-box>p:before {
		top: 100%;
		left: 7%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
	}
	.error-box>p:after {
		border-color: rgba(136, 183, 213, 0);
		border-top-color: #fff;
		border-width: 5px;
		margin-left: -5px;
	}
	.error-box>p:before {
		border-color: rgba(224, 29, 3, 0);
		border-top-color: #e01d03;
		border-width: 9px;
		margin-left: -9px;
	}

/* ---------------------------------------------------------
	確認・完了ページ
--------------------------------------------------------- */
#conf .mb15{
	margin-bottom: 15px;
}
#conf .mb24{
	margin-bottom: 24px;
}
#conf .mr50{
	margin-right: 50px;
}
#conf .att .red,
#conf .send .red,
#conf .att-red{
	color:#e01d03;
	font-size:18px;
	font-weight: bold;
}
#conf .att-red{
	padding-top: 18px;
	text-align: center;
}
#conf .btn-blue a{
	width: 100%;
	text-align: center;
}

#conf .reserv-form-box h2{
	color:#fff;
	background: #616161;
	font-size:14px;
	width: 950px;
	height:31px;
	line-height: 31px;
	padding-left: 11px;
}

#conf .att{
	text-align: center;
	padding-top:17px;
}
#conf .reserv-form-box{
	margin-top:14px;
}
#conf .gray .reserv-form dt{
	background: #eae8e8;
}

#conf .btn-gray{
	margin-top: 13px;
	border:1px solid #9a9a9a;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding: 5px 12px;
	transition: all .3s;
	-webkit-transition: all .3s;
	font-size:14px;
	color:#333;
	width: 222px;
	height: 53px;
	font-weight: bold;
	background: #c5c5c5; /* Old browsers */
	background: -moz-linear-gradient(top,  #c5c5c5 0%,#d5d5d5 98%); /* FF3.6+ */
	background: -webkit-linear-gradient(top,  #c5c5c5 0%,#d5d5d5 98%); /* Chrome10+,Safari5.1+ */
	background: -ms-linear-gradient(top,  #c5c5c5 0%,#d5d5d57 98%); /* IE10+ */
	background: linear-gradient(to bottom,  #c5c5c5 0%,#d5d5d5 98%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c5c5c5', endColorstr='#d5d5d5',GradientType=0 ); /* IE6-9 */
}

/*料金BOX*/
#conf .reserv-form .price-box{
	padding:0;
	width:749px;
	overflow: hidden;
	height:80px;
}
#conf .reserv-form .price-form{
	width: 405px;
	float:left;
	padding:7px 20px;
}
#conf .reserv-form .total{
	float:right;
	width:304px;
	overflow:hidden;
}
#conf .reserv-form .total dt{
	width:120px;
	text-align: center;
	line-height: 62px;
}
#conf .reserv-form .total dd{
	width:187px;
	line-height: 62px;
	padding:0 17px;
	color:#e01d03;
}
#conf .reserv-form .total dd>em{
	font-size:18px;
}

/*完了ページ*/
#conf .send{
	margin-bottom: 24px;
	width: 782px;
	height: 74px;
	padding:20px 0;
	margin:0 auto;
	text-align: center;
	border:2px solid #e01d03;
}
#conf .point{
	color:#333;
	font-size:18px;
	font-weight: bold;
}
#conf .info-box{
	margin-bottom: 10px;
	}
	#conf .info-box dt{
		height:68px;
		line-height: 68px;
	}
	#conf .info-box dd{
		padding:0;
		width: 749px;
	}
	#conf .info-box dd>ul{
		padding:10px 20px;
	}
	#conf .info-box dd .login{
		border-bottom:1px solid #dfdfdf;
	}
#conf .map{
	display:inline-block;
	text-align: center;
}
.at {
	font-size:15px;
	font-weight:bold;
	margin-top:5px;
	color:#ff0000;
}

/* ---------------------------------------------------------
	footer
--------------------------------------------------------- */
#footer{
	background: #eefafd;
	padding-bottom:12px;
}

#footer .ssl{
	background: #f3f3f3;
	text-align:center;
	padding:18px 0;
	margin-top: 16px;
	border-bottom:1px solid #dfdfdf;
}
#footer .footer-inner{
	width: 980px;
	margin:0 auto;
	padding-top:14px;
	overflow:hidden;
}
#footer .footer-inner p{
	display:inline-block;
	float:left;
}
#footer .footer-inner small{
	display:inline-block;
	float:right;
}
#footer a{
	text-decoration:underline;
}

/* プラン詳細へ戻る下の日時 */
.reservation_time {
	text-align: center;
	margin-top: 20px;
	margin-top: 20px;
}
.reservation_time p {
    font-size: 17px;
    font-weight: bold;
}
.reservation_time img {
    max-width: 300px;
    margin-top: 10px;
}
.meeting_time {
    text-align: left;
    margin-left: 20px;
    font-size: 14px;
    font-weight: bold;
}
.meeting_time em {
    margin-right: 10px;
    background: #ea736b;
    color: #fff;
    padding: 0 3px;
    border-radius: 3px;
    font-size: 11px;
    text-shadow: 0px 0px 1px rgba(0,0,0,.4);
    display: inline-block;
    vertical-align: text-top;
}
.time_select {
	margin-bottom: 50px;
	text-align: left;
	text-align: left;
}
.time_select a, .time_box_noselected {
    text-decoration: none;
	color: #1b62b4;
	text-align: center;
	text-align: center;
}
.time_box, .time_box_noselected {
    border: 2px solid #ccc;
    margin: 15px 10px 0 10px;
    border-radius: 5px;
    width: 22%;
    display: inline-flex;
}
.time_box p {
    display: inline-block;
    padding: 10px 12px;
    font-size: 12px;
    font-weight: bold;
}
.reservations_not {
    background-color: #eee;
    border-color: #eee;
    color: #7b7b7b;
    margin: 15px 10px 0 10px;
    border-radius: 5px;
    width: 22%;
    display: inline-flex;
}
.reservations_not p {
    display: inline-block;
    padding: 10px 12px;
    font-size: 12px;
    font-weight: bold;
}
.time_box:focus, .time_box:hover, .time_box_selected, .time_box_selected a{
    background: #1b62b4;
    color: #fff !important;
    border: 2px solid #1b62b4;
    opacity: 1;
}
.acdn_reservation_select {
    display: inline;
}
.acdn_time_close {
    display: none;
}
.reservation_select_close {
    display: none;
}
#acdn_time {
    width: 980px;
    margin: 0 auto;
}