.signboard-area section:first-of-type .signboard-ticker {overflow: hidden;}
.signboard-area section:first-of-type .signboard-ticker .ticker-wrap {display: flex; gap: 0 16px; animation: img-ticker 100s linear infinite; width: max-content;}
.signboard-area section:first-of-type .signboard-ticker .ticker-wrap img {max-height: 436px;}
.signboard-area section:nth-of-type(2) {padding: 50px 0 215px; text-align: center;}
.signboard-area section:nth-of-type(2) > h2 + p {margin-bottom: 80px;}
.signboard-area section:nth-of-type(2) > img {width: 100%; max-width: 1042px;}
.signboard-area section:nth-of-type(2) > img:hover {content: url('/work/img/img_signboard_area_hover.jpg');}
.signboard-area section:nth-of-type(3) {padding: 150px 0 170px; background: url('/work/img/bg_design_list.png') no-repeat left top / cover;}
.signboard-area section:nth-of-type(3) > h2 + p {margin-bottom: 70px;}
.signboard-area section:nth-of-type(3) .btn-slide-tab {display: flex; justify-content: center; gap: 0 40px; margin-bottom: 45px;}
.signboard-area section:nth-of-type(3) .btn-slide-tab li:not(:first-child) {padding-left: 40px; border-left: 1px solid #e0e0e0;}
.signboard-area section:nth-of-type(3) .btn-slide-tab li button {position: relative; font-size: 22px; font-weight: 800; line-height: 22px; color: #e0e0e0;}
.signboard-area section:nth-of-type(3) .btn-slide-tab li button.active {color: #111;}
.signboard-area section:nth-of-type(3) .btn-slide-tab li button.active::after {content: ''; position: absolute; top: -2px; right: -14px; width: 10px; height: 10px; border-radius: 50%; background-color: #3a9286;}
.signboard-area section:nth-of-type(3) .signboard-slide {padding-left: 19%; overflow: hidden;}
.signboard-area section:nth-of-type(3) .signboard-slide ul {display: flex; gap: 20px; transition: transform .6s;}
.signboard-area section:nth-of-type(3) .signboard-slide ul li {flex: 0 0 auto; width: 14.7%; height: 527px; transition: width 0.5s; cursor: pointer; overflow: hidden; border-radius: 10px;}
.signboard-area section:nth-of-type(3) .signboard-slide ul li img {width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 10px;}
.signboard-area section:nth-of-type(3) .signboard-slide ul li.is-active {width: 77.7%;}
.signboard-area section:nth-of-type(3) .btn-port-more {margin: 100px auto 0;}

@media screen and (max-width: 1024px) {
    .signboard-area section:first-of-type .signboard-ticker .ticker-wrap img {max-height: 304px;}
    .signboard-area section:nth-of-type(2) {padding: 110px 0;}
    .signboard-area section:nth-of-type(2) > h2 + p {margin-bottom: 40px;}
    .signboard-area section:nth-of-type(2) > ul {display: flex !important; flex-wrap: wrap; justify-content: center; padding: 0 10px;}
    .signboard-area section:nth-of-type(2) > ul li {width: 335px;}
    .signboard-area section:nth-of-type(2) > ul li:not(:last-child) {margin-bottom: 40px;}
    .signboard-area section:nth-of-type(2) > ul li h3 {margin-bottom: 10px; padding-top: 156px; background-repeat: no-repeat; background-position: center top; font-size: 24px; font-weight: 700; line-height: 40px; color: #3a9286;}
    .signboard-area section:nth-of-type(2) > ul li:nth-child(1) h3 {background-image: url('/work/img/img_signboard_mo_01.jpg');}
    .signboard-area section:nth-of-type(2) > ul li:nth-child(2) h3 {background-image: url('/work/img/img_signboard_mo_02.jpg');}
    .signboard-area section:nth-of-type(2) > ul li:nth-child(3) h3 {background-image: url('/work/img/img_signboard_mo_03.jpg');}
    .signboard-area section:nth-of-type(2) > ul li:nth-child(4) h3 {background-image: url('/work/img/img_signboard_mo_04.jpg');}
    .signboard-area section:nth-of-type(2) > ul li p {font-size: 17px; font-weight: 300; line-height: 30px; color: #666;}
    .signboard-area section:nth-of-type(3) {padding: 100px 0 140px; background-image: none;}
    .signboard-area section:nth-of-type(3) > h2 + p {margin-bottom: 30px;}
    .signboard-area section:nth-of-type(3) .btn-slide-tab {gap: 0 20px;}
    .signboard-area section:nth-of-type(3) .btn-slide-tab li:not(:first-child) {padding-left: 20px;}
    .signboard-area section:nth-of-type(3) .btn-slide-tab li button {font-size: 16px; line-height: 16px;}
    .signboard-area section:nth-of-type(3) .btn-slide-tab li button.active::after {width: 5px; height: 5px; right: -10px;}
    .signboard-area section:nth-of-type(3) .signboard-slide {padding-left: 8.5%;}
    .signboard-area section:nth-of-type(3) .signboard-slide ul {gap: 0 9px;}
    .signboard-area section:nth-of-type(3) .signboard-slide ul li {min-width: 108px; height: 251px;}
    .signboard-area section:nth-of-type(3) .signboard-slide ul li.is-active {min-width: 300px;}
}

@keyframes img-ticker {
    0% {
        transform: translateX(0);
    }100% {
        transform: translateX(calc(-50% - 8px));
    }
}