@charset "utf-8";
/*******************************************************************
　基本設定
*******************************************************************/

/*----------------------------------------------------------
　全体
-----------------------------------------------------------*/
html {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 62.5%;/*10px相当*/
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
	line-height: 1.8;
	background: #FFF;
	color: #4c4c4c;
}
@media only screen and ( max-width: 599px ) {
	body {
		font-size: 1.4rem;
		line-height: 1.4;
	}
}
area{
	border:none;
	outline:none;
}

a:link, a:visited {
	color: #512d1e;
	text-decoration: none;
}
a:hover {
	color: #512d1e;
	text-decoration: none;
}
.cev_link a:link, a:visited {
	color:#2462B5;
	text-decoration: underline;
}
.cev_link a:hover {
	color:#2462B5;
	text-decoration: underline;
}
.text_left {
	text-align: left;
}
.text_fff {
	color: #fff;
}
.text_b {
  font-weight: 700;
}
/*******************************************************************
　ページ共通パーツ
*******************************************************************/

@media print, screen and (min-width:600px){
	.display_sp {display: none}
}
@media screen and (max-width:599px){
	.display_pc {display: none}
}

/*******************************************************************
　各セクション
*******************************************************************/
/*共通 ------------------------------*/
.contents {
	width: 100%;
	text-align: center;
	margin: 0 auto;
  background: url("../img/bg_body.png") center top;
  background-attachment: fixed;
  background-size: cover;
}
.container {
	width: 100%;
	max-width: 750px;
	margin: 0 auto;
}
/*----------------------------------------------------------
　ヘッダー 
-----------------------------------------------------------*/
header {
	position: relative;
	z-index: 0;
	width: 100%;
	margin: 0;
	padding: 0 0 6px;
	overflow: hidden;
  background: #fff;
}
.header_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 96%;
	max-width: 750px;
	margin: 0 auto;
}
.header_logo{
	width: 15%;
}
.header_logo img {
  max-width: 100px;
}

.header_name {
	text-align: right;
}
@media only screen and ( max-width: 599px ) {
	header {
		margin: 0 auto 0;
		padding: 5px 0 0;
	}
	.header_logo {
		width: 50%
	}
.header_logo img {
  max-width: 200px;
}
.header_name {
}
.header_name img {
	width: 80%;
	}
}

/*----------------------------------------------------------
　メインビジュアル
-----------------------------------------------------------*/
.main_wrapper {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  background: url("../img/bg_main.png") center top;
  box-shadow: -5px 0 10px rgba(0, 0, 0, 0.2), 5px 0 10px rgba(0, 0, 0, 0.2);
}

/*クリッカブルマップ*/
.image-map {
  position: relative;
  width: 100%;
  max-width: 750px; /* 任意 */
  margin: 0 auto;
}

.image-map img {
  width: 100%;
  height: auto;
  display: block;
}

.link-area {
  position: absolute;
  display: block;
  /* 透過で見えなくする */
  background-color: rgba(255, 0, 0, 0); /* テスト時に可視化 */
}

/* 座標は画像の比率で%で指定（例：画像上の位置） */
/*画像のサイズw750ｘh250*/
.btn_box .area1 {
  top: calc(145 / 250 * 100%);
  left: calc(70 / 750 * 100%);
  width: calc(610 / 750 * 100%);
  height: calc(95 / 250 * 100%);
}

.flowArea {
  padding-bottom: 5%;
}

/*----------------------------------------------------------
　フッター 
-----------------------------------------------------------*/
footer {
	width: 100%;
	z-index: 1000;
  background: #000;
}

.copy {
	width: 100%;
	padding: 1em 0;
	text-align: center;
}


/*----------------------------------------------------------
　非表示 
-----------------------------------------------------------*/
/* {
	display: none;
	height: 0;
	line-height: 0;
}
*/