@media screen and (max-width: 1280px) { /*1px = 0.075vw*/
  nav div.navigation {
    padding: 0 6.75vw;
  }
  #main img {
    height: 11.25vw;
  }

  #header {
    padding: 0 6.75vw;
  }
  #header .box {
    padding: 4.5vw;
    border: 0.675vw solid;
  }
  #header .box h1 {
    font-size: 3.6vw;
  }
  #header .box p {
    margin-top: 2.25vw;
    font-size: 1.8vw;
  }

  #process, #partners, #footer {
    padding: 11.25vw 6.75vw;
    display: block;
    height: 100%;
  }
    
  #process h2, #partners h2 {
    font-size: 3.6vw;
  }
  #process p.title, #partners p.title {
    margin: 1.125vw auto 2.25vw auto;
    font-size: 1.8vw;
  }

  #process .diagram, #partners .client {
    width: 100%;
  }
  #process .subpro {
    margin-top: 1.125vw;
  }
  #process .subpro img {
    width: 20.25vw; height: 20.25vw;
  }
  #process .subpro h3 {
    margin: 1.125vw 0 0.675vw 0;
    font-size: 1.8vw;
  }
  #process .subpro p {
    font-size: 1.35vw;
  }

  #partners .client .clientlogo {
    margin-top: 1.125vw;
    border-radius: 2.25vw;
    height: 4.5vw;
  }
  #partners .client .clientlogo img.client1 {height: 3.15vw; margin-top: 0.675vw;}
  #partners .client .clientlogo img.client2 {height: 2.25vw; margin-top: 1.125vw;}
  #partners .client .clientlogo img.client3 {height: 1.8vw; margin-top: 1.35vw;}
  #partners .client .clientlogo img.client4 {height: 2.25vw; margin-top: 1.125vw;}
  #partners .client .clientlogo img.client5 {height: 2.25vw; margin-top: 1.125vw;}
  #partners .client .clientlogo img.client6 {height: 2.25vw; margin-top: 1.125vw;}
  #partners .client .clientlogo img.client7 {height: 2.925vw; margin-top: 0.9vw;}
  #partners .client .clientlogo img.client8 {height: 2.25vw; margin-top: 1.125vw;}

  #footer .info {
    padding-left: 0.45vw;
  }
  #footer .info img {
    height: 7.2vw;
  }
  #footer .info h3 {
    margin: 1.125vw 0 1.575vw 0;
    font-size: 1.35vw;
  }
  #footer .info p.contact {
    font-size: 1.8vw;
  }
  #footer .info p.copyright {
    margin-top: 1.575vw;
    font-size: 1.35vw;
  }

  .section {
    padding: 6.75vw;
    display: block;
    height: 100%;
  }
  .content {
    height: 36vw;
  }
  .content .text {
    width: 31.5vw;
  }
  .content .text h2 {
    font-size: 3.6vw;
  }
  .content .text p {
    padding-top: 2.25vw;
    font-size: 1.35vw;
  }

  .content .tab h3 {
    padding: 6.75vw 0.675vw 0 0;
    font-size: 1.575vw;
  }
  .content .tab p {
    padding: 0.225vw 0.675vw 0.675vw 0;
    font-size: 1.125vw;
  }
  .content ul {
    width: 31.5vw;
  }
  .content ul li {
    height: 6.75vw;
  }
  .content ul li img {
    width: 6.75vw; height: 6.75vw;
  }
}

@media screen and (max-width: 1024px) {/*아이패드프로 세로일때 가로px*/

}

@media screen and (max-width: 768px) {/*아이패드 세로일때 가로px*/ /*1px = 0.125vw*/
  #main img {
    height: 18.75vw
  }
  #header .box {
    padding: 7.5vw;
    border: 1.125vw solid;
  }
  #header .box h1 {
    font-size: 6vw;
  }
  #header .box p {
    margin-top: 3.75vw;
    font-size: 3vw;
  }

  #process h2, #partners h2 {
    font-size: 6vw;
  }
  #process p.title {
    margin: 1.875vw auto 0 auto;
    font-size: 3vw;
  }
  #process .subpro {
    width: 100%;
    margin-top: 0;
  }
  #process .subpro img {
    margin-top: 7.5vw;
    width: 33.75vw; height: 33.75vw;
  }
  #process .subpro h3 {
    margin: 1.875vw 0 1.125vw 0;
    font-size: 3vw;
  }
  #process .subpro p {
    font-size: 2.25vw;
  }
  #partners p.title {
    margin: 1.875vw auto 3.75vw auto;
    font-size: 3.6vw;
  }
  #partners .client .clientlogo {
    margin-top: 1.875vw;
    border-radius: 3.75vw;
    width: 49%; height: 7.5vw;
  }
  #partners .client .clientlogo img.client1 {height: 5.25vw; margin-top: 1.125vw;}
  #partners .client .clientlogo img.client2 {height: 3.75vw; margin-top: 1.875vw;}
  #partners .client .clientlogo img.client3 {height: 3vw; margin-top: 2.25vw;}
  #partners .client .clientlogo img.client4 {height: 3.75vw; margin-top: 1.875vw;}
  #partners .client .clientlogo img.client5 {height: 3.75vw; margin-top: 1.875vw;}
  #partners .client .clientlogo img.client6 {height: 3.75vw; margin-top: 1.875vw;}
  #partners .client .clientlogo img.client7 {height: 5vw; margin-top: 1.5vw;}
  #partners .client .clientlogo img.client8 {height: 3.75vw; margin-top: 1.875vw;}

  #footer .info {
    padding-left: 0.75vw;
  }
  #footer .info img {
    height: 12vw;
  }
  #footer .info h3 {
    margin: 1.875vw 0 2.625vw 0;
    font-size: 2.25vw;
  }
  #footer .info p.contact {
    font-size: 3vw;
  }
  #footer .info p.copyright {
    margin-top: 2.625vw;
    font-size: 2.25vw;
  }

  .content {
    position: static;
    height: 100%;
    overflow: hidden;
  }
  .content .text {
    position: static; float: left;
    width: 100%;
  }
  .content .text h2 {
    font-size: 6vw;
  }
  .content .text p {
    padding: 3.75vw 0;
    font-size: 2.5vw;
  }

  .content .tab {
    position: relative;
    float: left;
    height: 100%;
  }
  .content .tab img {
    width: 100%;
  }
  .content .tab h3 {
    padding: 15vw 1.5vw 0 0; /*사이즈 조정*/
    font-size: 3.3vw; /*사이즈 조정*/
  }
  .content .tab p {
    padding: 0.6vw 1.2vw 1.2vw 0; /*사이즈 조정*/
    font-size: 2.25vw; /*사이즈 조정*/
  }

  .content ul {
    position: static; float: left;
    width: 100%;
    margin-top: 2vw;
  }
  .content ul li {
    height: 20vw;
  }
  .content ul li img {
    width: 20vw; height: 20vw;
  }
}

@media screen and (max-width: 450px) { /*스마트폰 세로 시작*/ /*1px=0.15vw 사정상 적용이 안되는 부분도 있음*/
  nav div.navigation {
    padding: 0 5vw;
  }
  #main img {
    height: 22.5vw;
  }
  #header {
    padding: 0 5vw;
  }
  #header .box {
    padding: 9vw;
    border: 1.35vw solid;
  }
  #header .box h1 {
    font-size: 7.2vw;
  }
  #header .box p {
    margin-top: 2vw;
    font-size: 3.6vw;
  }
  #process, #partners, #footer {
    padding: 18vw 5vw;
  }

  #process h2, #partners h2 {
    font-size: 7.2vw;
  }
  #process p.title {
    margin: 2.25vw auto 0 auto;
    font-size: 3.6vw;
  }
  #process .subpro {
    width: 100%;
  }
  #process .subpro img {
    margin-top: 7.5vw;
    width: 40.5vw; height: 40.5vw;
  }
  #process .subpro h3 {
    margin: 2.25vw 0 1.35vw 0;
    font-size: 4.95vw;
  }
  #process .subpro p {
    font-size: 3.3vw; /*사이즈 조정*/
  }
  #partners p.title {
    margin: 2.25vw auto 4.5vw auto;
    font-size: 3.6vw;
  }
  #partners .client .clientlogo {
    margin-top: 2.25vw;
    border-radius: 4.5vw;
    width: 49%; height: 9vw;
  }
  #partners .client .clientlogo img.client1 {height: 6.3vw; margin-top: 1.35vw;}
  #partners .client .clientlogo img.client2 {height: 4.5vw; margin-top: 2.25vw;}
  #partners .client .clientlogo img.client3 {height: 3.6vw; margin-top: 2.7vw;}
  #partners .client .clientlogo img.client4 {height: 4.5vw; margin-top: 2.25vw;}
  #partners .client .clientlogo img.client5 {height: 4.5vw; margin-top: 2.25vw;}
  #partners .client .clientlogo img.client6 {height: 4.5vw; margin-top: 2.25vw;}
  #partners .client .clientlogo img.client7 {height: 6.3vw; margin-top: 1.35vw;}
  #partners .client .clientlogo img.client8 {height: 4.5vw; margin-top: 2.25vw;}

  #footer .info {
    padding-left: 0.9vw;
  }
  #footer .info img {
    height: 14.4vw;
  }
  #footer .info h3 {
    margin: 2.25vw 0 3.15vw 0;
    font-size: 3.3vw; /*사이즈 조정*/
  }
  #footer .info p.contact {
    font-size: 4.07vw; /*사이즈 조정*/
  }
  #footer .info p.copyright {
    margin-top: 3.15vw;
    font-size: 3.3vw; /*사이즈 조정*/
  }

  .section {
    padding: 6vw 5vw 5vw 5vw;
  }
  .content .text h2 {
    font-size: 7.2vw;
  }
  .content .text p {
    padding: 4.5vw 0 4.5vw 0;
    font-size: 3.5vw;
  }

  .content .tab h3 {
    padding: 18vw 1.5vw 0 0; /*사이즈 조정*/
    font-size: 4.5vw; /*사이즈 조정*/
  }
  .content .tab p {
    padding: 0.9vw 1.5vw 1.5vw 0; /*사이즈 조정*/
    font-size: 3.15vw; /*사이즈 조정*/
  }
  .content ul {
    margin-top: 3vw;
  }
}


/* 모바일 메뉴 시작 */
@media screen and (max-width: 768px) {
  nav ul li, .bottomnav {
    display: none;
  }
  nav div.icon {
    float: right;
    display: block;
    margin-top: 16px;
  }
  nav div.icon a img {
    width: 30px;
    height: 28px;
  }

  nav.responsive {
    height: 100vh; 
  }
  nav.responsive ul {
    display: block;
    clear: both;
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
  }
  nav.responsive ul li {
    display: block;
    font-size: 30px; line-height: 75px;
    margin: 0;
  }
  nav.responsive ul li a {
    display: block;
    width: 50vw;
  }
}

@media screen and (max-width: 450px) {
  nav.responsive ul li {
    font-size: 6.5vw; line-height: 16.5vw;
  }
}