/* ---------------------------------------------------------------
	start max 850px
--------------------------------------------------------------- */

@media print,screen and ( max-width: 990px ) {

	body {
		font-size: 15px;
		line-height: 1.75;
		max-width: 990px;
		background-color: #ffffff;
	}


	/* --------------- header -------------- */


	.top_logo {
		display: none;
		border-bottom: none;
	}

	#header {
		height: 74px;
		z-index: 100;
	}

	.col_header {
		height: 100%;
		padding: 0 1%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		align-items: center;
		background-color: #47afd9;
	}

	.logo_header {
		width: calc(100% - 74px);
		padding: 0;
		height: 74px;
		background-color: #47afd9;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		   -ms-flex-align: center;
		      align-items: center;
					z-index: 2;
	}

	.logo_header a {
		margin: 0;
		padding-left: 15px;
	}

	.logo_header img {
		max-width: 570px;
	}
	
	
	
	#menubtn {
		width: 50px;
		height: 50px;
		margin: 0 0 0 auto;
		padding: 0;
		display: block;
		background-color: #000;
		position: relative;
		z-index: 2;
	}

	#menubtn.active {
		background-color: #000;
	}

	#menubtn .btn {
		width: 36px;
		height: 100%;
		margin: 0 auto;
		position: relative;
		z-index: 0;
	}

	#menubtn .btn span {
		width: 100%;
		height: 3px;
		margin: auto;
		padding: 0;
		background-color: #fff;
		display: inline-block;
		-webkit-transition: all .4s;
		position: absolute;
		left: 0;
		right: 0;
	}

	#menubtn span:nth-child(1) {
		top: 11px;
	}

	#menubtn span:nth-child(2) {
		top: 24px;
	}

	#menubtn span:nth-child(3) {
		top: 37px;
	}


	#menubtn.active span:nth-of-type(1) {
		width: 96%;
		transform: translateY(20px) rotate(-45deg);
		top: 3px;
	}

	#menubtn.active span:nth-of-type(2) {
		opacity: 0;
	}

	#menubtn.active span:nth-of-type(3) {
		width: 96%;
		transform: translateY(-20px) rotate(45deg);
		top: 43px;
	}

	#menubtn .btn {
		width: 33px;
	}




	nav {
		width: 100%;
		height: 100vh;
		margin: 0;
		padding: 0;
		background-color: #e4f4fd;
		position: fixed;
		top: 74px;
		right: 0;
		z-index: 100;
		display: none;
		box-shadow: none;
		overflow: auto;
	}

	#navi {
		width: 100%;
		max-width: 100%;
		margin: 0 0 20px 0;
		/*margin-bottom: 150px;*/
		overflow: auto;
	}

	#navi li {
		background: #e4f4fd;
		border-radius: 0px;
		border-bottom: 1px solid #dcdddd;
		margin: 0;
	}
	
		#navi li a, #navi li div {
		padding: 10px 19px 8px 19px;
		font-size: 15px;
	}

	#navi li:before {
		content: '';
		position: absolute;
		right: 15px;
		top: 17px;
		width: 8px;
		height: 8px;
		border-top: 2px solid #000000;
		border-right: 2px solid #000000;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	#navi li.active::before {
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
	}

	#navi li::after {
		width: 100%;
		height: 2px;
		left: 0;
		background: #DCDDDD;
	}

	#navi li:last-of-type::after {
		content: "";
	}

	#navi li a {
		justify-content: flex-start;
	}



	.col_navi {
		width: 100%;
		height: calc(100vh - 60px);
		top: 60px;
		background-color: #fff;
		overflow-y: scroll;
	}



	#contents {
	/*
		position: relative;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		   -ms-flex-direction: column;
		       flex-direction: column;
		       */
	max-width: 1260px;
	width: 100%;
	}




	#leftcontents {
		width: 100%;
		padding: 0;
		float: none;
		-webkit-box-ordinal-group: 2;
		           -ms-flex-order: 1;
		                    order: 1;
	}

	#rightcontents {
		width: 100%;
		float: none;
		background-color: #fff;
		-webkit-box-ordinal-group: 1;
		           -ms-flex-order: 0;
		                    order: 0;
		            
	}



	#rightcontents.single {
		min-height: auto;
		background-size: 100%;
		padding: 27px 30px;
	}


#rightcontents.sub {
		width: 100%;
		margin: 0;
		padding: 0;
	}

	.bg_content {
		width: 100%;
		margin: 0;
		padding: 25px 3% 6%;
	}

	.mds1 {
		width: 100%;
		text-align: center;
	}
	
	
	.col_topmain{
		max-width: 100%;
		background-size: 100%;
		height: 85vw;
	}

	.img_topinfo1{
		width: 70%;
		margin: 0 auto;
		padding: 58% 0 0 0;
	}
	
	
	.wrap_topnews {
		margin: 25px auto 25px;
		padding: 0 0 0;
		max-height: initial;
	}

	.box_topnews {
		width: 100%;
		max-width: 100%;
		margin: 0 0 0;
		padding: 15px;
	}

	.col_topnews {
		max-height: 135px;
		padding: 0 20px 10px 0;
	}

	.col_topnews dl {
		padding: 10px;
		font-size: 15px;
	}


	.wrap_contents {
		max-width: 100%;
		min-height: 500px;
		margin: 0;
	}

	.mds1 {
		max-width: 100%;
	}

	.mds2 {
		width: 96%;
		max-width: 96%;
		margin: 0 auto 8px;
		font-size: 20px;
	}

	.col_content {
		width: 98%;
		max-width: 100%;
		margin: 0 auto 30px;
		padding: 0 15px 0;
	}

	#overlay {
		width: 100%;
		height: 100%;
		/*background: rgba(0,0,0,.6);*/
		position: fixed;
		top: 0px;
		left: 0;
		right: 0;
		bottom: 0;
		display: none;
		z-index: 1;
		transition: all .4s;
	}

	.open #overlay {
		display: block;
	}


	footer .col_footer {
		padding: 12px 0 13px 0;
		width: 86%;
	justify-content: center;
	}

	.copy {
		font-size: 12px;
	}



}

/* ---------------------------------------------------------------
	end max 990px
--------------------------------------------------------------- */
