@media screen and (min-width: 1200px) {}

@media screen and (min-width: 1025px) {
	.mobile-only {
		display: none;
	}
}

@media screen and (max-width: 1280px) {
	.chairman-text {
		flex-direction: column;
	}

	.gceo .vip-stats {
		padding-right: 0;
		max-width: 220px;
	}

	.gceo .vip-stats .icon {
		float: none;
		margin-bottom: var(--gap10);
		max-width: 36px;
	}

	.gceo .vip-stats .stat-number {
		font-size: 1.8rem;
		line-height: 1.1em;
	}
}

@media screen and (max-width: 1024px) {
	:root {
		--gap: 24px;
		--gap72: 36px;
	}

	html,
	body {
		font-size: 15px;
	}

	body.cdar {
		padding-top: 48px;
	}

	.desktop-only {
		display: none;
	}

	#menu {
		width: 100%;
		padding: var(--gap);
		max-width: calc(100% - var(--gap72));
	}

	.menu-overlay {
		width: 100%;
		max-width: calc(100% - var(--gap72));
	}

	.row.intro {
		background-size: auto 50%;
		background-position: right bottom;
		background-image: url(../img/bg/bg-intro-mobile.jpg);
	}

	.row.intro .intro-cols {
		flex-direction: column;
	}

	.row.intro .text {}

	.row.intro .text>p:nth-child(4),
	.row.intro .text>p:nth-child(5) {
		padding-right: 30%;
	}

	.text-progress {
		width: 180px;
	}

	.row.chairman>.flex,
	.row.gceo>.flex {
		flex-wrap: wrap;
	}

	.row.chairman>.flex>.col:first-child,
	.row.gceo>.flex>.col:first-child {
		flex-basis: 60%;
		padding-left: var(--gap72);
	}

	.row.chairman>.flex>.col.picture {
		flex-basis: 40%;
		padding-right: var(--gap);
	}

	.row.gceo>.flex>.col.picture {
		flex-basis: 40%;
		padding-right: 0;
	}

	.row.chairman>.flex>.col.profile-text,
	.row.gceo>.flex>.col.profile-text {
		flex-basis: 100%;
	}

	.row.chairman,
	.row.gceo {
		padding-left: 0;
		padding-right: 0;
	}

	.chairman .hero-chairman,
	.gceo .hero-gceo {
		transform: scale(1);
	}

	.job-title {
		background-position: left 16px;
		padding-left: var(--gap24);
	}

	.sustain-phases {
		flex-direction: column;
	}

	.sustain-phases .phase {
		flex-basis: auto;
		width: 100%;
	}

	.download-cols {
		flex-direction: column;
		align-items: start;
	}

	.download-cols .col {
		flex-basis: auto;
	}

	.row.download .section-title {
		text-align: center;
	}
	
	.sustain-icons {
		flex-direction: column;
	}
	.sustain-desc {
		flex-direction: column;
	}
	.sustain-desc>.col:not(:last-of-type) {
		border-right: 0;
		border-bottom: 1px solid var(--color-blue);
	}
	.sustain-icons2 {
		flex-direction: column;
	}
	.sustain-rows .sustain-row.top {
		flex-direction: column;
	}
	.sustain-rows .sustain-row .col {
		flex-basis: auto;
		width: 100%;
	}
	.sustain-rows .sustain-row .col.left,
	.sustain-rows .sustain-row .col.right {
		flex-basis: auto;
		height: calc( 80vw - var(--gap) * 5 );
		width: calc( 80vw - var(--gap) * 5 );
		margin-left: auto;
		margin-right: auto;
		padding: var(--gap);
	}
	.sustain-row.top .center {
		flex-basis: auto;
		margin-left: auto;
		margin-right: auto;
		height: calc( 80vw - var(--gap) * 5 );
		width: calc( 80vw - var(--gap) * 5 );
		margin-top: -13vw;
		margin-bottom: -5vw;
	}
}

@media screen and (max-width: 800px) {
	.highlight-stats {
		flex-wrap: wrap;
	}

	.highlight-stats .highlight-stat {
		flex-basis: 50%;
	}

	.highlight-stats>.highlight-stat:nth-child(even) {
		border-right: 0;
	}

	.sustainability .highlight-stats-rows .highlight-stats {
		flex-direction: column;
		gap: var(--gap);
	}
	.sustainability .highlight-stats-rows .highlight-stats .highlight-stat-group {
		flex-basis: auto;
	}
	.highlight-stat-group .highlight-stat-group-title {
		padding-bottom: var(--gap18);
	}

	.highlight-stat-group-stats>.highlight-stat:last-child {
		border-right: 0;
	}

	.download-books {
		flex-direction: column;
		width: 100%;
		gap: var(--gap) !important;
	}

	.download-books .book {
		width: 100%;
	}

	.financial-charts {
		flex-direction: column;
	}

	.chart-box img {
		max-width: 300px;
		margin: 0 auto;
	}
}

@media screen and (max-width: 640px) {

	html,
	body {
		font-size: 14px;
	}

	.download-lists {
		flex-direction: column;
		gap: var(--gap18) !important;
	}

	.row.sustainability .section-title {
		text-align: center;
	}

	.sustainability-cols {
		flex-direction: column;
	}

	.sustainability-cols .col {
		flex-basis: auto;
	}

	.icon-milestones {
		max-width: 200px;
	}

	.row.intro .text>p:nth-child(4),
	.row.intro .text>p:nth-child(5) {
		padding-right: 40%;
	}

	.highlight-stats .highlight-stat img {
		max-width: 56px;
	}

	.row.chairman>.flex,
	.row.gceo>.flex {
		flex-direction: column;
	}

	.row.chairman>.flex>.col,
	.row.gceo>.flex>.col {
		flex-basis: auto !important;
	}

	.row.chairman>.flex>.col.left,
	.row.gceo>.flex>.col.left {
		padding-right: var(--gap72);
		padding-bottom: 0;
	}

	.row.chairman>.flex>.col.picture,
	.row.gceo>.flex>.col.picture {
		padding-right: var(--gap72);
		padding-left: var(--gap72);
	}

	.chairman .hero-chairman,
	.gceo .hero-gceo {
		max-width: 70%;
		margin-left: auto;
		margin-right: auto;
	}
	.sustain-rows .sustain-row .col.left,
	.sustain-rows .sustain-row .col.right {
		height: calc( 100vw - var(--gap) * 4 );
		width: calc( 100vw - var(--gap) * 4 );
	}
	.sustain-row.top .center {
		height: calc( 100vw - var(--gap) * 4 );
		width: calc( 100vw - var(--gap) * 4 );
		margin-top: -13vw;
		margin-bottom: -5vw;
	}
}

@media screen and (max-width: 480px) {
	.row.intro .intro-cols .col {
		flex-basis: auto !important;
	}

	.row.intro .text>p:nth-child(4),
	.row.intro .text>p:nth-child(5) {
		padding-right: 0%;
	}

	.row.intro {
		background-size: 200% auto;
	}

	.row.intro .text {
		padding-bottom: 50vw;
	}

	.floating-bar .box {
		padding: var(--gap18) var(--gap24);
	}

	.floating-bar .action {
		right: var(--gap24);
	}
}

/* Font resize */
@media screen and (max-width: 640px) {
	.section-title {
		font-size: 2.1rem;
		line-height: 1.1em;
	}

	.gceo .section-title {
		font-size: 1.7rem;
		line-height: 1.1em;
	}
}

@media screen and (max-width: 480px) {
	.section-title {
		font-size: 1.8rem;
		line-height: 1.1em;
	}

	.row.highlights .section-subtitle {
		font-size: 1rem;
		line-height: 1em;
	}

	.highlight-boxes .highlight-box .icon-stat .stat-number {
		font-size: 2rem;
		line-height: 1.1em;
	}
	.highlight-boxes .highlight-box.business .icon-stat .stat-number {
		font-size: 2.2rem;
		line-height: 1.1em;
	}
	.highlight-boxes .highlight-box .icon-stat .note.text {
		font-size: 1rem;
    	line-height: 1.3em;
	}
	.highlight-boxes .highlight-box.sustainability .icon-stat .stat-number, .highlight-boxes .highlight-box.sustainability .icon-stat .stat-unit {
		font-size: 1.8rem;
    	line-height: 1.1em;
	}
	.quote {
		font-size: 1.3rem;
		line-height: 1.3em;
	}
	.row.chairman:after,
	.row.gceo:after {
		height: 5px;
	}
	.row.footnote p {
		display: flex;
		flex-direction: column;
	}
}