@charset "UTF-8";
@import "../plugin/fontawesome/all.min.css";




/* ===================================================================
    *
    *   publishing desingk v1.0 - Layout Stylesheet
    *   2023-01-02
    *   ------------------------------------------------------------------
    *
    *  TOC:
    *   header
        *   topbar
        *   toolbar
        *   searchbar
        *   gnb
    *   container
    *   footer
        *   footer-top
        *   footer-info
    *   go to top
 *
 * =================================================================== */
 

 @font-face {
    font-family: 'Haas Grot Text R Web';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/HaasGrotTextRWeb-Regular.woff2) format('woff2'),
    url(../../fonts/HaasGrotTextRWeb-Regular.woff) format('woff');
}
@font-face {
    font-family: 'Haas Grot Text R Web';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/HaasGrotTextRWeb-Medium.woff2) format('woff2'),
    url(../../fonts/HaasGrotTextRWeb-Medium.woff) format('woff');
}

 @font-face {
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 300;
    src: url(../../fonts/NunitoSans-Light.woff2) format('woff2'),
    url(../../fonts/NunitoSans-Light.woff) format('woff');
}
@font-face {
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/NunitoSans-SemiBold.woff2) format('woff2'),
    url(../../fonts/NunitoSans-SemiBold.woff) format('woff');
}
@font-face {
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/NunitoSans-Bold.woff2) format('woff2'),
    url(../../fonts/NunitoSans-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/NunitoSans-Black.woff2) format('woff2'),
    url(../../fonts/NunitoSans-Black.woff) format('woff');
}


/* @font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 100;
    src: url(../../fonts/NotoSansKR-Thin.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Thin.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    src: url(../../fonts/NotoSansKR-Light.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Light.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/NotoSansKR-Regular.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Regular.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/NotoSansKR-Medium.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Medium.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/NotoSansKR-Bold.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 900;
    src: url(../../fonts/NotoSansKR-Black.woff2) format('woff2'),
    url(../../fonts/NotoSansKR-Black.woff) format('woff');
} */

@font-face {
    font-family: "Noto Sans KR";
    font-weight: 900;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Black.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 800;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-ExtraBold.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 700;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Bold.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 600;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-SemiBold.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 500;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Medium.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 400;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Regular.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 300;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Light.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 200;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-ExtraLight.woff2")
      format("woff2");
  }
  @font-face {
    font-family: "Noto Sans KR";
    font-weight: 100;
    font-display: swap;
    src: url("../../fonts/woff2/NotoSans-Thin.woff2")
      format("woff2");
  }

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	src: url(../../fonts/Roboto-Regular.woff2) format('woff2'),
	url(../../fonts/Roboto-Regular.woff) format('woff');
}
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 500;
	src: url(../../fonts/Roboto-Medium.woff2) format('woff2'),
	url(../../fonts/Roboto-Medium.woff) format('woff');
}
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 700;
	src: url(../../fonts/Roboto-Bold.woff2) format('woff2'),
	url(../../fonts/Roboto-Bold.woff) format('woff');
}

/* @font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-Light.eot);
    src: url(../../fonts/HKGrotesk-Light.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-Light.woff2) format('woff2'),url(../../fonts/HKGrotesk-Light.woff) format('woff');
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-lightitalic.eot);
    src: url(../../fonts/HKGrotesk-lightitalic.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-lightitalic.woff2) format('woff2'),url(../../fonts/HKGrotesk-lightitalic.woff) format('woff');
    font-weight: 300;
    font-style: italic
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-Regular.eot);
    src: url(../../fonts/HKGrotesk-Regular.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-Regular.woff2) format('woff2'),url(../../fonts/HKGrotesk-Regular.woff) format('woff');
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-italic.eot);
    src: url(../../fonts/HKGrotesk-italic.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-italic.woff2) format('woff2'),url(../../fonts/HKGrotesk-italic.woff) format('woff');
    font-weight: 400;
    font-style: italic
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-Medium.eot);
    src: url(../../fonts/HKGrotesk-Medium.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-Medium.woff2) format('woff2'),url(../../fonts/HKGrotesk-Medium.woff) format('woff');
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-mediumitalic.eot);
    src: url(../../fonts/HKGrotesk-mediumitalic.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-mediumitalic.woff2) format('woff2'),url(../../fonts/HKGrotesk-mediumitalic.woff) format('woff');
    font-weight: 500;
    font-style: italic
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-SemiBold.eot);
    src: url(../../fonts/HKGrotesk-SemiBold.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-SemiBold.woff2) format('woff2'),url(../../fonts/HKGrotesk-SemiBold.woff) format('woff');
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-semibolditalic.eot);
    src: url(../../fonts/HKGrotesk-semibolditalic.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-semibolditalic.woff2) format('woff2'),url(../../fonts/HKGrotesk-semibolditalic.woff) format('woff');
    font-weight: 600;
    font-style: italic
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-Bold.eot);
    src: url(../../fonts/HKGrotesk-Bold.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-Bold.woff2) format('woff2'),url(../../fonts/HKGrotesk-Bold.woff) format('woff');
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: HKGrotesque;
    src: url(../../fonts/HKGrotesk-bolditalic.eot);
    src: url(../../fonts/HKGrotesk-bolditalic.eot?#iefix) format('embedded-opentype'),url(../../fonts/HKGrotesk-bolditalic.woff2) format('woff2'),url(../../fonts/HKGrotesk-bolditalic.woff) format('woff');
    font-weight: 700;
    font-style: italic
} */


/* Skip navigation */
.skipnavi {}
.skipnavi a {display:block; position:absolute; top:-10000px; left:0; z-index:100; width:100%; font-size:13px; text-align: center}
.skipnavi a:focus {position:absolute; top:0; z-index:100; padding:10px 0;background:#ff482f ;font-weight:600;color:#fff}

/* Page Loader */
/* .supports .loading::before,
.supports .loading::after { content: ''; position: fixed; z-index: 1000;}
.supports .loading::before { top: 0; left: 0; width: 100%; height: 100%; background: #f1f3f4;}
.supports .loading::after { top: 50%; left: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%; opacity: 0.4; background: #fff; animation: loaderAnim 0.7s linear infinite alternate forwards;}
@keyframes loaderAnim { 
    to { opacity: 1; transform: scale3d(0.5,0.5,1); }
} */
.loadingbar {display: none;}
.loadingbar.active {display: block;}
.loadingbar.active,
.loadingbar.active::before {content: ''; position: fixed; z-index: 1000;}
.loadingbar.active {top: 50%; left: 50%; width: 230px; height:230px; margin: -115px 0 0 -115px;}
.loadingbar.active::before {z-index: 0; top: 0; left: 0; width: 100%; height: 100%; background-color: #fffbf4;}

/* Loader */
body.ready .loader {display: none;}
.loader {display: flex; position: fixed; width: 100%; height: 100%; z-index: 1001; background-color: #f7f6ff; align-items: center; justify-content: center; flex-direction: column; gap: 2em; font-size: 13px;}
.loader .progress {position: absolute; top: 56%; width: 36%; height: 1px; background: #63340e; transform: scaleX(0); transition: transform 1s; transform-origin: left; z-index: 10; margin: 0 5%;}
.loader .loader-drawing {width: 200px; height:200px;}
.loader .loader-txt {display: none;}
.w-editor .loader {background-color: transparent;}

/* Check supported browsers (notice) */
.no-supports {}


.hover-line { white-space: nowrap; /*overflow: hidden;*/ position: relative; display: inline-block; vertical-align: text-bottom;}
.hover-line::before { content: ''; height: 1px; width: 100%; background: currentColor; position: absolute; top: 92%; transition: transform 0.3s; transform-origin: 0% 50%;}
.hover-line:hover::before { transform: scaleX(0); transform-origin: 100% 50%;}

body {
    /* layout common */
    --k-layout-padding: 40px;

    /* header */
    --k-header-padding: 0 40px;
    /* gng depth1 */
    --k-gnb-height: 80px;
    --k-gnb-a-padding-side: 30px;

	/* Column/item variables */
	--ratio: 1; 				/* image ratio */
	--grid-item-width: 30vw;	/* image width */
	--justify: center;	/* spread columns or center */
	--gap: 2.5vw;				/* column gap and margin for items */
	--rotation: -45deg;			/* section rotation */
	--radius: 4px;				/* image border radius */
	--offset: -20vh;			/* offset of even columns */
	/* content section */
	--radius-small: 4px; 		/* border radius of small images */

    /* --image-gap: 1vw;
	--image-gap-large: 2vw;
    --img-size: 5vw;
	--img-size-large: 14vw; */
}

/* second type */
/* .demo-2 {

} */

/* grid(flex) */
.grid-row {display:flex; width:100%;}
.grid-row.cols-auto > div {flex: 1;}
.grid-row.cols-1 > div {}
.grid-row.cols-2 > div {width:50%;}
.grid-row.cols-3 > div {width:33.33333%;}
.grid-row.cols-4 > div {width:25%;}
.grid-row.cols-5 > div {width:20%;}

body {
    --vw: 1vw;
    --vh: 1vh;
    --vh100: calc(var(--vh) * 100);
    --vw100: calc(var(--vw) * 100);

    --gird-margin: 40px;
    --gird-column-gutter: 32px;
    --columns: 4; /* --columns 값 변경하면서 사용 가능 함(@media) 1/4, 1/5 사용 할 수 있음 */ 
    --grid-width: calc((var(--vw) * 100));
    --grid-width-margin: calc((var(--vw) * 100) - (var(--gird-margin) * 2));
    --col: calc((var(--grid-width) + var(--gird-column-gutter)) / var(--columns));
    --col1: calc((var(--col) * 1));
    --col1-g: calc(var(--col1) - var(--gird-column-gutter));
    --col1g: calc(var(--col1) + var(--gird-column-gutter));
    --col2: calc((var(--col) * 2));
    --col2-g: calc(var(--col2) - var(--gird-column-gutter));
    --col2g: calc(var(--col2) + var(--gird-column-gutter));
    --col3: calc((var(--col) * 3));
    --col3-g: calc(var(--col3) - var(--gird-column-gutter));
    --col3g: calc(var(--col3) + var(--gird-column-gutter));
    --col4: calc((var(--col) * 4));
    --col4-g: calc(var(--col4) - var(--gird-column-gutter));
    --col4g: calc(var(--col4) + var(--gird-column-gutter));
}
/* Grid Classic(flex) : --columns 개수가 4개여야 함 (사용성이 떨어짐)  */
.grid-row-classic {display:flex; width:var(--grid-width);}
.grid-row-classic.margin {width:var(--grid-width-margin); margin-left: var(--gird-margin); margin-right: var(--gird-margin);}
.grid-row-classic.cols-auto > div {flex: 1;}
.grid-row-classic > div,
.grid-row-classic > span {margin-right: var(--gird-column-gutter);}
/* .grid-row-classic > div:last-child,
.grid-row-classic > span:last-child {margin-right:0;} */
.grid-row-classic > .col-1 {width:var(--col1-g)}
.grid-row-classic > .col-2 {width:var(--col2-g)}
.grid-row-classic > .col-3 {width:var(--col3-g)}
.grid-row-classic > .col-4 {width:var(--col4-g)}

@media screen and (max-width: 1023px) {
    body {
        --gird-margin: 20px;
        --gird-column-gutter: 10px;
    }
    /* .grid-row-classic > .col-1 {width:var(--col2-g)} */
    .grid-row-classic{flex-wrap: wrap}
    .grid-row-classic > .col-1 {width: 100%;}
    .grid-row-classic > .col-3 {width: 100%;}
}
@media screen and (max-width: 599px) {
    /* .grid-row-classic{flex-wrap: wrap}
    .grid-row-classic > .col-1 {width: 100%;}
    .grid-row-classic > .col-3 {width: 100%;} */
}
@media screen and (max-width: 414px) {

}


.hide-opacity {opacity: 0;}



.s_mo {display: none;}
.s_mo_tablet {display: none}
@media screen and (max-width: 1023px) {
    .s_mo_tablet {display: block}
    .s_pc_only {display: none;}
}
@media all and (max-width: 767px) {
	.s_pc {display: none;} /* heve to change to s_pc_tablet */
	.s_mo {display: block}

    body {
        --k-layout-padding: 20px;
    }
}


/* header */
.single .k-header { background-color: rgba(255,255,255, 0.7); backdrop-filter: blur(5px);}
.single .k-toolbar .logo ~ .k-header-btns {margin-top: 24px;}
.single.sc-dir-up .k-toolbar .logo ~ .k-header-btns {margin-top: 34px;}
.single .k-content {padding-bottom: 0;}
.single .k-content.sub-cnt {padding-bottom: 50px;}
.single .loader + .k-content.sub-cnt .builder-group-wrap {padding-top: 0;}
.single .loader + .k-content.sub-cnt .builder-group-wrap .builder-nav {top: 0;}

.k-header {position: fixed; z-index: 90; top: 0; left: 0; right: 0; width: 100%; min-height: var(--k-gnb-height); /*background: #fff;*/ /*transition: top .3s, background .5s;*/ transition: top 0.2s ease-in-out, background-color .5s ease-in-out}
.k-toolbar {display:-webkit-flex; display:flex; padding: var(--k-header-padding);}
.k-toolbar .logo {margin-right: auto; margin-top: 20px; transition: margin 0.3s ease-in-out}
.k-toolbar .logo a {display:block; width:190px; height:40px; margin-top: -13px; background: url(../../images/common/logo.svg) no-repeat 0 0 / contain;}
/* .k-toolbar .k-header-btns {display:flex;} */

.h-overlay {z-index: -1; position: absolute; top: 0; left: 0; right: 0; height: var(--k-gnb-height); transition: all 0.3s ease-in-out;}
.h-overlay .overlay__path {fill: #fff; transition: all 0.3s ease-in-out;}
.sc-dir-up .k-header {top: -20px;}
.sc-dir-up .k-toolbar .logo {margin-top: 31px;}
.sc-dir-up .k-toolbar .logo a {height:36px; margin-top: -11px;}
/* .sc-dir-up .h-overlay {box-shadow: 0 2px 5px 0 rgba(0,0,0,0.06), 0 2px 10px 0 rgba(0,0,0,0.06);} */
/* .sc-dir-up .h-overlay {backdrop-filter: blur(10px);} */
.sc-dir-up .h-overlay.active {backdrop-filter: blur(10px);}
.sc-dir-up .h-overlay .overlay__path {fill: rgba(255,255,255, 0.9) !important;}
.sc-dir-down.out-sec .h-overlay {filter: drop-shadow(1px 3px 2px rgb(0 0 0 / 0.03));}

/* toolbar */
.k-header-btns {display:flex; align-items: center; margin: 24px 0 0 0; transition: margin 0.3s ease-in-out}
.k-header-btns .btn-menu {display:flex; align-items: center; justify-content: center; width: 140px; height: 46px; background-color: #c8935f; border-color: #c8935f; color:#fff; font-size: 19px; font-weight: normal;}
.k-header-btns .btn-menu .w-icon-search:before {width: 24px; height: 24px; margin-left: 10px;}

.k-header-btns .list-wrap {display:-webkit-flex; display:flex; align-items: center; position: relative; padding-bottom: 10px;}
.k-header-btns .list-wrap .ico {/*position: absolute; left: 14px; top: 10px;*/ display:inline-block; width: 34px; height: 34px; margin-right: 10px; background: url(../../images/common/reshot-icon-globe-1.svg) no-repeat center / contain;}
.k-header-btns .list-wrap .ico1 {display:none; width: 60px; height: 60px; background: url(../../images/common/reshot-icon-globe-2.svg) no-repeat center / contain;}
.k-header-btns .list-wrap .text {margin-top: -3px; color:#333; font-size: 20px; font-weight: bold;}
.k-header-btns .list-wrap .list {display: none; position: absolute; top: 45px; left: 50%; transform: translateX(-50%); width: 100px; border:1px solid #e5e5e5; padding: 10px 0; border-radius: 6px; background-color: rgba(255,255,255,0.85); transition: all 0.5s ease-in-out;}
.k-header-btns .list-wrap .list a {display: block; padding: 0 15px; line-height: 1.6; font-size: 20px; font-family:"Roboto", sans-serif; font-weight: bold;}
.k-header-btns .list-wrap .list .triangle {overflow: hidden; position: absolute; top:-8px; left:50%; transform: translateX(-50%); width: 14px; height: 8px;}
.k-header-btns .list-wrap .list .triangle::before {position: absolute; top:4px; left:2px; display: block; line-height: 0; font-size: 0; content:''; width: 8px; height: 8px; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; background-color: rgba(255,255,255,.85);}

.k-header-btns .list-wrap:hover .list,
.k-header-btns .list-wrap:focus .list {display: block;}
.k-header-btns .k-btn-sm ~ .k-btn-sm {margin-left: 10px;}

/* gnb */
.k-gnb {position: absolute; left: 50%; top: 0; transform: translateX(-50%); padding: 0 10px; font-size: 20px; color:#111; text-transform: capitalize; letter-spacing: -0.4px;}
.k-gnb::before {overflow: hidden; opacity: 0; display:block; content:""; position:absolute; /*top:var(--k-gnb-height);*/ top:calc(3px + var(--k-gnb-height)); left:-15px; right:-15px; bottom:0; height: 0; /*width: 100%;*/ background-color:rgba(255, 255, 255, 0.9); font-size:0; line-height:0; border-radius: 20px; /*border: 1px solid #e8e8e8;*/ box-shadow: 3px 3px 10px 1px rgba(22, 20, 18, 0.04); /* offset-x | offset-y | blur-radius | spread-radius | color */ transition:all 0.2s linear; /*height: calc(100% - var(--k-gnb-height)); opacity: 1;*/ backdrop-filter: blur(5px);} /* submenu container bg */ 
.k-gnb.active::before {height: calc(100% - var(--k-gnb-height)); opacity: 1;}
/* .k-gnb.active::before {height: 100%; opacity: 1;} */

.k-gnb > ul {display:flex; align-items:baseline; justify-content: center; }
.k-gnb > ul > li {position: relative;}
.k-gnb > ul > li > a {display:flex; align-items: center; justify-content: center; height:var(--k-gnb-height); padding: 0 var(--k-gnb-a-padding-side); font-weight: 500; white-space: nowrap; transition: all 0.3s ease-in-out;}
.k-gnb > ul > li:nth-child(1) > a {font-weight: bold; font-size: 19px;}
/* .k-gnb > ul > li:nth-child(3) > a {color: #ea4c4c;} */
.k-gnb > ul > li > a.on {color: #ea4c4c;}
.k-gnb > ul > li:last-child > a  {min-width: 160px; justify-content:flex-start;}
.k-gnb > ul > li > ul {display: none; position: absolute; top: var(--k-gnb-height); width: 110%; padding: 20px 0 10px var(--k-gnb-a-padding-side); line-height: 1.3;}
.k-gnb > ul > li > ul.on  {display: block;}
.k-gnb > ul > li > ul > li > a {display: block; font-size: 16px; padding: 8px 0; /*font-weight: bold;*/}
.k-gnb > ul > li:nth-child(1) > ul > li > a {font-size: 17px;}
.k-gnb > ul > li:nth-child(3) > ul > li > a {/*color: #5e2bb4;*/ font-size: 17px;}
.k-gnb a:hover {color: #ea4c4c;}

.sc-dir-up .k-gnb > ul > li > a {margin-top: 10px;}
.sc-dir-up .k-header-btns {margin-top: 34px}
/* .sc-dir-up .k-gnb.active::before {height: calc(100% - var(--k-gnb-height) + 20px);} */
/* .sc-dir-up .k-gnb > ul > li > ul {top: calc(var(--k-gnb-height) - 10px); var(--k-gnb-height);} */
/* .sc-dir-down .k-gnb > ul > li > ul {top: calc(var(--k-gnb-height) - 10px); var(--k-gnb-height);} */
body.sc-dir-up {

}
/* .out-sec .k-gnb {font-size: 18px; color:rgb(30, 12, 8);} */



.k-gnb-profile {position: relative; display: inline-block;}
.k-gnb-profile .img-avatar {padding:0 10px 10px; display: flex; align-items: center; font-size: 14px; letter-spacing: -1px; font-weight: 500;}
.k-gnb-profile .img-avatar > img:first-child {width: 34px; height: 34px; overflow: hidden; border-radius: 50%; margin-right: 8px;}
.k-gnb-profile .text {margin-top: -3px; color:#333; font-size: 20px; font-weight: bold;}
.k-gnb-profile .list {display: none; position: absolute; top: 44px; left: 100%; transform: translateX(-100%); width: 200px; /*border:1px solid #e5e5e5;*/ padding: 10px 0; border-radius: 6px; background-color: rgba(255,255,255,1); transition: all 0.5s ease-in-out; box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 2px 6px 16px 0 rgba(0,0,0,0.1);}
.k-gnb-profile .list nav {margin-top: 10px;}
.k-gnb-profile .list a {display: block; padding: 5px 25px; line-height: 1.6; font-size: 14px; font-weight: 500;}
.k-gnb-profile .list .triangle {overflow: hidden; position: absolute; top:-8px; left:80%; transform: translateX(-50%); width: 14px; height: 8px;}
.k-gnb-profile .list .triangle::before {position: absolute; top:4px; left:2px; display: block; line-height: 0; font-size: 0; content:''; width: 8px; height: 8px; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; background-color: rgba(255,255,255,.85);}
.k-gnb-profile .list a.k-btn-nav-signout {padding-top: 15px; margin-top: 15px; border-top: 1px solid #e8e8e8;}
.k-gnb-profile .list a.k-btn-nav-signout .svg-icon {width: 16px; }
.k-gnb-profile .list a.k-btn-nav-signout .svg-icon path {fill: #694be7;}
.k-gnb-profile .list a .svg-icon {vertical-align: middle; margin-top: -5px;}
.k-gnb-profile .list a .svg-icon-setting {width: 16px;}
.k-gnb-profile .list a .svg-icon-setting path:last-child {fill: #7b7b7b;}

.k-gnb-profile:hover .list,
.k-gnb-profile .img-avatar:focus ~ .list {display: block;}






/* ### menu-toggle */
.menu-toggle {display: none; margin-top: 16px; margin-right: 10px; width: 40px; height: 38px; background-color:transparent;}
.menu-toggle .icon-menu {display:inline-block; vertical-align:top; width:40px; height:34px; padding:0 6px;}
.menu-toggle .icon-menu .bar1, .menu-toggle .icon-menu .bar2, .menu-toggle .icon-menu .bar3 {display:block; height:2px; background-color:#222; margin:7px 0; font-size:0; line-height:0;-webkit-transition:all 0.2s; transition:all 0.2s;}

.menu-toggle:hover .icon-menu .bar1, .menu-toggle:hover .icon-menu .bar2, .menu-toggle:hover .icon-menu .bar3 {background-color:#ff7ccd;}
.menu-toggle:hover .icon-menu .bar1 {margin-left:7px;}
.menu-toggle:hover .icon-menu .bar3 {margin-left:4px;}
.menu-toggle:hover .icon-menu .bar2 {margin-left:0;}

.k-btn-menu-burger {position: relative; display: none; cursor: pointer; background-color: transparent; border: none;}
.k-btn-menu-burger .menu-icon-burger {position: relative; display: flex; align-items: center; justify-content: center; width: 35px; height: 35px;}
.k-btn-menu-burger .menu-icon-burger .top-bun, 
.k-btn-menu-burger .menu-icon-burger .patty, 
.k-btn-menu-burger .menu-icon-burger .bottom-bun {position: absolute; display: block; top: 0; left: 0; bottom: 0; margin: auto; width: 100%; height: 2px; background-color: #000; opacity: 0.9; transition: transform 250ms cubic-bezier(.2,.6,.3,1),width 250ms cubic-bezier(.2,.6,.3,1); will-change: transform,width;}

.k-btn-menu-burger .menu-icon-burger.type-double .top-bun { transform: translateY(-5px);}
.k-btn-menu-burger .menu-icon-burger.type-double .patty { transform: scale(0);}
.k-btn-menu-burger .menu-icon-burger.type-double .bottom-bun { transform: translateY(5px);}

.k-btn-menu-burger.active .menu-icon-burger .top-bun, 
.k-btn-menu-burger.active .menu-icon-burger .patty, 
.k-btn-menu-burger.active .menu-icon-burger .bottom-bun { background-color: #000; opacity: 1;}

.k-btn-menu-burger.active .menu-icon-burger .top-bun { transform: translateX(3.5px) rotate(-135deg); width: 28px;}
.k-btn-menu-burger.active .menu-icon-burger.navLeft .patty, 
.k-btn-menu-burger.active .menu-icon-burger.navRight .patty, 
.k-btn-menu-burger.active .menu-icon-burger .patty { transform: scale(0);}
.k-btn-menu-burger.active .menu-icon-burger .bottom-bun { transform: translateX(3.5px) rotate(135deg); width: 28px;}

/* 1920×1080 – 24.28% (more than in the USA)
1366×768 – 15.29%
1440×900 – 10.45%
1536×864 – 8.89%
1280×720 – 5.68%
768×1024 – 5.52% */
@media screen and (max-width: 1365px) {
    body{
        --k-gnb-a-padding-side: 22px;
    }
}
@media screen and (max-width: 1023px) {
    body{
        --k-gnb-a-padding-side: 18px;
    }

    .k-gnb {display: none;}
    .h-overlay {height: 72px;}
    .sc-dir-up .h-overlay {height: 80px;}
    .sc-dir-up .k-toolbar .logo {margin-top: 34px;}

    .k-toolbar .logo a {width:160px; height:36px;}

    .k-header-btns {margin-top: 17px;}
    .k-header-btns .k-btn-menu-burger {display: inline-block; margin-right: 12px; margin-left: 12px;}
    .k-header-btns .btn-menu {display: none;}
    .k-gnb-profile .img-avatar {padding:0 10px 0;}
    .k-gnb-profile .list {top: 34px;}

    .menu-toggle {display: block;}
    .k-header-btns .list-wrap {margin: 0; padding: 0;}
    .k-header-btns .list-wrap .ico {width: 36px; height: 36px; margin-right: 0;}
    .k-header-btns .list-wrap .text {position:absolute; margin:-1px; padding:0; width:1px; height:1px; overflow:hidden; border:0; clip:rect(0 0 0 0);}
    .k-header-btns .list-wrap .list {left: -16px;}
    .k-header-btns .list-wrap .list .triangle {left:85%;}
}

@media screen and (max-width: 767px) {
    body {
        --k-header-padding: 0 20px;
    }

    /* .k-btn-nav-login {display: none;}
    .k-btn-nav-signup {display: none;} */
    .single .k-header .k-btn-nav-signup {display:inline-block;}

}
@media screen and (max-width: 414px) {
    .k-btn-nav-signup {display: none;}
    .k-header-btns .list-wrap .ico {width: 34px; height: 34px;}
}



/* -------------------------------------------------------------------
 * ## snb
 * ------------------------------------------------------------------- */
.snb {display:none; z-index:200; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%;}
.snb.active {display:block;}
.snb > .backdrop {left:0; top:0; bottom:0; position:absolute; width:100%; height:100%; background-color:#000; opacity:0.6; -webkit-animation-name:snb_backdrop_fadein; animation-name:snb_backdrop_fadein; -webkit-animation-duration:0.35s; animation-duration:0.35s;}
.snb > .snb-content {z-index:5; position:absolute; top:0; bottom:0; left:0; right:0; -webkit-animation-duration:0.35s; animation-duration:0.35s;}
.snb.active > .snb-content {-webkit-animation-name:snb_slideLeft; animation-name:snb_slideLeft;}
/* inactive */
.snb.active.inactive > .snb-content {-webkit-transform:translateY(100%); transform:translateY(100%); -webkit-animation-name:snb_slideRight; animation-name:snb_slideRight;}
.snb.active.inactive > .backdrop {opacity:0; -webkit-animation-name:snb_backdrop_fadeout; animation-name:snb_backdrop_fadeout;}
@-webkit-keyframes snb_slideLeft {
	from {-webkit-transform:translate(100%, 0%);} 
	to {-webkit-transform:translate(0%, 0%);}
}
@keyframes snb_slideLeft {
	from {transform:translate(100%, 0%);}
	to {transform:translate(0%, 0%);}
}
@-webkit-keyframes snb_slideRight {
	from {-webkit-transform:translate(0%, 0%);} 
	to {-webkit-transform:translate(100%, 0%);}
}
@keyframes snb_slideRight {
	from {transform:translate(0%, 0%);}
	to {transform:translate(100%, 0%);}
}
@media all and (min-width:375px) {
	.snb > .snb-content {left:auto; width:360px;}
}
/* backdrop Animation */
@-webkit-keyframes snb_backdrop_fadein {
	from {opacity:0} 
	to {opacity:.6}
}
@keyframes snb_backdrop_fadein {
	from {opacity:0}
	to {opacity:.6}
}
@-webkit-keyframes snb_backdrop_fadeout {
	from {opacity:.6}
	to {opacity:0}
}
@keyframes snb_backdrop_fadeout {
	from {opacity:.6}
	to {opacity:0}
}
.snb .snb-close {position:absolute; z-index:10; top:10px; right:10px; width:28px; height:40px;}
.snb .snb-close::before,
.snb .snb-close::after {display:inline-block; content:""; display:block; position:absolute; top:11px; left:0; height:2px; width: 100%; background-color:#fff; font-size:0; line-height:0; transform: rotate(0); transition:all 0.5s 2s ease-out;}
.snb .snb-close::after {top:17px;}
.snb.active .snb-close::before {top:19px; transform: rotate(45deg);}
.snb.active .snb-close::after {top:19px; transform: rotate(-45deg);}

/* #### snb-body */
.snb-body {position:absolute; top:0; left:0; right:0; bottom:0; background-color:#000; overflow-x:hidden; overflow-y:scroll; will-change:scroll-position; -webkit-overflow-scrolling:auto;}

/* ### allnavbar */
#allnav {position:relative; height:100%; color:#0e0e19; font-size:19px; line-height:1.3; font-weight: 400; letter-spacing:-0.48px;}

#allnav .nav {position:relative; height:100%; padding-top:60px;}
#allnav .nav::before {display:block; content:""; position:absolute; top:0; bottom:0; left:0; width:170px; background-color:rgba(255, 255, 255, 0.12);}
#allnav .nav>li ~ li {margin-top: 10px;}
#allnav .nav>li a {transition:all 0.3s; -webkit-transition:all 0.3s;}
#allnav .nav>li>:first-child,
#allnav .nav>li>a {position:relative; z-index:1; display:block; width:170px; padding:14px 20px 13px; color:#fff;}
#allnav .nav>li:first-child > a {}
#allnav .nav>li.on>a {width:173px; background:#fff; color:#111; font-weight:bold;}

#allnav .nav>li>ul {display:none; position:absolute; top:60px; left:200px; right:0;}
/* #allnav .nav>li>ul::after {display:block; content:""; position:absolute; top:0; bottom:0; left:-160px; width:120px; background-color:#f7f7f7;} */
#allnav .nav>li:nth-child(2)>ul {top:122px;}
#allnav .nav>li.on>ul {display:block;}

#allnav .nav>li>ul>li {}
#allnav .nav>li>ul>li>a {position:relative; display:block; padding:14px 20px 13px 0; font-size: 17px; color:#fff; border-bottom:1px solid #ebebeb;}
#allnav .nav>li>ul>li>a.on,
#allnav .nav>li>ul>li>a.on:focus {color:#fff; font-weight:500;}
#allnav .nav>li>ul>li>a::before {visibility:hidden; display:inline-block; content:""; position:absolute; bottom:-1px; left:0; width:100%; height:1px; line-height:0; font-size:0; background: #f7f7f7;; width:0; -webkit-transition:all 0.3s; transition:all 0.3s;}
#allnav .nav>li>ul>li>a.on::before, #allnav .nav>li>ul>li>a.on:focus::before {visibility:visible; width:100%;}

#allnav .nav>li>ul>li.toggle>a.on,
#allnav .nav>li>ul>li.toggle>a.on:focus {color:#0e0e19; font-weight:normal;}
#allnav .nav>li>ul>li.toggle>a::before {display:block; content:""; position:absolute; left:0; right:0; top:auto; bottom:-1px; width:100%; height:1px; background:#ebebeb;}
#allnav .nav>li>ul>li.toggle>a::after {display:inline-block; content:""; position:absolute; top:50%; right:18px; width:16px; height:16px; margin:-8px 0 0 -8px; /*background:url() 50% 50% no-repeat;*/ background-size:26px auto; transition:all 0.2s ease-in-out; opacity:.6;}
#allnav .nav>li>ul>li.toggle>a.on::before {background:#bcbccc;}
#allnav .nav>li>ul>li.toggle>a.on::after {-webkit-transform:rotate(180deg); transform:rotate(180deg); opacity:1;}

#allnav .nav>li>ul>li>ul {display:none; padding:15px 0 15px 0;}
/* #allnav .nav>li>ul>li>a.on + ul {display:block;} */

#allnav .nav>li>ul>li>ul li>a {position:relative; display:block; padding:10px 10px; font-size:14px;}
#allnav .nav>li>ul>li>ul li>a::before {display:inline-block; content:""; position:absolute; left:0; top:19px; width:2px; height:2px; background:#0e0e19; opacity:.4;}
#allnav .nav>li>ul>li>ul li>a.on, #allnav .nav>li>ul>li>ul li>a:focus {color:#1f7af7;}
#allnav .nav>li>ul>li>ul li>a.on::before, #allnav .nav>li>ul>li>ul li>a:focus::before {background:#1f7af7;}

#allnav .nav>li>ul>li>ul ul {padding:5px 0 5px 10px;}





/* -------------------------------------------------------------------
 * ## k-snb
 * ------------------------------------------------------------------- */
 .snb-open .t-toolbar .logo a {background-image: url(../../images/temp/restaurant/common/logo.svg);}
 .k-snb {display:none; z-index:85; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%;}
 .k-snb.active {display:block;}
  @media screen and (min-width: 1024px) {.k-snb.active {display:none;}}
  /* .k-snb > .backdrop {left:0; top:0; bottom:0; position:absolute; width:100%; height:100%; background-color:#fff; opacity:1; animation-name:t_snb_backdrop_fadein; animation-duration:0.6s;} */
 .k-snb > .k-snb-content-back {left:0; top:0; bottom:0; position:absolute; width:100%; height:100%; background-color:#fff;}
 .k-snb > .k-snb-content {z-index:5; position:absolute; top:0; bottom:0; left:0; right:0;}
 .k-snb.active > .k-snb-content-back {animation:t_snb_backdrop_fadein 0.3s ease-in-out;} /* Duration must be same as duration of javascript */
 .k-snb.active > .k-snb-content {animation:t_snb_slideUp 0.3s ease-in-out;}
 /* inactive */
 /* .k-snb.active.inactive > .backdrop {opacity:0; animation-name:t_snb_backdrop_fadeout;} */
 .k-snb.active.inactive > .k-snb-content-back {animation:t_snb_backdrop_fadeout 0.3s ease-in-out;} /* second animation */
 .k-snb.active.inactive > .k-snb-content {animation:t_snb_slideDown 0.3s ease-in-out;}
  @keyframes t_snb_slideUp {
      from {transform:translate(0%, 5%);opacity:0}
      to {transform:translate(0%, 0%);opacity:1}
  }
  @keyframes t_snb_slideDown {
      from {transform:translate(0%, 0%);opacity:1}
      to {transform:translate(0%, 5%);opacity:0}
  }
  /* backdrop Animation */
  @keyframes t_snb_backdrop_fadein {
      from {opacity:0}
      to {opacity:1}
  }
  @keyframes t_snb_backdrop_fadeout {
      from {opacity:1}
      to {opacity:0}
  }
 .k-snb .k-snb-close {position:absolute; z-index:10; top:10px; right:10px; width:28px; height:40px;}
 .k-snb .k-snb-close::before,
 .k-snb .k-snb-close::after {display:inline-block; content:""; display:block; position:absolute; top:11px; left:0; height:2px; width: 100%; background-color:#fff; font-size:0; line-height:0; transform: rotate(0); transition:all 0.5s 2s ease-out;}
 .k-snb .k-snb-close::after {top:17px;}
 .k-snb.active .k-snb-close::before {top:19px; transform: rotate(45deg);}
 .k-snb.active .k-snb-close::after {top:19px; transform: rotate(-45deg);}
 
 .k-snb.active.inactive .all-nav .nav>li>a {color: #fff;}
 
 /* #### k-snb-body */
 .k-snb-body {position:absolute; top:var(--k-gnb-height); left:0; right:0; bottom:0; background-color:transparent; overflow-x:hidden; overflow-y:auto; will-change:scroll-position; -webkit-overflow-scrolling:auto;}
 /* @media all and (min-width:375px) {
 
 } */
 /* ### allnavbar */
 .all-nav {overflow: hidden; display: flex; flex-direction:column; justify-content: flex-start; position:relative; height:100%; color:#0e0e19; font-size:44px; line-height:1.3; font-weight: 400; letter-spacing:-0.48px; text-transform: capitalize; overflow-x:hidden; overflow-y:auto; will-change:scroll-position; -webkit-overflow-scrolling:auto;}
 .all-nav .nav {display:flex; align-items:center; justify-content: center; flex-direction: column; flex-grow: 1; flex-shrink: 0; position:relative; width: 100%; padding:var(--t-gnb-height) var(--t-all-nav-padding-side) 0;}
 /* .all-nav .nav::before {display:block; content:""; position:absolute; top:0; bottom:0; left:0; width:170px; background-color:rgba(255, 255, 255, 0.12);} */
 .all-nav .nav>li {}
 .all-nav .nav>li ~ li {margin-top: 10px;}
 .all-nav .nav>li a {transition:all 0.3s; -webkit-transition:all 0.3s; text-align: center;}
 .all-nav .nav>li a strong {font-weight: bold;}
 .all-nav .nav>li>:first-child,
 .all-nav .nav>li>a {position:relative; z-index:1; display:block; width:100%; padding:14px 20px 13px; color:#000; text-align: center;}
 .all-nav .nav>li:first-child > a {}
 .all-nav .nav>li.on>a {width:100%; color:#ea4c4c; /*font-weight:bold;*/}
 .all-nav .nav>.toggle-line>a>span:first-child {position: relative; display: inline-block; /*background-color: #fff;*/ padding: 0 5px 0 10px;}
 .all-nav .nav>.toggle-line.on>a>span:first-child {display: inline-block; /*background-color: #fff;*/ padding: 0 10px;}

 .all-nav .nav>li.toggle-line>a::before { content: ''; height: 1px; width: 0; background: currentColor; z-index: -1; position: absolute; top: 50%; left: 50%; transform: translateX(-50%); transition: width 0.5s; transform-origin: 0% 50%;}
 .all-nav .nav>li.toggle-line.on>a::before {width: 88vw;}
 /* .all-nav .nav>li.on>a::before { transform: scaleX(0); transform-origin: 100% 50%;} */
 .all-nav .nav>.toggle-line>a>span:first-child::before { content: ''; height: 3px; background: #fff; z-index: -1; position: absolute; top: 50%; left: 0; right: -30px; transform: translateY(-50%);  }


 
 .all-nav .nav>li>ul {display:none; position:relative; top:0; left:0; right:0;}
 /* .all-nav .nav>li>ul::after {display:block; content:""; position:absolute; top:0; bottom:0; left:-160px; width:120px; background-color:#f7f7f7;} */
 .all-nav .nav>li:nth-child(2)>ul {top:0;}
 /* .all-nav .nav>li.on>ul {display:block;} */ /* used slideUp and slideDown */
 
 .all-nav .nav>li>ul>li {}
 .all-nav .nav>li>ul>li>a {position:relative; display:block; padding:7px 0 6px 0; margin: 2px 0; font-size: 20px; color:#0e0e19; /*border-bottom:1px solid #ebebeb;*/}
 .all-nav .nav>li>ul>li>a.open,
 .all-nav .nav>li>ul>li>a.open:focus {color:#0e0e19; font-weight:500;}
 .all-nav .nav>li>ul>li>a.on,
 .all-nav .nav>li>ul>li>a.on:focus {color:#ea4c4c; background: #faeeee; border-radius: 6px;}
 .all-nav .nav>li>ul>li>a::before {visibility:hidden; display:inline-block; content:""; position:absolute; bottom:-1px; left:0; width:100%; height:1px; line-height:0; font-size:0; background: #f7f7f7;; width:0; -webkit-transition:all 0.3s; transition:all 0.3s;}
 .all-nav .nav>li>ul>li>a.open::before, .all-nav .nav>li>ul>li>a.open:focus::before {visibility:visible; width:100%;}
 
 .all-nav .nav>li>ul>li.toggle>a.open,
 .all-nav .nav>li>ul>li.toggle>a.open:focus {color:#0e0e19; font-weight:normal;}
 .all-nav .nav>li>ul>li.toggle>a::before {display:block; content:""; position:absolute; left:0; right:0; top:auto; bottom:-1px; width:100%; height:1px; background:#ebebeb;}
 .all-nav .nav>li>ul>li.toggle>a::after {display:inline-block; content:""; position:absolute; top:50%; right:18px; width:16px; height:16px; margin:-8px 0 0 -8px; /*background:url() 50% 50% no-repeat;*/ background-size:26px auto; transition:all 0.2s ease-in-out; opacity:.6;}
 .all-nav .nav>li>ul>li.toggle>a.open::before {background:#bcbccc;}
 .all-nav .nav>li>ul>li.toggle>a.open::after {-webkit-transform:rotate(180deg); transform:rotate(180deg); opacity:1;}
 
 .all-nav .nav>li>ul>li>ul {display:none; padding:15px 0 15px 0;}
 /* .all-nav .nav>li>ul>li>a.open + ul {display:block;} */
 
 .all-nav .nav>li>ul>li>ul li>a {position:relative; display:block; padding:10px 10px; font-size:14px;}
 .all-nav .nav>li>ul>li>ul li>a::before {display:inline-block; content:""; position:absolute; left:0; top:19px; width:2px; height:2px; background:#0e0e19; opacity:.4;}
 .all-nav .nav>li>ul>li>ul li>a.open, .all-nav .nav>li>ul>li>ul li>a:focus {color:#ea4c4c;}
 .all-nav .nav>li>ul>li>ul li>a.open::before, .all-nav .nav>li>ul>li>ul li>a:focus::before {background:#ea4c4c;}
 
 .all-nav .nav>li>ul>li>ul ul {padding:5px 0 5px 10px;}
 .all-nav .all-nav-btn {min-height: 20%; display:flex; align-items:center; justify-content: center; font-size: 14px; opacity: 0;}
 .k-snb.active > .k-snb-content .all-nav .all-nav-btn {animation:all-nav-btn-ani 0.3s 0.2s ease-in-out forwards;}
 .k-snb.active.inactive > .k-snb-content .all-nav .all-nav-btn .t-btn {color: #000; background-color: rgba(255,255,255, 0.5);}
 @keyframes all-nav-btn-ani {
     from {transform:translate(0%, 100%);opacity:0}
     to {transform:translate(0%, 0%);opacity:1}
 }
 
 @media screen and (max-width: 767px) {
     .all-nav {font-size:32px;}
     .all-nav .nav>li ~ li {margin-top: 5px;}
 }

.all-nav .nav>li>a .toggle-icon {/*background-color: #fff;*/ width:22px; /*border-right: 10px solid #fff;*/ right:0; /*position: static; vertical-align: -14px; margin-left: 8px;*/}
/* .all-nav .nav>li.open>a {} */
.all-nav .nav>li.on>a .toggle-icon::before {background-color: #7e2dc5;}
.all-nav .nav>li.on>a .toggle-icon::after {background-color: #3e884f;}
.all-nav .nav>li.open>a .toggle-icon::before {background-color: #ea4c4c; transform: translateX(-31%) rotate(-48deg);}
.all-nav .nav>li.open>a .toggle-icon::after {background-color: #ea4c4c; transform: translateX(31%) rotate(48deg);}






.main-cnt {/*overflow: hidden;*/} /* because layer cut */
.section {position: relative;}
.section.section1 {z-index: 30; /*background-color: #fff;*/}
.section.section2 {}
.mn-service .grid-row-classic {position: relative; z-index: 25;}

.mn-section {position: relative; width:100%; height:100vh;}
@media screen and (max-height: 670px) {
    .mn-section {height: 670px;}
}
.mn-visual {overflow: hidden; z-index: 1;}

/* fullpage.js */
/* #fullpage .section {} */ 
/* // fullpage.js */

/* ad zone */
/* .mn-video {position: relative; width:100%; height:100vh; overflow: hidden;}
.mn-video video,
.mn-video img {display: none; object-fit: cover; width:auto; height: auto; min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.mn-video video.s_mo {width:100%; height: 100%;} */

.vt-slides {/*position: relative; width:100%; height:100vh;*/} /* gsap slides */
.ico-down-scroll {position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);}

/* hero */
.k-mn-visual {position: relative; overflow: hidden; z-index: 1; height:560px; font-family: Poppins, Noto Sans KR, Malgun Gothic, sans-serif; line-height: 1.6; word-break: keep-all;}
.k-mn-video {position: relative; width:100%; height:560px; overflow: hidden; background: rgb(64,37,66); background: linear-gradient(0deg, rgba(64,37,66,1) 0%, rgba(28,12,37,1) 21%, rgba(126,45,197,1) 100%); background: #99aedf;}
@media all and (max-height: 560px) {
    .k-mn-video { height:560px; }
}
.k-mn-video video,
.k-mn-video .img {object-fit: cover; width:auto; height: auto; min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.k-mn-video video.s_mo {width:100%; height: 100%;}
/* .k-mn-video::after {content:''; display: block; position: absolute; z-index: 0; top: 0; left: 0; right: 0; bottom: 0; background-image: linear-gradient(180deg,rgba(0,0,0,.4),rgba(0,0,0,.4));} */
.k-mn-video .img {transition:0.8s linear; transform: translate(-50%, -50%) scale(1.1); filter: blur(5px);}
.k-mn-video .img.active {transform: translate(-50%, -50%) scale(1); filter: blur(1px);}

/* .t-gallery-slider .img {position: relative; overflow: hidden;}
.t-gallery-slider .img > img {position: relative; left:50%; transform: translateX(-50%);} */

/* slider */
/*.k-mn-visual .swiper-slide-active .k-mn-video img {transform: translate(-50%, -50%) scale(1); filter: blur(1px);}*/ /* 슬라이드가 움직일때도 애니메이션 효과를 보여준다 */
.k-mn-visual .swiper-button-prev,
.k-mn-visual .swiper-button-next {width: 60px; height: 60px; margin-top: -30px; transform: translateY(40px); background-size: contain;}
.k-mn-visual .swiper-button-prev::before,
.k-mn-visual .swiper-button-next::before {content: ''; display: block; width: 60px; height: 60px; z-index: -1; position: absolute; left: 0; top: 0; background-color: rgba(0,0,0,.7); border-radius: 50%;}
.k-mn-visual .swiper-button-prev {left:70px; background-image: none;}
.k-mn-visual .swiper-button-next {right:70px; background-image: none;}
.k-mn-visual .swiper-button-prev .ico,
.k-mn-visual .swiper-button-next .ico {position: absolute; left: 50%; top: 50%; transform:translate(-50%, -50%); width: 40px; height: 40px; /* position: relative; display: block; margin: 0 auto; */}
.k-mn-visual .swiper-button-prev .ico path,
.k-mn-visual .swiper-button-next .ico path {stroke: rgba(255,255,255,0.6); stroke-width: 2px; stroke-linejoin: round; stroke-linecap: round; fill: none;}
.k-mn-visual .swiper-button-prev .ico:hover path,
.k-mn-visual .swiper-button-next .ico:hover path {stroke: rgba(255,255,255,1);}
.k-mn-visual .swiper-button-disabled {display:none;}
@media screen and (max-width: 767px) {
    .k-mn-visual .swiper-button-prev {left:40px; display: none;}
    .k-mn-visual .swiper-button-next {right:40px; display: none;}
}

.k-mn-video-cont-wrap {position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom:0; display: flex; align-items: flex-end;}
.k-mn-video-cont-wrap.fix-middle {align-items: center;}
.k-mn-video-cont-wrap.fix-center {justify-content: center;}
.k-mn-video-cont-wrap.fix-center .k-mn-video-cont {text-align: center;}
.k-mn-video-cont {color: #fff; width:1200px; padding: 0 0 0; margin: 80px auto 0;}
.k-mn-video-cont h1 {margin: 0 -40px; overflow: hidden; font-size: calc(2.5 * 1rem); line-height: calc(1.2 * (1 + (1 - 4)/25)); font-weight: 600;
    -webkit-text-fill-color: rgba(255, 255, 255, 1);
    -webkit-text-stroke-color: #09083a;
    -webkit-text-stroke-width: 1px;
}
/* .k-mn-video-cont h1 {margin: 0 -40px; overflow: hidden; font-size: calc(2.5 * 1rem); line-height: calc(1.4 * (1 + (1 - 4)/25)); font-weight: normal; color:#00bb79} */
.k-mn-video-cont h1.letter-short {line-height: calc(1.2 * (1 + (1 - 4)/25));}
.k-mn-video-cont .txt {margin-top: 30px; color: #000;}
.k-mn-video-cont .txt-link {margin-top: 30px;}
.k-mn-video-cont .txt-link .fa {font-size: 16px; margin-left: 3px;}
.k-mn-video-cont .t-btn-primary {padding: 13px 42px; border-color: #fff; border-width: 2px; background-color: rgba(0, 0, 0, 0.1); color: #fff;}
.k-mn-video-cont .t-btn-primary:hover {border-color: transparent; background-color: rgba(255, 255, 255, 1); color: #000;}



/* ### ISOTOPE MASONARY */
.sortable-box {}
.sortable-list {display: flex; flex-wrap: wrap; justify-content: center; max-width: 1320px; margin: auto; word-break: keep-all;}
.sortable-list-item {flex:0 0 33.333%;}
.sortable-list-item {width: 400px;}
.sortable-list-item .img {overflow: hidden; display: flex; /*justify-content: center;*/}
.sortable-list-item .img img {vertical-align: top; border-radius: 20px;}
.sortable-list-item .item-info {margin: 30px 0;}
.sortable-list-item .item-name {font-size: calc((1.8 - 1) * 1.2vw + 1rem); letter-spacing: -1px;}
.sortable-list-item .item-price-block {display: flex; margin-top: 15px;}
.sortable-list-item .item-price-block .item-price {font-size: calc((1.4 - 1) * 1.2vw + 1rem); color: #ff3000; font-weight: bold;}
.sortable-list-item .item-price-block .item-price-market {font-size: calc((1.1 - 1) * 1.2vw + 1rem); align-self: center; margin-left: 10px; color: #8d8c8c; text-decoration: line-through;}

@media screen and (max-width: 1320px) {
    .sortable-list {width: auto;}
}
@media screen and (max-width: 1023px) {
    /* .sortable-list {width: auto;} */
}
@media screen and (max-width: 767px) {

}
@media screen and (max-width: 414px) {

}

/* ---- .stamp ---- */
.stamp {position: absolute; width: 150px; height: 150px;}
.stamp1 { left: 0; top: 0; display: none;}
.stamp2 { left: 800px; top: 300px; display: none;}
.stamp3 { left: 0; top: 600px; display: none;} 

/* if you are using percentage widths */
/*
  <div class="sortable-list-item-sizer"></div>
  <div class="sortable-list-item"></div>
  <div class="sortable-list-item sortable-list-item--width2"></div>
  ...
*/
/* .sortable-list-item-sizer,
.sortable-list-item { width: 20%; }
.sortable-list-item--width2 { width: 40%; } */

.collection-nav-wrapper { display: inline-block; position: relative; z-index: 10; padding: 20px 0 30px;}
.collection-nav { display: flex;  }
.collection-nav .button { margin-right: 5px; margin-left: 5px; padding: 16px 22px; /*border-style: solid; border-width: 1px;*/ border-radius: 50px; transition: color 300ms cubic-bezier(.25, .46, .45, .94), border-color 300ms cubic-bezier(.25, .46, .45, .94), background-color 300ms cubic-bezier(.25, .46, .45, .94), transform 300ms cubic-bezier(.25, .46, .45, .94); background-color: rgba(0,0,0,0.75); color: #fff; font-size: 16px; line-height: 1.2em; font-weight: 500; text-align: center; letter-spacing: 0.06em; text-transform: capitalize; white-space: nowrap;}
.collection-nav .button:hover { background-color: #fff; color: #000; -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03);  }
.collection-nav .button.current { background-color: #ea4c4c; color: #fff; font-weight: bold; }
.collection-nav .button.current:hover { background-color: #fff; color: #000; }

@media screen and (max-width: 767px) {
    .swiper-container-initialized .collection-nav { flex-wrap: wrap; justify-content: center;}
    .collection-nav > div {margin: 3px 0;}
    .collection-nav .button {padding: 11px 17px; font-size: 14px;}
}












.counterup-container {display: flex; margin-top: 50px; padding: 40px 0 0; border-top: 1px solid hsla(0, 0%, 100%, 0.4);}
.counterup-wrapper {flex: 1;}
.counterup-text { font-family: Noto Sans KR, Malgun Gothic, sans-serif; font-size: 60px; line-height: 1.1em; font-weight: 500;}
.counterup-text.primary-text-color {color: #c8935f;}
.counterup-text + p {margin-top: 10px;}



.t-sub-visual {position: relative; width:100%; height:370px; overflow: hidden; z-index: 1; font-family: Poppins, Noto Sans KR, Malgun Gothic, sans-serif; line-height: 1.6;}
.t-sub-video {position: relative; width:100%; height:370px; overflow: hidden; }
.t-sub-video video,
.t-sub-video img {object-fit: cover; width:auto; height: auto; min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.t-sub-video video.s_mo {width:100%; height: 100%;}
.t-sub-video::after {content:''; display: block; position: absolute; z-index: 0; top: 0; left: 0; right: 0; bottom: 0; background-image: linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.5));}
/* .t-sub-video img {transition:0.8s linear; transform: translate(-50%, -50%) scale(1.1); filter: blur(5px);}
.t-sub-video img.active {transform: translate(-50%, -50%) scale(1); filter: blur(1px);} */
.t-sub-video img {transition:0.8s linear; transform: translate(-50%, -50%);}

.t-sub-video-cont-wrap {position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom:0; display: flex; align-items: flex-end;}
.t-sub-video-cont-wrap.fix-middle {align-items: center;}
.t-sub-video-cont-wrap.fix-center {justify-content: center;}
.t-sub-video-cont-wrap.fix-center .t-sub-video-cont {width:auto; text-align: center;}
.t-sub-video-cont {color: #fff; width:1200px; padding: 0; margin: 100px auto 0;}
.t-sub-video-cont h1 {overflow: hidden; font-size: calc(3.5 * 1rem); line-height: calc(1.4 * (1 + (1 - 4)/25)); font-weight: normal; letter-spacing:-1px;}
.t-sub-video-cont h1 span {display: inline-block;}
.t-sub-video-cont .txt {margin-top: 10px;}
.t-sub-video-cont .txt-link {margin-top: 10px;}
.t-sub-video-cont .txt-link .fa {font-size: 16px; margin-left: 3px;}


/* @media screen and (min-width: 768px), screen and (max-width: calc(1511px)) and (orientation: landscape) { } */
@media screen and (max-width: 1280px) {
    .k-mn-section-block {width:100%; padding: 0;}
    .k-mn-video-cont {width:100%; padding: 0 40px 0;}
    .t-sub-video-cont {width:100% !important; padding: 0 40px 0;}
}
@media screen and (max-width: 1023px) {
    .k-mn-video-cont h1 { font-size: calc((2.5 - 1) * 1.5vw + 1rem); line-height: 1.2; font-weight: 700;}
    .k-mn-video-cont .txt {font-size: 13px;}
    .counterup-text {font-size: calc((3.6 - 1) * 1.5vw + 1rem);}

    .t-sub-video-cont h1 {font-size: calc((3 - 1) * 1.5vw + 1rem); line-height: 1.2; font-weight: 700;}
}
/* .k-mn-video-cont .scroll-x-wrap {} */
@media screen and (max-width: 599px) {
    .k-mn-video-cont .scroll-x-wrap {margin-right: -40px; margin-left: -40px; padding-left: 40px;}
    /* .k-mn-video-cont .scroll-x-wrap {margin-right: calc(-1 * var(--k-layout-padding))} */
    .t-sub-video-cont .scroll-x-wrap {margin-right: -40px; margin-left: -40px; padding-left: 40px;}

}


.t-page-search > .title .subtitle {padding-right: 5px; padding-left: 5px; font-family: 'Homemade Apple', sans-serif; color: #e9bd54; font-size: 18px; line-height: 1.3em;}
.t-page-search > .title {position: relative; width: 50%; margin: 0 auto; padding: 80px 0 30px; text-align: center; color: #1f1b1a; line-height: 1.7;}
.t-page-search > .title h2 {font-weight: bold; color:#1f1b1a; font-size: calc(2.5 * 1rem); line-height: calc(1.4 * (1 + (1 - 3.5)/25)); }
.t-page-search > .title h2 + p {margin-top: 20px; color:#5a5a5a;}





.mn-collection {height: auto; word-break: keep-all; padding-left: 72px; padding-right: 72px;}


.collection-list-top {display: flex; align-items: flex-start; margin-top: 42px;}
.collection-filter-set {display: flex; align-items:flex-start;}
.collection-filter-set > .k-select-selection {min-width: 200px; margin-right: 16px;}
/* .collection-filter-set > .k-select-selection ~ .k-select-selection {margin-left: 16px;} */
.filter-view {margin-left: auto;}





/* ### grid */
.collection-box { margin-top: 30px; font-family: Poppins, 'Nunito Sans', Noto Sans KR;}
.collection-list {display: -ms-grid; display: grid; grid-auto-columns: 1fr; grid-column-gap: 36px; -ms-grid-columns: 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr; -ms-grid-rows: auto; grid-template-rows: auto; grid-row-gap: 36px;}
.collection-list-item {position: relative; color: #1f1f1f;}
/* ### ISOTOPE MASONARY */
/* .collection-list {display: flex; flex-wrap: wrap; justify-content: center; margin: auto; word-break: keep-all;}
.collection-list-item {position: relative; width: 287px;} */
.collection-list-item > a {display: block;}
.collection-list-item .img {position: relative;}
.collection-list-item .img > a {display: block;}
.collection-list-item .img .empty {width: 100%; vertical-align: top;}
.collection-list-item .img .img-inner {overflow: hidden; display: flex; align-items: center; /*justify-content: center;*/ border-radius: 8px; position: absolute; top: 0; right: 0; left: 0; bottom:0;}

.collection-list-item .img .img-video {overflow: hidden; position: absolute; top: 0; right: 0; left: 0; bottom: 0; border-radius: 8px;}
.collection-list-item .img .img-video video { object-fit:inherit; width:auto; height: auto; min-width: 100%; min-height: auto; vertical-align: top; transition: all 0.15s linear; position: absolute; left: -18%; right: -18%; max-width: 136%; display: none;}
.collection-list-item .img .img-video:hover video {display: block;}
.collection-list-item .img .img-video:hover .img-inner {display: none;}

.collection-list-item .img .img-inner img {object-fit:inherit; width:auto; height: auto; min-width: 100%; min-height: auto; vertical-align: top; transition: all 0.15s linear; position: absolute; left: -18%; right: -18%; max-width: 136%;}
/* .collection-list-item .img .img-inner img {object-fit: cover; width:auto; height: auto; min-width: 100%; min-height: 100%; vertical-align: top; transition: all 0.15s linear;} */
.collection-list-item .img .img-inner::after { content: '';position: absolute; top: 0; right: 0; bottom: 0; left: 0;
background: linear-gradient(to bottom, transparent 0%, 
transparent 8.1%, 
rgba(0,0,0,0.001) 15.5%, 
rgba(0,0,0,0.003) 22.5%, 
rgba(0,0,0,0.005) 29%, 
rgba(0,0,0,0.008) 35.3%, 
rgba(0,0,0,0.011) 41.2%, 
rgba(0,0,0,0.014) 47.1%, 
rgba(0,0,0,0.016) 52.9%, 
rgba(0,0,0,0.019) 58.8%, 
rgba(0,0,0,0.022) 64.7%, 
rgba(0,0,0,0.025) 71%, 
rgba(0,0,0,0.027) 77.5%, 
rgba(0,0,0,0.029) 84.5%, 
rgba(0,0,0,0.03) 91.9%, 
rgba(0,0,0,0.03) 100%);
pointer-events: none;}
.collection-list-item .img-overlay {display: flex; z-index: 1; -ms-flex-align: end; align-items: flex-end; border-radius: 8px; opacity: 0; padding: calc(0.3 * 1.5vw + 0.625rem); transition: opacity 300ms ease; background: linear-gradient(180deg, 
transparent 62%, 
rgba(0,0,0,0.00345888) 63.94%, 
rgba(0,0,0,0.014204) 65.89%, 
rgba(0,0,0,0.0326639) 67.83%, 
rgba(0,0,0,0.0589645) 69.78%, 
rgba(0,0,0,0.0927099) 71.72%, 
rgba(0,0,0,0.132754) 73.67%, 
rgba(0,0,0,0.177076) 75.61%, 
rgba(0,0,0,0.222924) 77.56%, 
rgba(0,0,0,0.267246) 79.5%, 
rgba(0,0,0,0.30729) 81.44%, 
rgba(0,0,0,0.341035) 83.39%, 
rgba(0,0,0,0.367336) 85.33%, 
rgba(0,0,0,0.385796) 87.28%, 
rgba(0,0,0,0.396541) 89.22%, 
rgba(0,0,0,0.4) 91.17%); content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none;}
.collection-list-item > a:hover  .img-overlay {opacity: 1;}
/* .collection-list-item .img > a:hover ~ .img-overlay {opacity: 1;} */
.collection-list-item .img:hover  .img-overlay {opacity: 1; pointer-events: none;}
@media (hover: none) and (pointer: coarse) {
    /* Smartphones and touchscreens */
    .collection-list-item .img:hover  .img-overlay {opacity: 0;}
}
@media (hover: hover) and (pointer: fine) {
    /* Desktops with mouse */
}


.collection-list-item .img-overlay-cont {width: 100%; display: flex; align-items: center; font-size: 15px; line-height: 1.3; color: #fff; font-weight: 500;}
.collection-list-item .img-overlay-cont .img-title {flex: 1; pointer-events: auto;}
.collection-list-item .img-overlay-cont .link {margin-left: 10px; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; background: #f3f3f4; border-radius: 6px; pointer-events: auto;}
.collection-list-item .img-overlay-cont .svg-icon {width: 14px; height: 14px;}
.collection-list-item .img-overlay-cont .svg-icon {fill: #1f1f1f;}

.collection-list-item .item-info {margin: 14px 0; display: flex; flex-direction:row; align-items: center; text-align: center;}
.collection-list-item .item-name {display: flex; align-items: center; font-size: 14px; letter-spacing: -1px; font-weight: 500;}
.collection-list-item .item-name > img:first-child {width: 24px; height: 24px; overflow: hidden; border-radius: 50%; margin-right: 8px;}
.collection-list-item .item-explain {margin-top: 15px; line-height: 1.3;}
.collection-list-item .item-count {display: flex; align-items: center; font-size: 12px; margin-left: auto;}
.collection-list-item .item-count > :first-child ~ span {margin-left:10px}
.collection-list-item .item-price-block {display: flex; margin-top: 15px;}
.collection-list-item .item-price-block .item-price {font-size: calc((1.4 - 1) * 1.2vw + 1rem); color: #111111; font-weight: bold;}
.collection-list-item .item-price-block .item-price-market {font-size: calc((1.1 - 1) * 1.2vw + 1rem); align-self: center; margin-left: 10px; color: #8d8c8c; text-decoration: line-through;}
.collection-list-item > a:hover .img .img-inner img {transform: scale3d(1.05, 1.05, 1);}
.collection-list-item .img > a:hover .img-inner img {transform: scale3d(1.05, 1.05, 1);}
.collection-list-item > a:hover .badge{background-color: #000; color: #fff;}


/* count */
.item-count-likes {position: relative; display: flex; align-items: center; line-height: 1; font-family: Poppins, 'Nunito Sans', Noto Sans KR;}
.item-count-likes .svg-icon {width: 14px; height: 14px; overflow: visible}
.item-count-likes .svg-icon path {fill: #a29ea7;}
.item-count-likes .text {margin-left: 4px; font-weight: normal;}

.collection-list .item-count-likes .svg-icon path:nth-child(1) {opacity: 1;}
.collection-list .item-count-likes .svg-icon path:nth-child(2) {opacity: 0; transform: scale(0.2); transform-origin: center; fill: #ea4c4c;}
.collection-list .item-count-likes.active .svg-icon path:nth-child(1) {opacity: 0;}
.collection-list .item-count-likes.active .svg-icon path:nth-child(2) {opacity: 1; transform: none; transition: all 0.5s cubic-bezier(0.3, 2.8, 0.6, 0.5);}
.collection-list .item-count-likes .spinner-loader {position: absolute; top:0; left:0;}


.item-count-views {position: relative; display: flex; align-items: center; line-height: 1; font-family: Poppins, 'Nunito Sans', Noto Sans KR;}
.item-count-views .svg-icon {width: 14px; height: 11px;}
.item-count-views .svg-icon path {fill: #a29ea7;}
.item-count-views .text {margin-left: 4px; font-weight: normal;}

.item-count-likes .spinner-loader .spinner-loader-icon,
.item-count-views .spinner-loader .spinner-loader-icon {width: 14px; height: 14px;}


.badge {z-index: 1; position: absolute; top: 16px; right: 16px; padding: 10px 20px; background-color: #fff; line-height: 1.2em; color: #161412; font-weight: 700; transition: all 0.3s ease-in-out;}
.badge.round {border-radius: 100px;}


@media screen and (max-width: 1365px) {
    .collection-list {grid-column-gap: 36px; grid-row-gap: 36px; -ms-grid-columns: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr; -ms-grid-rows: auto; grid-template-rows: auto; }
    .collection-list-item .item-name {font-size: calc((0.9 - 1) * 1.2vw + 1rem);}

    .collection-filter-set > .k-select-selection {max-width: 300px;}
}
@media screen and (max-width: 1023px) {
    .mn-collection {padding-left: var(--k-layout-padding); padding-right: var(--k-layout-padding);}
    .collection-list {grid-column-gap: 36px; grid-row-gap: 36px; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; -ms-grid-rows: auto; grid-template-rows: auto;}

    .collection-filter-set > .k-select-selection {max-width:none; min-width: 120px;}
    .filter-view .k-select-selection:first-child {margin-left: 16px;}
    .collection-filter-set {flex:1; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-row-gap: 16px; grid-column-gap: 16px;} /* use grid (Can not use it(flex) */
    .collection-filter-set > .k-select-selection {margin-right: 0;}
}
@media screen and (max-width: 767px) {

    .collection-filter-set {grid-template-columns: 1fr 1fr;}
    .collection-filter-set > .k-select-selection:nth-child(1) {grid-column: 1/3}
    
}
@media screen and (max-width: 599px) {
    .collection-list {grid-column-gap: 36px; grid-row-gap: 36px; -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: auto; grid-template-rows: auto;}

    .collection-filter-set {grid-template-columns: 1fr; flex: auto; width: 100%;}
    .collection-filter-set > .k-select-selection:nth-child(1) {grid-column: auto}

    .collection-list-top {flex-wrap: wrap;}
    .filter-view {margin-top: 16px;}
    .filter-view .k-select-selection:first-child {margin-left: 0;}
}

.collection-list-wrapper-categories { position: relative; z-index: 10; padding: 10px 0 50px;}
.collection-list-categories { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

.button-categories { margin-right: 5px; margin-left: 5px; padding: 15px 32px; border-style: solid; border-width: 1px; border-color: #f4f4f4; border-radius: 50px; background-color: #fff; transition: color 300ms cubic-bezier(.25, .46, .45, .94), border-color 300ms cubic-bezier(.25, .46, .45, .94), background-color 300ms cubic-bezier(.25, .46, .45, .94), transform 300ms cubic-bezier(.25, .46, .45, .94); color: #1f1b1a; font-size: 16px; line-height: 1.2em; font-weight: 500; text-align: center; letter-spacing: 0.06em; text-transform: uppercase; }
.button-categories:hover { background-color: #fb8c23; border-color: #fb8c23; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); color: #fff; }
.button-categories.is-checked { background-color: #fb8c23; border-color: #fb8c23; color: #fff; font-weight: bold; }
.button-categories.is-checked:hover { background-color: #ff3000; border-color: #ff3000; }
  

.t-mn-faq {max-width: 1220px; padding-bottom: 0; margin: auto; word-break: keep-all;}
.t-mn-faq > .title {position: relative; width: 50%; margin: 0 auto; padding: 80px 0 30px; text-align: center; color: #1f1b1a; line-height: 1.7;}
.t-mn-faq > .title h2 {font-weight: bold; color:#1f1b1a; font-size: calc(2.5 * 1rem); line-height: calc(1.4 * (1 + (1 - 3.5)/25)); }
.t-mn-faq > .title h2 + p {margin-top: 20px; color:#5a5a5a;}
.t-mn-faq > .title .subtitle {color: #c8935f; font-size: 18px; text-transform: uppercase;}
.t-mn-faq-list {}

.text-decoration-none { text-decoration: none; }
.accordion-item-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; width: 100%; margin-top: -4px;  -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; border-top: 4px solid #202020; border-bottom: 4px solid #202020; background-color: #fff; -webkit-transition: -webkit-transform 300ms ease; transition: -webkit-transform 300ms ease; transition: transform 300ms ease; transition: transform 300ms ease, -webkit-transform 300ms ease; cursor: pointer; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } 
.accordion-item-wrapper:hover { -webkit-transform: translate3d(6px, 0px, 0.01px); transform: translate3d(6px, 0px, 0.01px); }
.accordion-header { width: 100%; position: relative; padding-top: 38px; padding-bottom: 38px; }
.accordion-header .accordion-icon-wrapper {position: absolute; right: 0; top: 50%; transform: translateY(-50%); }  .acordion-body { width: 100%; padding-top: 24px; padding-bottom: 38px; }
.accordion-header.active .accordion-btn-line.vertical { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } 
.accordion-spacer { min-height: 24px; } 
.accordion-btn-line { position: absolute; width: 24px; height: 4px; border-radius: 20px; background-color: #202020; transition: all 0.2s linear; }
.accordion-btn-line.vertical { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } 
.accordion-content-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.accordion-icon-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 38px; height: 38px; min-height: 38px; min-width: 38px; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.accordion-title {     font-weight: bold; color:#0e081e; font-size: 24px; line-height: 1.6; }



/* about */




.mn-about {/*overflow: hidden;*/ word-break: keep-all;}
.mn-about-cols {width: 100%; position: relative; display: flex; justify-content: var(--justify); gap: var(--gap); height: 100%; margin-left: -20%; margin-left: -20%; transform: rotate(var(--rotation)); align-items: center; will-change: transform, opacity;}
.mn-about-col--wrap {position: relative; z-index: 1; display: flex; flex-direction: column; padding: 5vh 0 15vh; margin: 30vh 0 0 7vh; will-change: transform;}
/* .column-wrap:nth-child(even)  {margin-top: var(--offset);} */
.mn-about-col {position: relative; display: block; will-change: transform;}
.mn-about-col__item {position: relative; --grid-item-height: calc(var(--grid-item-width) * var(--ratio)); width: var(--grid-item-width); height: var(--grid-item-height); position: relative; overflow: hidden; border-radius: var(--radius); border: 2vw solid #ffaeb0; /*cursor: pointer;*/ margin: 0 0 4.5vw 0; z-index: 1; will-change: transform, filter; background-color: #ffaeb0; border-radius: 30px; transition: all 0.3s;}
.mn-about-col__item-img {width: 100%; height: 100%; background-size: cover; background-position: 50% 50%; will-change: transform;}

.mn-about-col__item-video {position: relative; width:100%; height:100%; overflow: hidden; border-radius: 20px;}
.mn-about-col__item-video video {position: absolute; object-fit: cover; width:180%; height: 180%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg);}

.mn-about-col__item:nth-child(1) {background-color: #cad3d5; border-color:#cad3d5;}
.mn-about-col__item:nth-child(2) {background-color: #ffaeb0; border-color:#ffaeb0;}
/* .mn-about-col__item:nth-child(2) .mn-about-col__item-video {border-radius: 20px;} */
.mn-about-col__item:nth-child(3) {background-color: #9bdaeb; border-color: #9bdaeb; border-radius: 50%;}
.mn-about-col__item:nth-child(3):hover {border-width:20px;}
.mn-about-col__item:nth-child(3) .mn-about-col__item-video {border-radius: 50%;}
.mn-about-col__item:nth-child(3) .mn-about-col__item-video video {top: 50%; left: 50%; width:100%; height: 100%;}
.mn-about-col__item:nth-child(4) {background-color: #f7b772; border-color: #f7b772;}
.mn-about-col__item:nth-child(4):hover {border-width:20px;}
/* .mn-about-col__item:nth-child(4) .mn-about-col__item-video {border-radius: 20px;} */

.mn-about-tit {position: absolute; z-index: 31; top: 20%; right:100px; font-weight: 900; font-size: 80px; color:#111; line-height: 1.2;}
.mn-about-tit .lines:nth-child(1) {margin-left: 260px;}
.mn-about-tit .lines:nth-child(2) {margin-left: 130px;}
.mn-about-tit .lines {overflow: hidden;}
.mn-about-tit .lines .word {color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg,#5363fd,#2482c7 45%,#33b7e7 76%,#00e499); background-color: #000 0%;}
/* .mn-about-tit .lines .word {color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg,#00e499,#33b7e7 45%,#2482c7 76%,#5363fd); background-color: #000 0%;} */
.mn-about-tit .lines span {display: inline-block; font-size: 60px; color: #2482c7;}
.mn-about-tit .lines span:nth-child(1) {color: #3c63e7;}
/* 
.mn-about-tit .lines span:nth-child(2) { -webkit-background-clip: text; background-clip: text;} */


@media screen and (max-width: 1365px) {
    .mn-about-col__item {border-width: 36px;}
    .mn-about-tit {font-size: 67px;}
    .mn-about-tit .lines span {font-size: 47px;}
}
@media screen and (max-width: 899px) {
    .mn-about-col__item {border-width: 26px;}
    .mn-about-tit {font-size: 47px;}
    .mn-about-tit .lines span {font-size: 27px;}
}
@media screen and (max-width: 599px) {
    body {
        --grid-item-width: 57vw;
    }
    .ico-down-scroll {bottom: 8%;}
    .mn-about-col__item {border-width: 18px; margin: 0 0 5vw 0; }
    .mn-about-tit {top: 30%; right:20px; font-size: 35px;}
    .mn-about-tit .lines:nth-child(1) {margin-left: 190px;}
    .mn-about-tit .lines span {font-size: 20px;}
}
@media screen and (max-width: 414px) {
    .mn-about-tit {font-size: 34px; line-height: 1.5;}
    .mn-about-tit .lines:nth-child(1) {margin-left: 150px;}
    .mn-about-tit .lines:nth-child(2) {margin-left: 125px;}
}
@media screen and (max-width: 375px) {
    .mn-about-tit {font-size: 30px;}
}


/* work */
.mn-work {/*height: auto;*/ word-break: keep-all;}

.mn-work-list  {position: relative; transition: background-color 0.3s ease-out, border-color 0.3s ease-out;}
.cell {position: relative;}
.mn-work-title-box  {position: fixed; z-index: 25; left: 0; top: 0; width: 100%; height:100vh; pointer-events: none; display: flex; justify-content: center; align-items: center;}
.mn-work-title-slider {position: relative; overflow: hidden; height: 114px;}
.mn-work-title-wrap {transition:transform 0.5s; transform:translateY(160px);} /* gsap 으로 변경 예정 */
.mn-work-title-wrap > .title  {display: flex; justify-content: center; align-items: center; padding: 10px 0; line-height: 1.2; letter-spacing: -2px; color: #9170ff; font-size: 67px; font-weight: 900; text-align: center; /* font-size: clamp(1.953rem,4vw,3.052rem); */ transition: all 0.5s ease-in; opacity: 0;}

/* .mn-work-title-wrap > .title:nth-child(1) {color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg,#2ca2b4,#5598de 24%,#7f87ff 45%,#f65aad 76%,#ec3d43); background-color: #9984df 0%; overflow: hidden;} */
.mn-work-title-wrap > .title:nth-child(1) {color: #000;}
.mn-work-title-wrap > .title:nth-child(1) {color: #000; -webkit-text-fill-color: rgba(255,255,255, 1); -webkit-text-stroke-color: #000; -webkit-text-stroke-width: 2px;}
.mn-work-title-wrap > .title:nth-child(2) {color: #e15454;}
.mn-work-title-wrap > .title:nth-child(2) {color: #e15454; -webkit-text-fill-color: rgba(255,255,255, 1); -webkit-text-stroke-color: #e15454; -webkit-text-stroke-width: 2px;}
.mn-work-title-wrap > .title:nth-child(4) {color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg,#00c366,#00c8aa 24%,#00c8aa 45%,#00cefc 76%,#00acfc); background-color: #00acfc 0%; overflow: hidden;}
.mn-work-title-wrap > .title:nth-child(5) {color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg,#ffcd6a,#ff6d41 24%,#ff6d41 45%,#ff6d41 76%,#ff4e41); background-color: #ff4e41 0%; overflow: hidden;}
.mn-work-title-wrap > .title.active {opacity: 1; transform: skewY(0); animation:mn-work-title-ani 0.5s ease-in;}
@keyframes mn-work-title-ani {from {opacity:0.7; transform: skewY(5deg);} to {opacity:1; transform: skewY(0);}}

.mn-work-items {}
.mn-work-items .item {position: relative; width:100%; min-height:100vh;}
@media screen and (max-height: 670px) {
    .mn-work-items .item {height: 670px;}
}
.mn-work-items .item .img {/* will-change: transform, opacity; */ z-index: 23; position: absolute; left: 12%; top: 50%; transform: translateY(-50%);}
.mn-work-items .item .img-inner {position: relative; overflow: hidden; display: block; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; width: 700px; height: 460px; border-radius: 20px;}
.mn-work-items .item video {object-fit: cover; width:100%; height: 100%; min-width: 100%; min-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.mn-work-items .item.type1 .img  {left: 0; right: 0; top: 0; bottom: 0; transform: translateY(0);}
.mn-work-items .item.type1 .img-inner  {width: 100%; height: 100%; background-size:contain;}

.mn-work-items .item .item-info {position: relative; z-index: 25; margin: 34px 0; display: flex; flex-direction: column; align-items: center; text-align: center;}
.mn-work-items .item .item-name {font-size: 22px; letter-spacing: -1px; font-weight: 500;}
.mn-work-items .item .item-explain {margin-top: 14px; line-height: 1.7;}
.mn-work-items .item .item-link {margin-top: 24px;}
.mn-work-items .item.type1 .item-info {position: absolute; bottom:30px; left: 50%; transform: translateX(-50%);}

@media screen and (max-width: 1365px) {
    .mn-work-title-slider {height: 100px;}
    .mn-work-title-wrap > .title {font-size: 57px;}
}
@media screen and (max-width: 1023px) {
    .mn-work-title-slider {height: 115px;}
    .mn-work-title-wrap > .title {font-size: 47px; margin: 0 20px; letter-spacing: -1px;}

    .cell-item {height:86vh;}
    .mn-work-items .item .img-inner {width: 600px; height: 370px; border-radius: 10px;}
    .mn-work-items .item.type1 .img-inner  {background-size:cover;}
}
@media screen and (max-width: 767px) {
    .mn-work-items .item .img {left: 20px; right: 20px;}
    .mn-work-items .item .img-inner {width: 500px; height: 300px;}

    .mn-work-items .item.type1 {margin-bottom:100px;}
    .mn-work-items .item.type1 .item-info {bottom: -80px; left: 20px; transform: translateX(0); right: 20px;}
}
@media screen and (max-width: 414px) {
    .mn-work-items .item .img-inner {width: 100%; height: 300px;}
}

/* service */
.mn-service {padding-top: 180px; line-height: 1.9; /*word-break: keep-all;*/}
/* .mn-service > .title {font-weight: 900; font-size: 37px; color:#111;} */
.mn-map-pic {position: relative; padding-top: 100px;}
.mn-map-pic::after {content: ''; display: block; width:100%; height:638px; background: url(../../images/common/main_map_bg.png) no-repeat left bottom / cover;}
.mn-map-pic-pin {position: absolute; top: 38px; left: 310px;}
.mn-map-pic-pin::before {content: ''; display: block; width:53px; height:81px; background: url(../../images/common/main_map_pin.png) no-repeat left bottom / cover; animation:mn-map-pic-pin-ani 1.4s ease-in infinite;}
.mn-map-pic-pin::after {content: ''; display: block; position: absolute; left: -50px; bottom: -41px; width:149px; height:58px; background: url(../../images/common/main_map_pin_circle.png) no-repeat left bottom / cover; animation:mn-map-pic-pin-ani1 1.4s ease-in infinite;}
@keyframes mn-map-pic-pin-ani {0% {transform: translateY(-15%);} 50% {transform: translateY(0);} 100% {transform: translateY(-15%);}}
@keyframes mn-map-pic-pin-ani1 {0% {opacity: 1; transform: scale3d(1,1,1);} 50% {opacity: 0.7; transform: scale3d(0.5,0.5,1);} 100% {opacity: 1; transform: scale3d(1,1,1);}}

.mn-service .grid-row-classic .h2 {margin-top: -8px;}
.mn-service .grid-row-classic ~ .grid-row-classic {margin-top: 40px;}
.mn-service .hover-line {line-height: 1.5;}

.mn-map {position: absolute; z-index: 32; bottom: 130px; right: 20%; transform: translate(0, 0); border: 30px solid #fff; border-radius: 36px;box-shadow: 0px 12px 34px rgb(32 52 89 / 25%); overflow: hidden;}
.mn-map iframe {vertical-align: top; width: 600px; height: 400px; border: none;}

@media screen and (max-width: 599px) {
    .mn-service {padding-top: 120px; line-height: 1.5;}
    .mn-service .grid-row-classic .para {margin-top: 20px; font-size: 16px;}
    .mn-map-pic::after {background-position: -120px bottom;}
    .mn-map-pic-pin {left: 190px;}
    .mn-map iframe {width: 300px; height: 400px;}
    .mn-map {border: 10px solid #fff; border-radius: 6px;}
}


.k-content {padding-bottom: 50px;}

/* footer */
.w-footer {position: relative; z-index: 70; background: #f7f6ff; padding: 72px 72px 72px; font-family: Poppins, 'Nunito Sans', 'Noto Sans KR', Malgun Gothic, sans-serif; line-height: 1.6; text-transform:capitalize}
.w-footer > .info-box {display: flex; align-items: flex-start;}
.w-footer .info-list {width: 210px; display: flex; align-items: flex-start; flex-direction: column; font-size: 16px;  color: #0d0c22;}
.w-footer .info-list > p {font-weight: bold;}
.w-footer .info-list > .info-nav {margin-top: 20px; font-size: 14px;}
.w-footer .info-list > .info-nav > ul > li {padding: 3px 0; font-weight: normal;}
.w-footer .info-list > .info-nav > ul > li > a {position: relative}
.w-footer .info-list > .info-nav > ul > li > a .ico {transition:all 0.2s linear; position: absolute; left: -14px; top: 50%; transform: translate(0, -50%); width: 10px; font-size: 15px;}
.w-footer .info-list > .info-nav > ul > li > ul {overflow: hidden; height: 0; opacity: 0; transition:all 0.2s linear; margin: 0 0 10px; color: #6a6d8c;}
.w-footer .info-list > .info-nav > ul > li.active {}
.w-footer .info-list > .info-nav > ul > li.open > ul {height: auto; opacity: 1;}
.w-footer .info-list > .info-nav > ul > li.open > a .ico {transform: translate(0, -50%) rotate(90deg);}

.w-footer .logo {display: flex; align-self: flex-end; width:180px; height:40px; margin-left: auto; background: url(../../images/common/logo_purple.svg) no-repeat bottom 0 right 0 / contain; /*filter: grayscale(1);*/}
/* .w-footer .logo .logo-svg {width: 60px; height:60px;}
.w-footer address {margin-left: auto; font-style: normal; font-size: 20px; line-height: 1.6; letter-spacing: -0.6px; font-weight: bold;} */




@media screen and (max-width: 1023px) {
    .w-footer {padding: 40px 40px;}
    /* .mn-map {bottom: 130px; right: 50%; transform: translate(50%, 0);} */
}
@media screen and (max-width: 767px) {
    .w-footer .info-list > .info-nav {margin-top: 10px;}
    .w-footer > .info-box {  display: grid; grid-auto-columns: 1fr; grid-column-gap: 10px; grid-row-gap: 30px; grid-template-columns: 1fr 1fr; grid-template-rows: auto;}
    .w-footer .info-list,
    .w-footer .logo {width: auto; margin-left: initial;}

    /* .w-footer .logo .logo-svg {width: 42px; height:42px;}
    .w-footer address {font-size: 16px; text-align: right;} */
}
@media screen and (max-width: 413px) {
    /* .w-footer > .info-box {flex-wrap: wrap;}  */
    /* .w-footer address {margin-top: 20px; text-align: left;} */
}

.requir {color: #694be7;}
.k-mn-contact {position: relative; z-index: 25; margin-top: 0; padding: 60px 0 100px; /*padding: 60px var(--k-layout-padding) 100px;*/ background-color: #f7f7f7; /*background-image: linear-gradient(135deg, #f5f7fa, #fed6e3);*/  background-image: linear-gradient(135deg, #f5f7fa, #fff9f0);  font-family: Bergentext, Poppins, 'Nunito Sans', 'Noto Sans KR', 'Malgun Gothic', '맑은 고딕', Arial; line-height: 1.4;}
.k-mn-contact-cont {display: flex;}
.k-mn-contact-formbox { /*flex: 0 0 48%;*/}
.k-mn-contact-formbox > .title {position: relative; padding: 0 0 30px; /*border-bottom:3px solid #0e081e;*/ color: #0c081e;}
.k-mn-contact-formbox > .title h2 {font-weight: bold; color:#fb8c23; font-size: calc(4 * 1rem); line-height: calc(1.4 * (1 + (1 - 4)/25)); }
.k-mn-contact-formbox > .title h2 .txt {color: #0c081e; font-size: calc(2.8 * 1rem); font-weight: bold;}
.k-mn-contact-formbox > .title h2 + p {margin-top: 15px;}
.k-mn-contact-formbox form .title {position: relative; padding: 0 0 30px; color: #0c081e;}
.k-mn-contact-formbox form .title h2 {font-weight: bold; /*color:#000;*/ font-size: calc(1.8  * 1rem); line-height: calc(1.4 * (1 + (1 - 4)/25)); }

.k-mn-contact-form {max-width: 900px; margin-top: 7px;}
.k-mn-contact-text {/*width: var(--col1-g); margin-right: var(--gird-column-gutter);*/ margin-top: 0; font-family: Poppins, Noto Sans KR, Malgun Gothic, sans-serif;  /*background: url(../images/temp/restaurant/content/coffee_cold_1.png) no-repeat 60% 70% / auto 300px;*/ }
.k-mn-contact-text > .title {position: relative; padding: 0 0 30px; color: #333;}
.k-mn-contact-text > .title h2 {font-weight: bold; color:#0e081e; font-size: 26px; line-height: 1.6;}
.k-mn-contact-text > .title h2 .txt {display: block; margin-top: 15px; color: #333; font-size: 16px; font-weight: normal;}
.k-mn-contact-text > .title h2 ~ p {margin-top: 15px;}
.k-mn-contact-text > .title [class^="t-icon-"] {vertical-align:middle; position:relative; display: inline-block; width: 70px; height: 70px; border-radius: 50%; background-color: #fff;}
.k-mn-contact-text > .title [class^="t-icon-"]:before {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 36px; height: 36px;}
.k-mn-contact-text > .title .k-icon-map-pin:before {width: 46px; height: 46px;}
.k-mn-contact-text > .title .hover-line {vertical-align:middle; font-size: 20px;}
.k-mn-contact-text > .title .hover-line > span {display:block; font-size: 17px; color: #0e0a22; margin-bottom: 5px;}
.k-mn-contact-text > .title .hover-line:before {top: 105%;}
.k-mn-contact-text > .title .k-icon-map-pin + .hover-line:before {display: none;}

.k-text-field-row {display: flex; align-items:normal;}
.k-text-field-row .k-text-field {flex: 1;}
.k-text-field-row .k-text-field ~ .k-text-field {margin-left: 10px;}

.k-text-field-row > .k-text-field-label {display: flex; align-items: center; width: 150px; padding-right: 10px;}
.k-text-field-row > .k-text-field-label.vertical-top {align-items:flex-start; padding-top: 16px;}
.k-text-field-row > .k-text-field-label.vertical-top ~ textarea.k-form-input {padding-top: 16px;}
/* .k-text-field-row > .k-text-field-label + .k-form-input {width: 65%;} */
.k-text-field-label .w-icon-asterisk {line-height: 1.4;}
.k-text-field-label .w-icon-asterisk:before {margin: -9px 0 0 5px; width: 14px; height: 18px;}
.k-text-field-row > .k-form-input {margin-bottom: 0; flex:1; padding: 30px 30px 30px 10px;}
.k-text-field-row > textarea.k-form-input {min-height: 150px;}
.k-text-field-row > .k-form-text {margin-bottom: 0; flex:1; padding: 10px 30px 10px 0;}
.k-text-field-row > label.error {width: 100%; margin-left: 150px; margin-top: 0; margin-bottom: -35px;}

.k-text-field-multi-chk {display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 45px; margin-top: 5px;}
.k-text-field-multi-chk .k-checkbox,
.k-text-field-multi-chk .k-radio {margin-top:15px; margin-right: 15px; cursor: pointer;}

label.error {display: flex; align-items: center; min-height: 20px; padding: 5px 0 5px 0; margin-top: -20px; font-size: 15px; line-height: 18px; color: #e81887;}
.k-mn-contact-form .k-input + label.error {}
label.chk-error {}
.k-form-submit-wrap label.error {margin-top: 10px;}
.chk-error-box-wrap {position: relative;}
label.chk-error-box {/*-webkit-transition:opacity 0.25s; transition:opacity 0.25s;*/margin-top:0; animation:chk-error-box-ani .2s linear; position: absolute; z-index: 2; top: -5px; left: 32px; right: auto; width: 60%; color: #4c4c4c; text-align: left; font-size: 0.923rem; line-height: 1.4; border-radius: 6px; padding: 10px 22px 10px 10px; border: 1px solid #595959; background-color: #fff; -webkit-box-shadow:3px 3px 5px 0 rgba(0, 0, 0, 0.07); box-shadow:3px 3px 5px 0 rgba(0, 0, 0, 0.07); font-size: 14px; line-height: 1.3; color: #333}
@keyframes chk-error-box-ani {
	from {transform:translateY(-30%); opacity: 0;}
	to {transform:translateY(0%); opacity: 1;}
}
label.chk-error-box::after {content: ''; height: 10px; width: 10px; position: absolute; background-color: #fff; top: 50%; left: -6px; border-top: #595959 solid 1px; border-left: #595959 solid 1px; transform:translateY(-50%) rotate(-45deg);}


label.error-text {display: block; min-height: 20px; padding: 5px 0 5px 0; margin-top: -20px; font-size: 15px; line-height: 18px; color: #e81887;}
.k-text-field-info {display: block; min-height: 20px; padding: 5px 0 5px 0; margin-top: -20px; font-size: 14px; line-height: 18px; color: #6e6d7a;}
label.error ~ .k-text-field-info,
label.error-text ~ .k-text-field-info {display: none;}

.k-form-submit-wrap {display: flex; align-items: center;}
.k-form-submit-wrap > p {position: relative;}
.k-form-submit-wrap .k-form-submit {display: flex; align-items: center; margin-left: auto; width: 40%; font-size: 22px; text-align: right;}
.k-form-submit-wrap .k-form-submit .k-btn {}
.k-form-submit-wrap .w-icon-recaptcha:before {margin-right: 10px; filter: grayscale(100%);}
@media screen and (max-width: 767px) {
    .k-form-submit-wrap {flex-wrap: wrap;}
    .k-form-submit-wrap .k-form-submit {margin-top: 20px; width: 100%;}
    .k-text-field-label {/*font-size: 15px;*/}
    .k-text-field-row > .k-text-field-label {width: 32%;}
    .k-text-field-row label.error {/*margin-left: 32%;*/}
    .k-text-field-multi-chk .k-checkbox,
    .k-text-field-multi-chk .k-radio {margin-top:10px; margin-right: 10px;}
    .k-text-field-multi-chk {margin-bottom: 25px;}
}

@media screen and (max-width: 413px) {
    
}



@supports not (-webkit-touch-callout:none) {
}

@media all and (max-width: 768px) {

}
@media all and (min-width: 768px) and (max-width:1023px) {

}
@media all and (min-width: 1023px) {
    /* @supports(-webkit-touch-callout:none) {

    } */
    /* @supports not (-webkit-touch-callout:none) {

    } */
}
/* @media only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min-resolution:144dpi),only screen and (min-resolution:1.5dppx) {

} */






/* grecaptcha */
.grecaptcha-badge {display: none;}

/* ================================================================= three js */
.canvas-container > canvas {
    position: fixed;
    z-index: 21;
    top: 0;
    width: 100%;
    height: 100%;
    width: 100%;
    height: 100%;
    
}

/* Rail */

.rail {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	overflow: hidden;
	pointer-events: none;
}

.rail_container {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.rail_sizing {
	position: relative;
	opacity: 0;
	height: auto;
	width: 420vw;

	@media screen and (min-width: 53em) {
		width: 232vw;
	}
}

.rail_clip {
	position: absolute;
	inset: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	-webkit-clip-path: url("#contentTitle");
	clip-path: url("#contentTitle");
	animation: clip-anim 20s linear infinite;
}

@media screen and (max-width: 767px) {
    .rail_clip { width: 150%;  height: 80%;}
}


.rail_color {
	position: absolute;
	inset: 0;
	height: 100%;
	width: 100%;
	background-color: #adbfeb;
	animation: color-anim 20s linear infinite;
}

.rail_heading {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.rail_gradients {
	display: flex;
	align-items: center;
	justify-content: center;
	backface-visibility: hidden;
	width: 100vw;
	height: 100%;
	transform: scale(1.75);

	@media screen and (min-width: 53em) {
		transform: scale(1);
	}
}

.rail_gradient {
	position: absolute;
	width: 52vw;
	height: 52vw;
	min-width: 52vw;
	min-height: 52vw;
}

.rail_gradient.-core {
	transform: translate(-7vw, calc(-2.3vw + 100vh));
	animation: intro-core 3s cubic-bezier(.04,1.15,0.4,.99) 0.5s forwards;
}

.rail_gradient.-pro {
	transform: translate(7vw, calc(5vw + 100vh));
	animation: intro-pro 2.75s cubic-bezier(.04,1.15,0.4,.99) 0.75s forwards;
}

@keyframes clip-anim {
	from {
		transform: translateX(0%);
   }
	to {
		transform: translateX(-50%);
   }
}

@keyframes color-anim {
	from {
		transform: translateX(0%);
   }
	to {
		transform: translateX(50%);
   }
}

/* Boxes */

.boxes {
	position: absolute;
	inset: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	transform: scale(1.75);

	@media screen and (min-width: 53em) {
		transform: scale(1);
	}
}

.box {
	position: absolute;
}

.box_container {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

.box_gradient {
	position: absolute;
	width: 180%;
	height: 180%;
	opacity: 0.4;
}

.box_image {
	position: relative;
	height: auto;
}

.box.-core {
	transform: translate(-7vw, calc(-2.3vw + 100vh));
	animation: intro-core 3s cubic-bezier(.04,1.15,0.4,.99) 0.5s forwards;
}

.box.-core .box_container {
	animation: float-core 4s ease-in-out 0s alternate;
	animation-iteration-count: infinite;
}

.box.-core .box_image {
	width: 26vw;
}

.box.-core .box_gradient {
	transform: translateX(-2vw);
}

.box.-pro {
	transform: translate(7vw, calc(5vw + 100vh));
	animation: intro-pro 2.75s cubic-bezier(.04,1.15,0.4,.99) 0.75s forwards;
}

.box.-pro .box_container {
	animation: float-pro 3s ease-in-out 0s alternate;
	animation-iteration-count: infinite;
}

.box.-pro .box_image {
	width: 22vw;	
}

.box.-pro .box_gradient {
	transform: translate(2vw, 2vw);
}

@keyframes float-core {
	from {
		transform: translateY(0%);
   }
	to {
		transform: translateY(5%);
   }
}
@keyframes float-pro {
	from {
		transform: translateY(4%);
   }
	to {
		transform: translateY(0%);
   }
}

@keyframes intro-core {
	from {
		transform: translate(-7vw, calc(-2.3vw + 100vh));
   }
	to {
		transform: translate(-7vw, -2.3vw);
   }
}
@keyframes intro-pro {
	from {
		transform: translate(7vw, calc(5vw + 100vh));
   }
	to {
		transform: translate(7vw, 5vw);
   }
}