/* header */
header {pointer-events:inherit; position:fixed; z-index:1000; left:0; top:0; width:100%; display:flex; flex-wrap:wrap; align-items:center; padding:15px 20px;}
header .header-menu {flex:1; min-width:0;}
header .header-menu .menu {display:block; font-size:0; width:24px; height:24px; background:url('../images/icon_menu.svg') no-repeat center / cover; filter:var(--filter-gray-300); transition:all ease 0.5s;}
header .header-button {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;}
header .header-button ul {display:flex; flex-wrap:wrap; align-items:center;}
header .header-button ul li {margin:0 20px 0 0;}
header .header-button ul li:last-of-type {margin:0;}
header .header-button ul li a {font-size:16px; font-weight:500; color:var(--color-white); transition:all ease 0.5s;}
header .header-button ul li a:hover {text-decoration:underline;}
header .header-logo h1 a {display:block; position:relative; width:200px; height:40px; font-size:40px; font-weight:600; color:var(--color-white); transition:all ease 0.5s;}
header .header-logo h1 a img {transition:all ease 0.5s; width:100%; height:100%; object-fit:cover; position:absolute; left:0; top:0; display:block;}
header .header-logo h1 a img.logo-b {opacity:0;}
header .header-mobile {pointer-events:none; opacity:0; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9999; transition:all ease 0.5s;}
header .header-mobile .box {pointer-events:none; opacity:0; position:absolute; left:-30px; top:0; width:100%; max-width:300px; height:100%; background:#FFFFFF; transition:all ease 0.5s; display:flex; flex-direction:column;}
header .header-mobile .mobile-head {width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; padding:15px;}
header .header-mobile .mobile-head .close {width:24px; height:24px; font-size:0; background:url('../images/icon_close.svg') no-repeat center / cover; filter:var(--filter-gray-400);}
header .header-mobile .mobile-body {width:100%; height:100%; padding:0 20px 20px; overflow-y:auto;}
header .header-mobile .mobile-body h2 {margin:0 0 30px; display:block; font-size:30px; font-weight:600; color:#000000;}
/*header .header-mobile .mobile-body h2 a {display:block; font-size:30px; font-weight:600; color:#000000;}*/
/*header .header-mobile .mobile-body h2 a {display:block; font-size:40px; font-weight:600; color:#b4c6ac;}*/
header .header-mobile .mobile-body > ul > li {margin:0 0 10px;}
header .header-mobile .mobile-body > ul > li:last-of-type {margin:0;}
header .header-mobile .mobile-body > ul > li > a {display:flex; flex-wrap:wrap; align-items:center;}
header .header-mobile .mobile-body > ul > li > a p {font-size:16px; color:#000000; font-weight:500;}
header .header-mobile .mobile-body > ul > li > a p:hover {color:#77875F;}
header .header-mobile .mobile-body > ul > li > a.toggle p {flex:1; min-width:0; padding:0 10px 0 0;}
header .header-mobile .mobile-body > ul > li > a.toggle:after {display:block; content:""; width:24px; height:24px; filter:var(--filter-light-active); background:url('../images/icon_arrow_down.svg') no-repeat center / cover; filter:var(--filter-active2);}
header .header-mobile .mobile-body > ul > li > ul {display:none; background:#000000; border-radius:5px; margin:5px 0 0; padding:15px;}
header .header-mobile .mobile-body > ul > li > ul > li {margin:0 0 3px;}
header .header-mobile .mobile-body > ul > li > ul > li:last-of-type {margin:0;}
header .header-mobile .mobile-body > ul > li > ul > li a {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#FFFFFF;}
header .header-mobile .mobile-body > ul > li > ul > li a:hover {color:#77875F;}
header .header-mobile .mobile-body > ul > li > ul > li.active a {color:var(--color-white);}
header .header-mobile .mobile-body > ul > li.active > a p {color:#77875F;}
header .header-mobile .mobile-body > ul > li.active > a.toggle:after {background-image:url('../images/icon_arrow_up.svg');}
header .header-mobile .mobile-body > ul > li.active > ul {display:block;}
header.scroll {background:#000000; pointer-events:inherit;}
header.scroll .header-menu .menu {filter:var(--filter-white);}
header.scroll .header-button ul li a {color: var(--color-active2);}
header.scroll .header-logo h1 a {color:var(--color-active2);}
header.scroll .header-logo h1 a img.logo-w {opacity:0;}
header.scroll .header-logo h1 a img.logo-b {opacity:1;}
header.fixed .header-mobile {pointer-events:inherit; opacity:1;}
header.fixed .header-mobile .box {pointer-events:inherit; opacity:1; left:0;}
header.no-scroll.scroll {opacity:0; pointer-events:none;}
header.no-scroll {background:#000000; pointer-events:inherit;}
header.no-scroll .header-menu .menu {filter:var(--filter-white);}
header.no-scroll .header-button ul li a {color: var(--color-active2);}
header.no-scroll .header-logo h1 a {color:var(--color-active2);}
header.no-scroll .header-logo h1 a img.logo-w {opacity:0;}
header.no-scroll .header-logo h1 a img.logo-b {opacity:1;}
@media (max-width:991px){
header {padding:10px 15px;}
header .header-button ul li {margin:0 15px 0 0;}
header .header-button ul li a {font-size:14px;}
header .header-logo h1 a {font-size:30px; width:170px; height:30px;}
header .header-mobile .mobile-body h2 {margin:0 0 20px;}
header .header-mobile .mobile-body h2 a {font-size:30px;}
}

/* footer */
footer {border-top:1px solid var(--color-active2); padding:20px 20px; display:flex; flex-wrap:wrap; align-items:center; position: ;  bottom: 0;  left: 0;  width: 100%;  z-index: 999;  background: #fff;}
footer .footer-left {flex:1; min-width:0; padding:0 20px 0 0;}
footer .footer-left ul {display:flex; flex-wrap:wrap;}
footer .footer-left ul li {flex:1; min-width:0; display:flex; flex-wrap:wrap; padding:0 15px 0 0;}
footer .footer-left ul li b {font-size:16px; font-weight:800; color:var(--color-active2);}
footer .footer-left ul li p {flex:1; min-width:0; font-size:16px; color:var(--color-active2); word-break:keep-all; margin:0 0 0 15px;}
footer .footer-right {margin:0 0 0 100px;}
footer .footer-right ul {display:flex; flex-wrap:wrap; align-items:center;}
footer .footer-right ul li {margin:0 50px 0 0;}
footer .footer-right ul li:last-of-type {margin:0;}
footer .footer-right ul li a {display:block; font-size:0; width:36px; height:36px; background-size:cover; background-position:center; }
footer .footer-right ul li a.kakao {background-image:url('../images/icon_kakao.svg');}
footer .footer-right ul li a.instagram {background-image:url('../images/icon_instagram.svg');}
footer .footer-right ul li a.toktok {background-image:url('../images/icon_naver.svg');}
@media (max-width:991px){
footer {margin-top:30px; padding:30px 15px; position: static; bottom: auto; left: auto;}
footer .footer-left {flex:none; width:100%; padding:0;}
footer .footer-left ul li {flex:none; width:100%; margin:0 0 5px;}
footer .footer-left ul li:last-of-type {margin:0;}
footer .footer-left ul li b {font-size:12px;}
footer .footer-left ul li p {font-size:13px; margin:0 0 0 8px;}
footer .footer-left ul li p a {font-size:13px;}
footer .footer-right {width:100%; margin:25px 0 0;}
footer .footer-right ul li {margin:0 15px 0 0;}
}

/* section */
section {padding:100px 0;}
@media (max-width:991px){
section {padding:100px 0 70px;}
}

/* main-box */
.main-box {margin:0 auto -200px;}
@media (max-width:991px){
.main-box {margin:0 0 -150px;}
}

/* main-title */
.main-box .main-title {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0 0 100px;}
.main-box .main-title .inner {position:relative; padding:0 10%;}
.main-box .main-title .inner h2 {font-size:50px; font-weight:500; color:var(--color-active2); text-align:center; font-weight:700;}
.main-box .main-title .inner p {text-align:center; font-size:20px; color:var(--color-active2); word-break:keep-all; font-weight:600;}
.main-box .main-title .inner a {width:50px; height:50px; background:var(--color-active2); border-radius:50%; position:absolute; right:0; top:50%; transform:translateY(-50%); display:flex; flex-wrap:wrap; align-items:center; justify-content:center; font-size:0;}
.main-box .main-title .inner a:after {display:inline-block; content:""; width:24px; height:24px; background:url('../images/icon_arrow_right.svg') no-repeat center / cover; filter:var(--filter-white);}
@media (max-width:991px){
.main-box .main-title .inner h2 {font-size:35px; font-weight:700;}
.main-box .main-title .inner p {font-size:15px; font-weight:600;}
.main-box .main-title .inner a {width:45px; height:45px; position:static; transform:none; margin:40px auto 20px;}
}
@media (max-width:767px){
.main-box .main-title {margin:0 0 30px;}
.main-box .main-title .inner {padding:0 5%; width:100%;}
}

/* main-top */
.main-box .main-top {overflow:hidden; position:relative; padding:90px 20px 11%; margin:-100px 0 0; background:url('../images/img_main_top.png') no-repeat center / cover; background-size:100% auto; width:100%;}
.main-box .main-top:before {position:absolute; left:0; top:0; width:100%; height:100%; content:"";}
.main-box .main-top h2 {pointer-events:none; opacity:0; position:relative; color:#fff6e6; text-align:center; font-size:25vw; line-height:1; margin:-50px 0 0;}
.main-box .main-top p {pointer-events:none; opacity:0; position:relative; text-align:center; font-size:30px; font-weight:500; color:#fff6e6; margin:10% 0 0;}
@media (max-width:991px){
.main-box .main-top p {font-size:25px;}
}
@media (max-width:767px){
.main-box .main-top {padding:75px 20px 15%; background:url('../images/img_main_top.png') no-repeat center / cover;}
.main-box .main-top h2 {margin:0;}
.main-box .main-top p {font-size:20px;}
}
@media (max-width:575px){
.main-box .main-top {padding:10% 20px 63%; background:url('../images/img_main_top.png') no-repeat center / cover;}
.main-box .main-top p {font-size:17px;}
}

/* main-banner */
.main-box .main-banner {overflow:hidden;}
.main-box .main-banner img {width:100%;}
@media (max-width:991px){
.main-box .main-banner {position:relative;}
.main-box .main-banner:after {display:block; content:""; padding-bottom:68%;}
.main-box .main-banner img {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:125%; height:125%; object-fit:cover;}
}

/* main-text */
.main-box .main-text {background:var(--color-active2); padding:100px 0;}
.main-box .main-text .inner {display:block;}
.main-box .main-text h2 {text-align:center; font-size:80px; color:var(--color-white); font-weight:600;}
.main-box .main-text p {text-align:center; font-size:50px; color:var(--color-white); font-weight:500;}
.main-box .main-text span {display:block; text-align:center; font-size:30px; color:var(--color-white); margin:20px 0 0; font-weight:600;}
@media (max-width:991px){
.main-box .main-text {padding:35px 0;}
.main-box .main-text h2 {font-size:28px;}
.main-box .main-text p {font-size:18px; margin:20px 0 0;}
.main-box .main-text span {margin:10px 0 0; font-size:14px;}
}

/* main-item */
.main-box .main-item {margin:200px 0;}
@media (max-width:991px){
.main-box .main-item {margin:80px 0;}
.main-box .main-item .item-list-box {padding:0 15px;}
}

/* main-about */
.main-box .main-about {background:url('../images/bg_main_about.png') no-repeat center / cover; background-attachment:fixed; padding:200px 0;}
.main-box .main-about .container {display:flex; flex-wrap:wrap; align-items:center;}
.main-box .main-about h2 {font-size:50px; color:var(--color-white); font-weight:700;}
.main-box .main-about p {flex:1; min-width:0; padding:0 0 0 10%; font-size:16px; line-height:2.5; color:var(--color-white); word-break:keep-all;}
@media (max-width:991px){
.main-box .main-about {padding:100px 0;}
.main-box .main-about h2 {width:100%; font-size:35px; font-weight:700;}
.main-box .main-about h2 br {display:none;}
.main-box .main-about p {flex:none; padding:0; font-size:16px; line-height:1.8; width:100%; margin:20px 0 0;}
.main-box .main-about p br {display:none;}
}

/* main-product */
.main-product {padding:100px 0; background:url('../images/bg_main_product.png') no-repeat center / cover; overflow:hidden;}
.main-product h2 {text-align:center; font-size:70px; color:var(--color-active2); font-weight:800;}
.main-product .inner {display:flex; flex-wrap:wrap; padding:0 10%; margin:3% 0 0;}
.main-product .inner p {font-size:80px; color:var(--color-active2); flex:1; min-width:0; font-weight:500;}
.main-product .inner p:first-of-type {text-align:right;}
.main-product .inner p:last-of-type {display:flex; flex-wrap:wrap; align-items:flex-end;}
.main-product .inner .image {display:block; width:40%;}
.main-product .inner .image img {width:100%;}
@media (max-width:1430px){
.main-product .inner p {font-size:80px; font-weight:500; text-align:center;}
}
@media (max-width:1150px){
.main-product h2 {font-size:80px; font-weight:500;}
.main-product .inner p {font-size:60px; font-weight:500; text-align:center;}
}
@media (max-width:991px){
.main-product {padding:70px 20px; background-image:url('../images/bg_main_product.png');}
.main-product h2 {font-size:40px; text-align:center; line-height:1.2; font-weight:800;}
.main-product .inner {padding:0;}
.main-product .inner p {font-size:25px; margin:0 10px 0 0; font-weight:500; text-align:center;}
.main-product .inner p:first-of-type {order:1;}
.main-product .inner p:last-of-type {order:4; margin:0;}
.main-product .inner .image {width:100%;}
.main-product .inner .image img {display:block; margin:0 auto; width:80%;}
}