

* {
	font-family: 'tuitype-light', sans-serif;
}

body {
	font-size:160%;
}





.lpHead {
	width:100%; background-color: rgb(194, 230, 250); display:block; color:#666666;
}
.mainHeader {
	
}

.header00 {
	width:100%; max-width:900px; margin: 0 auto; margin-top:1em; font-size:1.3em;
}

.header01 {
	display:inline-block;  width:45%; font-size:1.2em; padding-bottom:2em;
}

.header01_1 {
	display:inline-block; width:40%; font-size:0.8em;
}

.header01_2 {
	display:inline-block; width:40%; font-size:0.8em; margin-top:0.7em;
}

.header01_3 {
	display:inline-block; width:40%; font-size:0.8em;
}

.header01_4 {
	display:inline-block; width:40%; font-size:0.8em;
}
	
.header02 {
	display:inline-block; width:20%; padding:0;
}	
	
.header03 {
	display:inline-block; font-size:0.8em; margin:5px 0;
}

.inputbox {
	display:inline-block; width:40%;
}

.inputbox-remark {
	font-size:0.7em; color:#AAAAAA;
}	

.inputarea {
	display:inline-block; width:100%; padding-left:1em;
}	

.inputarea_field {
	width:80.5%;
}

.inputarea_remark {
	display:inline-block; width:80%; font-size:0.9em; color:#666666;
}

input::placeholder {
  opacity: 0.5;
  color: grey;
}

.contactBorder {
	background-color:#C2E6FA;
}
.greyButton {
	
}

.contact_1 {
	display:inline-block; vertical-align:top; width:50%;
}
.contact_2 {
	display:inline-block; vertical-align:top; width:49%;
}

.tui-table {
  width: 100%;
  font-size:0.9em;
}

.tui-table thead td {
    font-weight:bold;
	border-bottom:solid 1px #CCCCCC;
}

.tui-table tbody tr:hover {
    background-color: #E2F3FE;
}

#select_startTravel {
	width:10em;
}
#select_endTravel {
	width:10em;
}
#select_duration {
	width:10em;
}
#select_adults {
	width:10em;
}
#select_children {
	width:10em;
}

#select_age1 {
	width:4.85em;
}
#select_age2 {
	width:4.85em;
}
#select_age3 {
	width:4.85em;
}
#select_age4 {
	width:4.85em;
}

.calMonth {
	width:39px;
	height:41px;
	text-align:center;
	color:#092A5E;
	font-weight:bold;
	font-size:1.2em;
}
.calLeftRight {
	width:39px;
	height:41px;
	text-align:center;
	color:#092A5E;
	font-size:1.2em;
}
.calLeftRight:hover {
	background:#E2F3FE;
	cursor:pointer;
}
#calDays td {
	width:39px;
	height:41px;
	text-align:center;
	color:#737373;
	border-bottom:solid 1px #D7D2C3;
}
.calWeekday {
	width:39px;
	height:41px;
	text-align:center;
	color:#4C4C4C;
}
.calWeekday:hover {
	background:#E2F3FE;
	cursor:pointer;
}
.calWeekend {
	width:39px;
	height:41px;
	text-align:center;
	color:#4C4C4C;
	background:#F3F0EC;
}
.calWeekend:hover {
	background:#E2F3FE;
	cursor:pointer;
}

.calWeekdayOff {
	width:39px;
	height:41px;
	text-align:center;
	color:#DDDDDD;
}
.calWeekdayOff:hover {
	background:#E2F3FE;
	cursor:pointer;
}
.calWeekendOff {
	width:39px;
	height:41px;
	text-align:center;
	color:#DDDDDD;
	background:#F3F0EC;
}
.calWeekendOff:hover {
	background:#E2F3FE;
	cursor:pointer;
}
.hideByMobile {
	display:inline-block;
}
.categoryLine {
	width:100%;
	margin:0 0 0 2em;
}
.categoryGridItem {
	width:190px;
	margin:0;
	display:inline-block;
}
.catBubble {
	table-layout:fixed;
	border-spacing:1px;
	border-collapse:separate;
	background:#092A5E;
	border:solid 1px #F3F0EC;
	width:100%;
	height:85px;
	overflow:hidden;
	cursor:pointer;
}
.catBubble .catCheck {
	display:none;
}
.catBubbleActive {
	table-layout:fixed;
	border-spacing:1px;
	border-collapse:separate;
	background:#70CBF4;
	border:solid 1px #70CBF4;
	width:100%;
	height:85px;
	overflow:hidden;
	cursor:pointer;
}
.catBubbleActive .catCheck {
	display:block;
}
.catArrow .catBubbleActive::after {
	content: '';
	position:absolute;
	margin-left:5.5em;
	border:12px solid transparent;
	border-top-color:#70CBF4;
}
.catIcon {
	background:#FFFFFF;
	font-size:1.0em;
	text-align:center;
	vertical-align:center;
}
.catContent {
	background:#FFFFFF;
	padding:0.3em;
}
.catCheck {
	float:right;
	font-size:1.3em;
	color:#70CBF4;
}
.catName {
	font-size:0.9em;
	line-height: normal;
	text-align:left;
}
.catDuration {
	font-size:0.7em;
	font-weight:bold;
	padding-top:0.2em;
}
.catInfo {
	position: absolute;
	margin: 60px 0 0 168px;
}

.tooltipTGH {
    display:inline-block;
    position:relative;
    text-align:left;
}

.tooltipTGH .top {
    min-width:200px; 
    top:-20px;
    left:50%;
    transform:translate(-50%, -100%);
    padding:10px 20px;
    color:#FFFFFF;
    background-color:#092a5e;
    font-weight:normal;
    font-size:13px;
    border-radius:8px;
    position:absolute;
    z-index:99999999;
    box-sizing:border-box;
    box-shadow:0 1px 8px rgba(0,0,0,0.5);
    visibility:hidden; opacity:0; transition:opacity 0.8s;
}

.tooltipTGH:hover .top {
   visibility:visible; opacity:1;
}

.tooltipTGH .top i {
    position:absolute;
    top:100%;
    left:50%;
    margin-left:-12px;
    width:24px;
    height:12px;
    overflow:hidden;
}

.tooltipTGH .top i::after {
    content:'';
    position:absolute;
    width:12px;
    height:12px;
    left:50%;
    transform:translate(-50%,-50%) rotate(45deg);
    background-color:#092a5e;
    box-shadow:0 1px 8px rgba(0,0,0,0.5);
}


.locationLine {
	width:100%;
	margin:0 0 0 2em;
}
.locationGridItem {
	width:190px;
	margin:0;
	display:inline-block;
}
.locBubble {
	table-layout:fixed;
	border-spacing:1px;
	border-collapse:separate;
	background:#092A5E;
	border:solid 1px #F3F0EC;
	width:100%;
	height:50px;
	overflow:hidden;
	cursor:pointer;
}
.locBubble .locCheck {
	display:none;
}
.locBubbleActive {
	table-layout:fixed;
	border-spacing:1px;
	border-collapse:separate;
	background:#70CBF4;
	border:solid 1px #70CBF4;
	width:100%;
	height:50px;
	overflow:hidden;
	cursor:pointer;
}
.locBubbleActive .locCheck {
	display:block;
}
.locIcon {
	background:#FFFFFF;
	font-size:1.0em;
	text-align:center;
	vertical-align:center;
}
.locContent {
	background:#FFFFFF;
	padding:0.3em;
}
.locCheck {
	float:right;
	font-size:1.3em;
	color:#70CBF4;
}
.locName {
	font-size:0.9em;
	line-height: normal;
	text-align:left;
}

.calendarContainer {
	display:inline-block; width:100%; padding:0.3em; margin:1em; text-align:center;
}
.weekSelector {
	display:inline-block; width:100%;
}
.selectOutside {
	display:inline-block; width:45px; padding:0.3em; margin:0em; text-align:center; font-size:1.6em; color:#092A5E; cursor:pointer;
}
.selectInside {
	display:inline-block; width:210px; padding:0.3em; margin:0; text-align:center; font-size:1.0em;
}
.weekDisplay {
	display:inline-block;
	width:90%;
	padding:1em;
	background:#FFFFFF;
	border:solid 1px #CCCCCC;
}
.dayDisplay {
	display:inline-block;
	width:13%;
	text-align:center;
	font-weight:bold;
}
.dayDate {
	width:32px;
	height:32px;
	margin:0.2em auto;
	border-radius:50%;
	font-size:1.3em;
	font-weight:bold;
}
.dayDate:Hover {
	background:#EEEEEE;
	transition: 0.3s;
	cursor:pointer;
}
.dayDateActive {
	width:32px;
	height:32px;
	margin:0.2em auto;
	border-radius:50%;
	font-size:1.3em;
	font-weight:bold;
	color:#FFFFFF;
	background:#000000;
}
.dayDateInactive {
	width:32px;
	height:32px;
	margin:0.2em auto;
	border-radius:50%;
	font-size:1.3em;
	font-weight:bold;
	color:#CCCCCC;
}
.timeContainer {
	display:inline-block; width:100%; min-height:70px; padding:0.5em 0 0 0; text-align:left;
}
.eventBubble {
	display:inline-block; border:solid 1px #000000; border-radius:5px; width:60px; padding:0.2em; margin:0.5em; text-align:center; font-family:arial; font-size:0.9em;
	cursor:pointer;
}
.eventBubble:Hover {
	background:#EEEEEE;
	transition: 0.3s;
}
.eventBubbleActive {
	display:inline-block; border:solid 1px #000000; border-radius:5px; width:60px; padding:0.2em; margin:0.5em; text-align:center; font-family:arial; font-size:0.9em;
	cursor:pointer;
	background:#092A5E;
	color:#FFFFFF;
}
.eventBubbleActive:Hover {
	background:#3A567F;
	transition: 0.3s;
}
.eventInfo {
	width:100%;
	text-align:center;
	color:#AAAAAA;
}
.selectize-control { 
	display: inline-block;
	vertical-align: middle;
}

.eventDetailLabel {
	display:inline-block; width:30%; padding-left:3em;
}
.eventDetailData {
	display:inline-block; width:65%; font-weight:bold;
}

a.tooltip {
    position: relative;
    text-decoration: none;
  }
  a.tooltip:after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 130%;
    left: 20%;
    background: #ffcb66;
    padding: 5px 15px;
    color: black;
    -webkit-border-radius: 10px;
    -moz-border-radius   : 10px;
    border-radius        : 10px;
    white-space: nowrap;
    opacity: 0;
     /* At time of this creation, only Fx4 doing pseduo transitions */
    -webkit-transition: all 0.4s ease;
    -moz-transition   : all 0.4s ease;
  }
  a.tooltip:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 20px solid #ffcb66;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    /* At time of this creation, only Fx4 doing pseduo transitions */
    -webkit-transition: all 0.4s ease;
    -moz-transition   : all 0.4s ease;
    opacity: 0;
    left: 30%;
    bottom: 90%;
  }
  a.tooltip:hover:after {
    bottom: 100%;
  }
  a.tooltip:hover:before {
    bottom: 70%;
  }
  a.tooltip:hover:after, a:hover:before {
    opacity: 1;
  }


@media screen and (max-width:690px) {
	.header00 {
		width:100%; max-width:900px; margin: 0 auto; font-size:1.1em;
	}
	.header01 {
		width:45%; font-size:1.1em;
	}
	.header01_1 {
	word-wrap: break-space; font-size:0.9em;
	}
	.header02 {
		display:none;
	}
	.header03 {
		width:45%;
	}
	
	.inputbox {
	display:block; width:100%;
	}
	.inputbox-remark {
		font-size:0.6em;
	}
	.inputarea {
	padding-left:0em;

	}	
	.inputarea_field {
	width:100%;
	}
	.inputarea_remark {
		display:inline-block; width:100%; font-size:0.9em; color:#666666;
	}
	.hideByMobile {
		display:none;
	}
}

@media screen and (max-width:800px) {
	body {
		font-size:140%;
	}
}

@media screen and (max-width:820px) {
	#searchCity {
		display:block;
	}
}

@media screen and (max-width:550px) {
	#searchPlz {
		display:block;
		width:6em;
	}
	#searchCity {
		display:block;
	}
	#searchStreet {
		display:block;
	}
	#inputChildren {
		display:block;
	}
	body {
		font-size:130%;
	}
	.tui-btn--sm {
		padding: 2px 4px; line-height: 1.0; font-size: 0.9em; margin:0.2em 0;
		width:70px;
	}
	.eventDetailLabel {
		display:inline-block; width:90%; padding-left:2em;
	}
	.eventDetailData {
		display:block; width:90%; font-weight:bold; padding-left:4em;
	}
	
	.catBubble {
		margin-bottom:1em;
	}
	.catBubbleActive {
		margin-bottom:1em;
	}
	.contact_1 {
		display:block; width:100%;
	}
	.contact_2 {
		display:block; width:100%;
	}
}