
.sp,
#header #btn_sp_menu{
	display: none !important;
}
#header #btn_sp_menu span{
	display: none !important;
}

body.menu-open{
	overflow: hidden;
}


@media (max-width: 992px) {
	.sp,
	#header #btn_sp_menu{
		display: block !important;
	}

	.content.bg-lg {
		padding:2rem 0;
	}
	h2 small {
		padding-top: 1rem;
		margin-top: 1rem;
	}

	#header .btn{
		font-size: 1rem;
		color: var(--main);
	}
	#header .btn.blue{
		color: var(--white);
	}
	#header .btn.blue::after{
		color: var(--white);
	}
	#header .btn .fas,
	#header .btn .fa{
		display: none;
	}


	#mainvisual{
		margin-bottom: 1rem;
	}
	.content {
		padding-bottom: 2rem;
	}

	#header #btn_sp_menu{
		display: inline-block;
		padding: 1rem;
		height: 60px;
		position: absolute;
		top:0;left:0;
		color: #666;
	}
	#menu{
		z-index: 1001;
		position: fixed;
		top: 0; left: -100%;
		width: 100%;
		height: 100%;
		overflow: auto;
		padding-right: 10%;
		background: rgba(0,0,0,0);
		transition: left 0.15s, background-color 0.5s;
	}
	.menu-open #menu{
		left: 0;
		background: rgba(0,0,0,0.5);
	}
	#menu li{
		display: block !important;
		margin: 0;
	}
	#header ul{
		display: block;
		margin: 0 !important;
		padding: 0;
		background: none !important;
		border: none;
	}

	#header ul.sp{
		margin-top: 0 !important;
	}
	#header ul.sp a{
		text-decoration: none;
		color: #666;
		background: #FFF;
	}

	#menu li:not(.has_child) > a::after{
		content: none;
	}

	#menu .btn:not(.outline){
		color:var(--white);
		background: var(--primary_color);
	}



	#header #btn_sp_menu_close{
		text-align: center !important;
		border: none;
		color: var(--white);
		background: var(--main);
	}


	#header .sub_menu{
		position: relative;
		display: block;
		top:auto; left: auto;
		background: #CCC;
		border: none;
		visibility: visible;
		box-shadow: none;
		margin: 0;
		padding: 0;
		opacity: 1;
		transform:none;
	}

	#header li.has_child:hover:after,
	#gnavi .has_child:after{
		border:none;
		bottom: unset;
		left: unset;
		top:1.75rem;
		right: 1rem;
	}
	#header #menu a{
		text-align: left;
		border-radius: 0;
		border-top: 1px solid var(--line_general);
	}
	#header #menu .has_child>a{
		border-top: none;
	}

	#gnavi li>a{
		background: var(--contents_back_dark_600);
	}


	#header li a{
		padding: 20px !important;
	}
	#header .sub_menu a{
		color: #666 !important;
		background: #FFF !important;
	}
	#header #menu a::after{
		font-size: 1rem;
		line-height: 1rem;
		color: var(--main);
		position: absolute;
		top: 50%; right: 1rem;
		left:unset;
		margin-top: -0.5rem;
		height: 0;
		width: auto;
		background: none;
	
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		content: "\f105";
	}

	#header #menu .has_child> a::after{
		content: none;
	}




	#header .btn{
		border: none;
	}
	#header .btn:hover{
		opacity:1;
	}

	#header a.disabled{
		display: none;
	}



	.inner,.inner.s,
	.inner,.inner.m{
		width: 92%;
		padding: 0;
	}
	.pankuzu{
		width: 92%;
		font-size: 0.8rem;
		padding: 1rem 0;
	}
	.pankuzu li:not(:last-child):after{
		top:0;
	}

	.sp{
		display: block;
	}
	body,
	body.page_link_fixed{
		padding-top: 60px;
	}

	.page_link>.fa {
		position: absolute;
		top: 0.2rem; left: -28px;
		font-size: 24px;
		color: #FFF;
		cursor: pointer;
		padding: 2px;
		width: 28px;
		text-align: center;
		background-color: #00539C;
		/*border-radius: 14px 0 0  14px;*/
	}

	.page_link.page_link_open>.fa {
		/* border-radius: 0 14px 14px 0; */
		transform: rotate(180deg);
	}


	.page_link,
	.page_link.fixed{
		position: fixed;
		z-index: 999;
		top:60px; right:-70%;
		margin: 0;
		width: 70%;
		background: var(--primary_color);
		transition:0.5s;
	}

	.page_link.page_link_open{
		right: 0;
	}


	.page_link .inner {
		display: block;
		width: 100%;
	}
	.page_link.fixed a,
	.page_link a{
		display: block;
		width: 100%;
		color: var(--white);
		background: var(--sub_gradient);
		margin: 0;
		text-align: left;
		padding:0.75rem 2rem 0.75rem 1rem;
		border: none;
		border-bottom:1px solid #FFF;
	}
	
	.page_link a::after,
	.page_link.fixed a::after {
		content: none;
	}

	.page_link a::before,
	.page_link.fixed a::before {
		color: var(--white);
		left:unset;

		right: 1rem;
		bottom: 1rem;
		transform: rotate(-90deg);
	}

	.page_link.fixed a:hover,
	.page_link a:hover{
		color: var(--white);
		border: none;
		border-bottom:1px solid #FFF;
	}
	.page_link a:hover:after{
		color: var(--white);
	}


	#header{
		position: fixed;
		top:0;
		text-align: center;
		height: 60px;
	}
	#header .inner{
		padding: 0;
		width: 100%;
	}
	#header .logo{
		position: relative;
		padding: 0;
	}
	#header a.logo {
		padding: 10px;
		margin: 0 auto;
	}


	#mainvisual{
		height: 400px;
	}
	.swiper-slide img{
		height: 100%;
		width: auto;
	}
	.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
		bottom:15px  !important;
	}

	.twitter-timeline{
		margin: 0 auto;
	}

}

@media (max-width: 767px) {

	h2,h3{
		margin: 0.5rem 0 1.5rem 0;
		padding: 0;
	}

	h2{
		font-size: 1.6rem;
	}
	h3{
		font-size: 1.4rem;
		padding-left: 40px;
		margin-bottom: 1rem;
	}
	h4,
	form h4{
		font-size: 1.2rem;
	}
	.content .description{
		font-size: 1rem;
		line-height: 1.5rem;
		text-align: left;
	}




	.content .row{
		margin-bottom: 0;
	}

	.row > div[class^="col"]{
		margin-bottom: 0;
	}
	#footer .row > div[class^="col"]{
		margin-bottom: 0;
	}
	.content {
		padding-bottom: 2rem;
	}
	.content .banner {
		margin: 20px -5px 0 -5px;
	}
	.banner li{
		width: 50% !important;
		padding: 0 5px;
		margin-bottom: 10px;
	}

	.news dl dt {
		float: none;
		margin-bottom: 0.5rem;
	}
	.news dl dd {
		margin: 0 3rem 0 0;
	}
	#mainvisual{
		height: 300px;
	}
	.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
		bottom:10px  !important;
	}


	.content table {
		width: 100%;
	}
	.content th,
	.content td {
		display: block;
		width: 100% !important;
		padding: 0.5rem;
	}
	.content th{
		font-weight: bold;
		text-align: left;
		padding-bottom: 0 !important;
		border: none !important;
	}
	.content td {
		border: none;
	}

	.bg>.bg1{
		left: 20%;
		width: 60%;
		transform: skewX(7deg);
	}
	.bg>.bg2{
		left: 20%;
		width: 60%;
		transform: skewX(-7deg);
	}



	.content .qa dt{
		margin: 1rem 0 0 2rem;
	}
	.content .qa dd{
		margin: 1rem 2rem 0 0;
	}


	form > dl{
		padding-top: 0;
	}

	form > dl dt{
		float: none;
		width: 100%;
	}
	form > dl dd{
		width: 100%;
		padding-left: 0;
	}


	.box,
	.box2 {
		padding: 1rem;
	}


	form .form-action a,
	form .form-action button{
		display: block;
		width: 100%;
		margin-bottom: 0.5rem;
	}

	.btn{
		white-space: unset;
	}

	ul.sns li img{
		max-width: 40px;
		height: auto;
	}
	ul.sns li a{
		padding: 0 1rem;
	}
}

@media (max-width: 460px){
	dl.bunya dt i{
		display: block;
	}
	.row > div:last-child {
		margin-bottom: 0;
	}

	#mainvisual{
		height: 200px;
	}
	.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
		bottom:0  !important;
	}
	.content .banner {
		margin: 20px 0 0 0;
	}
	.banner li{
		float: none;
		width: 100% !important;
		padding: 0 !important;
	}


}