@charset "utf-8";

/*===============================================================================================================================================*/
/* Default font(s) and text size
/*===============================================================================================================================================*/
html
{	font-size: 14px;
	line-height: 1.6em;
}

body
{	background-color: #FFF;
	width: 100%;
	min-width: 320px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	color: #222;
	font-size: inherit;
	line-height: inherit;
	font-weight: normal;
	font-style: normal;
	text-align: justify;
	word-wrap: break-word;
}

html[lang=en] body
{	text-align: left;
}

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

.serif,
.mincho
{	font-family: "ヒラギノ明朝 Pro W4","Hiragino Mincho Pro","HGS明朝B","MingLiU","SimSun","ＭＳ Ｐ明朝",serif;
}

/* English */
.eng-sans
{	font-family: Verdana, Geneva, Arial, sans-serif;
}

.times,
.eng-serif
{	font-family: "Times New Roman", Times, serif;
}
@media screen and (max-width: 599px)
{	html
	{	font-size: 13px;
	}
}

@media screen and (max-width: 399px)
{	html
	{	font-size: 12px;
	}
}

/*==========================================================================================================================================================*/
/* Base tags - Redefinition */
/*==========================================================================================================================================================*/
h1, h2, h3, h4, h5, h6, p,
div,
img, a,
ol, ul, li, dl, dt, dd,
table, tbody, tfoot, thead, tr, th, td,
span, small, strong, em,
b, i, u, var,
iframe, object, button,
fieldset, legend,
input[type=text], input[type=password], input[type=number],
textarea,
select, option,
form, sub, sup, address, blockquote, time
{	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1em;
	line-height: 1.6em;
	color: inherit;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	text-indent: 0;
}
a,
span, small, strong, em,
b, i, u
{	line-height: inherit;
}

::before, ::after
{	text-indent: 0;
}


/* HTML5 resets */
/*===============================================================================================================================================*/
header, main, footer,
nav, aside,
figure, figcaption,
section, article,
address
{	display: block;
	padding: 0;
	margin: 0;
}

/*==========================================================================================================================================================*/
/* Tag-specific */
/*==========================================================================================================================================================*/

/* Links - may or may not want to define default colors depending on design */
/*==========================================================================================================================================================*/
a, button, label,
input[type=checkbox], input[type=radio],
input[type=submit], input[type=reset],
[onclick]
{	cursor: pointer;
}

a:not([href]):not([onclick]),
button:not([onclick])
{	cursor: default;
}
input[type=text][onclick],
input[type=password][onclick]
{	cursor: text;
}

button,
input[type=submit], input[type=reset]
{	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

/* Give links no special treatment by default */
a
{	color: inherit;
	text-decoration: none;
}

a:hover
{	text-decoration: none;
}

/* In general, links in a P tag should look a different color than text. For other tags, use .text-link */
p a,
.text-link a, a.text-link
{	color: #0071BC;
}

p a:hover,
.text-link a:hover, a.text-link:hover,
label:hover
{	color: #0091DC;
	text-decoration: underline;
}

/* For some links (e.g. images), this will provide a simple hover animation */
.img-link a:hover,
a.img-link:hover
{	opacity: 0.75;
}

/* Images - these settings are suitale for responsive design and scaling. Emoji should still be inline, however.
/*==========================================================================================================================================================*/
img
{	max-width: 100%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.emoji img,
img.emoji
{	display: inline;
}

/* Lists */
/*==========================================================================================================================================================*/
ol, ul, li,
dl, dt, dd
{	list-style: none;
	list-style-type: none;
}

/* Tables */
/*==========================================================================================================================================================*/
table
{	border-spacing: 0;
	empty-cells: show;
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
}

table tr th, table tr td
{	word-wrap: break-word;
	vertical-align: top;
}

/*===============================================================================================================================================*/
/* Dynamic pages and inputs */
/*==========================================================================================================================================================*/
input[type=text], input[type=password], input[type=number],
textarea, select
{	box-sizing: border-box;
	border: 1px solid;
	font-size: 16px;	/* Done to ensure no auto zooming on iPhones */
}

input[type=checkbox], input[type=radio]
{	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
}

textarea
{	max-width: 100%;
	resize: vertical;
}

/* This class (generally used on a div) forces an input, select, or textarea to be the full size of its parent.
/* To control specific widths, resize the parent tag (or its parent tag).
/* Such sizing is FAR more reliable than sizing the bare input and gives much better control maintaining a uniform appearance. */
.input-holder
{	overflow: hidden;
	padding: 1px;
	box-sizing: border-box;
}

.input-holder > input,
.input-holder > textarea,
.input-holder > select
{	width: 100%;
	display: block;
}

/* Captions placed beside text inputs (e.g. "First Name").
/* This is generally a parent of an .input-holder and allows a caption to be on either side of the input.
/* Needs an accompanying .fr (right side) or .fl (left side) for the caption itself. */
.input-holder-caption
{	position: relative;
	overflow: hidden;
	text-align: left;
}

.input-holder-caption > .fr
{	padding-left: 0.5em;
}
.input-holder-caption > .fl
{	padding-right: 0.5em;
}

/* For phone numbers, this will put 3 boxes of equal width complete with dashes in the middle.
/* FORMAT: Main tag is .phone-inputs-wrap, next is .phone-inputs, then div children containing text inputs.
/* (Should generally only use 3 total divs) */
.phone-inputs-wrap
{	overflow: hidden;
}

/* Children divs have padding on either side, but this will extend them to the edge for perfect, equal width. */
.phone-inputs
{	margin-left: -0.5em;
	margin-right: -0.5em;
}

.phone-inputs > div
{	display: inline-block;
	vertical-align: top;
	width: 6em;
	max-width: 33.3333%;
	max-width: calc(100% / 3);
	box-sizing: border-box;
	position: relative;
	padding-right: 0.5em;
	padding-left: 0.5em;
}
.phone-inputs > div::after
{	content: "-";
	line-height: 1.2em;
	width: 1em;
	right: -0.5em;
	top: 50%;
	margin-top: -0.6em;
	position: absolute;
	text-align: center;
}

.phone-inputs > div:nth-child(3n)::after,
.phone-inputs > div:last-child::after
{	content: none;
}
.phone-inputs > div > input
{	width: 100%;
	display: block;
}

/* For dates, this will assume the format of:  (Jan, 01, 2XXX)
/* FORMAT: Main tag is .date-inputs-wrap, next is .date-inputs, then div children containing selects. */

.date-inputs-wrap
{	overflow: hidden;
}

/* Children divs have padding on either side, but this will extend them to the edge for perfect, equal width. */
.date-inputs
{	margin-left: -0.5em;
	margin-right: -0.5em;
}

.date-inputs > div
{	display: inline-block;
	vertical-align: top;
	padding: 0 0.5em;
	box-sizing: border-box;
}

.date-inputs > div:nth-child(1)
{	max-width: 32.5%;
}
.date-inputs > div:nth-child(2)
{	max-width: 32.5%;
}
.date-inputs > div:nth-child(3)
{	max-width: 35%;
}

.date-inputs > div > select
{	display: block;
	width: 100%;
}

.date-inputs > div > select option
{	padding-right: 1em;
}

/* radio/checkbox */
.multi-inputs
{}
.multi-inputs > div
{	display: inline-block;
	vertical-align: top;
}
.multi-inputs > div:not(:last-child)
{	margin-right: 1em;
}

.multi-inputs > div > label
{	display: inline-block;
}

.multi-inputs.use-mt
{	margin-top: -1em;
}
.multi-inputs.use-mt > div
{	margin-top: 1em;
}

/* Indents checkboxes or radios */
.indent-input
{	padding-left: 25px;
	text-indent: -25px;
}
.indent-input input[type=checkbox],
.indent-input input[type=radio]
{	width: 20px;
	display: inline-block;
	margin: 0 5px 0 0;
	text-indent: 0;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Other common formatting */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.items2 > li,
.items2 > div,
.items3 > li,
.items3 > div,
.items4 > li,
.items4 > div
{	display: inline-block;
	vertical-align: top;
	margin-right: 2%;
	box-sizing: border-box;
}

.items2 > li,
.items2 > div
{	width: 49%;
}
.items2.full-width > li,
.items2.full-width > div
{	width: 50%;
	margin-right: 0;
}

.items3 > li,
.items3 > div
{	width: 32%;
}
.items3.full-width > li,
.items3.full-width > div
{	width: 33.3333%;
	width: calc(100% / 3);
	margin-right: 0;
}

.items4 > li,
.items4 > div
{	width: 23.5%;
}
.items4.full-width > li,
.items4.full-width > div
{	width: 25%;
	margin-right: 0;
}

.items2 > li:nth-child(2n),
.items2 > div:nth-child(2n),
.items3 > li:nth-child(3n),
.items3 > div:nth-child(3n),
.items4 > li:nth-child(4n),
.items4 > div:nth-child(4n)
{	margin-right: 0;
}

.items2:not(.no-margin) > li:nth-child(n+3),
.items2:not(.no-margin) > div:nth-child(n+3),
.items3:not(.no-margin) > li:nth-child(n+4),
.items3:not(.no-margin) > div:nth-child(n+4),
.items4:not(.no-margin) > li:nth-child(n+5),
.items4:not(.no-margin) > div:nth-child(n+5)
{	margin-top: 2%;
}

@media screen and (max-width: 799px)
{	.items2:not(.leave) > li,
	.items2:not(.leave) > div,
	.items2.full-width:not(.leave) > li,
	.items2.full-width:not(.leave) > div,
	.items3:not(.leave) > li,
	.items3:not(.leave) > div,
	.items3.full-width:not(.leave) > li,
	.items3.full-width:not(.leave) > div,
	.items4:not(.leave) > li,
	.items4:not(.leave) > div,
	.items4.full-width:not(.leave) > li,
	.items4.full-width:not(.leave) > div
	{	display: block;
		vertical-align: baseline;
		margin-right: auto;
		margin-left: auto;
		width: auto;
	}
	.items2:not(.leave) > li:nth-child(n+3),
	.items2:not(.leave) > div:nth-child(n+3),
	.items3:not(.leave) > li:nth-child(n+4),
	.items3:not(.leave) > div:nth-child(n+4),
	.items4:not(.leave) > li:nth-child(n+5),
	.items4:not(.leave) > div:nth-child(n+5)
	{	margin-top: 0;
	}
	.items2:not(.no-margin):not(.leave) > li:not(:last-child),
	.items2:not(.no-margin):not(.leave) > div:not(:last-child),
	.items3:not(.no-margin):not(.leave) > li:not(:last-child),
	.items3:not(.no-margin):not(.leave) > div:not(:last-child),
	.items4:not(.no-margin):not(.leave) > li:not(:last-child),
	.items4:not(.no-margin):not(.leave) > div:not(:last-child)
	{	margin-bottom: 20px;
	}

	.items4.leave.leave2 > li,
	.items4.leave.leave2 > div
	{	width: 49%;
	}
	.items4.leave.leave2 > li:nth-child(4n),
	.items4.leave.leave2 > div:nth-child(4n)
	{	margin-right: 2%;
	}
	.items4.leave.leave2.full-width > li,
	.items4.leave.leave2.full-width > div
	{	width: 50%;
		margin-right: 0;
	}
	.items4.leave.leave2 > li:nth-child(2n),
	.items4.leave.leave2 > div:nth-child(2n)
	{	margin-right: 0;
	}
	.items4.leave.leave2:not(.no-margin) > li:nth-child(n+3),
	.items4.leave.leave2:not(.no-margin) > div:nth-child(n+3)
	{	margin-top: 2%;
	}
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Boxes (general) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.box
{	background-color: #F2F2F2;
	padding: 15px;
}
.outline-box
{	background-color: #FFF;
	padding: 15px;
	border: 1px solid currentColor;
}

.box:not(:last-child),
.outline-box:not(:last-child)
{	margin-bottom: 20px;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Bullet lists */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
ul.bullet-list-text:not(:last-child),
ul.bullet-list-link:not(:last-child),
ul.triangle-list-text:not(:last-child),
ul.triangle-list-link:not(:last-child),
ul.arrow-list-text:not(:last-child),
ul.arrow-list-link:not(:last-child)
{	margin-bottom: 20px;
}

ul.bullet-list-text > li,
ul.bullet-list-link > li > a
{	padding-left: 1em;
	text-indent: -1em;
	box-sizing: border-box;
}

ul.bullet-list-text.use-margin > li:not(:last-child)
{	margin-bottom: 20px;
}


ul.bullet-list-text.same-line > li
{	display: inline-block;
	vertical-align: top;
}

ul.bullet-list-text.same-line > li:not(:last-child)
{	margin-right: 1em;
}

ul.bullet-list-link > li > a
{	display: block;
}

ul.bullet-list-text > li::before,
ul.bullet-list-link > li > a::before
{	background-color: currentColor;
	content: "";
	width: 0.6em;
	height: 0.6em;
	margin: 0 0.2em;
	display: inline-block;
	border-radius: 50%;
}

ul.bullet-list-text.no-icon > li::before,
ul.bullet-list-link.no-icon > li > a::before,
ul.bullet-list-text > li.no-icon::before,
ul.bullet-list-link > li.no-icon > a::before
{	content: none;
}

/* dots */
ul.bullet-list-text.gold-dot > li::before,
ul.bullet-list-link.gold-dot > li > a::before,
ul.bullet-list-text > li.gold-dot::before,
ul.bullet-list-link > li.gold-dot > a::before
{	background-color: #B09B7C;
}

ul.bullet-list-text.pink-dot > li::before,
ul.bullet-list-link.pink-dot > li > a::before,
ul.bullet-list-text > li.pink-dot::before,
ul.bullet-list-link > li.pink-dot > a::before
{	background-color: #FFB8B8;
}

/* triangle */
/* ================================= */
ul.triangle-list-text > li,
ul.triangle-list-link > li > a
{	padding-left: 1em;
	text-indent: -1em;
	box-sizing: border-box;
}
ul.triangle-list-link > li > a
{	display: block;
}
ul.triangle-list-text > li::before,
ul.triangle-list-link > li > a::before
{	content: "";
	border-left: 0.5em solid currentColor;
	border-top: 0.4em solid transparent;
	border-bottom: 0.4em solid transparent;
	margin-right: 0.25em;
	margin-left: 0.25em;
	display: inline-block;
	vertical-align: 0.1em;
	box-sizing: border-box;
}

ul.triangle-list-text > li.no-icon::before,
ul.triangle-list-link > li.no-icon > a::before
{	content: none;
}

/* arrow */
/* ================================= */
ul.arrow-list-text > li,
ul.arrow-list-link > li > a
{	padding-left: 1em;
	text-indent: -1em;
	box-sizing: border-box;
}
ul.arrow-list-link > li > a
{	display: block;
}
ul.arrow-list-text > li::before,
ul.arrow-list-link > li > a::before
{	content: "";
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	border-radius: 0;
	margin-left: 0;
	margin-right: 0.5em;
	width: 0.5em;
	height: 0.5em;
	display: inline-block;
	vertical-align: 0.1em;
	box-sizing: border-box;
}

ul.arrow-list-text > li.no-icon::before,
ul.arrow-list-link > li.no-icon > a::before
{	content: none;
}

/* */
ul.bullet-list-link > li > a:hover,
ul.triangle-list-link > li > a:hover,
ul.arrow-list-link > li > a:hover
{	background-color: #EEE;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Numeric lists */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
ol.numeric-list
{	counter-reset: counter0;
}
ol.numeric-list > li
{	padding-left: 1.5em;
	text-indent: -1.5em;
	counter-increment: counter0;
}

ol.numeric-list > li:not(:last-child)
{	margin-bottom: 0.8em;
}

ol.numeric-list > li::before
{	content: counter(counter0) ".";
	display: inline-block;
	min-width: 1.5em;
	text-align: right;
	box-sizing: border-box;
	padding-right: 0.5em;
}

ol.numeric-list > li:nth-child(1):nth-last-child(n+10),
ol.numeric-list > li:nth-child(2):nth-last-child(n+9),
ol.numeric-list > li:nth-child(3):nth-last-child(n+8),
ol.numeric-list > li:nth-child(4):nth-last-child(n+7),
ol.numeric-list > li:nth-child(5):nth-last-child(n+6),
ol.numeric-list > li:nth-child(6):nth-last-child(n+5),
ol.numeric-list > li:nth-child(7):nth-last-child(n+4),
ol.numeric-list > li:nth-child(8):nth-last-child(n+3),
ol.numeric-list > li:nth-child(9):nth-last-child(n+2),
ol.numeric-list > li:nth-child(n+10)
{	padding-left: 2em;
	text-indent: -2em;
}
ol.numeric-list > li:nth-child(1):nth-last-child(n+10)::before,
ol.numeric-list > li:nth-child(2):nth-last-child(n+9)::before,
ol.numeric-list > li:nth-child(3):nth-last-child(n+8)::before,
ol.numeric-list > li:nth-child(4):nth-last-child(n+7)::before,
ol.numeric-list > li:nth-child(5):nth-last-child(n+6)::before,
ol.numeric-list > li:nth-child(6):nth-last-child(n+5)::before,
ol.numeric-list > li:nth-child(7):nth-last-child(n+4)::before,
ol.numeric-list > li:nth-child(8):nth-last-child(n+3)::before,
ol.numeric-list > li:nth-child(9):nth-last-child(n+2)::before,
ol.numeric-list > li:nth-child(n+10)::before
{	min-width: 2em;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Pagination (general) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.pagination
{	text-align: center;
	overflow: hidden;
	padding: 1px 0;
	font-size: 1em;
	line-height: 1.4em;
}

.pagination a
{	background-color: #E0E0E0;
	line-height: inherit;
}

.pagination a:hover
{	background-color: #F0F0F0;
}

.pagination > a,
.pagination > ol,
.pagination > ol > li
{	box-sizing: border-box;
	display: inline-block;
	vertical-align: top;
	line-height: inherit;
}

.pagination > ol > li > a
{	display: block;
}

.pagination > ol > li > a.current
{	background-color: #EEE;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Buttons (general) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.btns
{	text-align: center;
	margin: 0 auto;
}

.btns:not(:last-child)
{	margin-bottom: 20px;
}

.btns > a,
.btns > button
{	background-color: #E0E0E0;
	display: inline-block;
	vertical-align: top;
	padding: 15px 35px 15px 15px;
	color: #323644;
	width: 200px;
	max-width: 48%;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
}
.btns > a:hover,
.btns > button:hover
{	background-color: #F0F0F0;
}

.btns > a:not(:last-child),
.btns > button:not(:last-child)
{	margin-right: 4%;
}

.btns > a:only-child,
.btns > button:only-child
{	width: 400px;
	max-width: 100%;
}

/* max-size */
.btns.max-size > a,
.btns.max-size > button
{	width: 48%;
}
.btns.max-size > a:only-child,
.btns.max-size > button:only-child
{	width: 100%;
}

/* auto-size */
.btns.auto-size > a,
.btns.auto-size > button
{	width: auto;
}
.btns.auto-size > a:only-child,
.btns.auto-size > button:only-child
{	width: auto;
}

/* arrow */
.btns > a::after,
.btns > button::after
{	content: "";
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	width: 0.5em;
	height: 0.5em;
	margin-top: -0.25em;
	position: absolute;
	right: 15px;
	top: 50%;
	box-sizing: border-box;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 2;
}

/* no-icon */
.btns > a.no-icon,
.btns > button.no-icon
{	padding-right: 15px;
}

.btns > a.no-icon::after,
.btns > button.no-icon::after
{	content: none;
}

@media screen and (max-width: 799px)
{	.btns.smt-break > a,
	.btns.smt-break > button
	{	display: block;
		width: auto;
		max-width: none;
		margin: 0 auto 20px;
	}
	.btns.smt-break > a:last-child,
	.btns.smt-break > button:last-child
	{	margin-bottom: 0;
	}
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Sub menus (general) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.sub-menu-parent
{ 	position: relative; 
}

.sub-menu 
{ 	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1;
	-webkit-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
	transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
}

.sub-menu-parent:focus .sub-menu,
.sub-menu-parent:hover .sub-menu 
{	visibility: visible;
	opacity: 1;
	z-index: 1;
	-webkit-transition-delay: 0s, 0s, 0.3s;
	transition-delay: 0s, 0s, 0.3s; /* this removes the transition delay so the menu will be visible while the other styles transition */
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* SMT Menu (general) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
#smt-top-menu-wrap
{	background-color: #000;
	background-color: rgba(0,0,0,0.7);
	position: fixed;
	top: -100%;
	bottom: 100%;
	left: 0;
	right: 0;
	z-index: 9999;
	-webkit-transition: all 0.15s ease-in-out 0s;
	transition: all 0.15s ease-in-out 0s;
	overflow: auto;
}

#smt-top-menu-wrap.active
{	top: 0;
	bottom: 0;
}

#smt-top-menu
{	background-color: #888;
	visibility: hidden;
	transition-delay: 0.2s;
	transition-timing-function: linear;
	transition-duration: 0.25s;
	transition-property: opacity;
	opacity: 0;
}

.active #smt-top-menu
{	opacity: 1;
	visibility: visible;
}


/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* iframe holders (YT videos, Google Maps, etc.) */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
.iframe-holder
{	background-color: #AAA;
	padding-top: 50%;
	position: relative;
}

.iframe-holder > iframe
{	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/																																							 
/* Other common */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Text alignment (should never be overwritten, thus important) */
.tl
{	text-align: left !important;
}
.tc
{	text-align: center !important;
}
.tr
{	text-align: right !important;
}
.tj
{	text-align: justify !important;
}

/* Text appearance */
.bold
{	font-weight: bold !important;
}
.italic
{	font-style: italic !important;
}
.strike
{	text-decoration: line-through !important;
}
.underline
{	text-decoration: underline !important;
}

/* The small tag, by default, should have a set size reduction */
small
{	font-size: 0.8em;
}

/*===============================================================================================================================================*/
/* widths */
/*===============================================================================================================================================*/
.w-auto
{	width: auto !important;
}
.w100percent
{	width: 100%;
}

/* max widths */
.max1200px,.max1100px,.max1000px,
.max900px,.max800px,.max700px,.max600px,.max500px,
.max400px,.max300px,.max250px,.max200px,.max150px,.max100px,
.max75px,.max50px
{	margin-left: auto;
	margin-right: auto;
}

.max1200px
{	max-width: 1200px;
}
.max1100px
{	max-width: 1100px;
}
.max1000px
{	max-width: 1000px;
}
.max900px
{	max-width: 900px;
}
.max800px
{	max-width: 800px;
}
.max700px
{	max-width: 700px;
}
.max600px
{	max-width: 600px;
}
.max500px
{	max-width: 500px;
}
.max400px
{	max-width: 400px;
}
.max300px
{	max-width: 300px;
}
.max250px
{	max-width: 250px;
}
.max200px
{	max-width: 200px;
}
.max150px
{	max-width: 150px;
}
.max100px
{	max-width: 100px;
}
.max75px
{	max-width: 75px;
}
.max50px
{	max-width: 50px;
}

/* min-widths */
.min1em, .min2em, .min3em, .min4em, .min5em,
.min6em, .min7em, .min8em, .min9em, .min10em
{	display: inline-block;
}

.min1em
{	min-width: 1em;
}
.min2em
{	min-width: 2em;
}
.min3em
{	min-width: 3em;
}
.min4em
{	min-width: 4em;
}
.min5em
{	min-width: 5em;
}
.min6em
{	min-width: 6em;
}
.min7em
{	min-width: 7em;
}
.min8em
{	min-width: 8em;
}
.min9em
{	min-width: 9em;
}
.min10em
{	min-width: 10em;
}

/*===============================================================================================================================================*/
/* Simple inline block formatting with b tags */
/*===============================================================================================================================================*/
.b-ib b,
.b-ib-smt-i b
{	display: inline-block;
	font-weight: inherit;
}

@media screen and (max-width: 799px)
{	.b-ib-smt-i b
	{	display: inline;
	}
}

/*===============================================================================================================================================*/
/* Pre-determined margins settings that do not change with screen size */
/*===============================================================================================================================================*/
/* MLR */
.mlr0,.mrl0
{	margin-left: 0 !important;
	margin-right: 0 !important;
}
.mlr-auto,.mrl-auto
{	margin-left: auto !important;
	margin-right: auto !important;
}

/* MT */
.mt0
{	margin-top: 0 !important;
}
.mt5
{	margin-top: 5px !important;
}
.mt10
{	margin-top: 10px !important;
}
.mt15
{	margin-top: 15px !important;
}
.mt20
{	margin-top: 20px !important;
}
.mt30
{	margin-top: 30px !important;
}
.mt40
{	margin-top: 40px !important;
}

/* MB */
.mb0
{	margin-bottom: 0 !important;
}
.mb5
{	margin-bottom: 5px !important;
}
.mb10
{	margin-bottom: 10px !important;
}
.mb15
{	margin-bottom: 15px !important;
}
.mb20
{	margin-bottom: 20px !important;
}
.mb30
{	margin-bottom: 30px !important;
}
.mb40
{	margin-bottom: 40px !important;
}

/* Give auto bottom margins to the P tags for spacing */
.p-mb p:not(:last-child),
.p-mb-direct > p:not(:last-child),
.oh-mb > .oh:not(:last-child),
.not-last-mb20:not(:last-child)
{	margin-bottom: 20px;
}

.not-last-mb30:not(:last-child)
{	margin-bottom: 30px;
}

.not-last-mb40:not(:last-child)
{	margin-bottom: 40px;
}

/*===============================================================================================================================================*/
/* Pre-determined padding settings that do not change with screen size */
/*===============================================================================================================================================*/
/* PT */
.pt0
{	padding-top: 0 !important;
}
/* PB */
.pb0
{	padding-bottom: 0 !important;
}

/*===============================================================================================================================================*/
/* Floats */
/*===============================================================================================================================================*/
.fl
{	float: left;
}
.fr
{	float: right;
}

/*===============================================================================================================================================*/
/* Overflow */
/*===============================================================================================================================================*/
.oh
{	overflow: hidden;
}
.ov
{	overflow: visible;
}

/*===============================================================================================================================================*/
/* Indenting (Generally for easily formatting lists) */
/*===============================================================================================================================================*/
.indent1
{	padding-left: 1em;
	text-indent: -1em;
}
.indent2
{	padding-left: 2em;
	text-indent: -2em;
}
.indent3
{	padding-left: 3em;
	text-indent: -3em;
}
.indent4
{	padding-left: 4em;
	text-indent: -4em;
}
.indent5
{	padding-left: 5em;
	text-indent: -5em;
}
.indent6
{	padding-left: 6em;
	text-indent: -6em;
}
.indent7
{	padding-left: 7em;
	text-indent: -7em;
}
.indent8
{	padding-left: 8em;
	text-indent: -8em;
}
.indent9
{	padding-left: 9em;
	text-indent: -9em;
}
.indent10
{	padding-left: 10em;
	text-indent: -10em;
}

/*===============================================================================================================================================*/
/* Device display override classes */
/*===============================================================================================================================================*/
.force-display-none
{	display: none !important;
}
.force-inline
{	display: inline;
}
.force-block
{	display: block;
}
.force-inline-block, .ib
{	display: inline-block;
}

/* --- */
.pc, .pc-block
{	display: block;
}
.pc-inline
{	display: inline;
}
.pc-inline-block
{	display: inline-block;
}
.smt, .smt-block, .smt-inline, .smt-inline-block
{	display: none;
}

@media screen and (max-width: 799px)
{	.pc, .pc-block, .pc-inline, .pc-inline-block
	{	display: none;
	}
	.smt, .smt-block, .smt-force-block
	{	display: block;
	}
	.smt-inline, .smt-force-inline
	{	display: inline;
	}
	.smt-inline-block, .smt-force-inline-block
	{	display: inline-block;
	}
}

@media screen and (orientation: landscape)
{	.vert-only
	{	display: none;
	}
	.horiz-only
	{	display: block;
	}
}

@media screen and (orientation: portrait), (max-width:639px)
{	.vert-only
	{	display: block;
	}
	.horiz-only
	{	display: none;
	}
}

/*===============================================================================================================================================*/
/* Shadows after boxes */
/*===============================================================================================================================================*/
.after-shadow
{	position: relative;
	height: 20px;
	overflow: hidden;
}
.after-shadow::after
{	background-image: -webkit-radial-gradient(rgba(0,0,0,0.25) 15%,rgba(0,0,0,0),rgba(0,0,0,0) 70%);
	background-image: radial-gradient(rgba(0,0,0,0.25) 15%,rgba(0,0,0,0),rgba(0,0,0,0) 70%);
	content: "";
	position: absolute;
	left: -10%;
	right: -10%;
	bottom: 0;
	height: 200%;
}

/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/* Customized CSS starts here */
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
/*===============================================================================================================================================*/
#main-content-wrap
{	max-width: 1600px;
	margin: 0 auto;
}

/* ---------- */
header
{}

/* */
#h1-wrap
{	padding: 0 10px 0 0;
	position: relative;
	z-index: 2;
	background-color: #000;
	color: #FFF;
}

#h1-wrap > div
{	max-width: 1000px;
	position: relative;
	padding-left: 130px;
	margin: 0 auto;
}
#h1-wrap > div img
{	position: absolute;
	top: 0;
	left: 0;
	width: 120px;
}

h1
{	text-align: center;
	padding: 10px 0;
}

/* */
#main-img
{	position: relative;
}

#main-img figure
{	position: absolute;
	max-width: 1180px;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: 0;
	padding: 0 10px;
}

#main-img figure img
{	margin: 0 0 0 auto;
	width: 250px;
	max-width: 25%;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
}

/* ---------- */
main
{}

main .in
{	max-width: 1000px;
	padding: 30px 10px;
	box-sizing: border-box;
	margin: 0 auto;
}

.line-bg
{	background: url("./img/bg-line.png") top left;
}

.red-text
{	color: #ED1C24;
}

/* */
.wavy-midasi
{	text-align: center;
	color: #FFF;
	font-size: 2.4em;
	line-height: 1.4em;
	font-weight: bold;
	margin: 0 auto;
}

.wavy-midasi:not(:last-child)
{	margin-bottom: 20px;
}

.wavy-midasi::after
{	background: url("./img/wavy-decal.svg") no-repeat center bottom;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	content: "";
	display: block;
	width: 173px;
	height: 15px;
	margin: 5px auto 0;
}

/* ----- */
#intro-text
{	background-color: #E53076;
	background-image: -webkit-linear-gradient(left,#E53076,#F46E92);
	background-image: linear-gradient(to right,#E53076,#F46E92);
	color: #FFF;
}

#intro-text p
{	text-align: center;
	font-size: 1.35em;
}

/* ----- */
#schedule-area
{	background: url("./img/bg-floral.png") repeat top left #FFF;
}

#schedule-area .details
{	font-size: 1.4em;
	line-height: 1.4em;
	margin: 0 auto 40px;
}

#schedule-area .details ul li
{	padding-left: 1.3em;
	position: relative;
	font-weight: bold;
}

#schedule-area .details ul li:not(:last-child)
{	margin-bottom: 15px;
}

#schedule-area .details ul li::before
{	background: url("./img/flower-bullet.svg") no-repeat center center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	content: "";
	width: 1.1em;
	height: 1.2em;
	position: absolute;
	left: 0;
	top: 0.1em;
}

#schedule-area .details img
{	max-width: 420px;
	margin: 0 0 0 auto;
}

/* */
#schedule-area .schedule h3
{	font-size: 1.2em;
	line-height: 2.25em;
	text-align: center;
	margin-bottom: -2.25em;
	-webkit-transform: translateY(5px);
	transform: translateY(5px);
	
}
#schedule-area .schedule h3 span
{	display: inline-block;
	font-size: 2em;
	line-height: inherit;
	padding: 0 20px;
	box-sizing: border-box;
	position: relative;
}
#schedule-area .schedule h3 span::after
{	content: "";
	border-bottom: 2px solid;
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
}

#schedule-area .schedule h3 span em::before,
#schedule-area .schedule h3 span em::after
{	content: "";
	background-color: currentColor;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	bottom: 0;
	margin-bottom: -3px;
	position: absolute;
}

#schedule-area .schedule h3 span em::before
{	left: 0;
}

#schedule-area .schedule h3 span em::after
{	right: 0;
}

#schedule-area .schedule h3 small
{	display: block;
	line-height: inherit;
	
}

#schedule-area .schedule figure
{	border: 1px dotted;
	border-radius: 20px;
	padding: 20px;
}

#schedule-area .schedule ol
{	max-width: 400px;
	margin: 0 auto;
	font-size: 1.15em;
	padding-top: 40px;
}

#schedule-area .schedule ol > li
{	overflow: hidden;
}
#schedule-area .schedule ol > li:not(:last-child)
{	margin-bottom: 15px;
}

#schedule-area .schedule ol > li span
{	display: block;
	min-width: 10em;
	text-align: left;
	float: left;
}
#schedule-area .schedule ol > li p
{	overflow: hidden;
}

/* ----- */
#bottom-wrap
{	background-color: #E53076;
	background-image: -webkit-linear-gradient(290deg,#F46E92,#F77696,#FFD933);
	background-image: linear-gradient(160deg,#F46E92,#F77696,#FFD933);
}

#bottom-wrap .gallery img
{	width: 100%;
}

.tel-box
{	position: relative;
	margin: 0 auto 30px;
	max-width: 800px;
	
}

.tel-box::before
{	background: url("./img/bg-floral.png") repeat top left #FFF;
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: 0;
	left: 30px;
	right: 30px;
	-webkit-transform: skewX(-12deg);
	transform: skewX(-12deg);
}
.tel-box > div
{	position: relative;
	z-index: 2;
	padding: 20px;
	text-align: center;
	font-size: 1.1em;
}

.tel-box > div strong
{	color: #FF0078;
	font-weight: bold;
	font-size: 2em;
	line-height: 1.2em;
	display: block;
}

.tel-box > div strong a
{	color: inherit;
}

.tel-box-wrap .decal
{	max-width: 80%;
}

/* ---------- */
footer
{	background-color: #000;
	padding: 10px;
	color: #FFF;
	text-align: center;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 799px)
{	.wavy-midasi
	{	font-size: 2em;
	}

	.wavy-midasi::after
	{	width: 138px;
		height: 12px;
	}
	
/* */	
	#intro-text p
	{	text-align: left;
		font-size: 1.25em;
	}

/* */
	#schedule-area .details img
	{	max-width: 374px;
		margin: 0 auto;
		max-width: 65%;
	}

/* */
	.tel-box > div strong
	{	font-size: 1.7em;
	}
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 599px)
{	#h1-wrap > div
	{	padding-left: 115px;
		font-size: 0.95em;
	}
	#h1-wrap > div img
	{	width: 105px;
	}
	
	#main-img figure img
	{	max-width: 30%;
	}

/* */	
	.wavy-midasi
	{	font-size: 1.6em;
	}
	.wavy-midasi::after
	{	width: 120px;
		height: 10px;
	}

/* */
	#intro-text .in
	{	padding-top: 50px;
	}
	
	#intro-text p
	{	font-size: 1.1em;
	}
	
/* */
	#schedule-area .details
	{	font-size: 1.2em;
		margin-bottom: 30px;
	}
	#schedule-area .schedule h3
	{	font-size: 1.1em;
		-webkit-transform: translateY(4px);
		transform: translateY(4px);
	}
	#schedule-area .schedule figure
	{	border-radius: 15px;
		padding: 15px;
	}
	
	#schedule-area .schedule ol
	{	font-size: 1em;
		padding-top: 25px;
	}
	
	#schedule-area .schedule ol > li span
	{	min-width: 8em;
	}

/* */
	.tel-box::before
	{	left: 20px;
		right: 20px;
	}
	.tel-box > div strong
	{	font-size: 1.5em;
	}
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 479px)
{	#h1-wrap > div
	{	padding-left: 100px;
		font-size: 0.925em;
	}
	#h1-wrap > div img
	{	width: 90px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	h1
	{	padding: 5px 0;
	}
	
	h1 b
	{	display: block !important;
	}
	
	#main-img figure img
	{	max-width: 35%;
	}
	
	.wavy-midasi
	{	font-size: 1.3em;
	}

/* */
	#intro-text .in
	{	padding-top: 60px;
	}
}
