@charset "UTF-8";

.overview figure {width: 671px; margin: 0 auto;}
.overview figure:before {display: none;}
.overview >.txt .tit {margin-bottom: 80px;}
.overview .txt .desc {padding-top: 35px;}
.logo-system > div:first-child {max-width: 970px; margin: 0 auto 40px;}
.logo-system > div figure {width: 329px;}
.slogan figure {max-width: 1000px; margin: 0 auto;}
.color-system {padding: 80px 0; margin-top: 80px;}
.color-system .sec-tit {margin-bottom: 42px;}
.color-system .color-wrap > div {font-size: 0; flex-shrink: 0;}
.color-system .color-wrap .tit {padding-bottom: 16px; display: block; color: #231f20; font-size: 20px;}
.color-system .color-wrap .color-cont {display: inline-block; width: 308px;}
.color-system .color-wrap .sub-color .color-cont + .color-cont {margin-left: 16px;}
.color-system .color-wrap .color-box {display: flex; justify-content: center; align-items: center; width: 100%; height: 100px; color: #fff;  font-size: 15px; line-height: 22px; text-align: center; padding: 0 25%;}
.color-system .color-wrap .color-box.green {background-color: #39b54a;}
.color-system .color-wrap .color-box.black {background-color: #231f20;}
.color-system .color-wrap .color-box.gray {background-color: #727071;}
.color-system .color-wrap .color-box.silver {background-color: #adb2b5;}
.color-system .color-wrap .color-cont span {display: block; padding-top: 10px; color: #666; font-size: 13px; text-align: center;}

@media screen and (max-width: 1440px) {
	.overview figure {width: 46.6vw;}
	.overview >.txt .tit {margin-bottom: 5.56vw;}
	.overview .txt .desc {padding-top: 2.43vw;}
	.logo-system .sec-tit, .slogan .sec-tit {margin-bottom: 3.33vw;}
	.logo-system > div:first-child {max-width: 67.36vw; margin: 0 auto 2.78vw;}
	.logo-system > div figure {width: 22.85vw;}
	.slogan figure {max-width: 69.44vw;}
	.color-system {padding: 5.56vw 0; margin-top: 5.56vw;}
	.color-system .color-wrap .tit {padding-bottom: 1.11vw; font-size: 1.39vw;}
	.color-system .color-wrap .color-cont { width: 21.39vw;}
	.color-system .color-wrap .sub-color .color-cont + .color-cont {margin-left: 1.11vw;}
	.color-system .color-wrap .color-box {height: 6.94vw; font-size: 1.04vw; line-height: 1.53vw;}
	.color-system .color-wrap .color-cont span { padding-top: 0.69vw;  font-size: 0.90vw; }
}

@media screen and (max-width: 768px) {
	.overview > .txt .desc p, .desc p {font-size: 3.81vw;}
	.overview figure {width: 58.33vw;}
	.overview figure:before {display: none;}
	.overview >.txt .tit {margin-bottom: 19.05vw;}
	.overview .txt .desc {padding-top: 8.33vw;}
	.logo-system .sec-tit, .slogan .sec-tit {margin-bottom: 5.48vw;}
	.logo-system > div:first-child {max-width: 230.95vw; margin: 0 auto 9.52vw; padding: 0 3.81vw;}
	.logo-system > div figure {width: 33.33vw;}
	.logo-system > div div + div {margin-left: 11.43vw;}
	.slogan figure {max-width: 238.10vw; margin: 0 auto;}
	.color-system {padding: 19.05vw 0; margin-top: 19.05vw;}
	.color-system .sec-tit {margin-bottom: 10.00vw;}
	.color-system .color-wrap {flex-direction: column;}
	.color-system .color-wrap > div {margin-bottom: 5.48vw;}
	.color-system .color-wrap .tit {font-weight: 700; padding-bottom: 3.81vw; display: block; color: #231f20; font-size: 3.33vw; text-align: center;}
	.color-system .color-wrap .color-cont {display: block; width: 47.62vw; margin: 0 auto;}
	.color-system .color-wrap .sub-color .color-cont + .color-cont {margin-left: 0; margin: 2.86vw auto 0;}
	.color-system .color-wrap .color-box {font-size: 2.86vw; height: 15.48vw; line-height: 1.3; text-align: center; padding: 0 19%;}
	.color-system .color-wrap .color-cont span {padding-top: 1.19vw;  font-size: 2.62vw; text-align: center;}
}

@media screen and (max-width: 320px) {
	.overview > .txt .desc p, .desc p {font-size: 12px;}
	.overview figure {width: 187px;}
	.overview >.txt .tit {margin-bottom: 61px;}
	.overview .txt .desc {padding-top: 27px;}
	.logo-system .sec-tit, .slogan .sec-tit {margin-bottom: 18px;}
	.logo-system > div:first-child {max-width: 739px; margin: 0 auto 30px; padding: 0 12px;}
	.logo-system > div figure {width: 107px;}
	.logo-system > div div + div {margin-left: 37px;}
	.slogan figure {max-width: 762px;}
	.color-system {padding: 61px 0; margin-top: 61px;}
	.color-system .sec-tit {margin-bottom: 32px;}
	.color-system .color-wrap > div {margin-bottom: 18px;}
	.color-system .color-wrap .tit {font-weight: 700; padding-bottom: 12px; font-size: 11px;}
	.color-system .color-wrap .color-cont {display: block; width: 152px; margin: 0 auto;}
	.color-system .color-wrap .sub-color .color-cont + .color-cont {margin-left: 0; margin: 9px auto 0;}
	.color-system .color-wrap .color-box {font-size: 9px; height: 50px;}
	.color-system .color-wrap .color-cont span {padding-top: 4px;  font-size: 8px; text-align: center;}
}