﻿.outframe
{
	display: grid;
	grid-template-columns: repeat(1, auto);
	grid-template-rows: 150px auto 150px;
	grid-gap: 2px 2px;
	/*background-color: #f0ffff;*/
}
.main
{
	display: grid;
	grid-template-columns: 1fr minmax(800px, 6fr) 1fr;
	grid-template-rows: minmax(1000px, 1fr);
	grid-gap: 2px 2px;
}
.main-item
{
	background-color: #284f8f;
}

.middle-item-1
{
	background-color: rgba(0.44,0.573,0.76, 0.1);
}

.middle-item-last
{
	background-color: rgba(0.44,0.573,0.76, 0.1);
}
 
.item
{
	place-self: stretch stretch;
}

 /*居中内容*/
.item-content-center
{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	grid-gap: 10px 10px;
	grid-auto-flow: row;
	justify-items: center;
	align-items: center;
	place-content:stretch stretch;
}

.topcontent
{
	display: grid;
	grid-template-columns: 2fr 2fr;
	grid-template-rows: 1fr;
	grid-gap: 5px 10px;
	grid-auto-flow: row;
	justify-items: center;
	align-items: center;
	place-content:stretch stretch;
}
.topcontent-item-2
{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(2, auto);
	grid-gap: 10px 10px;
	grid-auto-flow: row;
	justify-items: start;
	align-items: center;
	place-content:stretch stretch;
}

.subcontainer
{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(2, auto);
	grid-gap: 10px 10px;
	grid-auto-flow: row;
	justify-items: start;
	align-items: center;
	place-content:stretch stretch;
}

.subcontainerCol2
{
	display: grid;
	grid-template-columns: 3fr 2fr;
	grid-gap: 10px 10px;
}

