body {
    background-color: #000000;
    color: #fff;
}

.header {
    background-color: #000000;
}

a:hover {
    color: #fff;
}

a:link {
    color: #fff;
}

a:visited {
    color: #fff;
}

.menu a {
    color: #000;
}

.videoWrapper {
    width: 100%;
    height: 383px;
    position: relative;
    overflow: hidden;
}

.main1 div, .main2 div, .main3 div {
  overflow: hidden;
}

.main1 img, .main2 img, .main3 img {
  transition: transform .5s ease;
  opacity: 1;
}

.main1 img:hover, .main2 img:hover, .main3 img:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

.main1 {
    display: grid;
    grid-template-columns: 50% 50%;
}

.main1 > div:first-child {
    grid-column: 1;
    grid-row: 1 / 3;
}

.main1 > div:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
}

.main1 > div:last-child {
    grid-column: 2;
    grid-row: 2 ;
}

.main2 {
    display: grid;
    grid-template-columns: 62.5% 37.5%;
}

.main3 {
    display: grid;
    grid-template-columns: 50% 25% 25%;
    grid-auto-columns: 50%;
}

.main3 > div:first-child {
    grid-column: 1;
    grid-row: 1 / 3;
}

.main3 > div:nth-child(2) {
    grid-column: 2 / 4;
    grid-row: 2;
}

.main3 > div:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
}

.main3 > div:last-child {
    grid-column: 3;
    grid-row: 1;
}

.imglist {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
	grid-gap: 10px;
}


/* ==========================================================================
   Responsive
   ========================================================================== */
/* < 880 */
@media only screen and (max-width: 880px) {
	.content_text {
		padding: 0 10px 0 10px;
	}
}
/* >= 880 */
@media only screen and (min-width: 881px) {
	.videoWrapper {
		width: 880px;
	}
}