@media (max-width: 1023px) { html { font-size: 9px; } }
/****************************************************** 
main
******************************************************/
#container { width: 100%; overflow: hidden; }

/* main wrapper */
#main { overflow-x: hidden; overflow-y: auto; }
#main .container { width: 100%; max-width: calc(120rem + 6rem); margin: 0 auto; padding-left: 3rem; padding-right: 3rem; }

/* common */
.sec-title { color: #1E2124; font-size: 2.4rem; line-height: 1.5; font-weight: 700; }

.controller { position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: 0.4rem; }
.controller > * { display: inline-flex; align-items: center; justify-content: center; height: 3.6rem; border: 1px solid #CDD1D5; }
.controller > * i { width: var(--krds-icon--size-medium); height: var(--krds-icon--size-medium); }
.controller .pagination { gap: 0.4rem; padding: 0 1.6rem; border-radius: 2.4rem; font-size: 1.5rem; line-height: 1.5; font-weight: 700; }
.controller .pagination .swiper-pagination-current { color: #256EF4; }
.controller .arrow-btn { width: 3.6rem; min-width: 3.6rem; border-radius: 50%; transition: all .3s; }
.controller .arrow-btn .swiper-button-disabled { opacity: 0.6; }
.controller .arrow-btn:hover, .controller .arrow-btn:focus { border-color: #000; }
.controller .more { width: 3.6rem; min-width: 3.6rem; border-radius: 50%; transition: all .3s; }
.controller .more:hover, .controller .more:focus { border-color: #000; background-color: #000; transform: rotate(180deg); }
.controller .more:hover i, .controller .more:focus i { background-color: #fff; }

/* section1 */
.sec1 { padding: 7.6rem 0 4.4rem; }
.sec1 .visual-title { margin-bottom: 0.8rem; color: #1E2124; font-size: 4rem; font-weight: 700; line-height: 1.5; text-align: center; transition: all .3s; opacity: 1; transform: translateY(20px); }
.sec1 .visual-title strong { color: #0B50D0; font-size: 5rem; }
.sec1 .sch-form { width: 100%; max-width: 79.2rem; margin: 0 auto; transition: all .4s .2s; opacity: 0; transform: translateY(20px); }
.sec1 .sch-form .sch-form-area { display: flex; gap: 0.8rem; }
.sec1 .sch-form .sch-form-area .sch-input-wrap { flex: 1; display: flex; align-items: center; justify-content: flex-start; border: 1px solid #000; border-radius: 2rem; box-shadow: 0 0 1px #000; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select { display: inline-block; vertical-align: middle; position: relative; padding: 2.3rem 1.6rem 2.3rem 2.4rem; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select select { display: none; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-btn { position: relative; min-width: 11.2rem; padding: 0.2rem 2.6rem 0.2rem 0; color: #1E2124; font-size: 1.9rem; font-weight: 700; line-height: 2.4rem; text-align: left; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-btn i { display: block; position: absolute; top: 50%; right: 0; width: 2.4rem; height: 2.4rem; transform: translateY(-50%); }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list { display: none; position: absolute; top: calc(100% + 0.4rem); left: 50%; width: 100%; border: 1px solid #000; border-radius: 1.2rem; background: #fff; transform: translateX(-50%); overflow: hidden; z-index: 2; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list > li { font-size: 1.8rem; line-height: 2.4rem; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list > li a { display: block; padding: 1.4rem 1.6rem; width: 100%; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list > li a:hover, .sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list > li a:focus { background: #F5F6F7; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select .select-list > li + li { border-top: 1px solid #ddd; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area { flex: 1; position: relative; border-radius: 2rem; overflow: hidden; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area .sch-input { width: 100%; font-size: 1.9rem; line-height: 2.4rem; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area .sch-input input { width: 100%; height: 7.8rem; padding: 2rem 7.24rem 2rem 1.6rem; border: none; box-shadow: none; background: none; }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area button { position: absolute; right: 2.4rem; top: 50%; width: 4rem; height: 4rem; transform: translateY(-50%); }
.sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area button i { width: 100%; height: 100%; }
.sec1 .sch-form .sch-form-area .sch-btn { display: inline-flex; align-items: center; justify-content: center; gap: 1.6rem; min-width: 8rem; height: 8rem; padding: 2rem 2.4rem; border-radius: 2rem; background: #1E2124; color: #fff; font-size: 1.9rem; font-weight: 700; line-height: 1.5; }
.sec1 .sch-form .sch-form-area .sch-btn i { background-color: #fff; }
.sec1 .sch-form .sch-form-area .sch-btn:hover, .sec1 .sch-form .sch-form-area .sch-btn:focus { background: #0B50D0; }
.sec1 .sch-form .sch-keyword-wrap { display: flex; align-items: center; justify-content: center; gap: 1rem 2.4rem; margin-top: 2.4rem; }
.sec1 .sch-form .sch-keyword-wrap .title { display: inline-block; vertical-align: middle; position: relative; min-width: 8rem; padding-left: 2.8rem; color: #1E2124; font-size: 1.7rem; line-height: 1.5; font-weight: 700; white-space: nowrap; }
.sec1 .sch-form .sch-keyword-wrap .title::before { content: ''; display: block; position: absolute; left: 0; top: 50%; width: 2.4rem; height: 2.4rem; background: url("/images/2025/main/ico-bookmark.svg") no-repeat 50% 50%/auto; transform: translateY(-50%); }
.sec1 .sch-form .sch-keyword-wrap .list { display: inline-flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 0.8rem; }
.sec1 .sch-form .sch-keyword-wrap .list > li a { display: inline-block; padding: 0.85rem 1rem; border: 1px solid #CDD1D5; border-radius: 0.6rem; color: #1E2124; font-size: 1.5rem; line-height: 1.5; transition: all .3s; }
.sec1 .sch-form .sch-keyword-wrap .list > li a:hover, .sec1 .sch-form .sch-keyword-wrap .list > li a:focus { color: #0B50D0; border-color: #0B50D0; }
.sec1.active .visual-title { opacity: 1; transform: translateY(0); }
.sec1.active .sch-form { opacity: 1; transform: translateY(0); }

/* section2 */
.sec2 { display: flex; align-items: flex-start; justify-content: space-between; gap: 2.5rem; padding: 0 0 6.4rem; }
.sec2 .left-area { position: relative; width: calc(100% - 30.9rem); transition: transform .3s, opacity .3s; transition-delay: .5s; opacity: 0; transform: translateY(20px); }
.sec2 .left-area .sec-title { margin-bottom: 2rem; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a { display: block; border-radius: 2rem; border: 1px solid #CDD1D5; overflow: hidden; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .thumb { display: block; position: relative; height: 17.5rem; overflow: hidden; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .thumb:has(img[src*="noimg"]) { background-color: #f4f5f6; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .thumb img { position: absolute; left: 50%; top: 50%; width: 100%; min-height: 100%; object-fit: cover; transition: all .3s; transform: translate(-50%, -50%); }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .thumb img[src*="noimg"] { width: calc(100% - 4rem); max-width: 11.6rem; min-height: 0; aspect-ratio: 116 / 32; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .info { display: block; padding: 2rem; background: #fff; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .info .title { display: block; font-size: 1.7rem; line-height: 1.7; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .info .krds-btn { padding: 0.4rem 0.2rem; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a .info .krds-btn i { margin-left: 0.4rem; }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a:hover .thumb img, .sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a:focus .thumb img { transform: scale(1.05) translate(-50%, -50%); }
.sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a:hover .info .krds-btn, .sec2 .left-area .slide-area .swiper-new-regist .swiper-slide a:focus .info .krds-btn { background: var(--krds-button--color-text-fill-hover); }
.sec2 .right-area { position: relative; width: 28.4rem; transition: transform .3s, opacity .3s; transition-delay: .6s; opacity: 0; transform: translateY(20px); }
.sec2 .right-area .sec-title { margin-bottom: 2rem; }
.sec2 .right-area .list > li { position: relative; padding: 0.8rem; border-radius: 1rem; border: 1px solid #CDD1D5; overflow: hidden; }
.sec2 .right-area .list > li a { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem; position: relative; width: 100%; padding: 1.3rem 2.4rem; border-radius: 0.4rem; background: #fff; }
.sec2 .right-area .list > li a .icon { display: inline-block; vertical-align: middle; width: 4rem; }
.sec2 .right-area .list > li a .info { flex: 1; padding-right: 3rem; line-height: 1.5; }
.sec2 .right-area .list > li a .info .title { display: block; font-size: 1.7rem; font-weight: 700; }
.sec2 .right-area .list > li a .info .text { display: block; font-size: 1rem; }
.sec2 .right-area .list > li a .info i { position: absolute; right: 2.4rem; top: 50%; transform: translateY(-50%); margin-left: 0.4rem; transition: all .3s; }
.sec2 .right-area .list > li a:hover .info i, .sec2 .right-area .list > li a:focus .info i { transform: translateY(-50%) translateX(1rem); }
.sec2 .right-area .list > li::after { content: ''; display: block; position: absolute; left: 0%; top: 50%; width: 300%; height: 100%; background: url("/images/2025/main/sec2-bg.png") repeat 50% 50%/auto 100%; transform: translateY(-50%); z-index: -1; }
.sec2 .right-area .list > li + li { margin-top: 1.2rem; }
.sec2 .right-area .list > li:hover::after, .sec2 .right-area .list > li:focus::after { animation: hoverBg 3s linear infinite; }
.sec2.active .left-area { opacity: 1; transform: translateY(0); }
.sec2.active .right-area { opacity: 1; transform: translateY(0); }

@keyframes hoverBg { 0% { left: 0; }
  100% { left: -100%; } }
/* section3 */
.sec3 { position: relative; padding: 6.4rem 0; }
.sec3 .sec-title { margin-bottom: 2rem; color: #fff; }
.sec3 .list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4rem; }
.sec3 .list > li { padding: 2rem; border-radius: 1.2rem; background: #001732; color: #fff; text-align: center; transition: transform .4s, opacity .4s; opacity: 0; transform: scale(0); }
.sec3 .list > li .thumb { display: block; position: relative; width: 100%; padding-top: 70%; border-radius: 0.8rem; overflow: hidden; }
.sec3 .list > li .thumb:has(img[src*="noimg"]) { background-color: #f4f5f6; }
.sec3 .list > li .thumb img { position: absolute; left: 50%; top: 50%; width: 100%; min-height: 100%; object-fit: cover; transition: all .3s; transform: translate(-50%, -50%); }
.sec3 .list > li .thumb img[src*="noimg"] { width: calc(100% - 4rem); max-width: 11.6rem; min-height: 0; aspect-ratio: 116 / 32; }
.sec3 .list > li .title { display: block; margin: 1.2rem 0 0.4rem; font-size: 1.9rem; line-height: 1.5; font-weight: 700; }
.sec3 .list > li .text { font-size: 1.7rem; line-height: 1.5; opacity: 0.55; }
.sec3 .list > li a { display: inline-block; vertical-align: middle; margin-top: 1.6rem; padding: 0.6rem 3.5rem; border-radius: 2.5rem; background: #0B50D0; color: #fff; font-size: 1.5rem; line-height: 3.2rem; transition: all .3s; }
.sec3 .list > li a i { vertical-align: middle; width: var(--krds-icon--size-medium); height: var(--krds-icon--size-medium); margin-left: 0.4rem; background-color: #fff; }
.sec3 .list > li a:hover, .sec3 .list > li a:focus { background: #1d3869; }
.sec3 .list > li:nth-child(1) { transition-delay: 0.05s; }
.sec3 .list > li:nth-child(2) { transition-delay: 0.1s; }
.sec3 .list > li:nth-child(3) { transition-delay: 0.15s; }
.sec3 .list > li:nth-child(4) { transition-delay: 0.2s; }
.sec3 .list > li:nth-child(5) { transition-delay: 0.25s; }
.sec3 .list > li:nth-child(6) { transition-delay: 0.3s; }
.sec3 .list > li:nth-child(7) { transition-delay: 0.35s; }
.sec3 .list > li:nth-child(8) { transition-delay: 0.4s; }
.sec3::after { content: ''; display: block; position: absolute; left: 50%; top: 0; width: 1000%; height: 100%; background: #052B57; z-index: -1; transform: translateX(-50%); }
.sec3.active .list > li { transform: scale(1); opacity: 1; }

/* section4 */
.sec4 { padding: 6.4rem 0; }
.sec4 .top-area { display: flex; flex-wrap: wrap; gap: 2.8rem; transition: transform .4s, opacity .4s; opacity: 0; transform: translateY(50px); }
.sec4 .top-area > * { width: calc(33.3% - 1.86rem); position: relative; padding: 2rem; border: 1px solid #CDD1D5; border-radius: 2rem; }
.sec4 .top-area .item1 { padding: 2.4rem; }
.sec4 .top-area .item1 .sec-title { margin-bottom: 1.6rem; padding-right: 18.5rem; }
.sec4 .top-area .item1 .slide-area .swiper-slide a { display: block; }
.sec4 .top-area .item1 .slide-area .swiper-slide a .thumb { display: block; position: relative; width: 100%; padding-top: 60%; border-radius: 1.2rem; background-color: #f4f5f6; overflow: hidden; }
.sec4 .top-area .item1 .slide-area .swiper-slide a .thumb img { position: absolute; left: 50%; top: 50%; width: 100%; min-height: 100%; object-fit: cover; transition: all .3s; transform: translate(-50%, -50%); }
.sec4 .top-area .item1 .slide-area .swiper-slide a .thumb img[src*="noimg"] { width: calc(100% - 4rem); max-width: 11.6rem; min-height: 0; aspect-ratio: 116 / 32; }
.sec4 .top-area .item1 .slide-area .swiper-slide a .title { display: block; margin-top: 2rem; font-size: 1.7rem; line-height: 2rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sec4 .top-area .item1 .slide-area .swiper-slide a:focus { outline-offset: -2px; outline-color: #0b50d0; }
.sec4 .top-area .item1 .slide-area .swiper-slide a:hover .thumb img, .sec4 .top-area .item1 .slide-area .swiper-slide a:focus .thumb img { transform: scale(1.05) translate(-50%, -50%); }
.sec4 .top-area .item1 .slide-area .swiper-slide a:hover .title, .sec4 .top-area .item1 .slide-area .swiper-slide a:focus .title { text-decoration: underline; text-underline-offset: 0.4rem; }
.sec4 .top-area .item1 .controller { top: 2.4rem; right: 2.4rem; }
.sec4 .top-area .item2 .list { display: flex; flex-direction: column; gap: 1.6rem; }
.sec4 .top-area .item2 .list > li a { display: block; position: relative; padding: 2.4rem 12rem 2.4rem 2.4rem; border-radius: 1.2rem; color: #fff; line-height: 1.5; }
.sec4 .top-area .item2 .list > li a strong { display: block; margin-bottom: 1.5rem; font-size: 1.9rem; }
.sec4 .top-area .item2 .list > li a strong i.svg-icon { background: #fff; display: inline-block; vertical-align: text-bottom; }
.sec4 .top-area .item2 .list > li a p { font-size: 1.7rem; }
.sec4 .top-area .item2 .list > li a::after { content: ''; display: block; position: absolute; right: 2.4rem; bottom: 2.4rem; background: no-repeat 50% 50%/contain; }
.sec4 .top-area .item2 .list > li:nth-child(2n-1) a { background: #4B89AF; }
.sec4 .top-area .item2 .list > li:nth-child(2n-1) a::after { width: 6.3rem; aspect-ratio: 1 / 1; background-image: url("/images/2025/main/sec4-icon1.png"); }
.sec4 .top-area .item2 .list > li:nth-child(2n) a { background: #5E86B3; }
.sec4 .top-area .item2 .list > li:nth-child(2n) a::after { width: 8.9rem; aspect-ratio: 89 / 82; background-image: url("/images/2025/main/sec4-icon2.png"); }
.sec4 .top-area .item2 .list > li:hover a::after, .sec4 .top-area .item2 .list > li:focus a::after { animation: iconAni 0.6s ease-in-out infinite alternate; }
.sec4 .top-area .item3 { position: relative; }
.sec4 .top-area .item3 .sec-title { margin-bottom: 1.6rem; padding-right: 5rem; }
.sec4 .top-area .item3 .list { padding: 1.2rem 2rem; border-radius: 1.2rem; background: #F2F9FF; }
.sec4 .top-area .item3 .list > li a { display: block; display: flex; align-items: center; position: relative; min-height: 4.4rem; padding: 0 3.2rem 0 0; font-size: 1.5rem; line-height: 2.25rem; transition: all .3s; }
.sec4 .top-area .item3 .list > li a p { display: inline-block; vertical-align: middle; }
.sec4 .top-area .item3 .list > li a .icon { display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; right: 0; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: #fff; transform: translateY(-50%); }
.sec4 .top-area .item3 .list > li a .icon i { width: 1.5rem; height: 1.5rem; background-color: #4C6250; }
.sec4 .top-area .item3 .list > li a:hover, .sec4 .top-area .item3 .list > li a:focus { font-weight: 700; }
.sec4 .top-area .item3 .list > li a:hover .icon, .sec4 .top-area .item3 .list > li a:focus .icon { background: #3B5062; }
.sec4 .top-area .item3 .list > li a:hover .icon i, .sec4 .top-area .item3 .list > li a:focus .icon i { background-color: #fff; }
.sec4 .top-area .item3 .list > li + li { border-top: 1px dashed #8A949E; }
.sec4 .top-area .item3 .controller { top: 2rem; right: 2rem; }
.sec4 .bottom-area { margin-top: 2.4rem; transition: transform .4s, opacity .4s; transition-delay: .4s; opacity: 0; transform: translateY(50px); }
.sec4 .bottom-area .list { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 2.8rem; padding: 2.8rem; border: 1px solid #CDD1D5; border-radius: 2rem; }
.sec4 .bottom-area .list > li { flex: 1; }
.sec4 .bottom-area .list > li a { display: block; text-align: center; }
.sec4 .bottom-area .list > li a > i { display: block; width: 8.5rem; height: 8.5rem; margin: 0 auto; border-radius: 3.2rem; background-color: #F2F9FF; background-position: 50% 50%; background-size: auto; background-repeat: no-repeat; transition: all .45s; transform-origin: 50% 50%; }
.sec4 .bottom-area .list > li a > i.icon1 { background-image: url("/images/2025/main/sec4-icon-menu1.svg"); }
.sec4 .bottom-area .list > li a > i.icon2 { background-image: url("/images/2025/main/sec4-icon-menu2.svg"); }
.sec4 .bottom-area .list > li a > i.icon3 { background-image: url("/images/2025/main/sec4-icon-menu3.svg"); }
.sec4 .bottom-area .list > li a > i.icon4 { background-image: url("/images/2025/main/sec4-icon-menu4.svg"); }
.sec4 .bottom-area .list > li a > i.icon5 { background-image: url("/images/2025/main/sec4-icon-menu5.svg"); }
.sec4 .bottom-area .list > li a > i.icon6 { background-image: url("/images/2025/main/sec4-icon-menu6.svg"); }
.sec4 .bottom-area .list > li a > i.icon7 { background-image: url("/images/2025/main/sec4-icon-menu7.svg"); }
.sec4 .bottom-area .list > li a .text { display: block; margin-top: 1.2rem; font-size: 1.7rem; line-height: 1.5; font-weight: 700; }
.sec4 .bottom-area .list > li a .text > i { width: 1.8rem; height: 1.8rem; vertical-align: -.3rem; }
.sec4 .bottom-area .list > li a:hover > i, .sec4 .bottom-area .list > li a:focus > i { transform: rotateY(180deg); box-shadow: 1px 1px 8px rgba(11, 80, 208, 0.4); }
.sec4 .bottom-area .list > li a:hover .text, .sec4 .bottom-area .list > li a:focus .text { text-decoration: underline; text-underline-offset: 0.4rem; }
.sec4.active .top-area { opacity: 1; transform: translateY(0); }
.sec4.active .bottom-area { opacity: 1; transform: translateY(0); }

@keyframes iconAni { 0% { transform: translateY(0); }
  100% { transform: translateY(-1rem); } }
/****************************************************** 
media query
******************************************************/
@media (max-width: 1240px) { /* section4 */
  .sec4 .top-area { gap: 2.4rem; }
  .sec4 .top-area .item1, .sec4 .top-area .item2 { width: calc(50% - 1.4rem); }
  .sec4 .top-area .item3 { width: 100%; }
  .sec4 .top-area .item2 .list { height: 100%; }
  .sec4 .top-area .item2 .list > li { height: 100%; }
  .sec4 .top-area .item2 .list > li a { display: flex; flex-direction: column; justify-content: center; min-height: 100%; }
  .sec4 .bottom-area .list > li a { width: auto; flex: 1; } }
@media (max-width: 1024px) { /* section3 */
  .sec3 .list { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; } }
@media (max-width: 840px) { /* section2 */
  .sec2 { flex-direction: column; gap: 2.4rem; }
  .sec2 .left-area { width: 100%; }
  .sec2 .right-area { width: 100%; }
  /* section4 */
  .sec4 .top-area .item2 .list > li a p br { display: none; } }
@media (max-width: 768px) { /* section1 */
  .sec1 .sch-form .sch-form-area .sch-btn span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .sec1 .sch-form .sch-keyword-wrap { justify-content: flex-start; flex-wrap: wrap; }
  /* section3 */
  .sec3 .list { grid-template-columns: repeat(2, 1fr); }
  /* section4 */
  .sec4 .top-area .item1, .sec4 .top-area .item2 { width: 100%; }
  .sec4 .top-area .item2 .list > li:nth-child(1n) a::after { bottom: auto; top: 50%; transform: translatey(-50%); }
  .sec4 .top-area .item2 .list > li:hover a::after, .sec4 .top-area .item2 .list > li:focus a::after { animation: unset; }
  .sec4 .bottom-area .list { justify-content: flex-start; gap: 2rem 0.8rem; padding: 2.8rem 1.2rem; }
  .sec4 .bottom-area .list > li { width: calc(33.3% - .8rem); }
  .sec4 .bottom-area .list > li a { padding: 0 1rem; }
  .sec4 .bottom-area .list > li a i { width: 7.2rem; height: 7.2rem; border-radius: 2rem; background-size: 3rem; } }
@media (max-width: 640px) { /* section1 */
  .sec1 .sch-form .sch-form-area { align-items: flex-end; }
  .sec1 .sch-form .sch-form-area .sch-input-wrap { flex-wrap: wrap; gap: 0.8rem; border: none; box-shadow: none; }
  .sec1 .sch-form .sch-form-area .sch-input-wrap .sch-select { padding: 1.3rem 1.6rem 1.3rem 2.4rem; border: 1px solid #000; border-radius: 1.2rem; }
  .sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area { flex: none; width: 100%; border: 1px solid #000; border-radius: 1.2rem; }
  .sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area::before { display: none; }
  .sec1 .sch-form .sch-form-area .sch-btn { border-radius: 1.2rem; } }
@media (max-width: 520px) { /* section1 */
  .sec1 .sch-form .sch-form-area .sch-input-wrap .sch-input-area button { width: 3.2rem; height: 3.2rem; }
  /* section2 */
  .sec2 .left-area .sec-title { padding-bottom: 3.8rem; }
  .sec2 .left-area .controller { top: 3.8rem; }
  /* section3 */
  .sec3 .list { grid-template-columns: repeat(1, 1fr); }
  /* section4 */
  .sec4 .top-area .item1 .sec-title { margin-bottom: 5.6rem; padding-right: 0; }
  .sec4 .top-area .item1 .controller { top: 6.2rem; }
  .sec4 .bottom-area .list > li { flex: none; width: calc(50% - 0.4rem); } }
@media (max-width: 375px) { .sec4 .top-area .item2 .list > li a { padding: 2.4rem 8rem 2.4rem 2.4rem; }
  .sec4 .top-area .item2 .list > li a::after { width: 4.4rem; height: 4.4rem; background-size: cover; }
  .sec4 .bottom-area .list > li a i { width: 6.5rem; height: 6.5rem; background-size: auto 2.5rem; } }