@charset "utf-8";
@import url("/css/navi.css");

/*************************リセット*************************/
.clearfix:after {
	content			: "" ;
	display			: block ;
	clear			: both ;
}

.clearfix	{
	display			: block ;
}

* html .clearfix {
	height			: 1% ; 
}

html	{
	background		: none ;
	position		: relative ;
	width			: 100% ;
	height			: 100% ;
	margin			: 0;
	padding			: 0;
}

body	{
	width			: 100% ;
	height			: 100% ;
	padding			: 0 ;
	margin			: 0 ;
	font-family		: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif ;
	font-size		: 14px ;
	font-weight		: normal ;
	line-height		: 1.5 ;
	color			: #000000;
	-webkit-text-size-adjust: 100%;
	position: relative;
	z-index: 1;
}

a img	{
	border			: none ;
}

a:hover img{
	transition-duration	: 0.5s;
	opacity			: 0.6;
	filter			: alpha(opacity=60);
	 -moz-opacity		: 0.6;
}

a, a:hover	{
	text-decoration		: none ;
	color 			: #000;
}

form{
	margin			: 0 ;
	padding			: 0 ;
}

.visi_text{
	visibility		: hidden ;
}

.text-indent_text{
	text-indent		:-9999px;
}



/*************************ヘッダー*************************/
.header{
	width: 100%;
	height: 56px;
	padding: 22px 0;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #fff;
	z-index: 10;
}

.head{
	width: 1080px;
	margin: 0 auto;
}
.head_box{
	width: 1080px;
	margin: 0 auto;
	display: inline-block;
}

.logo{
	width: 250px;
	height: 56px;
	float: left;
}
.logo img{
	width: 250px;
	height: 56px;
}
.logo h1{
	width: 250px;
	line-height: 56px;
	margin: 0;
	padding: 0;
	font-size: 12px;
}

.menu_area{
	width: 604px;
	padding: 22px 0;
	float: right;
}

/****メニュー****/

.menu_box01{
	width: 120px;
	height: 30px;
	border-right: solid 1px #000;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	float: left;
}
.menu_box01 span{
	font-size: 10px;
}
.menu_box01 a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
.menu_box01 a:before{
	content: "";
	position: absolute;
	 left: 0;
	bottom: 15px;
	width: 100%;
	height: 10px;
	background: rgba(48,175,245,0.5);
	transform: scale(0, 1);
	transform-origin: left;
	transition: 0.4s;
}
.menu_box01 a:hover:before {
	transform: scale(1);
}

.menu_box02{
	width: 120px;
	height: 30px;
	border-right: solid 1px #000;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	float: left;
}
.menu_box02 span{
	font-size: 10px;
}
.menu_box02 a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
.menu_box02 a:before{
	content: "";
	position: absolute;
	 left: 0;
	bottom: 15px;
	width: 100%;
	height: 10px;
	background: rgba(48,175,245,0.5);
	transform: scale(0, 1);
	transform-origin: left;
	transition: 0.4s;
}
.menu_box02 a:hover:before {
	transform: scale(1);
}

.menu_box03{
	width: 120px;
	height: 30px;
	border-right: solid 1px #000;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	float: left;
}
.menu_box03 span{
	font-size: 10px;
}
.menu_box03 a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
.menu_box03 a:before{
	content: "";
	position: absolute;
	 left: 0;
	bottom: 15px;
	width: 100%;
	height: 10px;
	background: rgba(48,175,245,0.5);
	transform: scale(0, 1);
	transform-origin: left;
	transition: 0.4s;
}
.menu_box03 a:hover:before {
	transform: scale(1);
}

.menu_box04{
	width: 120px;
	height: 30px;
	border-right: solid 1px #000;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	float: left;
}
.menu_box04 span{
	font-size: 10px;
}
.menu_box04 a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
.menu_box04 a:before{
	content: "";
	position: absolute;
	 left: 0;
	bottom: 15px;
	width: 100%;
	height: 10px;
	background: rgba(48,175,245,0.5);
	transform: scale(0, 1);
	transform-origin: left;
	transition: 0.4s;
}
.menu_box04 a:hover:before {
	transform: scale(1);
}

.menu_box05{
	width: 120px;
	height: 30px;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	float: left;
}
.menu_box05 span{
	font-size: 10px;
}
.menu_box05 a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
.menu_box05 a:before{
	content: "";
	position: absolute;
	 left: 0;
	bottom: 15px;
	width: 100%;
	height: 10px;
	background: rgba(48,175,245,0.5);
	transform: scale(0, 1);
	transform-origin: left;
	transition: 0.4s;
}
.menu_box05 a:hover:before {
	transform: scale(1);
}

/****メニュー****/

/****ボタン****/
.btn_box{
	width			: 200px;
	margin			: 0 auto 100px;
}

.btn a{
	width			: 180px;
	height			: 22px;
	padding			: 10px;
	margin			: 0 auto 50px;
	font-size		: 16px;
	line-height		: 20px;
	border			: solid 1px #00538b;
	background-color	: #fff;
	color			: #00538b;
	text-align		: center;
	display			: inline-block;
	border-radius		: 50px;
}

.btn a:hover{
	transition-duration	: 0.5s;
	color			: #fff;
	background-color	: #00538b;
}

.btn a:hover span{
	transition-duration	: 0.5s;
	color			: #fff;
}

.btn span{
	color			: #00538b;
	position		: relative;
	display			: inline-block;
	width			: 180px;
}

.btn span::before{
	content			: "";
	position		: absolute;
	top			: 50%;
	left			: 170px;
	width			: 7px;
	height			: 7px;
	border-top		: 2px solid #00538b;
	border-right		: 2px solid #00538b;
	transform		: rotate(45deg);
	margin-top		: -5px;
}

.btn a:hover span::before{
	transition-duration	: 0.5s;
	border-top		: 2px solid #fff;
	border-right		: 2px solid #fff;
}

.btn_box02{
	width			: 200px;
	margin			: 0 auto 30px;
}

/*************************フッター*************************/
#page-top {
    position		: fixed;
    bottom			: 60px;
    right			: 20px;
    opacitye		: 0.8;
    cursor			: pointer ;
    z-index			: 9999 ;
}
#page-top img {
    width			: 50px ;
    height			: 50px;
}


.footer{
	width: 100%;
	padding: 10px 0;
}

.foot{
	width: 905px;
	margin: 0 auto 10px;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}

.foot_menu{
	width: 150px;
	padding: 1px 0;
	text-align: center;
	font-size: 13px;
	border-right: solid 1px #000;
}
.foot_menu:last-child {
	border-right: none;
}

.copy{
	width: 100%;
	font-size: 10px;
	padding: 5px 0;
	text-align: center;
}
.copy span{
	font-size: 11px;
}



/****共通****/
.content_tit{
	width: 100%;
	text-align: center;
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 10px;
}

.content_tit_under{
	width: 40px;
	height: 5px;
	background-color: #000;
	margin: 0 auto 30px;
}

.content_tit_under02{
	width: 40px;
	height: 5px;
	background-color: #000;
	margin: 0 auto 30px;
}


/*■■■■■■■■■■■■■■■■SP■■■■■■■■■■■■■■■■*/

@media screen and (max-width:639px) {
/*　639pxまで　*/

/*************************ヘッダー*************************/
.header{
	width: 90%;
	height: 56px;
	padding: 22px 5%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #fff;
	z-index: 10;
}

.head{
	width: 100%;
	margin: 0 auto;
}
.head_box{
	width: 100%;
	margin: 0 auto;
	display: inline-block;
}

.logo{
	width: 250px;
	height: 56px;
	margin: 0 auto;
}
.logo img{
	width: 250px;
	height: 56px;
}
.logo h1{
	width: 250px;
	line-height: 56px;
	margin: 0;
	padding: 0;
	font-size: 12px;
}

.menu_area{
	display: none;
}

.sp_head{
	width: 90%;
}

.sp_menu{
	width: 36px;
}

/*************************フッター*************************/
#page-top {
    position		: fixed;
    bottom			: 60px;
    right			: 20px;
    opacitye		: 0.8;
    cursor			: pointer ;
    z-index			: 9999 ;
}
#page-top img {
    width			: 50px ;
    height			: 50px;
}


.footer{
	width: 100%;
	padding: 10px 0;
}

.foot{
	width: 100%;
	margin: 0 auto 10px;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}

.foot_menu{
	display: none;
}
.foot_menu:last-child {
	border-right: none;
}

.copy{
	width: 100%;
	font-size: 10px;
	padding: 5px 0;
	text-align: center;
}


}

/*************************フッター*************************/

/*■■■■■■■■■■■■■■■■PC■■■■■■■■■■■■■■■■*/
@media screen and (min-width: 640px) {
/* 　640pxから　 */
.pcnone{
	display: none;
}
.sp_head{
	display: none !important;
}
.sp_menu{
	display: none;
}

}