@charset "UTF-8";

body::after {
	position:absolute; 
    width:0; 
    height:0; 
    overflow:hidden; 
    z-index:-1;  
    content:
   	url(../images/camp-fixed-banner-off.png)
   	url(../images/camp-fixed-banner-on.png);
}

html {font-size:62.5%}

.wrap-camp {letter-spacing:-0.01em}
.campaign-wrap {position:relative;width:190.8rem;margin:auto;font-family:'Pretendard';font-size:2.5rem;font-weight:400;color:#1e1e1e;letter-spacing:-0.02em;color:#121212}
.campaign-wrap img {width:100%;max-width:100%}
.campaign-wrap * {box-sizing:border-box}
.campaign-wrap input[type='checkbox'] {position:absolute;left:0;top:0;width:0;height:0;opacity:0}
.campaign-wrap .cont-section {position:relative;background-position:center top;background-repeat:no-repeat;background-size:cover}
.campaign-wrap .cont-section .section-inner {position:relative;height:100%;margin:auto;z-index:9}

.inner-flex-right {display:flex;justify-content:flex-end}

.button {pointer-events:auto;cursor:pointer;border:none;margin:0;font-family:inherit;font-size:inherit;position:relative;display:inline-block;text-align:center}
.button::before,
.button::after {position:absolute;top:0;left:0;width:100%;height:100%}
.button--dione {background: none;font-weight:700;font-size:2.8rem;width:33.3rem;height:10rem;line-height:10rem;vertical-align:middle;border-radius:1.5rem;letter-spacing:0}
.button--dione span {display:inline-block;position:relative;color:#fff}
.button--dione::before {content:'';background:rgb(10,71,52);background:linear-gradient(90deg, rgba(10,71,52,1) 0%, rgba(19,134,90,1) 100%);transition:transform 0.3s cubic-bezier(0.2,1,0.7,1);border-radius:1.5rem;box-shadow:0 0 1rem 0 rgba(0, 0, 0, 0.31)}
.button--dione:hover>span {outline-offset:1.2rem;outline-color:#005B48}
.button--dione:hover::before {transform: scale3d(0.9, 0.8, 1);box-shadow:0 0 2rem 0 rgba(0, 0, 0, 0.31);background:#005b48}
.button--dione::after {content:'';transition:transform 0.3s cubic-bezier(0.2,1,0.7,1);transform:scale3d(0.9, 0.8, 1)}
.button--dione:hover::after {transform:scale3d(1,1,1);outline:4px solid rgba(255, 255, 255, 0.5);-webkit-transition:all 1.25s cubic-bezier(0.19, 1, 0.22, 1);transition:all 2.2s cubic-bezier(0.19, 1, 0.22, 1);border-radius:1.5rem;animation:fadeout 1.2s 1 ease;animation-fill-mode:forwards}
@keyframes fadeout {
	0% {
		opacity: 1;
	}
	
	100% {
		opacity: 0;
	}
}

.campaign-wrap .cont-section.section01 {height:84.9rem;background-image:url(../images/section01-bg.jpg)}
.campaign-wrap .cont-section.section01 .section-inner {width:115.6rem;padding-top:2.8rem}
.campaign-wrap .cont-section.section01 .section-inner .camp-txt-eyebrow {margin-left:0.7rem;font-weight:500;font-size:1.5rem;line-height:2.4rem;color:#242424}
.campaign-wrap .cont-section.section01 .section-inner .camp-txt-eyebrow > span {color:#005b48}
.campaign-wrap .cont-section.section01 .section-inner .camp-txt-eyebrow > em {margin:0 0.7rem}
.campaign-wrap .cont-section.section01 .section-inner h3 {width:53.6rem;height:43.6rem;position:absolute;top:5.3rem;left:-9.5rem}
.campaign-wrap .cont-section.section01 .section-inner .camp-txt {margin-top:38.8rem;font-weight:500;font-size:2.3rem;line-height:3.9rem;letter-spacing:-0.05em}
.campaign-wrap .cont-section.section01 .section-inner .camp-btn {margin-top:3.8rem}
.campaign-wrap .cont-section.section01 .section-inner .camp-btn .button--dione {width:36.2rem;height:10rem;font-weight:800;font-size:3rem}
.campaign-wrap .cont-section.section01 .section-inner .camp-btn .button--dione::before {background:#005b48;border-radius:1rem;box-shadow:0.3rem 0.3rem 0.5rem 0.3rem rgba(0, 0, 0, 0.3)}
.campaign-wrap .cont-section.section01 .section-inner .camp-btn .button--dione:hover::before {background:#2e4763}
.campaign-wrap .cont-section.section01 .section-inner .camp-btn .button--dione:hover::after {border-radius:1rem}

.campaign-wrap .cont-section.section02 {height:90.7rem;background-image:url(../images/section02-bg.jpg)}
.campaign-wrap .cont-section.section02 .section-inner {padding-top:13rem;width:169rem;display:flex;justify-content:flex-end}
.campaign-wrap .cont-section.section02 .section-inner .yt-inner {width:113.4rem;height:63.8rem}
.campaign-wrap .cont-section.section02 .section-inner .yt-inner > .yt-box {width:100%;height:100%}
.campaign-wrap .cont-section.section02 .section-inner .yt-inner > p {font-weight:500;font-size:1.5rem;color:#8893a0;margin-top:1.7rem;text-align:right}

.campaign-wrap .cont-section.section03 {height:102.7rem;background-image:url(../images/section03-bg.jpg)}
.campaign-wrap .cont-section.section03 .section-inner {padding-top:15.5rem;width:132rem}
.campaign-wrap .cont-section.section03 .section-inner .txt-main {width:56rem;height:13.6rem;margin-bottom:6rem}
.campaign-wrap .cont-section.section03 .section-inner .camp-txt {display:flex;flex-direction:column;gap:3rem;font-size:2.4rem;line-height:4rem;letter-spacing:-0.025em;color:#fff}
.campaign-wrap .cont-section.section03 .section-inner .camp-txt p {margin-left:2.3rem}
.campaign-wrap .cont-section.section03 .section-inner .camp-txt span {font-weight:500;color:#b8cfea}
.campaign-wrap .cont-section.section03 .section-inner .camp-txt .txt-img {width:45.9rem;height:15.6rem;margin-left:1.5rem}
.campaign-wrap .cont-section.section03 .section-inner .photo-box {position:absolute;top:67.2rem;left:58.8rem}
.campaign-wrap .cont-section.section03 .section-inner .photo-box > ul {display:flex;gap:1.6rem}
.campaign-wrap .cont-section.section03 .section-inner .photo-box > ul > li {width:29.6rem}
.campaign-wrap .cont-section.section03 .section-inner .photo-box > ul > li > img {width:100%;height:21.3rem}
.campaign-wrap .cont-section.section03 .section-inner .photo-box > ul > li > p {margin-top:1.3rem;font-size:2rem;letter-spacing:-0.025em;color:#cad0d7}

.campaign-wrap .cont-section.section04 {height:122.8rem;background-image:url(../images/section04-bg.jpg)}
.campaign-wrap .cont-section.section04 .section-inner {padding-top:13rem;width:135rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div {width:60rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .txt-main {width:45.1rem;height:14.7rem;margin-bottom:6rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-txt {display:flex;flex-direction:column;gap:3rem;font-weight:500;font-size:2.4rem;line-height:4rem;letter-spacing:-0.025em}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-txt > p {margin-left:2rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-txt .txt-img {width:58rem;height:7.5rem;margin-left:1.4rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-btn {margin-top:31.5rem;margin-left:2rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-btn .button--dione {width:28.3rem;height:7.8rem;line-height:7.8rem;font-weight:800;font-size:2.5rem}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-btn .button--dione::before {background:#8d957e;border-radius:1rem;box-shadow:0.3rem 0.3rem 0.5rem 0.3rem rgba(0, 0, 0, 0.3)}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-btn .button--dione:hover::before {background:#8d957e}
.campaign-wrap .cont-section.section04 .section-inner.inner-flex-right > div .camp-btn .button--dione:hover::after {border-radius:1rem}

.campaign-wrap .cont-section.section05 {height:105.1rem;background-image:url(../images/section05-bg.jpg)}
.campaign-wrap .cont-section.section05 > ul {display:flex;border-top:0.2rem solid #8d957e;border-bottom:0.2rem solid #8d957e}
.campaign-wrap .cont-section.section05 > ul > li {width:25%;height:37.2rem;background-repeat:no-repeat;background-position:center top;background-size:cover;border:0.2rem solid #8d957e}
.campaign-wrap .cont-section.section05 > ul > li:nth-child(1) {background-image:url(../images/section05-photo01.jpg);border-left:0}
.campaign-wrap .cont-section.section05 > ul > li:nth-child(2) {background-image:url(../images/section05-photo02.jpg)}
.campaign-wrap .cont-section.section05 > ul > li:nth-child(3) {background-image:url(../images/section05-photo03.jpg)}
.campaign-wrap .cont-section.section05 > ul > li:nth-child(4) {background-image:url(../images/section05-photo04.jpg);border-right:0}
.campaign-wrap .cont-section.section05 .section-inner {padding-top:6rem;text-align:center}
.campaign-wrap .cont-section.section05 .section-inner .camp-txt {display:flex;flex-direction:column;gap:2.5rem;font-weight:500;font-size:2.4rem;line-height:4rem;letter-spacing:-0.025em}
.campaign-wrap .cont-section.section05 .section-inner .camp-txt .txt-main > img {width:77.8rem;height:11.4rem}
.campaign-wrap .cont-section.section05 .section-inner .camp-btn {margin-top:4rem}
.campaign-wrap .cont-section.section05 .section-inner .camp-btn .button--dione {width:28.3rem;height:7.8rem;line-height:7.8rem;font-weight:800;font-size:2.5rem}
.campaign-wrap .cont-section.section05 .section-inner .camp-btn .button--dione::before {background:#8d957e;border-radius:1rem;box-shadow:0.3rem 0.3rem 0.5rem 0.3rem rgba(0, 0, 0, 0.3)}
.campaign-wrap .cont-section.section05 .section-inner .camp-btn .button--dione:hover::before {background:#8d957e}
.campaign-wrap .cont-section.section05 .section-inner .camp-btn .button--dione:hover::after {border-radius:1rem}

.campaign-wrap .cont-section.section06 {height:85.6rem;background-image:url(../images/section06-bg.jpg)}
.campaign-wrap .cont-section.section06 .section-inner {padding-top:12.9rem;width:112.6rem}
.campaign-wrap .cont-section.section06 .section-inner .txt-main {width:47.7rem;height:16.9rem;margin-bottom:5.5rem}
.campaign-wrap .cont-section.section06 .section-inner .camp-txt {display:flex;flex-direction:column;gap:3rem;font-size:2.4rem;line-height:4rem;letter-spacing:-0.025em;color:#fff}
.campaign-wrap .cont-section.section06 .section-inner .camp-txt > p {margin-left:2rem}
.campaign-wrap .cont-section.section06 .section-inner .camp-txt .txt-img {width:32rem;height:12.6rem;margin-left:0.9rem}

.campaign-wrap .cont-section.section07 {height:74.5rem;background-image:url(../images/section07-img.jpg)}
.campaign-wrap .cont-section.section07 .section-inner {width:132.8rem;padding-top:21rem}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn {margin-top:28.7rem;margin-left:75rem}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn .button--dione {width:38.4rem;height:10.7rem;line-height:10.7rem;font-weight:700;font-size:3.5rem}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn .button--dione span {color:#f1f0ec}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn .button--dione::before {background:#005b48;border-radius:1rem;box-shadow:0.3rem 0.3rem 0.5rem 0.3rem rgba(0, 0, 0, 0.3)}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn .button--dione:hover::before {background:#272e36}
.campaign-wrap .cont-section.section07 .section-inner .camp-btn .button--dione:hover::after {border-radius:1rem}

.campaign-wrap .cont-section.section08 {height:89.8rem;background-image:url(../images/section08-bg.jpg)}
.campaign-wrap .cont-section.section08 .section-inner {padding-top:14rem;width:133.2rem}
.campaign-wrap .cont-section.section08 .section-inner .txt-main {width:70.9rem;height:9.5rem;margin:auto;margin-bottom:5.5rem}
.campaign-wrap .cont-section.section08 .section-inner > ul {display:flex;justify-content:space-between}
.campaign-wrap .cont-section.section08 .section-inner > ul > li {width:41.6rem;background-color:#e0dacb;border-radius:3.1rem;overflow:hidden;transition:all 0.3s}
.campaign-wrap .cont-section.section08 .section-inner > ul > li::before {content:'';display:block;width:100%;height:28.3rem;background-repeat:no-repeat;background-position:center top;background-size:contain}
.campaign-wrap .cont-section.section08 .section-inner > ul > li:nth-child(1)::before {background-image:url(../images/section08-photo01.jpg)}
.campaign-wrap .cont-section.section08 .section-inner > ul > li:nth-child(2)::before {background-image:url(../images/section08-photo02.jpg)}
.campaign-wrap .cont-section.section08 .section-inner > ul > li:nth-child(3)::before {background-image:url(../images/section08-photo03.jpg)}
.campaign-wrap .cont-section.section08 .section-inner > ul > li .list-inner {height:13rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.campaign-wrap .cont-section.section08 .section-inner > ul > li .list-inner p {font-weight:600;font-size:2rem;line-height:3.6rem;letter-spacing:-0.025em;color:#000}
.campaign-wrap .cont-section.section08 .section-inner > ul > li .list-inner h5 {font-weight:600;font-size:2.8rem;line-height:3.6rem;letter-spacing:-0.025em;color:#2a415b}
.campaign-wrap .cont-section.section08 .section-inner > ul > li .list-inner h5 > span {display:inline-block;position:relative;font-weight:800;z-index:0}
.campaign-wrap .cont-section.section08 .section-inner > ul > li .list-inner h5 > span::after {content:'';display:block;width:109%;height:2.2rem;background-color:#7cd9b9;position:absolute;bottom:0;left:-0.3rem;z-index:-1}
.campaign-wrap .cont-section.section08 .section-inner > ul > li:hover {background-color:#aa986a}
.campaign-wrap .cont-section.section08 .section-inner > ul > li:hover .list-inner h5 > span::after {background-color:#aac6a1}
.campaign-wrap .cont-section.section08 .section-inner .txt-info {text-align:center;margin-top:4.5rem;font-size:1.7rem;line-height:3.3rem;color:rgba(255,255,255,0.5)}

.campaign-copyright {font-weight:600;font-size:2rem;letter-spacing:-0.025em}

.camp-fixed-banner {width:12.5rem;height:22.8rem;position:fixed;top:18rem;right:7.4rem;background-repeat:no-repeat;background-position:center center;background-size:contain;transition:all 0.3s;box-shadow:0.3rem 0.2rem 0.5rem rgba(0, 0, 0, 0.5);border-radius:1.5rem;z-index:999}
.camp-fixed-banner.odd {background-image:url(../images/camp-fixed-banner-on.png)}
.camp-fixed-banner.even {background-image:url(../images/camp-fixed-banner-off.png)}
.camp-fixed-banner > a {display:block;width:100%;height:100%}


/* 노트북 배율 스타일 지우지 말 것 */
@media (max-width: 1536px) {
    html {overflow-x:hidden;font-size:50%}
    .wrap-camp {width:1536px}
    .campaign-wrap {width:100%}
    .campaign-wrap img {max-width:100%}    
}