@charset "utf-8";



/*==============================================

	共通

==============================================*/

html, body {

	margin: 0;

	padding: 0;

	height: 100%;

}

html {

	-webkit-text-size-adjust: 100%;

}

* {

	border: none;

	margin: 0;

	padding: 0;

	font-weight: inherit;

	font-size: inherit;

}

section{

	display: block;

}

.wrap{

	width: 100%;

  	min-height: 100%;

	overflow: hidden;

	position: relative;

}



body{

	font-size: 18px;

	font-weight: 600;

	font-family: "メイリオ","Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo",  Helvetica, sans-serif;

	letter-spacing: 1px;

  	text-align: center;

  	color: #4A2C07;

 	background: #fff;

}

main {

  	display: block;

}

h1,h2,h3,h4{

	margin: 0;

	padding: 0;

}

h2{

	font-size: 31px;

}

h3{

	font-size: 24px;

}

h4{

	font-size: 17px;

	line-height:1.9;

}

ul,li,dl,dt,dd {

	margin:0 auto;

	padding:0;

	list-style: none;

}

a{

	text-decoration: none;

	transition: all 0.6s ease;

}

.text-blue {

	color: #1479b9;

}

img {

	width: 100%;

	vertical-align: bottom;

  }

.pc-img{

	display: flex;
	justify-content: center;

}
.pc-img1{

	display: flex;
	justify-content: center;

}
.sp-img{

	display: none;

}

.btn{

	color: #fff;

	background-color: #f29219;

	font-size: 15px;

	font-weight: bold;

	margin: 5px 0;

	padding: 7px 30px;

	border-radius:8px;

}

a.btn:hover{

	color:#ffffff;

	background: #7e992e;

	

}

/*==============================================

	header

==============================================*/

/*----TOP header----*/

.header-area{
/*
	max-width: 1920px;

	height: 880px;

	background-image: url("../images/top/top01.jpg");

   	background-repeat: no-repeat;

   	background-position: center;

   	background-size: cover;

*/
}

.header-in{

	width: 98%;

	margin: 0 auto;

	padding-top: 15px;

}



.logo-area{

	display:flex;

	-webkit-justify-content: space-btween;

	justify-content: space-between;

}

.header-text{

	position: absolute;

	top: 300px;

	left: 0;

	right: 0;

}

.header-text img{

	margin-top: 20px;

}

.logo{

	position:absolute;
	top:5px;
	left:10px;
}

.tel{

	display: flex;
	
	position: absolute;

	top:5px;

	right:10px;

}

.header-text h2,.header-h2{

	width: 95%;

	margin: auto;

	text-align: center;

	font-size: 220%;

	line-height: 1.5em;

	font-weight: bold;

	text-shadow: 

	       2px  2px 1px #ffffff,

	      -2px  2px 1px #ffffff,

	       2px -2px 1px #ffffff,

	      -2px -2px 1px #ffffff,

	       2px  0px 1px #ffffff,

	       0px  2px 1px #ffffff,

	      -2px  0px 1px #ffffff,

	       0px -2px 1px #ffffff;  

}

.moji-l{

	font-size: 55px;

	padding: 0 5px;

	color: #ff9700;

}

.img-maru{

	max-width: 663px;

	max-height: 561px;

	position: absolute;

	top: 200px;

}

.pc-h{

	width: 95%;

	max-width: 720px;

	max-height: 97px;

	margin: auto;

	text-align: center;	

}

.sp-h{

	width: 95%;

	max-width: 429px;

	max-height: 140px;

	margin: auto;

	text-align: center;

	display: none;

}

.sp-br{

	display: none;

}

/*==============================================

	nav

==============================================*/

.gnav-area{

	background-color: #1479b9

}

ul.gnav{

	width: 100%;

	max-width: 1040px;

	height: 42px;

	display: flex;

	padding: 5px 0;



}

.gnav li{

	max-width: 173px;

	width: 100%;

	line-height: 2.5em;

	color: #fff;

	border-left: 1px solid #ffffff;

}

.gnav li a{

	width: 100%;

	height: 42px;

	color: #ffffff;

	font-size: 16px;

	position: relative;

	font-weight: bold;

	display: inline-block;

}

.gnav li a:hover{

	color: #f29219;

}

#nav1{

	border-left: none;

}

.nav-none{

	display: none;

}



/*==============================================

	サイドボタン

==============================================*/

#side-btn{

	position: fixed;

	bottom: 350px;

	right: 0px;

	font-size: 77%;

	z-index:1100;

}

#side-btn a img{

	margin: 0;

	border: 0;

	width: 22px;

}

#side-btn a{

	padding: 15px 5px;

	display: inline-block;

	width: 40px;

	margin-left: 10px;

	text-align: center;

	background-color: #1479b9;

	border-radius:5px 0 0 5px;

	color: #FFF;

	transition: all 300ms 0s ease;

}

#side-btn a:hover{

	padding-right:11px;

	margin-left:0;

}



/*==============================================

	下層ページのヘッダー設定

==============================================*/

/*---header---*/

.header-area-com{

	width: 100%;

/*	margin-bottom: 10px;*/

	background-color: #e5f2fa;

}

.logo-com{

	margin-top:30px;

}

.logo-com img{

	width: 80%;

}

.gnav-area-com{

	width:50%;

	margin-top:19px;

}

/*---nav---*/

ul.gnav-com{

	width: 100%;

	display: flex;

	margin-top: 20px;

}

.gnav-com li a{

	width: 100%;

	color: #452704;

	font-size: 15px;

	position: relative;

	font-weight: bold;

	display: inline-block;

}



.gnav-com li a::after{

	position: absolute;

	bottom: 0;

	left: 0;

	content: "";

	width: 100%;

	height: 2px;

	background: #ffa500;

	transform: scale(0, 1);

	transform-origin: center top;

	transition: transform .3s;

}

.gnav-com li a:hover::after{

	transform: scale(1, 1);

}

/*リンク３つ*/

.link-area{

	width: 350px;

}

.link1{

	position: relative;

	padding-top: 5px;

	width: 100%;

	max-width: 350px;

	box-sizing: border-box;

	border: 1px solid #1479b9;

	background: #fff;

}

.link1 a{

	color: #1479b9;

	margin: 0 auto 1px;

	width: 100%;

	text-align: center;

	text-decoration: none;

	transition: .3s;

	font-size: 24px;

	font-weight: bold;

	overflow: hidden;

	line-height: 1.3em;

}

.link-s{

	width: 300px;

	margin: 0 auto;

	margin-bottom: 5px;

	padding-bottom: 2px;

	font-size: 12px;

	border-bottom: 1px dashed;

	color: #1479b9;

}

.link1 img{

	position: absolute;

	top: 34px;

	left: 45px;

	width: 100%;

	max-width: 25px;

}



.link-area ul{

	display: flex;

}

.link2 a, .link3 a{

	display: block;

	color: #fff;

	background: #1479b9;

	padding: 7px;

	margin: 5px 0;

	width: 170px;

	text-align: center;

	text-decoration: none;

	transition: .3s;

	font-size: 15px;

	font-weight: normal;

	box-sizing: border-box;


}

.link2 a:hover, .link3 a:hover{

	background:#e5f2fa;

	color: #1479b9;
	
	border: 1px solid #1479b9;

}

.link3{

	margin-left: 7px;
	margin-bottom: 10px;

}



/*--title--*/

.main-title{

	width: 100%;

	height: 122px;

	background-color: #1479b9;

	margin-bottom: 26px;

	display: flex;

	justify-content: center;

	align-items: center;

}

.main-title h2{

	font-size: 35px;

	color: #fff;

}

/*---パンくずリスト---*/

.breadcrumbs {

	width: 97%;

	max-width: 1020px;/*1155px*/

	margin: 0 auto 40px;

}

.breadcrumbs ul {

 	display: flex;

	font-size: 14px;

	font-weight: bold;

/*	margin: 0 0 0 10px;*/

}

 

.breadcrumbs ul li {

    margin: 0 15px 0 0;

    font-size: 13px;

}

.breadcrumbs ul li a{

    color:#4A2C07;

}

/*2カラム設定*/

.main-com{

	display: flex;

/*	width: 90%;*/

	max-width: 1020px;/*1200px*/

	margin: 0 auto;

}

article{

	width: 100%;

}

aside{

	width: 234px;

	background-color: #fff;

	text-align: left;

	margin-left: 20px;

}

/*サイドナビ*/

.nav-title{

	background-color: #1479b9;

	padding: 10px 10px;

	font-size: 15px;

}

.sidenav ul{

	margin-bottom: 15px;

}

.sidenav ul:last-child {

	margin-bottom: 70px;

}

.sidenav li{

/*	border-bottom: 1px dashed #452704;*/

	padding: 10px 0;

	padding-left: 10px;

}

.sidenav li a{

	color: #452704;

	font-size: 15px;

	display: block;

	box-sizing: border-box;

	width: 95%;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

	margin-top: 3px;

}

.sidenav a:hover{

	color:#ffa500;

}

aside img{

	margin-top: 10px;

}



/*==============================================

	footer

==============================================*/

/* TOPへ戻るボタン*/

#totop{

	display: none;

	position: fixed;

	right: 5px;

	bottom: 110px;

}

#totop a{

	display: block;

	/*font-size: 0px;*/

	width: 65px;

	height: 65px;

	border:2px solid #1479b9;

	border-radius: 50%;

	text-align: center;

	background: #fff;

}

#totop a i{

	font-size: 25px;

	color: #1479b9;

	margin-top: 5px;

}

#totop a p{
	
	font-size: 21px;

	line-height: 1em;

	color: #1479b9;



}

/* footer内*/

.footer-area{

	background-color: #e5f2fa;

	margin: 0 auto;

	padding-bottom: 30px;

}

.footer-in{

	width: 100%;

	max-width:1040px;

	margin: 0 auto;

	padding-top: 20px;

}

/* ナビ*/

.f-nav{

	width: 90%;

	display: flex;

	margin: 0px 34px 50px 70px;

}

.f-nav li{

	font-size: 14px;

	font-weight: 600;

	border-right: 1px solid #1479b9;

	padding-right:35px;

}

.f-nav li:last-child{

	border-right: none;

}

.f-nav a{

	color: #1479b9;

}

.f-nav a:hover{

	color: #ff9700;

}

.f-box{

	text-align: center;

	margin-bottom: 20px;

}

.f-box p{

	margin: 0 auto;

	padding: 0;

	color: #1479b9;

	font-size: 13px;

	line-height: 1em;

}

.f-bold {

	color: #1479b9;

	font-size: 18px;

}

.vacation{

	margin-right: 5px;

	padding: 0 5px;

	background-color: #fff;

	color: #1479b9;

	font-size: 12px;

	border: 1px solid #1479b9;

}

.copy{

	font-size: 12px;

	color: #1479b9;

}



/*==============================================

	フェードイン

==============================================*/

.fadeInUp {

	opacity : 0;

	transform: translateY(20px);

	transition: 1s;

}
/*==============================================

	メディアクエリ

==============================================*/

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

	h2{

		font-size: 24px;

	}

	h3{

		font-size: 20px;

	}

	.sp-img{

		display: block;

		margin: 0 auto;

		margin-top: 20px;

	}
/*
	.header-area{

		height: 515px;

		background-image: url(../images/top/sp-top.png);

	}
*/
	.header-text{

		top: 130px;

	}

	.header-text h2,.header-h2{

		font-size: 150%;

	}

	.moji-l{

		font-size: 40px;

	}

}

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

	.logo img{

		width: 50%;

		position:absolute;

		top:1.5%;

	}

	#side-btn{

		display: none!important;

	}

	.sp-br{

		display: block;

	}


	/*.service_naiyou {

		width: 85%;

	}
	*/

	.map-text{

		top:25%;

		right: 20px;

		font-size: 25px;

		line-height: 1.2em;

	}

	.moji-s{

		font-size: 12px;

	}

}

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

	aside{

		display:none;

	}

}

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

	aside{

		display:none!important;

	}

}

/*ハンバーガーメニュー*/

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

	/*ボタン設定*/

	#navbtn {

		transition:all 0.5s;

		width:40px; height:40px;

		background:#e5f2fa;

		position:fixed;

		right:10px;

		top:10px;

		cursor:pointer;

		z-index:2000;

	}

	#navbtn span {

		width:30px;

		height:2px;

		background:#1479b9;

		position:absolute;

	}

	#navbtn span:nth-child(1) { transition:all 0.2s; left:5px; top:11px; }

	#navbtn span:nth-child(2) { left:5px; top:19px; }

	#navbtn span:nth-child(3) { transition:all 0.2s; left:5px; top:27px; }



	.open span:nth-child(1) { transform:translateY(8px) rotate(45deg); }

	.open span:nth-child(3) { transform:translateY(-8px) rotate(-45deg); }

	.open span:nth-child(2) { top:17px; opacity:0; }

	/*ナビ部分の設定*/

	nav.gnav-area{

		transition:all 0.5s;

		width:414px; height:100%;

		position:fixed;

		right:-414px;

		top: 0px;

		background:#e5f2fa;

		padding-top:0px;

		z-index:1999;

	}

	/*開くときの動き*/

	.opennav { transform:translateX(-414px); }

	/*問い合わせクリック時閉じる*/

	.closenav { transform:translateX(414px); }

	/*ナビの文字部分*/

	ul.gnav, ul.gnav-com{ 

		display:block; 

		flex-direction: column;

		margin-top:50px;

	}

	.gnav li{ 

		max-width: 100%;

		height: 45px;

		border-left:none;

		border-right:none;

		border-bottom: dashed 1px #1479b9;

		text-align:center;

		font-size: 18px;

	}

	.gnav li a{

		display:inline-block;

		margin: 0px 0;

		padding: 0 auto;

		color:#1479b9;

		font-size:100%;

	}

	.gnav li a:hover{

		color:#f29219;

	}

	/*下層ページナビ*/

	nav.gnav-area-com{

		transition:all 0.5s;

		width:414px;

		height:100%;

		margin-top: 0;

		position:fixed;

		right:-414px;

		top:0px;

		background:#e5f2fa;

		padding-top:0px;

		z-index:1999;

	}

	.gnav-com li{ 

		max-width: 100%;

		height: 45px;

		border-left:none;

		border-right:none;

		border-bottom: dashed 1px #1479b9;

		text-align:center;

		font-size: 18px;

	}

	.gnav-com li a{

		display:inline-block;

		margin:10px 0;

		padding:0;

		color:#1479b9;

		font-size:100%;

	}

	.gnav-com li a:hover{

		color:#f29219;

		border:none;

	}

	

	.nav-none{

		display:block;

	}

	.f-nav, .tel, .link-area, .gnav-com li a::after{

		display:none;

	}

	article{

		margin: 0 auto;

	}

}