@media (max-width: 1860px) {
  main .philosophy h2 {
    font-size: 6.4rem;
  }

  .sub-contents .introduction .information .item h5 {
    left: 40px;
	bottom: 40px;
  }
  .sub-contents .introduction .information .item .text {
    padding: 40px;
  }
  .sub-contents .health .text {
    padding: 0 40px;
  }
  .sub-contents .systematization .chain .info .p-box {
    max-width: 290px;
  }
  .sub-contents .systematization .chain .info .orange .p-box {
    top: -180px;
    left: -90px;
  }
  .sub-contents .systematization .chain .info .yellow .p-box {
    top: -30px;
	left: calc(100% - 95px);
  }
  .sub-contents .urban .details .item-box {
    column-gap: 10px;
  }
  .sub-contents .urban .direction .item {
    padding: 30px 20px;
  }
  .sub-contents .text .policy-tab li br {
    display: none;
  }
}

@media (max-width: 1600px) {
  header nav {
    width: 100%;
  }
  header .deph2 {
    padding: 25px 0;
  }
  .site-map .depth1 > li > a {
	height: 2.6em;
	font-size: 2.3rem;
  }
  .site-map .depth2 > li > a {
    font-size: 1.7rem;
  }
  .site-map .depth3 > li > a {
    font-size: 1.5rem;
	padding: 5px 0;
  }

  main h2 {
    font-size: var(--font36);
  }
  main .philosophy h2 {
    font-size: 5.4rem;
  }
  main .tourism h2,
  main .news h2 {
    font-size: calc(var(--font36) - 0.4rem);
  }

  .sub-contents .introduction .information p {
    font-size: 1.7rem;
	line-height: 1.5;
  }
  .sub-contents .introduction .information .item h5 {
    font-size: 2.7rem;
	left: 30px;
	bottom: 30px;
  }
  .sub-contents .introduction .information .item .text {
    padding: 30px;
  }
  .sub-contents .introduction .material a {
    width: 340px;
  }
  .sub-contents .health .item-box {
    column-gap: 40px;
  }
  .sub-contents .health .text {
    padding: 0;
  }
  .sub-contents .urban .direction p {
    font-size: 1.8rem;
  }
  .sub-contents .policy .hover-item .hover p span {
    font-size: 1.4rem;
  }
  .sub-contents .text .policy-tab {
    row-gap: 5px;
	column-gap: 5px;
  }
  .sub-contents .text .policy-tab li button {
    font-size: 1.4rem;
  }

  footer .link {
    flex-wrap: wrap;
	row-gap: 20px;
	column-gap: 30px;
  }
}

@media (max-width: 1400px) {
  header nav {
    display: none;
  }
  header .menu-button {
    margin-left: auto;
  }
  .site-map .inner {
    padding: 20px 0;
  }
  .site-map .depth1 > li > a {
    font-size: 2.1rem;
  }
  .site-map .depth2 > li > a {
    font-size: 1.6rem;
	padding: 7.5px 0;
  }
  .site-map .depth3 {
    padding: 2.5px 5px;
  }

  .move-tabs ul li > * {
    font-size: 1.7rem;
  }
  .explain .text .gap20 p {
    font-size: 1.8rem;
  }

  main h2 {
    font-size: calc(var(--font36) - 0.4rem);
  }
  main .philosophy h2 {
    font-size: 4.6rem;
  }

  .sub-visual:has(.big) p br {
    display: none;
  }
  .sub-contents .introduction .information .item {
    padding: 85% 0;
  }
  .sub-contents .introduction .material .row {
    flex-direction: column;
	row-gap: 30px;
	align-items: flex-start;
  }
  .sub-contents .introduction .material .item-box {
    width: 100%;
    justify-content: flex-start;
  }
  .sub-contents .introduction .material a {
    max-width: calc(50% - 10px);
  }
  .sub-contents .sunjin .item-box .item {
    height: 400px;
  }
  .sub-contents .sunjin .item-box .item h4 {
    font-size: var(--font28);
  }
  .sub-contents .ns .item-box .item p {
    font-size: 1.8rem;
  }
  .sub-contents .environment .process b,
  .sub-contents .environment .process span {
    font-size: 1.3rem;
  }
  .sub-contents .philosophy h5 {
    font-size: 2.3rem
  }
  .sub-contents .philosophy .explan .text p {
    font-size: 1.6rem;
  }
  .sub-contents .philosophy .explan .text p br {
    display: none;
  }
  .sub-contents .urban .direction .item-box {
    row-gap: 10px;
  }
  .sub-contents .text .policy-tab {
    grid-template-columns: repeat(3, 1fr);
  }
  .sub-contents .text .policy-tab li button {
    font-size: 1.5rem;
  }
}

@media (max-width: 1200px) {
  .site-map .inner {
    padding: 40px 10px;
  }
  .site-map .depth1 > li > a {
    height: auto;
    font-size: 2.5rem;
  }
  .explain .text h5 {
    font-size: 2.2rem;
  }
  .explain .text .gap20 p {
    font-size: 1.7rem;
  }

  main .section h2 {
    font-size: calc(var(--font40) - 0.3rem);
  }
  main .visual .video-box {
    padding: 28.475% 0;
  }
  main .visual .text {
    padding: 0 0 80px;
  }
  main .visual .text h2 {
    font-size: var(--font56);
  }
  main .philosophy h2 {
    font-size: 4.0rem;
  }
  
  .sub-visual:has(.big) p {
	font-size: 2.8rem;
  }
  .sub-contents .about .information .diagram .img {
    max-width: 90%;
  }
  .sub-contents .about .detail .text p {
    font-size: 1.6rem;
  }
  .sub-contents .introduction .information .item {
    padding: 67.075% 0;
  }
  .sub-contents .introduction .ci > .row h4 br {
    display: none;
  }
  .sub-contents .sunjin .item-box .item p {
    font-size: 1.7rem;
  }
  .sub-contents .ns .item-box .item h4 {
    font-size: 2.7rem;
  }
  .sub-contents .ns .item-box .item .p-box {
    row-gap: 15px;
  }
  .sub-contents .corporations .contents .refer p {
    font-size: 1.7rem;
  }
  .sub-contents .corporations .contents .refer {
    margin-bottom: -40px;
  }
  .sub-contents .corporations .tooltip .inner {
    column-gap: 20px;
    padding: 30px 20px;
  }
  .sub-contents .corporations .tooltip .inner .row {
    column-gap: 10px;
  }
  .sub-contents .corporations .tooltip .inner span,
  .sub-contents .corporations .tooltip .inner .flag {
    width: 25px;
	height: 25px;
  }
  .sub-contents .corporations .tooltip .inner p {
	font-size: 1.4rem;
  }
  .sub-contents .health .item p {
    font-size: 1.4rem;
  }
  .sub-contents .environment .process p {
    font-size: 1.6rem;
  }
  .sub-contents .environment .process h6 {
    margin-bottom: 10px;
  }
  .sub-contents .areas .entire svg .top .white,
  .sub-contents .areas .entire svg .tag-box > g {
    transform: scale(1.05);
  }
  .sub-contents .urban .overview dl dd span {
    font-size: 1.6rem;
  }

  footer .link {
    width: 100%;
	max-width: 780px;
	flex-wrap: wrap;
    row-gap: 20px;
	column-gap: 30px;
  }
}


@media (max-width: 1024px) {
  .move-tabs ul li > * {
    font-size: 1.4rem;
  }

  main .philosophy h2 {
    font-size: 3.0rem;
  }
  main .process h2 br {
    display: block;
  }
  
  .sub-visual:has(.big) p {
	font-size: 2.0rem;
  }
  .sub-contents .location .text ul p {
    height: auto;
  }
  .sub-contents .introduction .information .item h5 {
    left: auto;
	bottom: auto;
  }
  .sub-contents .introduction .information .item .text p {
    font-size: 1.7rem;
  }
  .sub-contents .vision .popup .button-box {
    width: calc(100% - 40px);
  }
  .sub-contents .vision .popup .item em {
    margin: 10px 0 30px;
  }
  .sub-contents .vision .popup .item p {
    width: 100%;
	max-width: calc(100% - 180px);
	margin: 0 auto;
  }
  .sub-contents .vision .popup .item p br {
    display: none;
  }
  .sub-contents .sunjin .item-box .item {
    height: 430px;
  }
  .sub-contents .sunjin .item-box .item p {
    font-size: 1.6rem;
  }
  .sub-contents .corporations .contents .refer {
    margin-bottom: 0;
  }
  .sub-contents .corporations .tooltip .inner .row {
    column-gap: 20px;
  }
  .sub-contents .corporations .tooltip .inner p {
    font-size: 1.6rem;
  }
  .sub-contents .health .item p {
    font-size: 1.6rem;
  }
  .sub-contents .esg .top p br {
    display: none;
  }
  .sub-contents .environment .process h6 {
    margin-bottom: 24px;
  }
  .sub-contents .environment .process b,
  .sub-contents .environment .process span {
    font-size: 1.45rem;
  }
  .sub-contents .systematization .chain .info .item .p-box {
    width: auto;
	max-width: inherit;
    top: auto;
    left: auto;
    right: auto;
  }
  .sub-contents .urban .information h3 {
    font-size: var(--font40);
  }
  .sub-contents .urban .direction p {
    font-size: 1.7rem;
  }
  .sub-contents .text .policy-tab {
    grid-template-columns: repeat(2, 1fr);
  }

  footer .information > div {
    flex-direction: column;
	row-gap: 5px;
	column-gap: 0;
  }
}

@media (max-width: 768px) {
  .site-map .depth1 > li > a {
    font-size: 2.2rem;
  }

  .download-button span {
    font-size: 1.6rem;
  }
  .explain .text .gap20 p {
    font-size: 1.7rem;
  }

  main .section h2 {
    font-size: var(--font40);
  }
  main .visual .video-box {
    padding: 34.475% 0;
  }
  main .visual .text h2 {
    font-size: 2.8rem;
  }
  main .process .hover h6 {
    height: auto;
	font-size: 2.2rem;
  }
  main .process .bottom span {
    width: 200%;
    font-size: 1.9rem;
	transform: rotate(-90deg) translateY(-35px);
  }
  
  .sub-visual:has(.big) p br {
    display: none;
  }
  .sub-contents .introduction .information .item-box {
    column-gap: 10px;
  }
  .sub-contents .introduction .information .item {
    padding: 75.5% 0;
  }
  .sub-contents .introduction .information .item:nth-child(even) {
    margin-top: 10px;
  }
  .sub-contents .introduction .information .item .text p {
    font-size: 1.6rem;
  }
  .sub-contents .introduction .explan .item-box {
    row-gap: 10px;
	column-gap: 10px;
  }
  .sub-contents .introduction .explan .item {
    width: calc(50% - 5px);
  }
  .sub-contents .introduction .explan p {
    font-size: 1.6rem;
  }
  .sub-contents .vision .popup .item p {
    max-width: 100%;
  }
  .sub-contents .sunjin .item-box {
    grid-template-columns: repeat(1, 1fr);
    row-gap: 20px;
    column-gap: 0;
  }
  .sub-contents .sunjin .item-box .item {
    height: 340px;
  }
  .sub-contents .sunjin .item-box .item .text {
    margin-top: auto;
  }
  .sub-contents .sunjin .item-box .item h4,
  .sub-contents .ns .item-box .item h4 {
    font-size: var(--font40);
  }
  .sub-contents .environment .process h6 {
    margin-bottom: 5px;
  }
  .sub-contents .philosophy h5 {
    font-size: 1.9rem;
  }
  .sub-contents .systematization .chain .text p {
    font-size: 1.7rem;
  }
  .sub-contents .urban .direction .item {
    width: calc(50% - 5px);
  }
  .sub-contents .policy .hover-box {
    grid-template-columns: repeat(2, 1fr);
  }
  .sub-contents .text .policy-tab li button {
    font-size: 1.4rem;
  }

  footer .link {
    max-width: calc(100% - 70px);
	row-gap: 15px;
	column-gap: 15px;
  }
  footer .link a {
    font-size: 1.55rem;
  }
}

@media (max-width: 640px) {
  .site-map .depth1 > li > a {
    font-size: 1.9rem;
  }
  .move-tabs {
    height: auto;
  }
  .move-tabs ul {
    flex-wrap: wrap;
  }
  .move-tabs ul li {
    width: 100%;
    max-width: calc(100% / 4);
    height: 40px;
  }
  .move-tabs ul li > * {
    font-size: 1.3rem;
  }
  .link-flex p {
    font-size: 1.5rem;
  }
  .explain {
	grid-template-columns: repeat(1, minmax(auto, 540px));
  }

  main .section h2 {
    font-size: calc(var(--font40) - 0.2rem);
  }
  main .visual .video-box {
    padding: 44.475% 0;
  }
  main .visual .text h2 {
    font-size: 2.2rem;
  }
  main .philosophy h2 {
    font-size: 2.4rem;
  }
  main .process h2 br {
    display: none;
  }
  main .process .hover h6 {
    max-width: calc(100% - 45px);
    font-size: 1.7rem;
	margin: 0 auto;
  }
  main .process .bottom span {
    font-size: 1.5rem;
	transform: rotate(-90deg) translateY(-25px);
  }
  main .esg h2 br {
    display: block;
  }
  main .esg .icon {
    top: 30px;
	bottom: auto;
  }

  .sub-visual .path-box {
    padding: 0 10px;
  }
  .sub-visual .path-box .home img {
    width: 15px;
  }
  .sub-visual .path-box .path::before {
    margin: 0 5px;
  }
  .sub-visual .path-box .path a {
    font-size: 1.2rem;
  }
  .sub-visual:has(.big) p {
    font-size: 1.8rem;
  }
  .sub-contents .about .information .title h4 br {
    display: block;
  }
  .sub-contents .ceo .text > p {
    flex-direction: column;
	row-gap: 10px;
	column-gap: 0;
	align-items: flex-end;
  }
  .sub-contents .introduction .information .item {
    padding: 53.75% 0;
  }
  .sub-contents .introduction .video .text {
    flex-direction: column;
	row-gap: 15px;
  }
  .sub-contents .introduction .material a {
    width: 100%;
	max-width: inherit;
  }
  .sub-contents .introduction .explan .item-box {
    row-gap: 10px;
	column-gap: 0;
  }
  .sub-contents .introduction .explan .item {
	width: 100%;
  }
  .sub-contents .vision .popup .inner {
    height: 420px;
  }
  .sub-contents .vision .popup .item em {
    margin: 10px 0 20px;
  }
  .sub-contents .history .history-tab {
    column-gap: 15px;
  }
  .sub-contents .history .history-tab li button {
    font-size: 1.5rem;
  }
  .sub-contents .history .list-box dl b,
  .sub-contents .history .list-box dl p {
    font-size: 1.7rem;
  }
  .sub-contents .history .list-box ol em,
  .sub-contents .history .list-box ol p {
    font-size: 1.6rem;
  }
  .sub-contents .history .list-box dl .column > p {
    flex-direction: column;
	align-items: flex-start;
	row-gap: 5px;
  }
  .sub-contents .history .list-box dl .column a {
    margin-left: auto;
  }
  .sub-contents .sunjin .item-box .item {
    height: 380px;
  }
  .sub-contents .ns .item-box .item {
    aspect-ratio: 1 / 0.9;
  }
  .sub-contents .ns .item-box .item::before {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 4%, #000 100%);
  }
  .sub-contents .ns .item-box .item p {
    font-size: 1.6rem;
  }
  .sub-contents .corporations .contents h3 {
    font-size: 2.1rem;
  }
  .sub-contents .corporations .tooltip .inner .row {
    flex-wrap: wrap;
	row-gap: 10px;
	column-gap: 15px;
  }
  .sub-contents .health .item p {
    font-size: 1.5rem;
  }
  .sub-contents .health .text .p-box p {
    font-size: 1.7rem;
  }
  .sub-contents .health .text .p-box p br {
    display: none;
  }
  .sub-contents .environment .process b,
  .sub-contents .environment .process span {
    font-size: 1.1rem;
  }
  .sub-contents .environment .process p {
	font-size: 1.4rem;
  }
  .sub-contents .systematization .chain .text dl dt {
    font-size: 1.8rem;
  }
  .sub-contents .brand .text br {
    display: block;
  }
  .sub-contents .tour .item a {
    padding: 15px;
  }
  .sub-contents .tour .item h6 {
    font-size: 1.7rem;
  }
  .sub-contents .urban .information .text p,
  .sub-contents .urban .information dl dd {
    font-size: 1.7rem;
  }
  .sub-contents .urban .details .item-box {
    column-gap: 0;
  }
  .sub-contents .urban .direction .item {
	width: 100%;
	padding: 30px 5px;
  }
  .sub-contents .policy .hover-box,
  .sub-contents .text .policy-tab {
    grid-template-columns: repeat(1, 1fr);
	column-gap: 0;
  }
  .sub-contents .text .policy-tab li button {
    font-size: 1.5rem;
  }

  footer .link {
    max-width: 100%;
    row-gap: 10px;
	column-gap: 15px;
  }
  footer .information dl {
    flex-direction: column;
	column-gap: 0;
  }
  footer .top-button {
    position: absolute;
	right: 0;
	bottom: 0;
  }
}