@charset "UTF-8";

/*
 *
 *	layout.css
 * 
 */ 

/* ! 共通
---------------------------------------------------------- */
html,body{
	font-size:62.5%;
	color:#000000;
	-webkit-text-size-adjust: none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	line-height:1;
	background-color:#c2ebff
}
img{
	max-width:100%;
	height:auto;
	vertical-align:bottom;
}
a{color:#000000;text-decoration:none;}
a:visited,a:hover,a:active,a:focus{color:#000000;}
strong{	font-weight:bold;}
.pc_block{display:block;}
.sp_block{display:none;}
.pc_txt-block{display:inline-block;}
.sp_txt-block{display:none;}
@media screen and (max-width:768px){
	.pc_block{display:none;}
	.sp_block{display:block;}
	.pc_txt-block{display:none;}
	.sp_txt-block{display:inline-block;}
}


.wrapper{
	width:1100px;
	margin:0 auto;
}
@media screen and (max-width:768px){
	.wrapper{
		width:100%;
	}
}


/* ! header
---------------------------------------------------------- */
header .logo_aera{
	padding:17px 0 15px 8px;
	background-color:#ffffff;
}
header .logo_aera img{
	height:36px;
}
header .mv{
	background:url(../img/bg_mv.png) repeat 0 0;
	padding-bottom:55px;
}
header .message{
	padding:34px 0;
	margin:45px auto 0;
	width:1000px;
	border-radius:8px;
	background-color:#ffffff;
}
header .message p{
	text-align:center;
	/* font-size:2.8rem;
	line-height:1.428;
	font-weight:bold; */
}
header .message p .txt_bl{
	color:#005bac;
}
header .message p .highlight{
	background-color:#fff600;
}
@media screen and (max-width:768px){
	header .logo_aera{
		padding:13px 0 10px 15px;
	}
	header .logo_aera img{
		height:23px;
	}
	header .mv{
		background:url(../img/bg_mv.png) repeat 0 0 /60px 37px;
		padding-bottom:28px;
	}
	header .message{
		padding:25px 0;
		margin:25px auto 0;
		width:90%;
		border-radius:6px;
	}
	header .message p{
		margin:0 auto;
		width:238px;
		/* font-size:1.8rem;
		line-height:1.388; */
	}
}


/* ! .inquiry
---------------------------------------------------------- */
.inquiry{
	padding:40px 240px 35px;
	background-color:#ffffff;
}
.inquiry h3{
	padding:6px 0;
	margin-bottom:20px;
	text-align:center;
	font-size:1.6rem;
	font-weight:bold;
	color:#005bac;
	line-height:1.2;
	border:solid 2px #005bac;
}

.inquiry .name{
	width:100%;
}
.inquiry .name p{
	font-size:1.8rem;
	line-height:1.555;
	font-weight:bold;
	text-align:center;
}
.inquiry .address{
	display:flex;
	align-items:center;
	margin: 0;
	padding: 0;
}

.inquiry .tel{
	width: 45%;
	margin-right: 30px;
}

.inquiry .tel a{
	display:block;
	cursor:default;
	pointer-events:none;
}
.inquiry .mail{
	display:flex;
	align-items:center;
	margin-top:10px;

}
.inquiry .mail dt{
	padding:5px 10px;
	margin-right:10px;
	color:#ffffff;
	font-size:1.4rem;
	font-weight: bold;
	background-color:#000000;
}
.inquiry .mail dd{
	font-size:1.6rem;
}
@media screen and (max-width:768px){
	.inquiry{
		padding:28px 5% 20px;
	}
	.inquiry h3{
		padding:7px 0;
		margin-bottom:10px;
		border:solid 1px #005bac;
	}
	.inquiry .name{
		width:100%;
	}
	.inquiry .name p{
		font-size:1.4rem;
	}
	.inquiry .address{
		display:block;
		padding-left:0;
		width:100%;
	}
	.inquiry .tel{
		width:100%;
	}

	.inquiry .tel a{
		margin:10px auto 0;
		width:205px;
		pointer-events:auto;
	}
	.inquiry .mail{
		justify-content:center;
	}
	.inquiry .mail dt{
		padding:3px 10px;
		font-size:1.1rem;
	}
	.inquiry .mail dd{
		font-size:1.5rem;
	}
}


/* ! footer
---------------------------------------------------------- */
footer{
	padding:25px 0;
	background-color:#098ac5;
}
footer p{
	color:#ffffff;
	text-align:center;
	font-weight:bold;
	font-size:1.4rem;
	line-height:1.4;
}



.address p{text-align: center;}

.link_btn{
	width: 100%;
	margin: 15px auto 8px;

}

.link_btn a{
  text-decoration: none;
  background: #000000;
  font-size:1.4rem;
  display: block;
  width: fit-content;
  color: #FFFFFF;
  padding: 16px 30px;
  display: flex;
  align-items: center;
  transition: .3s;     /*追加:マウスオーバー戻る時ゆっくりにする*/
  margin: 0 auto;
}
.link_btn a div.icon {
  border-bottom: 2px solid #FFFFFF;
  border-right: 2px solid #FFFFFF;
  width: 10px; 
  height: 10px;
  transform: rotate(-45deg);
  transition: .3s;　　　　　/*追加:マウスオーバー戻る時ゆっくりにする*/
}
.link_btn a div.text{
  padding-right: 14px;
}
/* -----ここから下 追加したところ----- */
.link_btn a:hover{
  background: #098ac5;     /*マウスオーバーで背景を白*/
  transition: .2s;　　　　　/*徐々に変化をつける*/
}
.link_btn a:hover div.icon{
  transform: translateX(20px) rotate(-45deg);　　　　　/*マウスオーバー時右に移動*/
  transition: .2s;　　　　　/*徐々に変化をつける*/
}





@media screen and (max-width:768px){
	footer{
		padding:15px 0;
	}
	footer p{
		font-size:1.2rem;
	}

.address p{
	text-align: center;
	font-size:1.2rem;
	}

.link_btn{
	width: 100%;
	margin: 15px 0 8px;

}

.link_btn a{
  text-decoration: none;
  background: #000000;
  font-size:1.4rem;
  display: block;
  width: fit-content;
  color: #FFFFFF;
  padding: 16px 30px;
  display: flex;
  align-items: center;
  transition: .3s;     /*追加:マウスオーバー戻る時ゆっくりにする*/
  margin: 0 auto;
}
.link_btn a div.icon {
  border-bottom: 2px solid #FFFFFF;
  border-right: 2px solid #FFFFFF;
  width: 10px; 
  height: 10px;
  transform: rotate(-45deg);
  transition: .3s;　　　　　/*追加:マウスオーバー戻る時ゆっくりにする*/
}
.link_btn a div.text{
  padding-right: 14px;
}
/* -----ここから下 追加したところ----- */
.link_btn a:hover{
  background: #098ac5;     /*マウスオーバーで背景を白*/
  transition: .2s;　　　　　/*徐々に変化をつける*/
}
.link_btn a:hover div.icon{
  transform: translateX(20px) rotate(-45deg);　　　　　/*マウスオーバー時右に移動*/
  transition: .2s;　　　　　/*徐々に変化をつける*/
}

}