@charset "utf-8";

/*======================[ COMMON PARTS ]*/

[class^="mark-arrow-"] {
 display: inline-block;
 width: 0;
 height: 0;
 border-width: 5px;
 border-style: solid;
}

.mark-arrow-gray-r { border-color: transparent transparent transparent #999; }

.mark-arrow-black-r { border-color: transparent transparent transparent #000; }

.hl-line {
	display: block;
	padding: 8px 10px;
	background: #fff;
}

.focus { outline: none; }

input[type=text], textarea { -webkit-appearance: none; }

input:focus, textarea:focus { outline: none; }

/*======================[ BUTTON ]*/

.btn-bx {
	display:block;
	position:relative;
	padding:15px 20px;
	border: none;
	border-radius: 4px;
	color: #fff;
	cursor:pointer;
	behavior: url(/js/PIE.htc); /* for IE */
}

.btn-bx a { color: #fff; }

.blue-btn {
	background: #19bbe6;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	text-shadow: 1px 1px 1px #1d8fb5;
}

.gray-btn {
	background: #999;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	text-shadow: 1px 1px 1px #6f6f6f;
}

/*======================[ PAGE LAYOUT ]*/

body { -webkit-text-size-adjust: none; }

div#page {
	width: 100%;
	min-height: 100%;
	position: relative;
	height: auto;
}

body > div#page { height: auto; }

div#container {
	width: 100%;
	min-width: 320px;
	background: #fff;
	position: relative;
}

div#wrapper {
	width:100%;
	max-width:960px;
	min-width: 320px;
	margin: 0 auto;
	background: #fff;
	color: #444;
}

.content { padding-bottom: 0px; }

.content a { color: #00b4e3; }

h1#page-ttl {
	padding-top: 20px;
	margin-bottom: 10px;
	text-align: center;
}

#topic-path {
	width: 100%;
	height:52px;
}

#topic-path p {
	width: 95%;
	max-width: 940px;
	padding: 20px 10px 0;
	margin: 0 auto;
}

#topic-path p a { color: #00b4e3; }

#topic-path p a:hover { text-decoration: underline; }


@media screen and (max-width:480px) {

#container { padding-bottom: auto; }

.stripe-border {
	padding: 4px;
	background: url(/english/images/etc/bg_stripe_border.gif) left top repeat;
}

.sp-hide { display: none; }

}

@media screen and (min-width:481px) {

#container { padding-bottom: 112px; }

.stripe-border {
	padding: 7px;
	background: url(/english/images/etc/bg_stripe_border.gif) left top repeat;
}

.pc-hide { display: none; }

}

@media screen and (min-width: 801px) {

#container { padding-bottom: 96px; }

#container > #wrapper { padding-top: 43px; }

}