@charset "UTF-8";
/*\*/


/* ------------------------------------
 * LINK
 * ------------------------------------ */
 
a {
	cursor: pointer;
	outline: none;
}
a:link,
a:visited {
	color: #474747;
	text-decoration: none;
	word-break: break-all;
	word-wrap: break-word;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	-o-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out;
}
a:link:hover,
a:visited:hover {
	color: #474747;
	text-decoration: none;
}

a img {
	border: 0;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	-o-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out;
}
a img:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";  /* ie 8 */
	-moz-opacity: 0.6;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;   
}
p a {
	word-wrap : break-word;
	overflow-wrap : break-word;
}

@media (max-width: 639px) {
	a:link,
	a:visited {
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		transition: none;
	}
	a:link:hover,
	a:visited:hover {
		color: #474747;
		text-decoration: none;
	}
	a:hover,
	a img:hover {
		opacity: 1 !important;
		filter: alpha(opacity=100) !important;        /* ie lt 8 */
		-ms-filter: "alpha(opacity=100)" !important;  /* ie 8 */
		-moz-opacity: 1 !important;                 /* FF lt 1.5, Netscape */
		-khtml-opacity: 1 !important;   
	}
}


/* ------------------------------------
 * HEADER
 * ------------------------------------ */

header h1 {
	display: block;
	overflow: hidden;
	margin: 42px auto 16px;
}

header h1 a,
header h1 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 250px;
	height: 80px;
	margin: 0 auto;
	background: url(../img/common/logo.png) no-repeat center center;
	background-size: contain;
	z-index: 10;
}
header h1 a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=70)";  /* ie 8 */
	-moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7;   
}

#navBtn {
	display: none;
}

@media (max-width: 999px) {
	header h1 a,
	header h1 span {
		background: url(../img/common/logo_sp.png) no-repeat center center;
		background-size: contain;
	}
}

@media (max-width: 639px) {
	header h1 {
		margin: 11px auto 9px;
		text-align: left;
	}
	header h1 a,
	header h1 span {
		width: 156px;
		height: 50px;
		margin: 0 auto 0 11px;
	}
	#navBtn,
	#backBtn a {
		position: fixed;
		top: 0px;
		width: 44px;
		height: 44px;
		z-index: 1001;
	}
	/* クリックエリアと位置を指定 ---------------------- */
	#navBtn {
		display: block;
		right: 8px;
		top: 13px;
		cursor: pointer;
	}
	/* 3本線の1本ごとに共通するスタイルを指定 ---------------------- */
	#navBtn .line {
		position: absolute;
		top: 0;
		left: 8px;
		display: block;
		width: 28px; /* 横幅 */
		height: 2px; /* 1本辺りの高さ */
		border-radius: 1px;
		-moz-border-radius: 1px;
		-webkit-border-radius: 1px;
		background: #999; /* 線の色 */
	/* 適用するプロパティ、変化する時間、変化する速度 */
		-webkit-transition: all 0.3s ease-out;
		transition: all 0.3s ease-out;
	}
	/* 3本線の各線の位置を指定 ---------------------- */
	#navBtn .line_01 { top: 13px; }
	#navBtn .line_02 { top: 21px; }
	#navBtn .line_03 { top: 29px; }
	/* 最上部の線のスタイル ---------------------- */
	#navBtn.is-active .line_01 {
		top: 21px; /* 上から2番目の線の位置に変更 */
	/* 線を45度回転 */
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		background: #888;
	}
	/* 上から2番目の線のスタイル ---------------------- */
	#navBtn.is-active .line_02 {
		opacity: 0; /* 不透明度を下げて線を消す */
	}
	
	/* 最下部の線のスタイル ---------------------- */
	#navBtn.is-active .line_03 {
		top: 21px; /* 上から2番目の線の位置に変更 */
	/* 線を135度回転 */
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
		background: #888;
	}
	.is-active {
	}
	/*#backBtn a {
		left: 0;
	}*/
}


/*-- GLOBAL NAV ---------------------- */

#globalNav {
	margin: 0 auto;
}

#globalNav ul {
	clear: both;
	text-align: center;
	font-size: 0;
}

#globalNav ul li {
	display: inline-block;
	padding: 0 25px;
	font-size: 12px;
}

#globalNav ul li a {
	display: inline-block;
	position: relative;
	line-height: 1;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}
#globalNav ul li a::after {
	content: "";
    display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
    height: 1px;
	background-color: #737373;
	z-index: 1;
	-webkit-transition: width 0.3s ease-in-out;
	-moz-transition: width 0.3s ease-in-out;
	-o-transition: width 0.3s ease-in-out;
	transition: width 0.3s ease-in-out;
}
#globalNav ul li a:hover::after {
	width: 100%;
}

#globalNav ul li a span {
	display: block;
	padding: 25px 0;
	font-family: "Open Sans", sans-serif;
	font-weight: 300;
	font-size: 117%;
	letter-spacing: 0.02em;
	color: #666;
}
#globalNav ul li a span:hover {
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	opacity: 0.6;
	filter: alpha(opacity=60);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";  /* ie 8 */
	-moz-opacity: 0.6;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;
}

@media (max-width: 639px) {
	#globalNav { display: none; }
	#globalNav {
		width: 100%;
		height: 100%;
		background: rgba(255,255,255,0.96);
		margin: 69px 0 0;
		padding: 0;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 1001;
	}
	#globalNav ul li {
		display: block;
		padding: 0;
		border: none !important;
		background-color: transparent !important;
		font-size: 13px;
	}
	#globalNav ul li a {
		display: block;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	#globalNav ul li a::before {
		content: "";
		display: block;
		position: static;
		width: 20px;
		height: 1px;
		margin: 0 auto 30px;
		background-color: #d9d9d9;
	}
	#globalNav ul li a:hover::after {
		display: none;
	}
	#globalNav ul li a span {
		padding: 0 0 30px !important;
		font-size: 116% !important;
	}
}


/* ------------------------------------
 * CONTENTS
 * ------------------------------------ */

.inner {
	width: 1000px;
	margin: 0 auto;
	padding: 40px 0 0;
}

section h2 {
	position: relative;
	margin-bottom: 40px;
	text-align: center;
	font-family: "Open Sans", sans-serif;
	font-weight: 300;
}

section h2 span {
	display: inline-block;
	padding: 40px 0 35px;
	border-bottom: solid 1px #737373;
	font-weight: 300;
	font-size: 250%;
	letter-spacing: 0.02em;
	color: #474747;
}

section time {
	display: inline-block;
	padding-right: 24px;
	font-family: "Open Sans", sans-serif;
	font-weight: 300;
	color: #888;
}

@media (max-width: 999px) {
	.inner {
		width: auto;
		margin: 0 4%;
	}
}

@media (max-width: 639px) {
	.inner {
		padding: 35px 0 0;
	}
	section h2 {
		margin-bottom: 25px;
	}
	section h2 span {
		padding: 25px 0 20px;
		font-size: 185%;
	}
	section time {
		padding-right: 20px;
	}
}

/* LIST */

.list {
	margin: 20px 0;
}

.list li {
	padding: 20px 0;
}

.list li a,
.list li div {
	display: block;
	padding: 1px 0 1px 24px;
	border-left: solid 1px #d9d9d9;
	text-align: left;
	color: #474747;
}
.list li a:hover {
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	opacity: 0.6;
	filter: alpha(opacity=60);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";  /* ie 8 */
	-moz-opacity: 0.6;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;
}

@media (max-width: 999px) {
}

@media (max-width: 639px) {
	.list {
		margin: 14px 0;
	}
	.list li {
		padding: 14px 0;
	}
	.list li a,
	.list li div {
		padding: 1px 0 1px 20px;
	}
}


/* FORM */

section form {
	margin: 60px 0;
}

section form textarea {
	width: 100%;
	height: 5em;
	padding: 0.4em;
	border-radius: 0;
	-webkit-appearance: none;
}

section form textarea:focus,
section form textarea:hover {
	height: 10em;
}

section form textarea,
section input[type="text"] {
	border: solid 1px #cfcfcf;
}

section input[type="text"] {
	padding: 0.4em;
}
section input.textInput {
	width: 60%;
	padding: 0.4em;
	border-radius: 0;
	-webkit-appearance: none;
}

section form ul {
	width: 62%;
	margin: 0 auto;
	zoom: 1;
}

section form li {
	display: inline;
	float: right;
	width: 48.5%;
}
section form li:first-child {
	float: left;
}

@media (max-width: 999px) {
	section form {
		margin: 50px 0;
	}
}


@media (max-width: 639px) {
	section form {
		margin: 40px 0;
	}
	section input.textInput {
		width: 70%;
	}
	section form ul {
		width: auto;
	}
}



/* BUTTON */

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

.btnArea {
	text-align: center;
}

.btnArea a,
form input.btn {
	display: inline-block;
	line-height: 1;
	padding: 14px 10px;
	width: 30%;
	border: solid 1px #d9d9d9;
	font-family: "Open Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "MS PGothic", sans-serif;
	font-weight: 300;
	letter-spacing: 0.02em;
}
form input.btn {
	background-color: #fff;
	color: #474747;
}
.btnArea a:hover,
form input.btn:hover {
	border-color: #898989;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
form li input.btn {
	width: 100%;
}

@media (max-width: 999px) {
	form input.btn {
		width: 40%;
	}
}

@media (max-width: 639px) {
	.btnArea a,
	form input.btn {
		display: block;
		width: auto;
		padding: 12px 10px;
	}
	form input.btn {
		width: 100%;
		border-color: #898989;
	}
}


/* ------------------------------------
 * FOOTER
 * ------------------------------------ */

footer .companyAddress {
	margin: 110px auto;
}
footer .companyAddress::before,
footer .companyAddress::after {
	content: "";
    display: block;
	width: 26px;
    height: 1px;
	margin: 0 auto;
	background-color: #d9d9d9;
}
footer .companyAddress::before {
	margin-bottom: 35px;
}
footer .companyAddress::after {
	margin-top: 35px;
}

footer .companyAddress .logo {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 200px;
	height: 64px;
	line-height: 0;
	margin: 0 auto 12px;
	background: url(../img/common/logo_200.png) no-repeat center center;
	background-size: contain;
}

footer .companyAddress strong {
	display: block;
	margin-bottom: 0.2em;
	font-size: 134%;
}

footer .companyAddress .address {
	letter-spacing: 0.08em;
	font-size: 92%;
}

footer .companyAddress a.mapLink {
	display: inline-block;
	line-height: 1.4;
	margin-left: 1em;
	padding: 0 0.5em;
	background-color: #989898;
	color: #fff;
}
footer .companyAddress a.mapLink:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";  /* ie 8 */
	-moz-opacity: 0.6;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;   
}

footer small {
	display: block;
	margin: 40px auto;
	font-family: "Open Sans", sans-serif;
	font-weight: 300;
	font-size: 84%;
	color: #888;
}

@media (max-width: 999px) {
	footer .companyAddress .logo {
		background: url(../img/common/logo_sp.png) no-repeat center center;
		background-size: contain;
	}
}

@media (max-width: 639px) {
	footer .companyAddress {
		margin: 80px auto;
	}
	footer .companyAddress::before {
		margin-bottom: 30px;
	}
	footer .companyAddress::after {
		margin-top: 30px;
	}
	footer .companyAddress .logo {
		width: 156px;
		height: 50px;
	}
	footer .companyAddress strong {
		font-size: 124%;
	}
	footer .companyAddress .address {
		font-size: 85%;
	}
	footer .companyAddress .address span {
		display: block;
	}
	footer small {
		margin: 30px auto;
		font-size: 77%;
	}
}

/* ------------------------------------
 * clearfix
 * ------------------------------------ */

.clearfix:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0.1em;
    content: ".";
    visibility: hidden;
}

