@media (max-width: 1880px) {
  .inner1840,
  .inner1760,
  .inner1680,
  .inner1520 {
    padding: 0 20px;
  }
  main .colon .contents {
    padding: var(--gap60);
  }
  main .guardant .item-box {
    padding: var(--gap80);
  }
  main .request .inquiry-box {
    padding: var(--gap80) var(--gap60);
  }
  .sub-contents .sub-page .methods .list {
    padding: 40px;
  }
}
@media (max-width: 1600px) {
  .privacy-text h3 {
    font-size: var(--font36);
    margin-bottom: 40px;
  }
  .privacy-text .text-box {
    row-gap: 30px;
  }
  .privacy-text .text {
    row-gap: 20px;
  }
  header .depth1 {
    column-gap: 60px;
  }
  header .depth1 > li::after {
    left: calc(100% + 28px);
  }
  .site-map .depth1 > li > a {
    font-size: 4rem;
  }
  .site-map .depth2 > li > a {
    font-size: 2.8rem;
  }
  main .request h2 br {
    display: none;
  }
  main .request .inquiry-box {
    flex-direction: column;
    row-gap: var(--gap60);
  }
  main .request .form-wrap {
    max-width: 100%;
  }
  main .request .policy-popup .inner {
    padding: 40px 40px 0;
  }
  .sub-visual {
    height: 580px;
    margin-top: calc(var(--header-height) + 40px);
  }
  .sub-contents .sub-page .flex-between {
    column-gap: 80px;
  }
  .sub-contents .sub-page .flex-between > .img {
    width: 50%;
  }
  .sub-contents .sub-page .methods .list .title {
    column-gap: 20px;
  }
  .sub-contents .sub-page .methods .list h3 {
    margin-top: 0;
  }
  .sub-contents .sub-page .reference {
    padding: 40px;
  }
  .sub-contents .colon .classification .text {
    padding: 0 20px;
  }
  .sub-contents .colon .prevention .item h4 {
    font-size: 2.7rem;
    left: 30px;
    bottom: 30px;
  }
}
@media (max-width: 1400px) {
  header .depth1 {
    column-gap: 50px;
  }
  header .depth1 > li::after {
    left: calc(100% + 23px);
  }
  header .depth1 > li > a {
    font-size: 1.8rem;
  }
  main .necessary .item-box {
    column-gap: 20px;
  }
  main .necessary .item {
    padding: 40px;
  }
  main .global .item {
    padding: 60px;
  }
  main .global .item p {
    font-size: 2rem;
  }
  main .global .item ul {
    margin-top: 30px;
  }
  main .colon .bg-box img {
    max-width: inherit;
    min-height: 100%;
  }
  main .colon .flex-row {
    flex-wrap: wrap;
    align-items: center;
    row-gap: 60px;
    column-gap: 40px;
  }
  main .colon .flex-row h2 {
    width: 100%;
  }
  main .colon .flex-row h2 br:last-child {
    display: none;
  }
  main .colon .img-wrap,
  main .colon .text-box {
    max-width: 45%;
  }
  main .colon .text-box {
    margin: 0 0 0 auto;
  }
  main .guardant .item-box {
    padding: var(--gap80) 40px;
  }
  main .request .inquiry-box {
    padding: var(--gap80) 40px;
  }
  main .request .form-box {
    column-gap: 40px;
  }
  main .request .form-box dl.half {
    width: calc(50% - 20px);
  }
  .sub-contents .sub-page h2 sup,
  .sub-contents .sub-page h3 sup {
    transform: translateY(-0.8em);
  }
  .sub-contents .sub-page .methods .check-list {
    row-gap: 20px;
    column-gap: 20px;
  }
  .sub-contents .colon .staging .inner {
    width: 1160px;
  }
  .sub-contents .colon .classification .item-box {
    column-gap: 20px;
  }
  .sub-contents .colon .classification .item p {
    font-size: 1.8rem;
  }
  .sub-contents .colon .prevention .item-box {
    max-width: 60%;
    row-gap: 20px;
    column-gap: 20px;
  }
  .sub-contents .colon .prevention .item:nth-child(even) {
    top: 100px;
  }
  .sub-contents .data .list-box {
    row-gap: 30px;
    column-gap: 20px;
  }
  .sub-contents .data .img-box .icon {
    width: 40px;
    height: 40px;
  }
  .sub-contents .data .text {
    row-gap: 10px;
    padding: 20px 0;
  }
  .sub-contents .data .text h5 {
    font-size: 1.9rem;
  }
}
@media (max-width: 1200px) {
  :root {
    --header-height: 74px;
    --radius: 30px;
  }
  header .logo,
  footer .logo {
    width: 130px;
  }
  header nav {
    display: none;
  }
  header .contact {
    height: 40px;
    padding: 0 20px;
  }
  header .contact span {
    font-size: 1.6rem;
  }
  header .menu-button {
    width: 27px;
    height: 27px;
    row-gap: 3px;
    column-gap: 3px;
  }
  main .visual .flex-box {
    padding: 20px;
  }
  main .visual .title p span {
    font-size: 1.9rem;
  }
  main .visual .swiper-button {
    width: 50px;
    height: 50px;
  }
  main .visual .option-box {
    column-gap: 40px;
  }
  main .visual .pagination {
    width: 200px;
    height: 60px;
  }
  main .necessary .item dl dt {
    font-size: 2.6rem;
  }
  main .global .item {
    padding: 40px;
  }
  main .global .item h3 {
    margin: 20px 0 15px;
  }
  main .global .item p {
    font-size: 1.8rem;
  }
  main .global .item ul li {
    font-size: 1.7rem;
  }
  main .colon .text p {
    font-size: 1.7rem;
  }
  main .guardant .bg {
    background-image: linear-gradient(to bottom, #041734, #092A57);
  }
  main .guardant .bg img {
    opacity: 0;
  }
  main .guardant .item-box {
    grid-template-columns: repeat(3, 1fr);
  }
  main .guardant .item {
    height: 100%;
    row-gap: 30px;
    padding: 40px 20px;
  }
  main .fda .item .icon,
  main .devote .item .icon {
    height: 90px;
  }
  main .fda .item {
    padding: 30px 20px;
  }
  main .fda .item p {
    font-size: 1.8rem;
  }
  main .devote .item > a {
    padding: 60px 20px 40px;
  }
  main .devote .item .arrow {
    width: 40px;
    height: 40px;
  }
  main .devote .item p {
    font-size: 2.1rem;
  }
  main .request .top-text {
    padding: 40px;
  }
  main .request .form-box {
    margin-bottom: 40px;
  }
  main .request .form-box dl.half {
    width: 100%;
  }
  main .request .policy-popup .inner {
    max-width: calc(100vw - 80px);
  }
  .sub-visual {
    height: 460px;
  }
  .sub-contents .sub-page p {
    font-size: 1.8rem;
  }
  .sub-contents .sub-page .flex-between {
    column-gap: 40px;
  }
  .sub-contents .sub-page .symptoms .item {
    height: inherit;
  }
  .sub-contents .sub-page .symptoms .item .icon {
    width: 80px;
    height: 80px;
  }
  .sub-contents .sub-page .symptoms .item .icon img {
    width: 50px;
  }
  .sub-contents .sub-page .symptoms .item h5 {
	font-size: 1.9rem;
	margin-top: 20px;
  }
  .sub-contents .colon .staging .item-box {
    padding: 20px 0 40px;
  }
  .sub-contents .colon .staging .inner {
    width: 900px;
  }
  .sub-contents .colon .staging .line {
    margin: 0px auto 40px;
  }
  .sub-contents .colon .staging .text em {
    height: 40px;
    font-size: 1.8rem;
  }
  .sub-contents .colon .staging .text p br {
    display: none;
  }
  .sub-contents .colon .classification .item span {
    font-size: 1.7rem;
  }
  .sub-contents .colon .classification .item h4 {
    font-size: 2.5rem;
  }
  .sub-contents .colon .classification .item p {
    font-size: 1.6rem;
  }
  .sub-contents .colon .classification .item p br {
    display: none;
  }
  .sub-contents .colon .survival p {
    font-size: 1.8rem;
  }
  .sub-contents .colon .symptoms .item-box {
    align-items: inherit;
  }
  .sub-contents .colon .prevention .item h4 {
    font-size: 2.4rem;
  }
  .sub-contents .data .list-box {
    grid-template-columns: repeat(3, 1fr);
  }
  .sub-contents .data .img-box .icon {
    right: 20px;
    bottom: 20px;
  }
}
@media (max-width: 1024px) {
  .privacy-text h5 {
    font-size: 1.8rem;
  }
  .site-map .snb-box {
    padding-top: calc(var(--header-height) + 40px);
  }
  .site-map .depth1 > li {
    column-gap: 40px;
  }
  .site-map .depth1 > li > a {
    column-gap: 10px;
    font-size: 3rem;
  }
  .site-map .depth1 > li > a::after {
    width: 12px;
    height: 12px;
  }
  .site-map .depth2 {
    column-gap: 40px;
  }
  .site-map .depth2 > li > a {
    font-size: 2.2rem;
  }
  .item.up.on {
    transition-delay: 0s !important;
  }
  main .title p {
    font-size: 1.8rem;
  }
  main .visual .bg {
    padding: 26% 0;
    position: relative;
  }
  main .visual .bg img {
    min-width: 100%;
    max-width: inherit;
    max-height: 100%;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  main .visual .title p span {
    font-size: 1.7rem;
  }
  main .visual .scroll-box,
  main .visual .pagination,
  main .visual .pagination > div {
    column-gap: 10px;
  }
  main .visual .scroll-box p,
  main .visual .pagination em {
    font-size: 1.4rem;
  }
  main .visual .scroll {
    width: 24px;
    height: 32px;
  }
  main .visual .pagination {
    width: 160px;
  }
  main .necessary .item-box,
  main .global .contents {
    flex-direction: column;
    row-gap: 20px;
    column-gap: 0;
  }
  main .colon .flex-row {
    row-gap: 40px;
    column-gap: 0;
  }
  main .colon .img-wrap,
  main .colon .text-box {
    max-width: 100%;
  }
  main .guardant .item-box {
    display: flex;
    flex-wrap: wrap;
    align-items: inherit;
    justify-content: center;
    row-gap: 20px;
    padding: 20px;
  }
  main .guardant .item {
    width: calc(50% - 10px);
  }
  main .fda h4 {
    font-size: 2.4rem;
  }
  main .devote .item-box {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 20px;
  }
  main .devote .item {
    width: calc((100% - 40px) / 3);
  }
  .sub-visual {
    height: 340px;
  }
  .sub-contents .sub-page .flex-between {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 40px;
    column-gap: 0;
    text-align: center;
  }
  .sub-contents .sub-page .flex-between > * {
    max-width: 750px;
    max-width: 0 auto;
  }
  .sub-contents .sub-page .flex-between > .title {
    order: 1;
  }
  .sub-contents .sub-page .flex-between > .title br {
    display: none;
  }
  .sub-contents .sub-page .flex-between > .img {
    order: 2;
    width: 100%;
  }
  .sub-contents .sub-page h2 sup,
  .sub-contents .sub-page h3 sup {
    transform: translateY(-0.3em);
  }
  .sub-contents .sub-page .list.left.on {
    transition-delay: 0s !important;
  }
  .sub-contents .sub-page .symptoms .item-box {
	display: flex;
	flex-wrap: wrap;
	row-gap: 20px;
	justify-content: center;
  }
  .sub-contents .sub-page .symptoms .item {
	width: calc((100% - 40px) / 3)
  }
  .sub-contents .sub-page .methods .check-list {
    grid-template-columns: repeat(1, 1fr);
  }
  .sub-contents .sub-page .methods .list dl dt {
    font-size: 2.1rem;
  }
  .sub-contents .sub-page .methods .list dl dd {
    font-size: 1.7rem;
  }
  .sub-contents .sub-page .methods .list .text > div {
    font-size: 1.9rem;
  }
  .sub-contents .sub-page .reference p {
    font-size: 1.8rem;
  }
  .sub-contents .sub-page .reference h5 {
    font-size: 2.2rem;
  }
  .sub-contents .sub-page .reference ol li em {
    width: 18px;
    height: 18px;
  }
  .sub-contents .sub-page .reference ol li em::before {
    font-size: 1.2rem;
  }
  .sub-contents .sub-page .reference ol li p {
    font-size: 1.6rem;
    transform: translateY(-0.2em);
  }
  .sub-contents .colon .staging .inner {
    width: 100%;
    display: flex;
  }
  .sub-contents .colon .staging .item-box {
    padding: 40px;
  }
  .sub-contents .colon .staging .img-box,
  .sub-contents .colon .staging .line,
  .sub-contents .colon .staging .text-box {
    grid-template-rows: repeat(5, 240px);
    grid-template-columns: inherit;
  }
  .sub-contents .colon .staging svg {
    max-height: 100%;
  }
  .sub-contents .colon .staging .img {
    width: 100%;
  }
  .sub-contents .colon .staging .img .rotate {
    transform: rotate(270deg);
    transform-origin: center;
  }
  .sub-contents .colon .staging .line {
    display: grid;
    width: 2px;
    height: 100%;
    justify-content: center;
    margin: 0;
    position: relative;
  }
  .sub-contents .colon .staging .line::before, .sub-contents .colon .staging .line::after {
    content: "";
    display: block;
    width: var(--dot-size);
    height: 10%;
    background: #f8f8f8;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .sub-contents .colon .staging .line::before {
    top: 0;
  }
  .sub-contents .colon .staging .line::after {
    bottom: 0;
  }
  .sub-contents .colon .staging .line span {
    position: relative;
    z-index: 1;
  }
  .sub-contents .colon .staging .text-box {
    margin-left: 30px;
  }
  .sub-contents .colon .staging .text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
  }
  .sub-contents .colon .staging .text em {
    margin: 0;
  }
  .sub-contents .colon .classification .item-box {
    flex-wrap: wrap;
    row-gap: 20px;
    justify-content: center;
  }
  .sub-contents .colon .classification .item {
    width: calc(50% - 10px);
  }
  .sub-contents .colon .prevention {
    flex-direction: column;
    justify-content: flex-start;
    row-gap: 40px;
  }
  .sub-contents .colon .prevention .title h3 {
    position: inherit;
    top: auto;
  }
  .sub-contents .colon .prevention .title h3 br {
    display: none;
  }
  .sub-contents .colon .prevention .item-box {
    max-width: 100%;
  }
  .sub-contents .screening .diagnosis {
    height: auto;
  }
  .sub-contents .facility .flex {
    flex-direction: column;
    row-gap: 40px;
  }
  .sub-contents .facility .item-box {
    width: 100%;
    row-gap: 30px;
  }
  .sub-contents .facility .paging {
    margin-top: 20px;
  }
  .sub-contents .facility .table-box th {
    height: 60px;
    font-size: 1.8rem;
  }
  .sub-contents .facility .table-box td {
    height: 50px;
    font-size: 1.6rem;
  }
  footer .top-button {
    width: 70px;
    height: 70px;
  }
  footer .family {
    width: 240px;
  }
}
@media (max-width: 768px) {
  :root {
    --form-height: 50px;
  }
  .privacy-text h3 {
    margin-bottom: 30px;
  }
  .privacy-text .text-box {
    row-gap: 20px;
  }
  .privacy-text .text {
    row-gap: 10px;
  }
  .privacy-text ul li::before {
    margin: 0 5px;
  }
  main h4 {
    font-size: 1.8rem;
  }
  main .title {
    margin-bottom: 40px;
  }
  main .title p {
    font-size: 1.6rem;
  }
  main .visual .bg {
    padding: 30% 0;
  }
  main .visual .title p span {
    font-size: 1.5rem;
  }
  main .necessary .item dl dt {
    font-size: 2.2rem;
  }
  main .fda h4 {
    font-size: 1.9rem;
  }
  main .fda .item-box {
    flex-wrap: wrap;
    row-gap: 20px;
  }
  main .fda .item {
    width: calc(50% - 10px);
  }
  main .request .top-text,
  main .request .inquiry-box {
    font-size: 1.7rem;
    border-radius: 20px;
    padding: 20px;
  }
  main .request .top-text {
    font-size: 1.7rem;
  }
  main .request .form-box {
    row-gap: 10px;
  }
  main .request .form-box dl input,
  main .request .form-box dl textarea,
  main .request .form-box dl button {
    font-size: 1.6rem;
    padding: 20px;
  }
  main .request .form-box dl dt {
    width: 120px;
    font-size: 1.7rem;
  }
  main .request .flex-row {
    column-gap: 20px;
  }
  main .request .flex-row label span {
    font-size: 1.6rem;
  }
  main .request .flex-row button {
    width: 160px;
  }
  main .request .flex-row button span {
    font-size: 1.7rem;
  }
  main .request .policy-popup .inner {
    padding: 30px 30px 0;
  }
  .sub-visual {
    height: 300px;
  }
  .sub-visual .text {
    row-gap: 20px;
  }
  .sub-contents .sub-page p {
    font-size: 1.6rem;
  }
  .sub-contents .sub-page .methods .list .title {
    column-gap: 10px;
  }
  .sub-contents .sub-page .methods .list .title em::after {
    font-size: 0.7em;
  }
  .sub-contents .sub-page .methods .list dl {
    margin-top: 20px;
  }
  .sub-contents .sub-page .methods .list hr {
    margin: 20px 0;
  }
  .sub-contents .sub-page .methods .list .text {
    row-gap: 15px;
  }
  .sub-contents .sub-page .reference {
    padding: 20px;
  }
  .sub-contents .sub-page .reference ol li {
    column-gap: 8px;
  }
  .sub-contents .colon .staging .img-box,
  .sub-contents .colon .staging .line,
  .sub-contents .colon .staging .text-box {
    grid-template-rows: repeat(5, 200px);
  }
  .sub-contents .colon .classification .item {
    width: 100%;
    max-width: 480px;
  }
  .sub-contents .facility .item-box p {
    font-size: 1.7rem;
  }
  .sub-contents .facility .table-box th {
    font-size: 1.7rem;
  }
  .sub-contents .data .text h5 {
    font-size: 1.7rem;
  }
  .sub-contents .data .text .date {
    font-size: 1.5rem;
  }
  footer .left-box {
    max-width: calc(100% - 70px);
  }
  footer .flex {
    position: relative;
  }
  footer .info dl:nth-child(4)::after {
    display: none;
  }
  footer .info dl:last-child {
    width: 100%;
  }
  footer .top-button {
    position: absolute;
    top: 0;
    right: 0;
  }
  footer .family {
    width: 200px;
    margin-bottom: 30px;
  }
}
@media (max-width: 640px) {
  :root {
    --header-height: 68px;
    --radius: 20px;
  }
  sup {
    font-size: 0.9rem !important;
  }
  .site-map .snb-box {
    padding-top: calc(var(--header-height) + 20px);
  }
  .site-map .depth1 > li {
    flex-direction: column;
    align-items: flex-start;
    column-gap: 0;
  }
  .site-map .depth1 > li > a {
    font-size: 2.4rem;
  }
  .site-map .depth1 > li > a::after {
    width: 10px;
    height: 10px;
  }
  .site-map .depth2 {
    height: 0;
    column-gap: 30px;
    overflow: hidden;
  }
  .site-map .depth2 > li > a {
    font-size: 1.8rem;
  }
  .site-map .depth1 li.on .depth2 {
    height: auto;
    margin-top: 20px;
  }
  main h4 {
    font-size: 1.5rem;
  }
  main .visual .visual .bg {
    padding: 38% 0;
  }
  main .visual .title p span {
    font-size: 1.3rem;
    letter-spacing: 0.8em;
  }
  main .visual .swiper-button {
    width: 40px;
    height: 40px;
  }
  main .visual .swiper-button img {
    width: 20px;
    height: 20px;
  }
  main .visual .option-box {
    column-gap: 20px;
  }
  main .visual .scroll-box p,
  main .visual .pagination em {
    font-size: 1.2rem;
  }
  main .visual .scroll-box .scroll {
    width: 22px;
    height: 30px;
  }
  main .visual .pagination {
    width: 140px;
    height: 40px;
  }
  main .necessary .item {
    row-gap: 30px;
  }
  main .necessary .item dl dt {
    font-size: 1.9rem;
  }
  main .necessary .item dl dd {
    font-size: 1.6rem;
  }
  main .global .item .icon {
    height: 60px;
  }
  main .global .item p {
    font-size: 1.6rem;
  }
  main .global .item ul li {
    font-size: 1.5rem;
  }
  main .colon .contents {
    padding: 30px;
  }
  main .colon .img-box {
    width: calc(100% - 60px);
    height: calc(100% - 60px);
  }
  main .colon .text p {
    font-size: 1.6rem;
  }
  main .guardant .item {
    width: 100%;
  }
  main .devote .item {
    width: calc(50% - 10px);
  }
  main .devote .item p {
    font-size: 1.8rem;
  }
  main .request .inquiry-box {
    row-gap: 30px;
  }
  main .request .form-box {
    row-gap: 20px;
  }
  main .request .form-box dl {
    flex-direction: column;
    row-gap: 10px;
    align-items: flex-start;
  }
  main .request .form-box dl dt {
    width: 100%;
  }
  main .request .form-box .flex-row label span {
    font-size: 1.5rem;
  }
  main .request .form-box .flex-row button {
    width: 140px;
  }
  main .request .form-box .flex-row button span {
    font-size: 1.6rem;
  }
  main .request .policy-popup .inner {
    max-width: calc(100vw - 40px);
    max-height: calc(100vh - 40px);
  }
  .paging a {
    width: 36px;
    height: 36px;
  }
  .paging .arr {
    column-gap: 20px;
  }
  .paging .arr a {
    width: auto;
  }
  .sub-contents .sub-page .symptoms .item {
	width: calc(50% - 10px);
  }
  .sub-contents .sub-page .symptoms .item h5 {
    font-size: 1.7rem;
  }
  .sub-contents .sub-page .methods .list {
    padding: 30px;
  }
  .sub-contents .sub-page .methods .list .text > div::before {
    width: 1.5em;
    height: 1.5em;
  }
  .sub-contents .sub-page .methods .list .text p {
    font-size: 0.9em;
  }
  .sub-contents .colon .staging .item-box {
    padding: 0 0 20px;
  }
  .sub-contents .colon .staging .text em {
    width: 60px;
    height: 34px;
    font-size: 1.5rem;
  }
  .sub-contents .colon .staging .text p {
    font-size: 1.6rem;
    margin-top: 10px;
  }
  .sub-contents .colon .survival p {
    font-size: 1.6rem;
  }
  .sub-contents .colon .symptoms .item-box {
    grid-template-columns: repeat(2, 1fr);
  }
  .sub-contents .colon .prevention .item h4 {
    font-size: 2rem;
    left: 20px;
    bottom: 20px;
  }
  .sub-contents .facility .search-box select,
  .sub-contents .facility .search-box input {
    padding: 0 10px;
  }
  .sub-contents .facility .search-box select {
    width: 100px;
  }
  .sub-contents .facility .search-box button {
    width: 80px;
  }
  .sub-contents .data .list-box {
    grid-template-columns: repeat(2, 1fr);
  }
  footer .left-box {
    max-width: 100%;
  }
  footer .top {
    flex-direction: column;
    row-gap: 20px;
    column-gap: 0;
    align-items: flex-start;
  }
  footer .info dl:first-child::after {
    display: none;
  }
  footer .info dl:nth-child(2) {
    width: 100%;
  }
  footer .top-button {
    width: 60px;
    height: 60px;
  }
  footer .top-button span {
    font-size: 1.6rem;
  }
}