@charset "utf-8";

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

  all commom

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

*{
    margin: 0 ;
    padding: 0 ;
}
html{
    font-size: 62.5% ;
}
body{
    font-size: 1.5rem ;
    color: #000 ;
    line-height: 1em ;
    font-family: YuGothic , "游ゴシック", "Yu Gothic Medium" , "游ゴシック体", 'Hiragino Kaku Gothic Pro', Meiryo , sans-serif ;
	font-weight: 600 ;
	position: relative ;
	padding-top: 5px ;
}
body::before{
	position: absolute ;
	content: " ";
	height: 5px ;
	width: 100% ;
	background-color: #000 ;
	top: 0 ;
}
@media (max-width: 991px){
    body{
        font-size: 1.3rem ;
    }
}
.clearfix{
    zoom:1;
}
.clearfix:after {  
    content: ".";   
    display: block;   
    height: 0;   
    clear: both;   
    visibility: hidden;  
    overflow: hidden;/* 隙間対応 */
    font-size: 0.1em;/* 隙間対応 */
    line-height: 0;/* 隙間対応 */
}
a,
button{
	transition: all 0.3s ;
}
a:hover,
button:hover{
	cursor: pointer ;
}
a:hover,
a:focus{
    text-decoration: none ;
    outline: none ;
}
ul,li{
	list-style-type: none ;
	margin-bottom: 0 ;
}
img.img_responsive{
	max-width: 100% ;
}



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

header

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

#header{
	
}
#header .container{
	position: relative ;
	background-image: url(../images/img_top_head_l.jpg) , url(../images/img_top_head_r.jpg) ;
	background-position: left bottom , right bottom ;
	background-repeat: no-repeat ;
	padding-bottom: 10px ;
	min-height: 230px ;
}
#header .btn_smalc{
	position: absolute ;
	top: 25px ;
	right: 15px ;
}
#header .btn_smalc a{
	background-color: #2379c9 ;
	color: #fff ;
	padding: 7px 20px ;
	border-radius: 20px ;
}
#header .h1{
	padding-top: 30px ;
	width: 100% ;
	max-width: 540px ;
	text-align: center ;
	margin-left: auto ;
	margin-right: auto ;
	margin-bottom: 20px ;
}
@media (max-width: 991px){
	#header .container{
		background-size: 32% ;
	}
	#header .h1{
		max-width: 450px ;
	}
}
@media (max-width: 767px){
	#header .container{
		background-size: 160px ;
	}
	#header .btn_smalc{
		display: none ;
	}
	#header .h1{
		margin-bottom: 10px ;
		max-width: 300px ;
	}
}


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

navbar

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

#glovalnav{
	margin-bottom: 30px ;
	height: 65px ;
}
#glovalnav .container{
	transition: all 0.3s ;
	max-width: 100% ;
}
#glovalnav .navbar{
	padding: 0 ;
	border-radius: 20px ;
	background-color: #fff ;
	border: 2px #000 solid ;
	box-shadow: 5px 5px 0 rgba(0, 0, 0, 0.12) ;
	transition: all 0.3s ;
	z-index: 150 ;
	max-width: 1120px ;
	margin-left: auto ;
	margin-right: auto ;
}
#glovalnav .navbar .navbar-nav{
	display: flex ;
	justify-content: space-evenly;
	width: 100% ;
}
#glovalnav .navbar .navbar-nav .nav-item{
	flex: 1 ;
	text-align: center ;
	padding: 0 ;
	width: 100% ;
	display: block ;
	padding: 20px 5px ;
}
#glovalnav .navbar .navbar-nav .nav-item:hover{
	opacity: 0.5 ;
}
#glovalnav .navbar .navbar-nav .nav-item img{
	max-width: 100% ;
}
#glovalnav .navbar .navbar-nav .nav-item.home{
	max-width: 50px ;
	text-align: right ;
}
#glovalnav .container.scrol{
	position: fixed ;
	top: 0 ;
	z-index: 100 ;
}
#glovalnav .container.scrol .navbar{
	border-top: 0 ;
	border-radius: 0 0 20px 20px ; 
}
#glovalnav .container.scrol .navbar .nav-item{
	padding: 17px 5px ;
}
.navbar-toggler{
	padding: 15px ;
	width: 100% ;
	font-size: 1.8rem ;
	font-weight: bold ;
}
.navbar-toggler::after{
	content: "\f13a" ;
	font-family: 'Font Awesome 5 Free' ;
	float: right ;
}
@media (max-width: 991px){
	#glovalnav .navbar{
		border-radius: 15px ;
		background-color: #ffe63e ;
	}
	#glovalnav .navbar .navbar-nav{
		flex-wrap: wrap ;
		flex-direction: unset;
	}
	.navbar-collapse{
		background-color: #fff ;
		border-radius: 0 0 13px 13px ;
	}
	#glovalnav .container.scrol .navbar{
		border-radius: 0px 0px 15px 15px ;
	}
	#glovalnav .container.scrol .navbar-collapse{
		border-radius: 0 0 15px 15px ;
	}
	#glovalnav .navbar .navbar-nav .nav-item,
	#glovalnav .container.scrol .navbar .nav-item{
		width: 50% ;
		flex: none ;
		border-bottom: #dbdbdb 1px solid ;
		padding: 15px ;
	}
	#glovalnav .navbar .navbar-nav .nav-item img{
		height: 17px ;
	}
	#glovalnav .navbar .navbar-nav .nav-item:nth-child(even){
		border-left: #dbdbdb 1px solid ;
	}
	#glovalnav .navbar .navbar-nav .nav-item.home{
		max-width: none ;
		text-align: center ;
	}
}



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

footer

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

#footer{
	position: relative ;
}
#footer::before{
	position: absolute ;
	content: " ";
	height: 5px ;
	width: 100% ;
	background-color: #000 ;
	top: 0 ;
}
ul.sitemap{
	text-align: center ;
	padding-top: 30px ;
	margin-bottom: 30px ;
}
ul.sitemap li{
	display: inline-block ;
	border-right: #ddd 1px solid ;
}
ul.sitemap li:last-child{
	border: 0 ;
}
ul.sitemap li a{
	padding: 0 25px ;
	color: #000 ;
}
ul.sitemap li a:hover{
	color: #ffe63e ;
}
p.shinko{
	text-align: center ;
	margin-bottom: 15px ;
}
address{
	background-color: #ffe63e ;
	width: 100% ;
	padding: 20px 0 ;
	line-height: 1em ;
	margin: 0 ;
	text-align: center ;
	font-size: 0.9em ;
}


@media (max-width: 767px){
	ul.sitemap{
		margin-bottom: 10px ;
	}
	ul.sitemap li{
		display: block ;
		border-right: 0 ;
		border-bottom: #ddd 1px solid ;
	}
	ul.sitemap li{
		padding: 15px ;
	}
}

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

pagetop

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

#pagetop{
	position: fixed;
	display: none ;
	bottom: 30px ;
	right: 30px ;
	z-index: 100 ;
}
#pagetop a:hover{
	opacity: 0.7 ;
}
@media (max-width: 767px){
	#pagetop{
		display: none !important ;
	}
}