@charset "utf-8";
/* TOURMUCH // Maker : H.J Jeon // E-Mail : jinia21@naver.com // Site : tourmuch.com */

#wrapper.mainpage {
    padding-top: 0 !important;
}


/* Header */
body:not(.scrollOn) .mainpage #header:not(.gnb-open) {
    border-bottom: 1px solid rgba(var(--color-white-rgb),0.1);
    background-color: rgba(var(--color-black-rgb),0.01);
}

body:not(.scrollOn) .mainpage #header:not(.gnb-open) .site-nav-burger span {
    background-color: var(--color-white);
}

body:not(.scrollOn) .mainpage #header:not(.gnb-open) h1 a {
    background-image: url("../img/logo_kor_white.png");
}

body:not(.scrollOn) .mainpage #header:not(.gnb-open) .lang-btn {
    color: var(--color-white);
}

@media screen and (min-width: 1023px) {
    body:not(.scrollOn) .mainpage #header:not(.gnb-open) .gnb .gnb-1a {
        color: var(--color-white);
        text-shadow: 0 1px 2px rgba(var(--color-black-rgb),0.1);
    }

    body:not(.scrollOn) .mainpage #header:not(.gnb-open) .gnb .gnb-1a:hover {
        color: var(--color-point);
    }

    body:not(.scrollOn) .mainpage #header:not(.gnb-open) .gnb .gnb-1a:after {
        background-color: var(--color-point);
    }
}


/* Mainpage */
#mainContainer {
}



/* Mainpage Top */
.main-top {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2rem;
    min-height: 100vh;
    padding: var(--padding-lg) var(--padding-basic);
    padding-top: calc(var(--header-height) + var(--padding-lg));
    color: var(--color-white);
}

.main-top .main-top-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("../img/main_visual01.jpg") no-repeat center bottom / cover;
}

.main-top .main-top-bg:after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: linear-gradient(to bottom,  rgba(159,169,220,1) 0%,rgba(255,255,255,0) 100%);
    content: '';
}

.main-top .main-top-tit {
    display: flex;
    flex-direction: column;
}

.main-top .main-top-tit small br,
.main-top .main-top-tit b br,
.main-top .main-top-tit p br {
    display: none;
}

.main-top .main-top-tit small {
    font-size: clamp(1rem, 3.5vw, 2.25rem);
    font-weight: var(--font-weight-medium);
    color: var(--color-point-hover);
}

.main-top .main-top-tit b {
    line-height: 1.2;
    margin-block: 10px 20px;
    font-size: clamp(2rem, 6vw, 5rem);
    font-weight: var(--font-weight-bold);
    color: var(--color-blue-deep);
}

.main-top .main-top-tit .btn-area {
    margin-top: 2rem;
}

.main-top .main-top-tit .btn-area .btns {
    transition: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.main-top .main-top-tit .btn-area .btns:not(.btns-point) {
    padding-inline: 15px;
    border-color: var(--color-sky);
    background-color: rgba(var(--color-black-rgb),0.5);
    backdrop-filter: blur(5px);
    color: var(--color-sky);
    font-weight: var(--font-weight-medium);
}

.main-top .main-top-link-list ul {
    flex-wrap: wrap;
    align-items: stretch;
    gap: 10px;
}

.main-top .main-top-link-list ul li {
    width: calc(50% - 5px);
}

.main-top .main-top-link-list ul li a {
    position: relative;
    gap: 10px;
    height: 100%;
    padding: var(--padding-basic);
    border: 1px solid rgba(var(--color-white-rgb),0.1);
    background-color: rgba(14,20,32,.7);
    backdrop-filter: blur(5px);
    transition: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    color: var(--color-white);
}

.main-top .main-top-link-list ul li a figure {
    width: 30%;
    max-width: 100px;
    font-size: 0;
}

.main-top .main-top-link-list ul li a .subject {
    line-height: 1.4;
    font-weight: var(--font-weight-medium);
    font-size: clamp(1rem, 3vw, 1.25rem);
}

.main-top .main-top-link-list ul li a span {
    font-size: clamp(0.75rem, 3vw, 0.875rem);
    opacity: 0.7;
}

@media screen and (min-width: 767px) {
    .main-top {
        padding: var(--padding-lg);
    }

    .main-top .main-top-tit small br,
    .main-top .main-top-tit b br,
    .main-top .main-top-tit p br {
        display: block;
    }

    .main-top .main-top-tit b {
        line-height: 1;
    }
}

@media screen and (min-width: 1023px) {
    .main-top {
        gap: 6rem;
    }

    .main-top .main-top-tit .btn-area .btns:not(.btns-point) {
        padding-inline: 30px;
    }

    .main-top .main-top-tit .btn-area {
        margin-top: 3.75rem;
    }

    .main-top .main-top-link-list ul {
        gap: 0;
    }

    .main-top .main-top-link-list ul li {
        width: 24%;
    }

    .main-top .main-top-link-list ul li a {
        gap: 20px;
    }

    .main-top .main-top-link-list ul li a .subject {
        padding-top: 10px;
    }
}

@media screen and (min-width: 1239px) {
    .main-top .main-top-tit .btn-area .btns em {
        position: relative;
    }

    .main-top .main-top-tit .btn-area .btns:not(.btns-point):before {
        position: absolute;
        top: calc(50% - 10px);
        left: calc(50% - 10px);
        width: 20px;
        height: 20px;
        background-color: #FBB584;
        border-radius: 50%;
        transition: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
        opacity: 0;
        content: '';
    }

    .main-top .main-top-tit .btn-area .btns:not(.btns-point):hover {
        border-color: #FBB584;
        text-shadow: 0 1px 2px rgba(var(--color-black-rgb),0.15);
    }

    .main-top .main-top-tit .btn-area .btns:not(.btns-point):hover:before {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
        opacity: 1;
    }

    .main-top .main-top-tit .btn-area .btns.btns-point:hover {
        gap: 6rem;
    }

    .main-top .main-top-link-list ul li a:hover {
        border-color: rgba(var(--color-white-rgb),0.5);
        background-color: rgba(var(--color-point-rgb),0.7);
        transform: translateY(-20px);
    }
}


/* We Need Solution */
.main-weneed {position:relative;padding:7.5rem var(--padding-basic);background:#fff url("../img/main_weneed_bg.jpg") no-repeat 50% 100%;}
.main-weneed .problem-txt {padding:0 6.25%;line-height:1.28;font-size:3.125rem;font-weight:var(--font-weight-light);margin:0 0 4.375rem;}
.main-weneed .we-need-solutions {position:relative;overflow:hidden;padding:2.813rem 6.25%;color:var(--color-white);background:url("../img/main_needsolution_bg.jpg") no-repeat 100% 100%/cover;border-radius:6.25rem;}
.main-weneed .we-need-solutions .slogan {font-weight:var(--font-weight-light);font-size:6.25rem;line-height:1.1;margin:0 0 3rem;}
.main-weneed .we-need-solutions .slogan b {font-weight:var(--font-weight-bold);}
.main-weneed .word-guide {display:flex;flex-direction:column;align-items:flex-end;}
.main-weneed .word-guide .nopm {display:flex;flex-direction:column;width:528px;margin:0 0 2.5rem;}
.main-weneed .word-guide .nopm dt {margin:0 0 0.938rem;}
.main-weneed .word-guide .nopm dt em {display:inline-flex;padding:0.625rem 1.813rem;font-size:1.5rem;background:rgba(15,56,53,.7);border-radius:3.125rem;white-space:nowrap;}
.main-weneed .word-guide .nopm dd {padding-left:1.813rem;line-height:1.5;font-size:1.25rem;}
.main-weneed .all-in-one {padding:7.5rem 6.25% 1.25rem;}
.main-weneed .all-in-one .title {line-height:1.28;font-weight:var(--font-weight-regular);font-size:3.125rem;letter-spacing:-1.5px;white-space:nowrap;margin:0 0 3.125rem;}
.main-weneed .all-in-one .title b {font-weight:var(--font-weight-semibold);color:#42509A;}
.main-weneed .all-in-one .title img {display:block;width:16.25rem;margin:0.562rem 0 0;}
.all-in-one .effect-list {display:flex;justify-content:space-between;}
.all-in-one .effect-list li {padding:3.438rem 0 3.75rem;width:30.71%;text-align:center;background:#fff;border-radius:1.5rem;}
.all-in-one .effect-list li .ico {display:inline-flex;width:8.75rem;height:8.75rem;background:url("") no-repeat center/contain;margin:0 0 1.875rem;}
.all-in-one .effect-list li .ico.no-bacteria {background-image:url("../img/icon_no_bacteria.png");}
.all-in-one .effect-list li .ico.no-fire {background-image:url("../img/icon_no_fire.png");}
.all-in-one .effect-list li .ico.kitchen {background-image:url("../img/icon_kitchen.png");}
.all-in-one .effect-list li .tit {font-size:1.5rem;line-height:1.2;margin:0 0 0.625rem;}
.all-in-one .effect-list li .desc {font-size:1.125rem;line-height:1.44;color:var(--color-gray);white-space:nowrap;}


@media screen and (max-width: 1639px) {
    .main-weneed {padding-block:6vw;}
    .main-weneed .problem-txt {padding:0 3.5%;font-size:3vw;margin:0 0 3vw;}
    .main-weneed .we-need-solutions {padding-inline:3.5%;border-radius:6vw;}    
    .main-weneed .we-need-solutions .slogan {font-size:5vw;}
    .main-weneed .all-in-one {padding:5vw 3.5% 1vw;}
    .main-weneed .all-in-one .title {font-size:3.1vw;margin:0 0 3vw;}
    .main-weneed .all-in-one .title img {width:15.8vw;margin:0.5vw 0 0;}
    .all-in-one .effect-list li {width:32%;}
    .all-in-one .effect-list li .ico {margin:0 0 1.5vw;}
    .all-in-one .effect-list li .tit {font-size:1.6vw;}
    .all-in-one .effect-list li .desc {font-size:1.2vw;}
}

@media screen and (max-width: 1438px) {
    .main-weneed .word-guide {align-items:flex-start;}
    .main-weneed .word-guide .nopm {width:auto;margin:0 0 1rem;}
    .main-weneed .word-guide .nopm dt em {font-size:1.7vw;}
    .main-weneed .word-guide .nopm dd {font-size:1.5vw;}
    .all-in-one .effect-list li {padding:3vw;}
    .all-in-one .effect-list li .ico {width:9vw;height:9vw;}
}

@media screen and (max-width: 1022px) {
    .main-weneed .word-guide .nopm dt {margin:0 0 0.5rem;}
    .main-weneed .word-guide .nopm dt em {padding:0.4rem 1.2rem;font-size:1.05rem;}
    .main-weneed .word-guide .nopm dd {padding:0 1.2rem;font-size:0.95rem;}
    .all-in-one .effect-list {flex-direction:column;gap:12px;}
    .all-in-one .effect-list li {padding:3vw;width:100%;}
    .all-in-one .effect-list li .ico {width:5.62rem;height:5.62rem;}
    .all-in-one .effect-list li .tit {font-size:1.15rem;}
    .all-in-one .effect-list li .desc {font-size:0.9rem;}
}

@media screen and (max-width: 766px) {
    .main-weneed {padding-block:2.2rem;}
    .main-weneed .problem-txt {padding:0;font-size:1.2rem;}
    .main-weneed .we-need-solutions {padding-block:1.5rem;background-position:center;}
    .main-weneed .we-need-solutions .slogan {font-size:1.8rem;margin:0 0 1.5rem;}
    .main-weneed .we-need-solutions .slogan br {display:none;}
    .main-weneed .word-guide .nopm dd br {display:none;}
    .main-weneed .all-in-one {padding:2rem 0 0.5rem;}
    .main-weneed .all-in-one .title {font-size:1.3rem;margin:0 0 1.2rem;}
    .main-weneed .all-in-one .title img {width:8rem;}
    .all-in-one .effect-list li {padding:3.4vw 3.2vw;border-radius:4vw;}
}

/* Setting Case */
.sec-tit {display:flex;margin:0 0 3.125rem;}
.sec-tit .shortcut {display:inline-flex;padding-right:2.625rem;font-weight:var(--font-weight-regular);font-size:3.75rem;line-height:1.2;color:var(--color-basic);text-decoration:none;background:url("../img/icon_shortcut.svg") no-repeat 100% 0.75rem;}
.main-case {padding:7.5rem var(--padding-basic);overflow:hidden;}
.main-case .setting-slider {position:relative;}
.main-case .setting-slider .swiper {overflow:visible;}
.main-case .setting-slider ul li {width:37.5rem;}
.main-case .setting-slider ul li a {display:block;text-decoration:none;}
.main-case .setting-slider .img-box {height:31.25rem;background:url("") no-repeat center/cover;border:1px solid var(--color-line-basic);border-radius:1.5rem;margin:0 0 1.25rem;}
.main-case .setting-slider .case-tit {font-size:1.5rem;line-height:1.2;color:var(--color-basic);}
.main-case .setting-slider .arrow-box {position:absolute;top:-7.875rem;right:0;width:10.625rem;height:5rem;}
.main-case .setting-slider [class^="swiper-button-"] {margin:0;top:0;width:5rem;height:5rem;font-size:1px;color:transparent;overflow:hidden;border:1px solid var(--color-line-basic);border-radius:50%;transition:.2s;}
.main-case .setting-slider .swiper-button-prev {left:0;background:url("../img/icon_prev.png") no-repeat center/1.25rem auto;}
.main-case .setting-slider .swiper-button-prev:hover {background-image:url("../img/icon_prev_on.png");border-color:var(--color-point);}
.main-case .setting-slider .swiper-button-next {right:0;background:url("../img/icon_next.png") no-repeat center/1.25rem auto;}
.main-case .setting-slider .swiper-button-next:hover {background-image:url("../img/icon_next_on.png");border-color:var(--color-point);}

@media screen and (max-width: 1639px) {
    .sec-tit {margin:0 0 3vw;}
    .sec-tit .shortcut {font-size:3.6vw;padding-right:2.5vw;background-position:100% 0.6vw;background-size:1.7vw auto;}
    .main-case {padding-block:6vw;}
    .main-case .setting-slider ul li {width:35vw;}
    .main-case .setting-slider .img-box {height:23vw;margin:0 0 1vw;}
    .main-case .setting-slider .case-tit {font-size:1.6vw;}
    .main-case .setting-slider .arrow-box {top:-7.5vw;width:10vw;height:4.5vw;}
    .main-case .setting-slider [class^="swiper-button-"] {width:4.5vw;height:4.5vw;background-size:1vw auto !important;}
    .main-case .setting-slider .swiper-button-next {background-position:55% 50%;}
}

@media screen and (max-width: 1022px) {
    .main-case .setting-slider ul li {width:25rem;}
    .main-case .setting-slider .img-box {height:20rem;}
    .main-case .setting-slider .case-tit {font-size:1.15rem;}
}

@media screen and (max-width: 766px) {
    .sec-tit {margin:0 0 0.8rem;}
    .sec-tit .shortcut {font-size:1.6rem;padding-right:1.5rem;background-position:100% 0.4rem;background-size:1rem auto;}
    .main-case {padding-block:2.2rem;}
    .main-case .setting-slider ul li {width:20rem;}
    .main-case .setting-slider .img-box {height:15rem;border-radius:1rem;}
    .main-case .setting-slider .arrow-box {}
    .main-case .setting-slider [class^="swiper-button-"] {}
}


/* Notice */
.main-notice {padding:7.5rem var(--padding-basic);background:#F8F9FD;}
.main-notice .sec-tit {justify-content:center;}
.main-notice .sec-tit .shortcut {font-weight:var(--font-weight-bold);}
.main-notice ul {display:flex;justify-content:space-between;}
.main-notice li {width:23.75%;border-top:2px solid var(--color-basic);}
.main-notice li a {display:block;padding:1.25rem 0 0;text-decoration:none;}
.main-notice li .state {display:flex;gap:1.25rem;font-size:1.125rem;margin:0 0 1.5rem;}
.main-notice li .state .brd {color:#00AEEF;}
.main-notice li .state .date {position:relative;padding-left:1.25rem;color:var(--color-gray);}
.main-notice li .state .date::before {content:"";position:absolute;left:0;top:50%;margin-top:-0.5rem;width:1px;height:1rem;background:var(--color-line-basic);}
.main-notice li .tit {font-size:1.5rem;line-height:1.4;color:#000;height:4.25rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 1.875rem;}
.main-notice li .img-box {height:13.75rem;background:url("") no-repeat center/cover;border:1px solid rgba(0,0,0,.1);border-radius:5px;}

@media screen and (max-width: 1639px) {
    .main-notice {padding-block:6vw;}
    .main-notice li a {padding:1vw 0 0;}
    .main-notice li .state {gap:1vw;font-size:1.2vw;margin:0 0 1.2vw;}
    .main-notice li .state .date {padding-left:1vw;}
    .main-notice li .state .date::before {height:0.8vw;margin-top:-0.4vw;}
    .main-notice li .tit {font-size:1.6vw;height:5vw;margin:0 0 1.2rem;}
}

@media screen and (max-width: 1022px) {
    .main-notice ul {flex-wrap:wrap;}
    .main-notice li {width:49%;}
    .main-notice li a {padding:1rem 0 0;}
    .main-notice li:first-child,
    .main-notice li:nth-child(2) {margin:0 0 5vw;}
    .main-notice li .state {gap:0.6rem;font-size:0.95rem;}
    .main-notice li .state .date {padding-left:0.6rem;}
    .main-notice li .state .date::before {height:0.7rem;margin-top:-0.35rem;}
    .main-notice li .tit {font-size:1.15rem;height:auto;text-overflow:ellipsis;white-space:nowrap;}
}

@media screen and (max-width: 766px) {
    .main-notice {padding-block:2.2rem;}
}

@media screen and (max-width: 640px) {
    .main-notice li {width:100%;margin:0 0 5vw;}
    .main-notice li:last-child {margin:0;}
    .main-notice li .tit {margin:0 0 1rem;}
}

/* ------------------------------------------------------------ */




@media screen and (min-width: 639px) {
}

@media screen and (min-width: 767px) {
}

@media screen and (min-width: 979px) {
}

@media screen and (min-width: 1023px) {
}

@media screen and (min-width: 1239px) {
}

@media screen and (min-width: 1340px) {
}

@media screen and (min-width: 1439px) {
}

@media screen and (min-width: 1640px) {
}

@media screen and (min-width: 1840px) {
}