/* --------------------------------common------------------------------ */
.sec {position: relative; width:100%;}
.sec .inner {position:relative; width: 92%; margin: 0 auto;}
.title {font-size: 3.5rem; font-weight: 900; text-align: center; }
.title .underline {position: relative; z-index: 10;}
.title .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 100%; height: 60%; z-index: -1;}
/* --------------------------------common end------------------------------ */


/* --------------------------------sec_01------------------------------ */
.sec_01 {display: flex; align-items: center; justify-content: center; width: 100%; padding: 11rem 0; background: url(../images/sub/sec_01_bg.jpg) no-repeat center bottom/cover; overflow: hidden;}
.sec_01 .inner {max-width: 1264px;}
.sec_01 .title {width: 50%; max-width: 32.375rem; margin: 0 auto}
.sec_01 .title img {display: block; width: 100%;}
.sec_01 figure {position: relative; width: 36%; max-width: 23.625rem; margin: -3rem auto 0; transform: translateX(-10%) rotate(0deg); animation: move 1s infinite steps(2); z-index: 10;}
.sec_01 figure img {display: block; width: 100%;}
.sec_01 .scorll {position: absolute; left: 50%; bottom: 5.125rem; width: 1.625rem ; height: 4rem; margin-left: -0.8125rem; background: url(../images/ico_scroll.svg) no-repeat center center/100% auto; z-index: 99;  opacity: 0; animation: scroll 1.4s ease infinite;}

.sec_01 .footprint_wrap {position: absolute; left: 50%; top: 50%; width: 100%; max-width: 1024px; height: 420px; transform: translate(-50%,-10%);}
.sec_01 .footprint_wrap [class^="footprint_"] {position: absolute; opacity: 0; transition: opacity 0.5s;}
.sec_01 .footprint_wrap [class^="footprint_"].on {opacity: 1;}
.sec_01 .footprint_wrap img {display: block; width: 100%;}
.sec_01 .footprint_01 {left: 2%; top: 22%; width: 2.5rem;}
.sec_01 .footprint_02 {left: 0%; top: 50%; width: 2.625rem;}
.sec_01 .footprint_03 {left: 24%; bottom: 25%; width: 3.625rem;}
.sec_01 .footprint_04 {left: 30%; bottom: 2%; width: 3.625rem;}
.sec_01 .footprint_05 {left: 66%; bottom: 30%; width: 3.5rem;}
.sec_01 .footprint_06 {left: 74%; bottom: 17%; width: 3.5rem;}
.sec_01 .footprint_07 {right: 3%; top: 30%; width: 3rem}
.sec_01 .footprint_08 {right: 6%; top: 2%; width: 3rem;}
.sec_01 .footprint_01.on {transition-delay: 0.3s;}
.sec_01 .footprint_02.on {transition-delay: 0.6s;}
.sec_01 .footprint_03.on {transition-delay: 0.9s;}
.sec_01 .footprint_04.on {transition-delay: 1.2s;}
.sec_01 .footprint_05.on {transition-delay: 1.5s;}
.sec_01 .footprint_06.on {transition-delay: 1.8s;}
.sec_01 .footprint_07.on {transition-delay: 2.1s;}
.sec_01 .footprint_08.on {transition-delay: 2.4s;}
@media screen and (max-width: 1400px) {
    .sec_01 .title {max-width: 20rem;}
    .sec_01 figure {max-width: 18rem; margin: -1.5rem auto 0;}
    .sec_01 .footprint_wrap {max-width: 800px; height: 340px;;}
    /* .sec_01 .footprint_01 {top: 14%;}
    .sec_01 .footprint_03 {bottom: 30%;}
    .sec_01 .footprint_05 {bottom: 36%;}
    .sec_01 .footprint_08 {top: -4%;} */
}/* lg */
@media screen and (max-width: 1024px) {
    .sec_01 figure {margin: -2.5rem auto 0;}
    .sec_01 .footprint_wrap {max-width: 700px; height: 320px;}
}/* md */
@media screen and (max-width: 767px) {
    .sec_01 {display: flex; align-items: center; height: calc(var(--var, 1vh) * 100); padding: 0; background: url(../images/sub/sec_01_bg_mo.jpg) no-repeat center center/420px auto #EAF2DA;}
    .sec_01 .inner {position: static;}
    .sec_01 .title {width: 74%; margin: 4rem auto 0;}
    .sec_01 figure {width: 54%; margin: -1.5rem auto 0;}
    .sec_01 .footprint_wrap {max-width: 420px; height: 580px; transform: translate(-50%, -50%);}
    .sec_01 .footprint_01 {left: 58%; top: 8%; width: 2rem; transform: rotate(100deg);}
    .sec_01 .footprint_02 {left: 40%; top: 0%; width: 2.125rem; transform: rotate(110deg);}
    .sec_01 .footprint_03 {left: 0%; top: 24%; bottom: auto; width: 3.125rem; transform: rotate(110deg);}
    .sec_01 .footprint_04 {display: none;}
    .sec_01 .footprint_05 {left: 4%; top: 76%; bottom: auto; width: 3rem; transform: rotate(80deg);}
    .sec_01 .footprint_06 {display: none;}
    .sec_01 .footprint_07 {left: 34%; top: auto; bottom: -10%; width: 2.5rem; transform: rotate(60deg);}
    .sec_01 .footprint_08 {left: 50%; top: auto; bottom: 2%; width: 2.5rem; transform: rotate(60deg);}
    .sec_01 .footprint_01.on {transition-delay: 0.3s;}
    .sec_01 .footprint_02.on {transition-delay: 0.6s;}
    .sec_01 .footprint_03.on {transition-delay: 0.9s;}
    .sec_01 .footprint_05.on {transition-delay: 1.2s;}
    .sec_01 .footprint_07.on {transition-delay: 1.5s;}
    .sec_01 .footprint_08.on {transition-delay: 1.8s;}

    .sec_01 .link_wrap {right: 4%; top: 7rem;}
}/* sm */
/* --------------------------------sec_01 end------------------------------ */


/* --------------------------------sec_02 common------------------------------ */
.sec_02 {padding: 10rem 0 6.75rem; background-color: #005E58;}
.sec_02 > [class^="img_"] {position: absolute;}
.sec_02 > .img_01 {left: 10%; top: 30%; width: 159px; height: 133px; background: url(../images/sub/sec_02_img_01.png) no-repeat center center/cover;}
.sec_02 > .img_02 {left: 5%; top: 70%; width: 118px; height: 155px; background: url(../images/sub/sec_02_img_02.png) no-repeat center center/cover;}
.sec_02 > .img_03 {right: 8%; top: 15%; width: 120px; height: 127px; background: url(../images/sub/sec_02_img_03.png) no-repeat center center/cover;}
.sec_02 .inner {max-width: 1320px;}
.sec_02 .title {margin-bottom: 2.5rem; color: #ffffff;}
.sec_02 .title .underline::before {background-color: #84995A;}
.sec_02 .slide_wrap {position: relative; width: 100%;}
.sec_02 .swiper-container {width: calc(100% - 13rem); max-width: 1100px;}
.sec_02 .slide_wrap [class^="cont_0"] {display: flex; align-items: center; justify-content: center; width: 100%; height: 37.5rem; background: url(../images/sub/sec_02_cont_bg.jpg) no-repeat center center/cover; text-align: center;  opacity: 0;}
.sec_02 .slide_wrap .swiper-slide-active [class^="cont_0"]  {opacity: 1;}
.sec_02 .slide_wrap .control::after {content: ""; position: absolute; top: 50%; right: 0; width: 5.5rem; height: 5.5rem; transform: translateY(-50%); z-index: 11;}
.sec_02 .slide_wrap .control.on::after {display:none;}

.sec_02 .slide_wrap .btn_prev,
.sec_02 .slide_wrap .btn_next {position: absolute; top: 50%; width: 5.5rem; height: 5.5rem; transform: translateY(-50%); z-index: 10; cursor: pointer;}
.sec_02 .slide_wrap .btn_prev {left: 0; background: url(../images/sub/sec_02_btn_bg.png) no-repeat center center/100% auto;}
.sec_02 .slide_wrap .btn_next {right: 0; background: url(../images/sub/sec_02_btn_bg.png) no-repeat center center/100% auto;}
.sec_02 .slide_wrap .btn_prev::after, 
.sec_02 .slide_wrap .btn_next::after{content: ""; position: absolute; left: 50%; top: 50%; width: 4.25rem; height: 4.25rem; transform: translate(-50%,-56%);}
.sec_02 .slide_wrap .btn_prev::after {background: url(../images/sub/sec_02_btn_prev_modi.png) no-repeat center center/100% auto;}
.sec_02 .slide_wrap .btn_next::after {background: url(../images/sub/sec_02_btn_next_modi.png) no-repeat center center/100% auto;}
.sec_02 .slide_wrap .swiper-button-disabled {opacity: 0 !important; pointer-events: none !important; animation: none !important;}
.sec_02 .slide_wrap .control.blink .btn_next::after {animation: blink 2s infinite ease-in-out;}
.sec_02 .cont_wrap {width: calc(100% - 6rem);}
.sec_02 .slide_title {position: relative; display: inline-block;}
.sec_02 .slide_title .bg  {position: absolute; left: 50%; top: 50%; width: 102%; height: 116%; background-color: #ffffff; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1);border-radius: 31.25rem;  transform: translate(-51%,-50%);}
.sec_02 .slide_title .text {position: relative; display: block; padding: 0.625rem 2.375rem; font-weight: 700; font-size: 2.125rem; border-radius: 31.25rem; color: #ffffff; background-color: #00513F; z-index: 10;}
.sec_02 .slide_title_modi .text {background-color: #ffffff; color: #00513F; border: 1px solid #00513F;}
@media screen and (max-width: 1660px) {
    .sec_02 > [class^="img_"] {transform: scale(0.8);}
    .sec_02 > .img_01 {left: 2%; top: 0%;}
    .sec_02 > .img_02 {left: 0%; top: 80%;}
    .sec_02 > .img_03 {right: 0%; top: 5%;}
}/* lg */
@media screen and (max-width:1080px) {
    .sec_02 .slide_wrap [class^="cont_0"] {height: 35rem;}
}/* md */
@media screen and (max-width:1024px) {
    .sec_02 .title {font-size: 3rem;}
    .sec_02 .swiper-container {width: calc(100% - 10rem);}
    .sec_02 .slide_wrap [class^="cont_0"] {height: 32rem}
    .sec_02 .slide_wrap .btn_next,
    .sec_02 .slide_wrap .btn_prev {width: 4rem; height: 4rem;}
    .sec_02 .slide_title .text {font-size: 1.5rem;}
}/* md */
@media screen and (max-width:767px) {
    .sec_02 {padding: 8rem 0 2rem;}
    .sec_02 > [class^="img_"] {transform: scale(0.5);}
    .sec_02 > .img_01 {left: 2%; top: 2%; transform-origin: left top;}
    .sec_02 > .img_02 {left: 0%; top: 80%; transform-origin: left top;}
    .sec_02 > .img_03 {right: 2%; top: 5%; transform-origin: right top;}

    .sec_02 .title {font-size: 2.5rem;}
    .sec_02 .swiper-container {width: calc(100% - 4rem);}
    .sec_02 .slide_wrap .btn_next,
    .sec_02 .slide_wrap .btn_prev {width: 3.5rem; height: 3.5rem;}
    .sec_02 .slide_wrap .btn_prev::after, 
    .sec_02 .slide_wrap .btn_next::after{width:2.75rem; height: 2.75rem;}

    .sec_02 .slide_title .bg {width: 106%; height: 120%;}
    .sec_02 .slide_title .text {font-size: 1.25rem;}
    .sec_02 .slide_wrap [class^="cont_0"] {height: 43rem;}
}/* sm */
/* --------------------------------sec_02 common end------------------------------ */


/* --------------------------------sec_02 cont_01------------------------------ */
.sec_02 .cont_01 .desc {margin-bottom: 3.125rem; font-size: 1.875rem; font-weight: 500; line-height: 160%;}
.sec_02 .cont_01 .radio_wrap {position: relative; padding: 3rem 0 4rem; background-color: #FBFBF8;}
.sec_02 .cont_01 .radio_wrap::after {content: ""; position: absolute; left: -4%; top: -8%; width: 5.625rem; height: 6rem; background: url(../images/sub/sec_02_cont_01_img_01.png) no-repeat center center/100% auto;}
.sec_02 .cont_01 .radio_wrap h6 {font-size: 1.875rem; line-height: 160%; font-weight: 900; color: #005E58;}
.sec_02 .cont_01 .radio_wrap h6 span {display: inline-block; height: 100%; border-bottom: 2px solid #ACDBD8;}
.sec_02 .cont_01 .radio_wrap ul {display: flex; justify-content: space-between; width: 100%; max-width: 862px; margin: 2.25rem auto 0;}
.sec_02 .cont_01 .radio_wrap input[type="radio"] + label {display: inline-block; padding: 1.125rem 2rem; border: 2px solid #005E58; color: #333333; cursor: pointer; font-size: 1.625rem; font-weight: 600; border-radius: 31.25rem; background-color: #FBFBF8; line-height: 140%;}
.sec_02 .cont_01 .radio_wrap input[type="radio"] + label:hover {border: 2px solid #333333; color: #ffffff;background-color: #333333;}
.sec_02 .cont_01 .radio_wrap input[type="radio"] + label i {vertical-align: 0.1rem;}
.sec_02 .cont_01 .radio_wrap input[type="radio"]:checked + label {border: 2px solid #333333; color: #ffffff;background-color: #333333;}
@media screen and (max-width:1200px) {
    .sec_02 .cont_01 .desc {margin-bottom: 2.5rem; font-size: 1.5rem;}
    .sec_02 .cont_01 .radio_wrap h6 {font-size: 1.5rem;}
    .sec_02 .cont_01 .radio_wrap ul {max-width: 580px;}
    .sec_02 .cont_01 .radio_wrap input[type="radio"] + label {padding: 1rem 1.25rem; font-size: 1.25rem;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_02 .cont_01 .desc {margin-bottom: 1.5rem; font-size: 1.25rem;}
    .sec_02 .cont_01 .radio_wrap h6 {font-size: 1.25rem;}
    .sec_02 .cont_01 .radio_wrap ul {max-width: 440px;}
    .sec_02 .cont_01 .radio_wrap input[type="radio"] + label { padding: 0.75rem 1rem;  font-size: 1rem;}
}/* md */
@media screen and (max-width:767px) {
    .sec_02 .cont_01 .cont_wrap {width: calc(100% - 4rem);}
    .sec_02 .cont_01 .desc {font-size: 1.315rem;}
    .sec_02 .cont_01 .radio_wrap {padding: 2rem 0 3rem;}
    .sec_02 .cont_01 .radio_wrap h6 {font-size: 1.25rem;}
    .sec_02 .cont_01 .radio_wrap ul {flex-wrap: wrap; max-width: 220px; margin: 1.75rem auto 0;;}
    .sec_02 .cont_01 .radio_wrap li {width: 48%;}
    .sec_02 .cont_01 .radio_wrap input[type="radio"] + label {width: 100%; padding: 0.75rem 0.5rem;}
}/* sm */
/* --------------------------------sec_02 cont_01 end------------------------------ */


/* --------------------------------sec_02 cont_02------------------------------ */
.sec_02 .cont_02 .img_wrap {display: flex; width: 100%; justify-content: center; align-items: center; margin-top: 2rem; opacity: 0; transition: opacity 0.5s;}
.sec_02 .cont_02.on .img_wrap {opacity: 1; transition-delay: 0.4s;}
.sec_02 .cont_02 .img_wrap figure {position: relative; width: 25%;}
.sec_02 .cont_02 .img_wrap img {display: block; width: 100%;}
.sec_02 .cont_02 .img_wrap .img_01 {transform: translateX(1rem);}
.sec_02 .cont_02 .img_wrap .img_02 {position: relative; z-index: 2;}
.sec_02 .cont_02 .img_wrap .img_03 {transform: translateX(-1rem);}
.sec_02 .cont_02 .text_box {position: absolute; left: 50%; top: 50%; width: 100%; }
.sec_02 .cont_02 .text_box span {display: inline-block; padding: 0.375rem 1.25rem; color: #ffffff; background-color: #00BDB2; font-size: 1.125rem; font-weight: 600; border-radius: 31.25rem;}
.sec_02 .cont_02 .text_box h6 {margin: 0.35rem 0; font-size: 1.875rem; font-weight: 500; line-height: 140%;}
.sec_02 .cont_02 .text_box h6 b {font-size: 3.75rem; color: #00513F; font-weight: 900;}
.sec_02 .cont_02 .text_box p {font-size: 1rem; font-weight: 500; color: #A5A5A5;}
.sec_02 .cont_02 .img_01 .text_box {transform: translate(-50%,-50%) rotate(-3deg);}
.sec_02 .cont_02 .img_03 .text_box {transform: translate(-50%,-50%) rotate(3deg);}
.sec_02 .cont_02 .desc {margin-top: 1.5rem; font-size: 1.375rem; font-weight: 500; line-height: 160%; word-break: keep-all; opacity: 0; transition: opacity 0.5s; white-space: nowrap;}
.sec_02 .cont_02.on .desc {opacity: 1; transition-delay: 0.8s;}
.sec_02 .cont_02 .desc span {font-weight: 700;}
@media screen and (min-width:767.1px) {
    .sec_02 .cont_02 .img_wrap .img_sm {display: none !important;}
}/* md~ */
@media screen and (max-width:1320px) {
    .sec_02 .cont_02 .img_wrap figure {width: 30%;}
    .sec_02 .cont_02 .text_box span {font-size: 1rem;}
    .sec_02 .cont_02 .text_box h6 {font-size: 1.5rem;}
    .sec_02 .cont_02 .text_box h6 b {font-size: 3.15rem;}
    .sec_02 .cont_02 .text_box p {font-size: 0.915rem;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_02 .cont_02 .img_wrap figure {width: 28%;}
    .sec_02 .cont_02 .text_box h6 {font-size: 1.25rem;}
    .sec_02 .cont_02 .text_box h6 b {font-size: 2.75rem;}
    .sec_02 .cont_02 .text_box p {font-size: 0.815rem;}
    .sec_02 .cont_02 .desc {font-size: 1.25rem;}
}/* md */
@media screen and (max-width: 900px) {
    .sec_02 .cont_02 .img_wrap figure {width: 35%;}
}/* md */
@media screen and (max-width:767px) {
    .sec_02 .cont_02 .img_wrap .img_lg {display: none !important;}
    .sec_02 .cont_02 .text_box h6 {font-size: 1.125rem;}
    .sec_02 .cont_02 .text_box h6 b {font-size: 1.5rem;}
    .sec_02 .cont_02 .img_wrap {flex-wrap: wrap; max-width: 200px; margin: 2rem auto 0;}
    .sec_02 .cont_02 .img_wrap figure {width: 88%;}
    .sec_02 .cont_02 .img_wrap .img_01 {transform: translate(-2rem,0);}
    .sec_02 .cont_02 .img_wrap .img_02 {width: 120px; margin-top: -3.5rem;}
    .sec_02 .cont_02 .img_wrap .img_03 {margin-top: -3.5rem; transform: translate(2rem,0);} 
    .sec_02 .cont_02 .img_01 .text_box {top: 50%; transform: translate(-50%,-75%);}
    .sec_02 .cont_02 .img_03 .text_box {top: 50%; transform: translate(-50%,-25%);}
    .sec_02 .cont_02 .desc {margin-top: 0.75rem; font-size: 1.125rem;}
}/* sm */
@media screen and (max-width:400px) {
    .sec_02 .cont_02 .desc {font-size: 1rem;}
}/* sm */
/* --------------------------------sec_02 cont_02 end------------------------------ */


/* --------------------------------sec_02 cont_03------------------------------ */
.sec_02 .cont_03 .desc {margin-top: 3.5rem; font-size: 1.875rem; font-weight: 500; line-height: 180%;}
.sec_02 .cont_03 .desc b {position: relative; font-weight: 900; font-size: 3.75rem; color: #00A07E; z-index: 10;}
.sec_02 .cont_03 .desc span {position: relative; font-weight: 900; font-size: 2.25rem; color: #00A07E; z-index: 10;}
.sec_02 .cont_03 .desc .ani {position: relative;}
.sec_02 .cont_03 .desc .ani::after {content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 50%; background-color: #ABFFC3; transition: width 0.5s}
.sec_02 .cont_03.on .desc .ani::after {width: 100%; transition-delay: 0.4s;}
.sec_02 .cont_03 .img_wrap {position: relative; width: 100%; max-width: 685px; margin: 1rem auto 0; opacity: 0; transition: opacity 0.5s;}
.sec_02 .cont_03.on .img_wrap {opacity: 1; transition-delay: 0.8s;}

.sec_02 .cont_03 .img_wrap img {display: block; width: 100%;}
.sec_02 .cont_03 .img_wrap h6 {position: absolute; left: 50%; top: 50%; width: 100%; font-size: 2.25rem; font-weight: 900; line-height: 148%; color: #00513F; transform: translate(-47%,-59%);}
.sec_02 .cont_03 .img_wrap h6 span {color: #00A07E;}
@media screen and (min-width:767.1px) {
    .sec_02 .cont_03 .img_wrap .img_sm {display: none !important;}
}/* md~ */
@media screen and (max-width:1340px) {
    .sec_02 .cont_03 .desc {margin-top: 3rem; font-size: 1.5rem;}
    .sec_02 .cont_03 .desc b {font-size: 2rem;}
    .sec_02 .cont_03 .desc span {font-size: 1.875rem;}
}/* lg */
@media screen and (max-width:1130px) {
    .sec_02 .cont_03 .img_wrap {max-width: 560px;}
    .sec_02 .cont_03 .img_wrap h6 {font-size: 2rem;}
}/* md1 */
@media screen and (max-width:1024px) {
    .sec_02 .cont_03 .desc {max-width: 400px; margin: 2rem auto 0; font-size: 1.25rem; word-break: keep-all;}
    .sec_02 .cont_03 .desc b {font-size: 2rem;}
    .sec_02 .cont_03 .desc span {font-size: 1.5rem;}
    .sec_02 .cont_03 .img_wrap {max-width: 460px;}
    .sec_02 .cont_03 .img_wrap h6 {font-size: 1.75rem;}
}/* md2 */
@media screen and (max-width:767px) {
    .sec_02 .cont_03 .desc {font-size: 1.315rem;}
    .sec_02 .cont_03 .desc b {font-size: 2rem;}
    .sec_02 .cont_03 .desc span {font-size: 1.5rem;}
    .sec_02 .cont_03 .img_wrap {margin-top: 2rem;}
    .sec_02 .cont_03 .img_wrap .img_lg {display: none !important;}
    .sec_02 .cont_03 .img_wrap .img_sm {max-width: 320px; margin: 0 auto;}
    .sec_02 .cont_03 .img_wrap h6 {transform: translate(-47%,-55%);font-size: 1.5rem;}
}/* sm */
/* --------------------------------sec_02 cont_03 end------------------------------ */   


/* --------------------------------sec_02 cont_04------------------------------ */
.sec_02 .cont_04 .flex_wrap {display: flex; justify-content: space-between; align-items: center; margin-top: 2.25rem;}
.sec_02 .cont_04 .img_wrap {width: 42%;}
.sec_02 .cont_04 .img_wrap img {display: block; width: 100%;}
.sec_02 .cont_04 .text_wrap {position: relative; width: 52%;}
.sec_02 .cont_04 .text_wrap img {display: block; width: 100%;}
.sec_02 .cont_04 .desc {position: absolute; left: 8%; top: 10%; width: 100%; word-break: keep-all; font-size: 1.375rem; font-weight: 500; line-height: 200%; text-align: left;}
.sec_02 .cont_04 .desc span {font-weight: 700;}
@media screen and (min-width:767.1px) {
    .sec_02 .cont_04 .text_wrap .img_sm {display: none !important;}
}/* md~ */
@media screen and (max-width:1320px) {
    .sec_02 .cont_04 .flex_wrap {margin-top: 3rem;}
    .sec_02 .cont_04 .text_wrap {width: 55%;}
    .sec_02 .cont_04 .desc {font-size: 1.25rem;}
}/* lg */
@media screen and (max-width: 1140px) {
    .sec_02 .cont_04 .text_wrap {width: 58%;}
    .sec_02 .cont_04 .desc {font-size: 1.125rem;}
}/* md 01 */
@media screen and (max-width:1024px) {
    .sec_02 .cont_04 .img_wrap {width: calc(100% - 380px); max-width: 280px;}
    .sec_02 .cont_04 .text_wrap {width: 350px;}
}/* md2 */
@media screen and (max-width: 920px) {
    .sec_02 .cont_04 .flex_wrap {position: relative; justify-content: left; flex-direction: row-reverse; max-width: 530px; margin: 2.25rem auto 0;}
    .sec_02 .cont_04 .img_wrap {position: absolute; right: 0; top: 50%; width: 240px; transform: translateY(-50%);}
    .sec_02 .cont_04 .text_wrap {width: 280px;}
    .sec_02 .cont_04 .desc {font-size: 0.915rem;}
}/* md3 */
@media screen and (max-width:767px) {
    .sec_02 .cont_04 .cont_wrap {width: calc(100% - 2rem);}
    .sec_02 .cont_04 .flex_wrap {margin-top: 1.5rem; flex-wrap: wrap; justify-content: center; flex-direction: column-reverse;  max-width: 300px; }
    .sec_02 .cont_04 .img_wrap {position: relative; width: 100%; max-width: 200px; margin: -10% auto 0; transform: translateY(0%); z-index: 10;}
    .sec_02 .cont_04 .text_wrap {width: 100%;}
    .sec_02 .cont_04 .text_wrap .img_lg {display: none !important;}
    .sec_02 .cont_04 .desc {left: 50%; top: 50%; transform: translate(-40%,-50%); line-height: 170%; font-size: 1.125rem;}
}/* sm */
/* --------------------------------sec_02 cont_04 end------------------------------ */


/* --------------------------------sec_02 cont_05------------------------------ */
.sec_02 .cont_05 .img_wrap {width: 100%; max-width: 558px; margin: 3.375rem auto 0;}
.sec_02 .cont_05 .img_wrap img {display: block; width: 100%;}
.sec_02 .cont_05 .desc {margin: 1.25rem 0; font-size: 1.875rem; font-weight: 500; line-height: 160%;}
.sec_02 .cont_05 .btn_comfirm {position: relative; display: block; width: 14.375rem; height: 4.375rem; margin: 0 auto; background: url(../images/sec_05_cont_btn.png) no-repeat center center/100% auto ;cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem; animation: blink 2s infinite ease-in-out;}
@media screen and (max-width: 1200px) {
    .sec_02 .cont_05 .img_wrap {max-width: 480px;}
    .sec_02 .cont_05 .desc {font-size: 1.5rem;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_02 .cont_05 .img_wrap {max-width: 380px;}
    .sec_02 .cont_05 .desc {font-size: 1.5rem;}
}/* md */
@media screen and (max-width:767px) {
    .sec_02 .cont_05 .desc {margin: 2.5rem auto;font-size: 1.25rem;}
    .sec_02 .cont_05 .btn_comfirm {width: 11.375rem; height: 3.375rem; font-size: 1.25rem;}
}/* sm */
/* --------------------------------sec_02 cont_05 end------------------------------ */


/* --------------------------------sec_03------------------------------ */
.sec_03 {padding: 20rem 0 28rem 0; background: url(../images/sub/sec_03_bg.jpg) no-repeat center bottom/cover;}
.sec_03 .title {width: 92%; max-width: 927px; margin: 0 auto;}
.sec_03 .sub_title {width: 70%; max-width: 677px; margin: 1.5rem auto 0;}
.sec_03 .title img, 
.sec_03 .sub_title img {display: block; width: 100%;}
.sec_03 .straw_wrap {position: relative; margin-top: 4rem;}
.sec_03 .straw_wrap figure {width: 10.625rem; margin: 0 auto; transform: translateX(10%);}
.sec_03 .straw_wrap figure img {display: block; width: 100%;}
.sec_03 .text_wrap {position: absolute; left: 50%; top: 15%; width: 100%; transform: translateX(-50%);}
.sec_03 .text_wrap ul {display: flex; flex-wrap: wrap; justify-content: space-between; width: 92%; max-width: 1016px; margin: 0 auto;}
.sec_03 .text_wrap li {position: relative; display: flex; width: 50%; margin-bottom: 4rem; }
.sec_03 .text_wrap li:nth-child(odd) {justify-content: right; padding-right: 8rem; text-align: right;  opacity: 0; transform: translateY(5rem); transition: opacity 0.8s, transform 0.8s;}
.sec_03 .text_wrap li.on:nth-child(odd) {opacity: 1; transform: translateY(0);}
.sec_03 .text_wrap li:nth-child(even) {justify-content: left; padding-left: 8rem; text-align: left; opacity: 0; transform: translateY(calc(45% + 5rem)); transition: opacity 0.8s, transform 0.8s; transition-delay: 0.2s;}
.sec_03 .text_wrap li.on:nth-child(even) {opacity: 1; transform: translateY(45%);}
/* .sec_03 .text_wrap li:nth-child(2) {transition-delay: 0.3s;}
.sec_03 .text_wrap li:nth-child(3) {transition-delay: 0.6s;}
.sec_03 .text_wrap li:nth-child(4) {transition-delay: 0.9s;}
.sec_03 .text_wrap li:nth-child(5) {transition-delay: 1.2s;}
.sec_03 .text_wrap li:nth-child(6) {transition-delay: 1.5s;} */

.sec_03 .text_wrap .text_box {position: relative;}
.sec_03 .text_wrap li:nth-child(4) .text_box::before {content: "[플라스틱 빨대 1개 사용 시 탄소 배출량]"; position: absolute; left: 0; bottom: 0.25rem; width: 100%; font-size: 1rem; color: #AFAFAF; text-align: center;}
.sec_03 .text_wrap .underline {position: relative; color: #008F71; z-index: 10;}
.sec_03 .text_wrap .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 100%; height: 60%; z-index: -1; background-color: #AFFFCA;}
.sec_03 .text_wrap h6 {margin-bottom: 1rem; font-size: 2.375rem; font-weight: 900; color: #005E58;}
.sec_03 .text_wrap h6::after {content: ""; position: absolute; width: 100px; height: 100px; z-index: 10;}
.sec_03 .text_wrap li:nth-child(1) h6::after {left: -25px; top: 25px; width: 86px; height: 108px; background: url(../images/sub/sec_03_img_02.png) no-repeat center center/cover;}
.sec_03 .text_wrap li:nth-child(2) h6::after {right: 5px; top: -25px; width: 104px; height: 107px; background: url(../images/sub/sec_03_img_03.png) no-repeat center center/cover;}
.sec_03 .text_wrap li:nth-child(3) h6::after {left: -15px; top: 0px; width: 123px; height: 137px; background: url(../images/sub/sec_03_img_04.png) no-repeat center center/cover;}
.sec_03 .text_wrap li:nth-child(4) h6::after {right: -15px; top: 20px; width: 128px; height: 54px; background: url(../images/sub/sec_03_img_05.png) no-repeat center center/cover;}
.sec_03 .text_wrap li:nth-child(5) h6::after {left: -30px; top: -30px; width: 129px; height: 129px; background: url(../images/sub/sec_03_img_06.png) no-repeat center center/cover;}
.sec_03 .text_wrap li:nth-child(6) h6::after {right: -85px; top: 30px; width: 132px; height: 155px; background: url(../images/sub/sec_03_img_07.png) no-repeat center center/cover;}
.sec_03 .text_wrap p {position: relative; display: inline-block; padding: 1.25rem 1.5rem; font-size: 1.625rem; font-weight: 600; background-color: #FBF7F7; line-height: 146%; border-radius: 0.625rem;}
.sec_03 .text_wrap li p::after {content: ""; position: absolute;top: 50%;width: 0;height: 0;transform: translateY(-50%);}
.sec_03 .text_wrap li:nth-child(odd) p::after {right: -3rem;border-bottom: 1rem solid transparent;border-top: 1rem solid transparent;border-left: 1.5rem solid #FBF7F7;border-right: 1.5rem solid transparent;}
.sec_03 .text_wrap li:nth-child(even) p::after {left: -3rem;border-bottom: 1rem solid transparent;border-top: 1rem solid transparent;border-left: 1.5rem solid transparent;border-right: 1.5rem solid #FBF7F7;}
@media screen and (max-width: 1200px) {
    .sec_03 {padding: 18rem 0 26rem 0;}
    .sec_03 .title {max-width: 780px;}
    .sec_03 .sub_title {max-width: 580px;}
    .sec_03 .text_wrap h6 {margin-bottom: 0.75rem; font-size: 2.15rem;}
    .sec_03 .text_wrap h6::after {transform: scale(0.7);}
    .sec_03 .text_wrap li:nth-child(6) h6::after {top: 20px;}
    .sec_03 .text_wrap p {font-size: 1.35rem;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_03 {padding: 16rem 0 24rem 0;}
    .sec_03 .title {max-width: 640px;}
    .sec_03 .sub_title {max-width: 440px;}
    .sec_03 .straw_wrap figure {width: 8rem;}
    .sec_03 .text_wrap {top: 10%;}
    .sec_03 .text_wrap li {margin-bottom: 3rem;}
    .sec_03 .text_wrap li:nth-child(odd) {padding-right: 6rem;}
    .sec_03 .text_wrap li:nth-child(even) {padding-left: 6rem;  transform: translateY(calc(40% + 5rem));}
    .sec_03 .text_wrap li.on:nth-child(even) {transform: translateY(40%);}

    .sec_03 .text_wrap h6 {margin-bottom: 0.5rem; font-size: 1.75rem;}
    .sec_03 .text_wrap h6::after {transform: scale(0.6);}
    .sec_03 .text_wrap li:nth-child(odd) h6::after {transform-origin: left top;}
    .sec_03 .text_wrap li:nth-child(even) h6::after {transform-origin: right top;}
    .sec_03 .text_wrap li:nth-child(2) h6::after {top: -15px;}
    .sec_03 .text_wrap li:nth-child(4) h6::after {top: 10px;}
    .sec_03 .text_wrap li:nth-child(5) h6::after {left: -5px; top: -10px;}
    .sec_03 .text_wrap li:nth-child(6) h6::after {right: -50px; top: 30px;}
    .sec_03 .text_wrap p {font-size: 1.15rem;}
}/* md */
@media screen and (max-width:767px) {
    .sec_03 {padding: 16rem 0; background: url(../images/sub/sec_03_bg.jpg) no-repeat right bottom/cover;}
    .sec_03 .sub_title {max-width: 400px;}
    .sec_03 .straw_wrap figure {width: 10rem;}
    .sec_03 .text_wrap {top: 5%;}
    .sec_03 .text_wrap .text_box {padding: 1rem; background-color: #FBF7F7; border-radius: 0.625rem;}
    .sec_03 .text_wrap .text_box::after {content: ""; position: absolute;top: 50%;width: 0;height: 0;transform: translateY(-50%);}
    .sec_03 .text_wrap li:nth-child(odd) .text_box::after {right: -2.75rem;border-bottom: 1rem solid transparent;border-top: 1rem solid transparent;border-left: 1.5rem solid #FBF7F7;border-right: 1.5rem solid transparent;}
    .sec_03 .text_wrap li:nth-child(even) .text_box::after {left: -2.75rem;border-bottom: 1rem solid transparent;border-top: 1rem solid transparent;border-left: 1.5rem solid transparent;border-right: 1.5rem solid #FBF7F7; }
    .sec_03 .text_wrap li:nth-child(4) .text_box::before {bottom: -3rem; margin-left: 30%; width: 110px; text-align: right; word-break: keep-all;}
    .sec_03 .text_wrap li {align-items: baseline; margin-bottom: 12rem;}
    .sec_03 .text_wrap li:nth-child(odd) {padding-right: 0rem;}
    .sec_03 .text_wrap li:nth-child(even) {padding-left: 0rem;  transform: translateY(calc(118% + 5rem)); transition-delay: 0s;}
    .sec_03 .text_wrap li.on:nth-child(even) {transform: translateY(118%);}

    .sec_03 .text_wrap h6 {margin-bottom: 0.5rem; font-size: 1.5rem;}
    .sec_03 .text_wrap h6::after {transform: scale(0.5);}
    .sec_03 .text_wrap li:nth-child(1) h6::after {top: 0px; left: -15px;}
    .sec_03 .text_wrap li:nth-child(2) h6::after {top: -20px;}
    .sec_03 .text_wrap li:nth-child(3) h6::after {left: 0; top: -20px;}
    .sec_03 .text_wrap li:nth-child(4) h6::after {top: 0px;}
    .sec_03 .text_wrap li:nth-child(5) h6::after {left: 0px; top: -30px;}
    .sec_03 .text_wrap li:nth-child(6) h6::after {right: 0px; top: -45px;}

    .sec_03 .text_wrap p {padding: 0rem; font-size: 1rem;}
    .sec_03 .text_wrap li p::after {display: none;}
}/* sm */
/* --------------------------------sec_03 end------------------------------ */


/* --------------------------------sec_03 slider------------------------------ */
.sec_03 .slide_wrap {position: relative; margin: -1rem;}
.sec_03 .swiper-container {position: relative; width: 92%; max-width: 1380px; padding: 0 9rem; overflow: visible;}
.sec_03 .pos_wrap {position: absolute; left: 50%; top: 50%; width: 25rem; height: 25rem; background: url(../images/sub/sec_03_img_08.png) no-repeat center center/contain; z-index: 10; transform: translate(-50%, -50%);}
.sec_03 .pos_wrap p {position: absolute; left: 0; top: 50%; width: 100%; text-align: center; font-size: 1.65rem; color: #005E58; line-height: 160%; font-weight: 600; transform: translateY(-25%);}
.sec_03 .pos_wrap span {font-weight: 800;}
.sec_03 .pos_wrap::after {content: "※ 상기 이미지는 연출된 장면으로 제품의 색상은 모니터와 컴퓨터의 사양에 따라 실물과 차이가 있을 수 있습니다."; position: absolute; left: 50%; bottom: -3rem; transform: translateX(-50%); width: 300%; text-align: center; color: #AFAFAF; font-size: 1rem;}
.sec_03 .slide_wrap [class^="cont_"] {padding: 1rem;}
.sec_03 .slide_wrap figure {width: 100%; height: 0; padding-top: 60%; border: 10px solid #ffffff; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); background-size: cover; background-position: center center; background-repeat: no-repeat; box-sizing: border-box;}
/* padding-top: 66.5%; */
.sec_03 .slide_wrap .btn_next,
.sec_03 .slide_wrap .btn_prev {position: absolute; top: 50%; width: 5.125rem; height: 5.125rem; transform: translateY(-50%); z-index: 10; cursor: pointer;}
.sec_03 .slide_wrap .btn_prev {left: 7rem; background: url(../images/sub/sec_03_btn_prev.png) no-repeat center center/100% auto;}
.sec_03 .slide_wrap .btn_next {right: 6.5rem; background: url(../images/sub/sec_03_btn_next.png) no-repeat center center/100% auto;}
@media screen and (max-width: 1200px) {
    .sec_03 .slide_wrap {margin-top: -10rem;}
    .sec_03 .pos_wrap {width: 22.125rem; height: 22.75rem;}
    .sec_03 .pos_wrap p {font-size: 1.25rem;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_03 .slide_wrap {margin-top: -5rem;}
    .sec_03 .slide_wrap .btn_next,
    .sec_03 .slide_wrap .btn_prev {width: 4rem; height: 4rem;}

    .sec_03 .pos_wrap {width: 20.125rem; height: 20.75rem;}
    .sec_03 .pos_wrap p {font-size: 1.25rem;}
}/* md 1 */
@media screen and (max-width:950px) {
    .sec_03 .slide_wrap [class^="cont_"] {padding: 0.5rem;}
    .sec_03 .slide_wrap figure {border: 5px solid #ffffff;}
    .sec_03 .pos_wrap {width: 18.125rem; height: 18.75rem;}
    .sec_03 .pos_wrap p {font-size: 1.125rem;}
}/* md 2 */
@media screen and (min-width:767.1px) {
    .sec_03 .slide_wrap .text_mo {display: none !important;}
}/* md~ */
@media screen and (max-width:767px) {
    .sec_03 .swiper-container {width: 100%; margin-top: 2rem; padding: 0rem; transform: translateX(-50%);}
    .sec_03 .slide_wrap .btn_next,
    .sec_03 .slide_wrap .btn_prev {width: 3rem; height: 3rem;}
    .sec_03 .slide_wrap .btn_prev {left: 65%;}
    .sec_03 .slide_wrap .btn_next {right: -37%;}

    .sec_03 .pos_wrap {position: relative; left: 0; width: 230px; height: 230px; margin: 0 auto; transform: translate(0,0);}
    .sec_03 .pos_wrap::after {display: none;}
    .sec_03 .slide_wrap .text_mo {width: 92%; margin: 2rem auto 0; color: #AFAFAF; font-size: 1rem; text-align: center;}    
}/* sm */
/* --------------------------------sec_03 slider end------------------------------ */



/* --------------------------------sec_04------------------------------ */
.sec_04 {padding: 10rem 0 6rem; background: url(../images/sub/sec_04_bg.jpg) no-repeat center top/cover;}
.sec_04 .inner {max-width: 1100px; padding: 6.25rem 4rem; box-sizing: border-box; background: url(../images//sub/sec_04_cont_bg.jpg) no-repeat center center/cover;-webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_04 .title {width: 100%; margin-bottom: 2rem; font-size: 3.5rem; line-height: 146%; font-weight: 900; color: #005E58;}
.sec_04 .title .underline::before {background-color: #FFFEDC;}
.sec_04 .sub_title {width: 100%; height: 5.25rem; margin-bottom: 2rem; line-height: 5.25rem; text-align: center; color: #ffffff; font-size: 1.625rem; font-weight: 800; text-indent: 1.5rem; background-position: center center; background-repeat: no-repeat; background-size: auto 100%;}
.sec_04 .add_title {width: 21.5rem; margin: 0 auto 0.815rem;}
.sec_04 .add_title img {display: block; width: 100%;}
.sec_04 .add_box {margin-bottom: 2.5rem; padding: 1.25rem 0; background-color: #F8F8F8; border-radius: 0.5rem;}
.sec_04 .add_desc {line-height: 160%; font-size: 1.375rem; text-align: center; font-weight: 500;}
.sec_04 .add_desc .underline {position: relative; display: inline-block; z-index: 10; font-weight: 800; font-size: 1.625rem; margin-bottom: 0.75rem;}
.sec_04 .add_desc .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 100%; height: 30%; z-index: -1; background-color: #80FFE4; border-radius: 18.75rem;}
.sec_04 .add_desc span {color: #005E58;}
.sec_04 .add_desc em {font-weight: 800; color: #00AE88;}

.sec_04 .top {position: relative; padding-bottom: 4.25rem; border-bottom: 1px solid #CFCFCF;}
.sec_04 .top::after {content: ""; position: absolute; right: 4%; bottom: 16%; width: 11.625rem; height: 11.625rem; background: url(../images/sub/sec_04_top_img.png) no-repeat center center/auto 100%;}
.sec_04 .top .sub_title {background-image: url(../images/sub/sec_04_subtit_02.png);}
.sec_04 .top .info {width: 100%; max-width: 800px; margin: 0 auto 2.375rem;}
.sec_04 .top .info li {display: flex; align-items: flex-start; font-size: 1.375rem; font-weight: 500;}
.sec_04 .top .info li:not(:last-child) {margin-bottom: 0.75rem;}
.sec_04 .top .info .no_title {margin-top: -0.5rem; padding-left: 7.5rem; color: #AFAFAF; font-size: 1.125rem;}
.sec_04 .top .info .color_modi {color: #00C89D; font-size: 1.375rem;}
.sec_04 .top .info li span {display: block;}
.sec_04 .top .info_title {width: 6.5rem; margin-right: 1rem; padding: 0.375rem 0; border-radius: 31.25rem; font-size: 1.125rem; color: #005E58; border: 1px solid #005E58; font-weight: 600; text-align: center;}
.sec_04 .top .info_desc {line-height: 150%; word-break: keep-all; line-height: 180%;}
.sec_04 .top .info_desc b {font-weight: 800;}
.sec_04 .top .info_desc em {position: relative; color: #AFAFAF; text-decoration: line-through;}
.sec_04 .top .info_desc em::after{content: "1만명"; position: absolute; left: 0; bottom: -115%; padding-left: 1.25rem; background: url(../images/sub/sec_04_img_arrow.png) no-repeat left center/1rem auto; color: #00C89D; font-weight: 600;}
.sec_04 .top .btn_apply {position: relative; display: block; width: 14.375rem; height: 4.375rem; margin: 0 auto; line-height: 4.375rem; text-align: center; background: url(../images/sec_06_btn.png) no-repeat center center/100% auto; cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem;}

.sec_04 .mid {padding-top: 4.25rem;}
.sec_04 .mid .sub_title {background-image: url(../images/sub/sec_04_subtit_02.png);}
.sec_04 .mid .sub_title_02 {margin-bottom: 1rem; font-size: 2rem; font-weight: 700; text-align: center; line-height: 140%;}
.sec_04 .mid .sub_title_03 {margin-bottom: 2rem; text-align: center; font-size: 1.5rem; color: #00AE88; font-weight: 900;}
.sec_04 .mid .sub_title_03 .underline {position: relative; z-index: 10;}
.sec_04 .mid .sub_title_03 .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 100%; height: 30%; z-index: -1; background-color: #80FFE4; border-radius: 18.75rem;}

.sec_04 .mid .step {display: flex; justify-content: space-between; align-items: flex-start;}
.sec_04 .mid .step li {width: 32%;}
.sec_04 .mid .step li img {display: block; width: 100%; }

.sec_04 .bot {width: 100%; padding-top: 3.125rem;}
.sec_04 .bot {display: flex; justify-content: space-between; align-items: flex-start;}
.sec_04 .bot .left {position: relative; width: 43%;}
.sec_04 .bot .left::after {content: ""; position: absolute; left: -10%; top: 50%; width: 12.5rem; height: 12.5rem; transform: translateY(-50%); background: url(../images/sub/sec_04_bot_img_01.png) no-repeat center center/100% auto;}
.sec_04 .bot .left::before {content: ""; position: absolute; right: -5%; top: -5%; width: 4.5rem; height: 3.625rem; background: url(../images/sub/sec_04_bot_img_03.png) no-repeat right top/contain;  z-index: 10;}
.sec_04 .bot .left img {display: block; width: 100%;}
.sec_04 .bot .text_wrap {position: absolute; right: 0; top: 50%; transform: translate(-15%,-50%); text-align: right;}
.sec_04 .bot h5 {width: 11.375rem; margin-left: calc(100% - 11.375rem); margin-bottom: 1.125rem;}
.sec_04 .bot h5 img {display: block; width: 100%;}
.sec_04 .bot p {font-size: 1.25rem; font-weight: 600; line-height: 160%;}
.sec_04 .bot p span {font-weight: 900;}

.sec_04 .bot .right {width: 52%;}
.sec_04 .bot .info li {display: flex; justify-content: space-between; align-items: flex-start; font-size: 1.375rem; font-weight: 500;}
.sec_04 .bot .info li:not(:last-child) {margin-bottom: 0.75rem;}
.sec_04 .bot .info_title {display: block; width: 7.25rem; padding: 0.5rem 0; text-align: center; border-radius: 31.25rem; font-size: 1.125rem; font-weight: 600; background-color: #F5F5F5;}
.sec_04 .bot .info_desc {display: block; width: calc(100% - 8.25rem); padding-top: 0.15rem; line-height: 150%; word-break: keep-all;}
.sec_04 .bot .info_desc .font_gs {font-weight: 500;}
.sec_04 .bot .btn_wrap {display: flex; margin-top: 2rem;}
.sec_04 .bot .btn_wrap [class^="btn_"] {display: inline-block; padding: 1rem 1.375rem; border-radius: 31.25rem; font-weight: 700; font-size: 1.25rem; cursor: pointer;}
.sec_04 .bot .btn_wrap .btn_copy {margin-right: 1.25rem; border: 2px solid #00746D; color: #00746D; background-color: #ffffff;} 
.sec_04 .bot .btn_wrap .btn_insta {position: relative; border: 2px solid #00746D; color: #ffffff; background-color: #00746D;}
.sec_04 .bot .btn_wrap .btn_insta::after {content: ""; position: absolute; right: 0; bottom: -50%; width: 2.5rem; height: 3rem; background: url(../images/sub/sec_04_hand.png) no-repeat center/100% auto; animation: blink 2s infinite ease-in-out;}
.sec_04 .bot #myInput {position: absolute; right: 0; bottom: 0; opacity: 0 ; }

.sec_04 .notice {width: 92%; max-width: 1100px; margin: 0 auto; padding: 2.5rem 4rem; box-sizing: border-box; background-color: #005E58; color: #eaeaea; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_04 .notice h6 {margin-bottom: 1.125rem ; font-size: 1.25rem; font-weight: 800;}
.sec_04 .notice h6::before {content: ""; display: inline-block; width: 1.125rem; height: 1.125rem; margin-right: 0.625rem; background: url(../images/ico_notice.svg) no-repeat center center/cover; vertical-align: -0.15rem;}
.sec_04 .notice li {position: relative; padding-left: 1rem; line-height: 140%; font-size: 1.125rem; font-weight: 500; word-break: keep-all;}
.sec_04 .notice li::before {content: ""; position: absolute; left: 0; top: 0.5rem; width: 0.25rem; height: 0.25rem;margin-right: 0.5rem; border-radius: 100%; background-color: #eaeaea; }
.sec_04 .notice li:not(:last-child) {margin-bottom: 0.75rem;}
@media screen and (max-width: 1200px) {
    .sec_04 .add_desc {font-size: 1.25rem;}
    .sec_04 .bot .left::after {width: 11rem; height: 11rem;}
    .sec_04 .bot .info li {font-size: 1.25rem;}
    .sec_04 .bot .btn_wrap [class^="btn_"] {font-size: 1.125rem;}
}/* lg 1 */
@media screen and (max-width:1024px) {
    .sec_04 .add_desc {font-size: 1.125rem;}
    .sec_04 {padding: 8rem 0 4rem;}
    .sec_04 .inner {padding: 6.25rem 2rem;}
    .sec_04 .title {margin-bottom: 3rem; font-size: 3rem;}
    .sec_04 .top::after {bottom: 2%; width: 9rem; height: 9rem;}
    .sec_04 .top .info {max-width: 640px;}
    .sec_04 .top .info li {font-size: 1.25rem;}
    .sec_04 .top .info_title {font-size: 1rem;}

    .sec_04 .bot .left::after {left: -5%; width: 10rem; height: 10rem;}
    .sec_04 .bot .btn_wrap [class^="btn_"] {padding: 0.75rem 1rem; font-size: 1rem;}
    .sec_04 .bot .btn_wrap .btn_copy {margin-right: 0.75rem;}

    .sec_04 .notice {padding: 2.5rem 2rem;}
    .sec_04 .notice h6 {font-size: 1.125rem;}
    .sec_04 .notice li {font-size: 1rem;}
}/* md */
@media screen and (max-width: 900px) {
    .sec_04 .bot .left {width: 46%; max-width: 320px;}
    .sec_04 .bot .left::after {top: -10%; left: 0%; width: 9rem; height: 9rem; transform: translateY(0);}

    .sec_04 .bot .right {width: 52%;}
    .sec_04 .bot .info li {font-size: 1rem;}
    .sec_04 .bot .info_title {font-size: 0.915rem;}
    .sec_04 .bot .info_desc {padding-top: 0.15rem}
}/* md2 */
@media screen and (max-width:767px) {
    .sec_04 {padding: 6rem 0 4rem 0;}
    .sec_04 .inner >div {max-width: 340px; margin: 0 auto;}
    .sec_04 .title {font-size: 2.25rem;}
    .sec_04 .sub_title {height: 4.75rem; line-height: 4.75rem; font-size: 1.5rem;}
    .sec_04 .add_desc {font-size: 1.25rem;}
    .sec_04 .top::after {right: auto; left: 50%; bottom: 4%; width: 8rem; height: 8rem; transform: translateX(60%);}
    .sec_04 .top .info li {flex-wrap: wrap;}
    .sec_04 .top .info li:not(:last-child) {margin-bottom: 1.5rem;}
    .sec_04 .top .info .no_title {margin-top: -1.25rem; padding-left: 0.5rem; line-height: 140%;}
    .sec_04 .top .info_desc {display: block; width: 100%; margin-top: 0.5rem; padding-left: 0.5rem;}
    .sec_04 .top .info_desc i {display: none;}
    .sec_04 .bot .info_desc .font_gs {font-weight: 400;}
    .sec_04 .top .info_title {font-size: 1.125rem;} 
    .sec_04 .top .btn_apply {width: 11.375rem; height: 3.375rem; line-height: 3.375rem;  font-size: 1.25rem;}

    .sec_04 .mid .sub_title_02 {font-size: 1.5rem;}
    .sec_04 .mid .sub_title_03 {font-size: 1.25rem;}
    .sec_04 .mid .step {flex-wrap: wrap;} 
    .sec_04 .mid .step li {width: 100%;}
    .sec_04 .mid .step li:not(:last-child) {margin-bottom: 2rem;}
    /* .sec_04 .mid .step li img {image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden;} */

    .sec_04 .bot {flex-wrap: wrap; padding-top: 5rem;}
    .sec_04 .bot .left {width: 100%; margin-bottom: 2em;}
    .sec_04 .bot .left::after {left: 5%;}
    .sec_04 .bot .right {width: 100%;}
    .sec_04 .bot .info li {flex-wrap: wrap; font-size: 1.25rem;}
    .sec_04 .bot .info li:not(:last-child) {margin-bottom: 1.5rem;}
    .sec_04 .bot .info_title {font-size: 1.125rem;}
    .sec_04 .bot .info_desc {width: 100%; margin-top: 0.5rem; padding-left: 0.5rem;}
    .sec_04 .bot .btn_wrap {justify-content: space-between;}
    .sec_04 .bot .btn_wrap [class^="btn_"] {width: 49%; padding: 1rem 0.5rem; text-align: center;}
    .sec_04 .bot .btn_wrap .btn_copy {margin-right: 0rem;}
}/* sm */
/* --------------------------------sec_04 end------------------------------ */


/* --------------------------------sec_05------------------------------ */
.sec_05 {padding-bottom: 14rem; background: url(../images/sub/sec_05_bg.jpg) no-repeat center top/cover;}
.sec_05 .inner {max-width: 1100px; padding: 2.625rem 4rem; box-sizing: border-box; background-color: #ffffff; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_05 .title {width: 100%; height: 5.25rem; margin-bottom: 2rem; line-height: 5.25rem; text-align: center; color: #ffffff; font-size: 1.625rem; font-weight: 800; text-indent: 1.5rem; background: url(../images/sub/sec_04_subtit_02.png) no-repeat center center/auto 100%;}
.sec_05 .sub_title {margin-bottom: 2.5rem; font-size: 2.25rem; font-weight: 900; color: #009289; text-align: center;}
.sec_05 .sub_title span {color: #00746D;}
.sec_05 .qna li {padding: 1rem; font-size: 1.375rem; font-weight: 600;}
.sec_05 .qna .q {background-color: #F1F2F2; font-weight: 900;}
.sec_05 .qna .a {position: relative; padding: 1rem 1rem 1rem 3rem; line-height: 140%; word-break: keep-all;}
.sec_05 .qna .a_title {position: absolute; left: 1rem; top: 1rem;}
.sec_05 .qna .youtube_wrap {position: relative; width: 100%; max-width: 700px; height: 0; margin: 1.5rem auto 0; padding-top: 44%;}
.sec_05 .qna .youtube_wrap iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.sec_05 .qna .youtube_wrap video {position: absolute; left: 0; top: 0; width: 100%;}

.sec_05 .share {position: relative; width: 92%; max-width: 1100px; margin: 0 auto; padding: 2.625rem 4rem 2.625rem 10rem; box-sizing: border-box; color: #ffffff; background-color: #005E58; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_05 .share_wrap {display: flex; align-items: center; justify-content: center;}
.sec_05 .share figure {position: absolute; left: -5%; top: 50%; width: 13.375rem; transform: translateY(-65%);}
.sec_05 .share figure img {display: block; width: 100%;}
.sec_05 .share h6 {margin-right: 5.625rem; font-size: 2rem; font-weight: 900; color: #ffffff; line-height: 140%;}
.sec_05 .share ul {display: flex;}
.sec_05 .share li {width: 4.25rem; height: 4.25rem;}
.sec_05 .share li:not(:last-child) {margin-right: 1.5rem;}
.sec_05 .share li button {display: block; width: 100%; height: 100%; cursor: pointer;}
.sec_05 .share li.btn_band {background: url(../images/sub/ico_band.svg) no-repeat center center/100% auto;}
.sec_05 .share li.btn_facebook {background: url(../images/sub/ico_facebook.svg) no-repeat center center/100% auto;}
.sec_05 .share li.btn_kakao {background: url(../images/sub/ico_kakaostory.svg) no-repeat center center/100% auto;}
.sec_05 .share li.btn_url {background: url(../images/sub/ico_url.svg) no-repeat center center/100% auto;}
@media screen and (max-width: 1200px) {
    .sec_05 .qna .youtube_wrap {padding-top: 50%;}
    .sec_05 .share figure {left: -2%; width: 12rem; transform: translateY(-75%);}
    .sec_05 .share h6 {margin-right: 3rem; font-size: 1.75rem;}
    .sec_05 .share li {width: 4rem; height: 4rem;}
}/* lg 1 */
@media screen and (max-width:1024px) {
    .sec_05 .inner {padding: 2.625rem 2rem;}
    .sec_05 .sub_title {font-size: 2rem;}
    .sec_05 .qna li {font-size: 1.125rem;}
    .sec_05 .qna .youtube_wrap {width: calc(100% + 2rem); max-width: none; margin: 1rem 0 0 -2rem; padding-top: 60%;}
    .sec_05 .share figure {left: -3%; width: 10rem; transform: translateY(-80%);}
    .sec_05 .share h6 {margin-right: 2rem; font-size: 1.5rem;}
    .sec_05 .share li {width: 3.5rem; height: 3.5rem;}
    .sec_05 .share li:not(:last-child) {margin-right: 1rem;}
}/* md */
@media screen and (max-width:767px) {
    .sec_05 {padding-bottom: 9rem;}
    .sec_05 .qna .a_desc {display: inline-block;}
    .sec_05 .qna .a_desc:not(:last-child) {margin-bottom: 0.5rem;}
    .sec_05 .qna .youtube_wrap {width: calc(100% + 4rem); margin: 1rem 0 0 -3rem;}
    .sec_05 .share {padding: 2.625rem 2rem;}
    .sec_05 .share_wrap {justify-content: left; flex-wrap: wrap;}
    .sec_05 .share figure {left: auto; right: 0; width: 8rem; transform: translateY(-125%);}
    .sec_05 .share h6 {margin: 0 0 1.5rem 0;}
    .sec_05 .share ul {width: 100%;}
}/* sm */
/* --------------------------------sec_05 end------------------------------ */


/* ------ani-------- */
@keyframes blink {
	0% {opacity:1;}
    10% {opacity:1;}
    40% {opacity:0;}
    90% {opacity:1;}
	100% {opacity:1;}
}

@keyframes scroll {
	0% {opacity: 0; transform: translateY(0px);}
    50% {opacity: 1;}
	100% {opacity: 0; transform: translateY(40px);}
}

@keyframes move {
	0% {transform: translateX(-10%) rotate(0deg)}
	100% {transform: translateX(-10%) rotate(-15deg)}
}
/* ------ani end-------- */


/* --------------------------------20230719 add------------------------------ */
.sec_04 .top_hide {display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: -6.25rem; width: calc(100% + 8rem); height: calc(100% + 6.25rem); transform: translateX(-50%); background-color: rgba(0,0,0,0.85); color: #fff; text-align: center; z-index: 20;}
.sec_04 .top_hide .logo {width: 7.5rem; margin: 0 auto 1.5rem;}
.sec_04 .top_hide h6 {margin-bottom: 2.5rem; font-size: 3rem; font-weight: 900;}
.sec_04 .top_hide h6 span {color: #6FEAE2;}
.sec_04 .top_hide p {margin-bottom: 2rem; font-size: 1.5rem; line-height: 148%;}
@media screen and (max-width:1024px) {
    .sec_04 .inner {overflow-x: hidden;}
    .sec_04 .top_hide {width: calc(100% + 8rem)}
}/* md */
@media screen and (max-width:767px) {
    .sec_04 .top_hide {width: calc(200% + 8rem)}
    .sec_04 .top_hide h6 {font-size: 2rem;}
    .sec_04 .top_hide p {font-size: 1.25rem;}
}/* sm */
/* --------------------------------20230719 add end------------------------------ */


/* --------------------------------20230905 add------------------------------ */
.sec_04 .bot .add_text {margin-top: 1.5rem; color: #00C89D; font-size: 1.125rem; line-height: 160%; word-break: keep-all;}
@media screen and (max-width:1100px) {
    .sec_04 .bot .add_text {font-size: 1.05rem;}
}/* lg */
@media screen and (max-width:900px) {
    .sec_04 .bot .add_text .brd {display: none;}
}/* md */
/* --------------------------------20230905 add end------------------------------ */


/* --------------------------------20240826 add------------------------------ */
/* 섹션4 */
.sec_04 {position: relative;}
.sec_04::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 10;}
.sec_04::before {content: ""; position: absolute; top: 18rem; left: 50%; width: 480px; height: 400px; transform: translateX(-50%); z-index: 11; background: url(../images/sub/sec_04_end_img.png) no-repeat center/100% auto;}
/* 섹션5 */
.sec_05 {position: relative;}
.sec_05::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 10;}
@media screen and (max-width: 1200px) {
    /*.sec_04::after {top: -10rem; height: calc(100% + 10rem);}*/
}/* lg */
@media screen and (max-width:1024px) {
    /*.sec_04::after {top: -9rem; height: calc(100% + 9rem);}*/
}/* md */
@media screen and (max-width:767px) {
    .sec_04::before {width: 384px; height: 320px;}
    /*.sec_04::after {top: -11rem; height: calc(100% + 11rem);}*/
}/* sm */
@media screen and (max-width:500px) {
    .sec_04::before {width: 288px; height: 240px;}
}/* sm */
/* --------------------------------20230905 add end------------------------------ */


/* --------------------------------20241209 add------------------------------ */
.sec_06 {padding-bottom: 10rem; background: url(../images/sub/sec_06_bg.jpg) no-repeat center top/cover;}
.sec_06 .inner {max-width: 1100px; padding: 3.5rem 4rem 6rem; background-color: #fff; box-sizing: border-box; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_06 img {display: block; width: 100%;}
.sec_06 h2 {margin-bottom: 5.125rem;}
.sec_06 h3 {font-size: 2rem; font-weight: 800; line-height: 160%;}
.sec_06 h4 {margin-bottom: 2.5rem;}
.sec_06 p {font-size: 1.375rem; font-weight: 500; color: #333; line-height: 150%;}
.sec_06 li {display: flex; align-items: center; width: 100%; gap: 3.75rem; text-align: center;}
.sec_06 li:not(:last-child) {margin-bottom: 3.5rem;}
.sec_06 li >div {flex: 1;}
.sec_06 li:nth-child(1) h3 {color: #F5A834;}
.sec_06 li:nth-child(2) {flex-direction: row-reverse;}
.sec_06 li:nth-child(2) h3 {color: #00C89D;}
.sec_06 li:nth-child(3) {align-items: flex-start;}
.sec_06 li:nth-child(3) .text_wrap {position: relative;}
.sec_06 li:nth-child(3) .text_wrap::after {content: ""; position: absolute; right: 0; top: 100%; width: 13.25rem; height: 11.125rem; background: url(../images/sub/sec_06_img_04.png) no-repeat center/100% auto;}
.sec_06 li:nth-child(3) p {position: absolute; left: 0; top: 50%; width: 100%; color: #fff; transform: translateY(-65%);}
@media screen and (max-width:1024px) {
    .sec_06 {padding-bottom: 8rem;}
    .sec_06 .inner {padding: 2.625rem 2rem 4rem;}
    .sec_06 li {gap: 2.5rem;}
    .sec_06 p {font-size: 1.25rem;}
    .sec_06 li:nth-child(3) .text_wrap::after {top: 95%; width: 11.25rem; height: 9.5rem; }
    .sec_06 li:nth-child(3) p {transform: translateY(-65%);}
}/* md */
@media screen and (max-width:880px) {
    .sec_06 p {font-size: 1.125rem;}
}/* sm */
@media screen and (max-width:767px) {
    .sec_06 {padding-bottom: 6rem;}
    .sec_06 h2 {margin-bottom: 3.125rem;}
    .sec_06 h4 {max-width: 200px; margin: 0 auto 1rem;}
    .sec_06 .img_wrap {max-width: 200px; margin: 0 auto;}
    .sec_06 li {flex-direction: column-reverse; gap: 1rem;}
    .sec_06 li:nth-child(2) {flex-direction: column-reverse;}
    .sec_06 li:nth-child(3) .text_wrap {width: 300px; margin: 0 auto;}
    .sec_06 li:nth-child(3) .text_wrap::after {display: none;}
    .sec_06 li:nth-child(3) p {transform: translateY(-60%);}
}/* sm */
@media screen and (max-width:500px) {

}/* sm */
/* --------------------------------20241209 add end------------------------------ */