@charset "utf-8";
*{ list-style: none; margin: 0; padding: 0; border: 0; box-sizing: border-box; text-decoration: none; line-height: 1; letter-spacing: -0.5px; font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
input{ outline: none; -webkit-appearance: none;}
select{ outline: none; -webkit-appearance: none;}
select::-ms-expand{ display: none;}
textarea{ outline: none; -webkit-appearance: none;}
html{ overflow-y: scroll; width: 100%; height: 100%; background: #FFF;}
html.no_scroll{ overflow: hidden;}
body{ overflow: hidden; background: #FFF; -webkit-text-size-adjust: none; transition: all .2s;}
@media(max-width: 1000px){
}
@media(max-width: 767px){
    html{ font-size: calc(100vw / 30);}
}


body::-webkit-scrollbar{ width: 5px; background: #000;}
body::-webkit-scrollbar-thumb{ background-color: #00FF69; border-radius: 0;}


.font_ser{ font-family: "Libre Baskerville", sans-serif;}


.modle_max{ padding-right: 30px; padding-left: 30px;}
.modle_min{ margin: 0 auto; max-width: 1500px; width: 100%;}
@media(max-width: 767px){
    .modle_max{ padding-right: 1rem; padding-left: 1rem;}
}

.br_pc{ display: block;}
.br_pad{ display: none;}
.br_m{ display: none;}
@media(max-width: 1560px){
    .br_pc{ display: none;}
    .br_pad{ display: block;}
    .br_m{ display: none;}
}
@media(max-width: 767px){
    .br_pc{ display: none;}
    .br_pad{ display: none;}
    .br_m{ display: block;}
}


.full_menu{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: fixed; z-index: 200; top: 0; right: -100%; bottom: 0; left: 100%; background: rgba(0 0 0/70%); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; transition: all .3s;}
.full_menu .inner{ display: flex; justify-content: space-between; align-items: center; max-width: 1200px; width: 100%;}
.full_menu .inner .fl{ position: relative;}
.full_menu .inner .fl .menu{ display: flex; flex-direction: column; align-items: flex-start; gap: 15px;}
.full_menu .inner .fl .menu a{ display: block; position: relative; font-size: 120px; font-weight: 900; color: #FFF; opacity: 0; transition: all .3s;}
.full_menu .inner .fl .menu a:nth-child(1){ transform: translate(100px,0); opacity: 0;}
.full_menu .inner .fl .menu a:nth-child(2){ transform: translate(200px,0); opacity: 0;}
.full_menu .inner .fl .menu a:nth-child(3){ transform: translate(300px,0); opacity: 0;}
.full_menu .inner .fl .menu a:nth-child(4){ transform: translate(400px,0); opacity: 0;}
.full_menu .inner .fl .menu a:after{ content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: #FFF; transition: all .3s;}
.full_menu .inner .fl .menu a:hover:after{ width: 100%;}

.full_menu .inner .fl .menu a.on:nth-child(1){ color: #bb69ff;}
.full_menu .inner .fl .menu a.on:nth-child(2){ color: #f247fa;}
.full_menu .inner .fl .menu a.on:nth-child(3){ color: #7acc00;}
.full_menu .inner .fl .menu a.on:nth-child(4){ color: #ffdd00;}

.full_menu .inner .fl .txt{ position: absolute; top: 0; left: 0; transform: translate(-120px,90px) rotate(-90deg); font-size: 16px; font-weight: 300; text-transform: uppercase; color: rgba(255 255 255/60%); transition: all .3s;}
.full_menu .inner .fr{ transform: translate(500px,0); opacity: 0; transition: all .3s;}
.full_menu .inner .fr .ft{ display: grid; grid-gap: 10px; padding: 0 0 30px 0;}
.full_menu .inner .fr .ft img{ display: block;}
.full_menu .inner .fr .ft .t1{ width: 40%;}
.full_menu .inner .fr .ft .t2{ width: 340px;}
.full_menu .inner .fr .ft .t3{ width: 340px;}
.full_menu .inner .fr .fm{ display: flex; justify-content: flex-start; padding: 30px 0; border-top: 1px solid rgba(255 255 255/20%); border-bottom: 1px solid rgba(255 255 255/20%);}
.full_menu .inner .fr .fm a{ display: block; position: relative;}
.full_menu .inner .fr .fm a span{ position: absolute; top: -10px; right: -40px; padding: 0 10px; height: 25px; border-radius: 20px; background: #F247FA; line-height: 25px; font-size: 14px; font-weight: 300; color: #FFF;}
.full_menu .inner .fr .fm a p{ font-size: 40px; font-weight: 500; color: #FFF; transition: all .3s;}
.full_menu .inner .fr .fm a p:hover{ color: rgba(255 255 255/50%);}
.full_menu .inner .fr .fb{ display: flex; flex-direction: column; align-items: flex-start; padding: 30px 0 0 0;}
.full_menu .inner .fr .fb .txt{}
.full_menu .inner .fr .fb .txt span{ display: block; margin: 20px 0 0 0;}
.full_menu .inner .fr .fb .txt span:first-child{ margin: 0;}
.full_menu .inner .fr .fb .txt span .t1{ font-size: 16px; font-weight: 200; color: rgba(255 255 255/60%);}
.full_menu .inner .fr .fb .txt span .t2{ padding: 5px 0 0 0; font-size: 18px; color: rgba(255 255 255/100%);}
.full_menu .inner .fr .fb .btn{ display: flex; align-items: center; margin: 30px 0 0 0; padding: 0 40px; height: 60px; border-radius: 30px; background: #F247FA; font-size: 20px; font-weight: 600; color: #FFF; transition: all .3s; cursor: pointer;}
.full_menu .inner .fr .fb .btn:hover{ padding: 0 60px;}
.full_menu .close{}
.full_menu .close_btn{ display: flex; align-items: center; position: fixed; z-index: 300; top: 30px; right: 30px; height: 30px; cursor: pointer; transform: translate(0,-200px); opacity: 0; transition: all .3s;}
.full_menu .close_btn svg{ display: block; width: 40px; height: 40px; color: #FFF; transition: all .3s;}
.full_menu .close_btn:hover svg{ transform: rotate(180deg); color: rgba(255 255 255/50%);}

.full_menu.on{ right: 0; left: 0; opacity: 1;}
.full_menu.on .inner .fl .menu a:nth-child(1){ transform: translate(0,0); opacity: 1; transition: all 0.5s;}
.full_menu.on .inner .fl .menu a:nth-child(2){ transform: translate(0,0); opacity: 1; transition: all 0.8s;}
.full_menu.on .inner .fl .menu a:nth-child(3){ transform: translate(0,0); opacity: 1; transition: all 1.1s;}
.full_menu.on .inner .fl .menu a:nth-child(4){ transform: translate(0,0); opacity: 1; transition: all 1.4s;}
.full_menu.on .inner .fr{ transform: translate(0,0); opacity: 1; transition: all 1.7s;}
.full_menu.on .close_btn{ transform: translate(0,0); opacity: 1; transition: all 1.0s;}
@media(max-width: 1560px){
    .full_menu .inner{ max-width: 800px;}
    .full_menu .inner .fl .menu a{ padding: 5px 0; font-size: 80px;}
    .full_menu .inner .fl .txt{ transform: translate(-110px,85px) rotate(-90deg);}
    .full_menu .inner .fr{ transform: translate(400px,0);}
    .full_menu .inner .fr .ft{ padding: 0 0 20px 0;}
    .full_menu .inner .fr .ft .t1{ width: 30%;}
    .full_menu .inner .fr .ft .t2{ width: 280px;}
    .full_menu .inner .fr .ft .t3{ width: 280px;}
    .full_menu .inner .fr .fm{ padding: 20px 0;}
    .full_menu .inner .fr .fm a p{ font-size: 24px;}
    .full_menu .inner .fr .fb{ padding: 20px 0 0 0;}
    .full_menu .inner .fr .fb .txt span{ margin: 10px 0 0 0;}
    .full_menu .inner .fr .fb .txt span .t1{ font-size: 14px;}
    .full_menu .inner .fr .fb .txt span .t2{ padding: 5px 0 0 0; font-size: 16px;}
    .full_menu .inner .fr .fb .btn{ margin: 20px 0 0 0; height: 50px; font-size: 18px;}
}
@media(max-width: 1000px){
    .full_menu .inner{ padding: 50px 0 0 0; max-width: 600px;}
    .full_menu .inner .fl .menu a{ padding: 10px 0; font-size: 70px;}
    .full_menu .inner .fl .txt{ transform: translate(-110px,80px) rotate(-90deg);}
    .full_menu .inner .fr{ width: 200px;}
    .full_menu .inner .fr .ft .t1{ width: 30%;}
    .full_menu .inner .fr .ft .t2{ width: 200px;}
    .full_menu .inner .fr .ft .t3{ width: 200px;}
}
@media(max-width: 767px){
    .full_menu{ align-items: flex-end; padding: 0 3rem !important;}
    .full_menu .inner{ flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 0 0 3rem 0;}
    .full_menu .inner .fl{ padding: 0 0 1rem 0; width: 100%; border-bottom: 1px solid rgba(255 255 255/20%);}
    .full_menu .inner .fl .menu a{ padding: 0.2rem 0; font-size: 2.2rem;}
    .full_menu .inner .fl .txt{ transform: translate(0,-1.5rem) rotate(0deg); font-size: 0.9rem;}
    .full_menu .inner .fr{ padding: 1rem 0 0 0; width: 100%;}
    .full_menu .inner .fr .ft{ grid-gap: 0.5rem; padding: 0 0 1rem 0;}
    .full_menu .inner .fr .ft .t1{ width: 6rem;}
    .full_menu .inner .fr .ft .t2{ width: 10rem;}
    .full_menu .inner .fr .ft .t3{ width: 10rem;}
    .full_menu .inner .fr .fm{ padding: 15px 0;}
    .full_menu .inner .fr .fm a span{ top: -0.5rem; right: -2.2rem; padding: 0 0.8rem; height: 1.6rem; line-height: 1.6rem; font-size: 0.9rem;}
    .full_menu .inner .fr .fm a p{ font-size: 1.4rem;}
    .full_menu .inner .fr .fb{ padding: 20px 0 0 0;}
    .full_menu .inner .fr .fb .txt span{ margin: 10px 0 0 0;}
    .full_menu .inner .fr .fb .txt span .t1{ font-size: 12px;}
    .full_menu .inner .fr .fb .txt span .t2{ padding: 5px 0 0 0; font-size: 14px;}
    .full_menu .inner .fr .fb .btn{ justify-content: center; margin: 20px 0 0 0; padding: 0; width: 100%; height: 45px; font-size: 16px;}
    .full_menu .close_btn{ top: 1rem; right: 1rem;}
    .full_menu .close_btn svg{ width: 2.4rem; height: 2.4rem;}

    .full_menu.on .inner .fl .menu a:nth-child(1){ transition: all 0.3s;}
    .full_menu.on .inner .fl .menu a:nth-child(2){ transition: all 0.5s;}
    .full_menu.on .inner .fl .menu a:nth-child(3){ transition: all 0.7s;}
    .full_menu.on .inner .fl .menu a:nth-child(4){ transition: all 0.9s;}
    .full_menu.on .inner .fr{ transition: all 1.1s;}
    .full_menu.on .close_btn{ transition: all 0.5s;}
}


.header_search{ overflow: hidden; position: fixed; z-index: 250; top: -100%; right: 0; bottom: 100%; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; transition: opacity .3s;}
.header_search .inner{ display: flex; justify-content: center; align-items: center; position: fixed; z-index: 20; top: -100%; right: 0; left: 0; padding: 0 30px; height: 50vh; background: linear-gradient(180deg, rgba(0 255 105/30%),rgba(0 255 105/0%)); opacity: 0; transition: all .3s;}
.header_search .inner .search{ display: flex; align-items: center; max-width: 500px; width: 100%;}
.header_search .inner .search input{ display: flex; align-items: center; margin: 0; padding: 0; width: 100%; height: 50px; border-radius: 0; border: 0; border-bottom: 1px solid rgba(255 255 255/30%); background: none; font-size: 24px; font-weight: 400; color: #FFF; outline: none; -webkit-appearance: none; transition: all .3s;}
.header_search .inner .search svg{ width: 40px; height: 40px; cursor: pointer;}
.header_search .inner .search svg circle{ color: #00FF69;}
.header_search .inner .search svg path{ color: #00FF69;}
.header_search .inner .search input::placeholder{ color: #00FF69;}
.header_search .inner .search input:focus{ border-color: #00FF69;}
.header_search .close{ position: fixed; z-index: 10; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0 0 0/0.000001%);}
.header_search .close_btn{ display: flex; align-items: center; position: fixed; z-index: 300; top: 30px; right: 30px; height: 30px; cursor: pointer; transform: translate(0,-200px); opacity: 0; transition: all .3s;}
.header_search .close_btn svg{ display: block; width: 40px; height: 40px; color: #FFF; transition: all .3s;}
.header_search .close_btn:hover svg{ transform: rotate(180deg); color: rgba(255 255 255/50%);}
.header_search.on{ top: 0; bottom: 0; opacity: 1;}
.header_search.on .inner{ top: 0; opacity: 1;}
.header_search.on .close_btn{ transform: translate(0,0); opacity: 1; transition: all .5s;}
@media(max-width: 1560px){
}
@media(max-width: 1000px){
}
@media(max-width: 767px){
    .header_search .inner .search input{ height: 3rem; font-size: 1.6rem;}
    .header_search .inner .search svg{ width: 3rem; font-size: 3rem;}
    .header_search .close_btn{ top: 1rem; right: 1rem;}
    .header_search .close_btn svg{ width: 2.4rem; height: 2.4rem;}
}


.header{ position: fixed; z-index: 100; top: 0; right: 0; left: 0; transition: all .3s;}
.header .modle_min{ display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 10; height: 100px;}
.header .modle_min::after{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: linear-gradient(90deg, rgba(255 255 255/10%), rgba(0 255 105/100%), rgba(255 255 255/10%)); transition: all .3s;}
.header .fl{ display: flex; align-items: center;}
.header .fr{ display: flex; align-items: center;}
.header .logo{ display: block; position: absolute; z-index: 10; top: calc(50% - 15px); left: calc(50% - 190px/2); height: 30px;}
.header .logo img{ display: block; width: auto; height: 100%;}
.header .menu{ display: flex; align-items: center; grid-gap: 40px;}
.header .menu a{ display: flex; align-items: center; height: 100px; cursor: pointer;}
.header .menu a p{ font-size: 20px; font-weight: 600; color: #FFF; white-space: nowrap; transition: all .3s;}
.header .lang{ display: flex; align-items: center; margin: 0 0 0 60px;}
.header .lang a{ display: block; font-size: 18px; font-weight: 600; color: rgba(255 255 255/50%); transition: all .3s;}
.header .lang a.on{ color: #FFF;}
.header .lang a:hover{ color: #00FF69;}
.header .lang span{ display: block; margin: 0 15px; width: 1px; height: 18px; background: rgba(255 255 255/30%);}
.header .btn_search{ display: flex; align-items: center; margin: 0 0 0 60px; cursor: pointer;}
.header .btn_search svg{ display: block; width: 30px; height: 30px; color: #FFF;}
.header .btn_search svg circle{ color: #FFF; transition: all .3s;}
.header .btn_search svg path{ color: #FFF; transition: all .3s;}
.header .btn_search:hover svg circle{ color: #00FF69;}
.header .btn_search:hover svg path{ color: #00FF69;}
.header .btn_full_menu{ margin: 0 0 0 30px; cursor: pointer;}
.header .btn_full_menu svg{ display: block; width: 30px; height: 30px;}
.header .btn_full_menu svg path{ color: #FFF; transition: all .3s;}
.header .btn_full_menu:hover svg path{ color: #00FF69;}

.header .fl .menu a:nth-child(1):hover p{ color: #bb69ff;}
.header .fl .menu a:nth-child(2):hover p{ color: #f247fa;}
.header .fl .menu a:nth-child(3):hover p{ color: #7acc00;}
.header .fl .menu a:nth-child(4):hover p{ color: #ffdd00;}
.header .fr .menu a:nth-child(1):hover p{ color: #fa9747;}

.header .fl .menu a.on:nth-child(1) p{ color: #bb69ff;}
.header .fl .menu a.on:nth-child(2) p{ color: #f247fa;}
.header .fl .menu a.on:nth-child(3) p{ color: #7acc00;}
.header .fl .menu a.on:nth-child(4) p{ color: #ffdd00;}

.header.on{ background: rgba(0 0 0/80%); backdrop-filter: blur(20px);}
.header.on .modle_min::after{ opacity: 0;}
@media(max-width: 1560px){
    .header .menu{ grid-gap: 30px;}
    .header .menu a p{ font-size: 18px;}
}
@media(max-width: 1025px){
    .header .fl .menu{ display: none;}
    .header .logo{ left: 0;}
}
@media(max-width: 767px){
    .header .modle_min{ height: 5rem;}
    .header .logo{ top: calc(50% - 0.8rem); height: 1.4rem;}
    .header .menu a{ height: 5rem;}
    .header .menu a p{ font-size: 1.2rem;}
    .header .lang{ margin: 0 0 0 1.5rem;}
    .header .lang a{ font-size: 1rem;}
    .header .lang span{ margin: 0 0.6rem; height: 1rem;}
    .header .btn_search{ margin: 0 0 0 1.5rem;}
    .header .btn_search svg{ width: 1.6rem; height: 1.6rem;}
    .header .btn_full_menu{ margin: 0 0 0 1rem;}
    .header .btn_full_menu svg{ width: 1.6rem; height: 1.6rem;}
}


.footer{ overflow: hidden; position: relative; background: #000;}
.footer .modle_min{ padding-top: 100px;}
.footer .fl{ display: flex; flex-direction: column; align-items: flex-start; position: relative; z-index: 10;}
.footer .fl .logo{ display: block; height: 40px;}
.footer .fl .logo img{ display: block; width: auto; height: 100%; transition: all .3s;}
.footer .fl .logo:hover img{ opacity: .6;}
.footer .fl .menu{ display: flex; align-items: center; grid-gap: 40px; margin: 60px 0 0 0;}
.footer .fl .menu a{ display: block; font-size: 16px; font-weight: 600; color: rgba(255 255 255/90%); cursor: pointer; transition: all .3s;}
.footer .fl .menu a:hover{ color: #00FF69;}
.footer .fl .text{ margin: 20px 0 0 0;}
.footer .fl .text p{ line-height: 1.4; font-size: 15px; font-weight: 300; color: rgba(255 255 255/60%);}
.footer .fr{ display: flex; flex-direction: column; align-items: flex-end; position: relative; margin-top: -280px;}
.footer .fr .map{ position: relative; height: 500px;}
.footer .fr .map .point{ position: absolute; z-index: 2; top: 67%; left: 46%; width: 0; height: 0; mix-blend-mode: screen; pointer-events: none;}
.footer .fr .map .point:before{ content: ""; position: absolute; top: 50%; left: 50%; margin: -90px 0 0 -90px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(242 71 250/45%) 0%, rgba(242 71 250/18%) 45%, rgba(242 71 250/0) 100%); animation: map_glow 3s ease-in-out infinite alternate;}
.footer .fr .map .point i{ position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -5px; width: 10px; height: 10px; border-radius: 50%; background: #F247FA; box-shadow: 0 0 14px 3px rgba(242 71 250/90%);}
.footer .fr .map .point span{ position: absolute; top: 50%; left: 50%; margin: -14px 0 0 -14px; width: 28px; height: 28px; border-radius: 50%; border: 2px solid rgba(242 71 250/85%); opacity: 0; animation: map_wave 3.6s cubic-bezier(.22,.61,.36,1) infinite;}
.footer .fr .map .point span:nth-child(2){ animation-delay: 1.2s;}
.footer .fr .map .point span:nth-child(3){ animation-delay: 2.4s;}
@keyframes map_wave{ 0%{ transform: scale(.35); opacity: 0;} 12%{ opacity: .9;} 100%{ transform: scale(5.5); opacity: 0;}}
@keyframes map_glow{ 0%{ transform: scale(.9); opacity: .75;} 100%{ transform: scale(1.15); opacity: 1;}}
.footer .fr .map img{ display: block; width: auto; height: 100%;}
.footer .fr .info{ display: flex; align-items: center; grid-gap: 15px; position: absolute; z-index: 1; right: 340px; bottom: 100px;}
.footer .fr .info .txt{ text-align: right;}
.footer .fr .info .txt .t1{ line-height: 20px; font-size: 16px; font-weight: 500; color: #FFF;}
.footer .fr .info .txt .t1 em{ font-style: normal; font-size: 12px; font-weight: 300; vertical-align: top;}
.footer .fr .info .txt .t2{ line-height: 20px; font-size: 16px; font-weight: 400; color: rgba(255 255 255/100%);}
.footer .fr .info .txt .t2 b{ font-weight: 600; color: rgba(255 255 255/100%);}
.footer .fr .info .btn{ display: flex; justify-content: center; align-items: center; width: 140px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/40%); transition: all .3s;}
.footer .fr .info .btn svg{ display: block; width: 24px; height: 24px; color: #F247FA;}
.footer .fr .info .btn p{ margin: 0 0 0 6px; font-size: 16px; font-weight: 600; color: #FFF; transition: all .3s;}
.footer .fr .info .btn:hover{ border-color: #F247FA;}
.footer .fr .info .btn:hover p{ color: #F247FA;}
.footer .fr .big{ position: absolute; z-index: 1; right: 0; bottom: 0; height: 40px;}
.footer .fr .big img{ display: block; width: auto; height: 100%;}
.footer .copy{ display: flex; justify-content: center; align-items: center; margin-top: 60px; height: 100px; border-top: 1px solid rgba(255 255 255/20%); text-align: center; font-size: 12px; color: rgba(255 255 255/40%); letter-spacing: .5px; text-transform: uppercase;}
@media(max-width: 1560px){
}
@media(max-width: 1000px){
    .footer .fr{ margin-top: -180px;}
    .footer .fr .info{ right: 260px;}
}
@media(max-width: 767px){
    .footer{}
    .footer .modle_min{ padding-top: 5rem;}
    .footer .fl{ align-items: center;}
    .footer .fl .logo{ height: 1.8rem;}
    .footer .fl .logo:hover img{ opacity: 1;}
    .footer .fl .menu{ grid-gap: 2rem; margin: 3rem 0 0 0;}
    .footer .fl .menu a{ font-size: 1.2rem;}
    .footer .fl .text{ margin: 1.2rem 0 0 0; text-align: center;}
    .footer .fl .text p{ font-size: 1rem;}
    .footer .fr{ display: flex; flex-direction: column; align-items: center; margin: 16rem 0 0 0;}
    .footer .fr .map{ position: absolute; bottom: 1rem; height: 30rem;}
    .footer .fr .map .point:before{ margin: -6rem 0 0 -6rem; width: 12rem; height: 12rem;}
    .footer .fr .map .point i{ margin: -.35rem 0 0 -.35rem; width: .7rem; height: .7rem; box-shadow: 0 0 1rem .2rem rgba(242 71 250/90%);}
    .footer .fr .map .point span{ margin: -1rem 0 0 -1rem; width: 2rem; height: 2rem; border-width: .15rem;}
    .footer .fr .map img{ display: block; width: auto; height: 100%;}
    .footer .fr .info{ grid-gap: 1rem; position: relative; right: inherit; bottom: initial;}
    .footer .fr .info .txt .t1{ line-height: 1.4; font-size: 1rem;}
    .footer .fr .info .txt .t1 em{ font-size: 1rem;}
    .footer .fr .info .txt .t2{ line-height: 1.4rem; font-size: 1rem;}
    .footer .fr .info .btn{ width: 8rem; height: 3rem; border-radius: 3rem;}
    .footer .fr .info .btn svg{ width: 1.4rem; height: 1.4rem;}
    .footer .fr .info .btn p{ margin: 0 0 0 0.5rem; font-size: 1.1rem;}
    .footer .fr .big{ position: relative; right: initial; bottom: initial; margin-top: 2rem; height: 1.2rem;}
    .footer .copy{ margin-top: 3rem; height: 6rem; font-size: 0.8rem;}
}


.quick{ position: fixed; z-index: 120; right: 50px; bottom: 100px;}
.quick .btn{ display: flex; justify-content: center; align-items: center; position: relative; margin: 10px 0 0 0; width: 60px; height: 60px; border-radius: 50%; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; cursor: pointer;}
.quick .btn:before{ content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; background: #000;  opacity: 1; transition: all .3s;}
.quick .btn:after{ content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; border: 1px solid #00FF69; opacity: 0; transition: all .3s;}
.quick .btn svg{ display: block; position: relative; z-index: 10; width: 24px; height: 24px;}
.quick .btn svg path{ color: #00FF69;}
.quick .btn:nth-child(1){ transform: translate(0,50px);  transition: .3s;}
.quick .btn:nth-child(2){ transform: translate(0,70px);  transition: .6s;}
.quick .btn:hover:before{ transform: scale(.8); background: #00FF69;}
.quick .btn:hover:after{ transform: scale(1.1); opacity: 1;}
.quick .btn:hover svg path{ color: #000;}
.quick.on .btn{ transform: translate(0,0); opacity: 1;}
@media(max-width: 1800px){
    .quick{ right: 30px;}
}
@media(max-width: 767px){
    .quick{ right: 1rem; bottom: 3rem;}
    .quick .btn{ width: 3rem; height: 3rem;}
    .quick .btn svg{ width: 1.2rem; height: 1.2rem;}
}


/* intro : 좌우 불빛 충돌 후 화면 전체로 확산 */
html.intro_on, html.intro_on body{ overflow: hidden;}
.intro{ overflow: hidden; position: fixed; z-index: 9999; top: 0; right: 0; bottom: 0; left: 0; background: #000; animation: intro_out .8s ease 1.7s forwards;}
.intro .light{ position: absolute; top: 50%; left: 50%; margin: -30vmax 0 0 -30vmax; width: 60vmax; height: 60vmax; border-radius: 50%; mix-blend-mode: screen; opacity: 0;}
.intro .light.green{ background: radial-gradient(circle closest-side, rgba(0 255 105/90%) 0%, rgba(0 255 105/40%) 42%, rgba(0 255 105/0) 100%); animation: intro_green 1s cubic-bezier(.65,0,.35,1) forwards;}
.intro .light.pink{ background: radial-gradient(circle closest-side, rgba(242 71 250/90%) 0%, rgba(242 71 250/40%) 42%, rgba(242 71 250/0) 100%); animation: intro_pink 1s cubic-bezier(.65,0,.35,1) forwards;}
.intro .flash{ position: absolute; top: 50%; left: 50%; margin: -10vmax 0 0 -10vmax; width: 20vmax; height: 20vmax; border-radius: 50%; background: radial-gradient(circle closest-side, #FFF 0%, rgba(242 71 250/85%) 38%, rgba(0 255 105/70%) 62%, rgba(0 255 105/0) 100%); transform: scale(0); animation: intro_flash 1s cubic-bezier(.22,.61,.36,1) .95s forwards;}
@keyframes intro_green{ 0%{ transform: translateX(-90vw) scale(.6); opacity: 0;} 25%{ opacity: 1;} 100%{ transform: translateX(-7vw) scale(1); opacity: 1;}}
@keyframes intro_pink{ 0%{ transform: translateX(90vw) scale(.6); opacity: 0;} 25%{ opacity: 1;} 100%{ transform: translateX(7vw) scale(1); opacity: 1;}}
@keyframes intro_flash{ 0%{ transform: scale(0); opacity: 1;} 15%{ transform: scale(.6);} 100%{ transform: scale(16); opacity: 1;}}
@keyframes intro_out{ 0%{ opacity: 1;} 100%{ opacity: 0; visibility: hidden;}}


.home_visual{ overflow: hidden; position: relative; display: flex; align-items: center; background: #000;}
.home_visual .modle_min{ display: flex; justify-content: space-between; align-items: center; grid-gap: 240px; position: relative; z-index: 20; padding: 100px 0; height: 100dvh;}
.home_visual .fl{ display: flex; flex-direction: column; align-items: flex-start; width: 100%;}
.home_visual .fl .tit{ display: flex; flex-direction: column; align-items: flex-start; grid-gap: 15px;}
.home_visual .fl .tit img{ display: block; height: auto;}
.home_visual .fl .tit img.t1{ width: 50%;}
.home_visual .fl .tit img.t2{ width: 100%;}
.home_visual .fl .tit img.t3{ width: 100%;}
.home_visual .fl .tit img.t4{ margin-top: 15px; width: 80%;}
.home_visual .fl .date{ display: flex; align-items: flex-start; margin: 20px 0 0 0; font-size: 20px; font-weight: 700; color: #FFF;}
.home_visual .fl .date em{ margin: 0 5px; font-style: normal; font-size: 12px; font-weight: 400; color: rgba(255 255 255/60%); letter-spacing: 0;}
.home_visual .fl .btn{ display: flex; justify-content: space-between; align-items: center; margin: 60px 0 0 0; padding: 0 30px; width: 200px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/40%); transition: all .3s;}
.home_visual .fl .btn p{ font-size: 16px; font-weight: 500; color: #FFF;}
.home_visual .fl .btn svg{ display: block; width: 24px; height: 24px;}
.home_visual .fl .btn svg path{ color: #FFF;}
.home_visual .fl .btn:hover{ border-color: #00FF69; background: rgba(0 255 105/10%);}
.home_visual .fl .btn:hover p{ color: #00FF69;}
.home_visual .fl .btn:hover svg path{ color: #00FF69;}

.home_visual .fr{ width: 100%;}

.home_visual .video{ overflow: hidden; position: relative; width: 100%; border-radius: 20px; border: 3px solid #F247FA; box-shadow: 0 30px 70px rgba(0 0 0/55%);}
.home_visual .video:after{ content: ""; display: block; padding-top: 109%;}
.home_visual .video video{ display: block; position: absolute; top: 0; left: 0;; width: 100%; height: auto; object-fit: cover;}

@property --ang{ syntax: "<angle>"; inherits: false; initial-value: 0deg;}
.home_visual .poster{ position: relative; width: 100%; border-radius: 20px; border: 0.4rem solid transparent; background: rgba(0 0 0/20%) padding-box; backdrop-filter: blur(20px);}
.home_visual .poster:before{ content: ""; display: block; position: absolute; z-index: 0; top: -0.4rem; right: -0.4rem; bottom: -0.4rem; left: -0.4rem; padding: 0.4rem; border-radius: 20px; background: conic-gradient(from var(--ang, 0deg), #00FF69, #FFF, #F247FA, #FFF, #00FF69); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; animation: poster_turn 6s linear infinite;}
@keyframes poster_turn{ 0%{ --ang: 0deg;} 100%{ --ang: 360deg;}}
.home_visual .poster .box{ display: flex; flex-direction: column; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; padding: 5%;}
.home_visual .poster .box img{ display: block; width: 100%;}
.home_visual .poster .box .tit{ filter: drop-shadow(0 0 6px rgba(255 255 255/60%)); animation: gr_flick 7s steps(1, end) infinite;}
@keyframes gr_flick{ 0%{ opacity: 1;} 1.5%{ opacity: .1;} 2.5%{ opacity: 1;} 3.5%{ opacity: .3;} 4.5%{ opacity: 1;} 5.5%{ opacity: .08;} 7%{ opacity: 1;} 36%{ opacity: 1;} 37%{ opacity: .12;} 38%{ opacity: 1;} 39.5%{ opacity: .35;} 40.5%{ opacity: 1;} 42%{ opacity: .1;} 43.5%{ opacity: 1;} 100%{ opacity: 1;}}
.home_visual .poster .box .graphic{ flex: 1; position: relative; margin: 5% 0;}
.home_visual .poster .box .roll{ overflow: hidden; position: relative; width: 100%; aspect-ratio: 613/15;}
.home_visual .poster .box .roll:before{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 200%; height: 100%; background-image: url(/images/vimg2.png); background-size: 50% 100%; background-repeat: repeat-x; animation: gr_roll 12s linear infinite;}
@keyframes gr_roll{ 0%{ background-position-x: 0%;} 100%{ background-position-x: -100%;}}
.home_visual .poster .graphic .col{ position: absolute; top: 0; bottom: 0; left: var(--x); margin-left: -2.61%; width: 5.22%;}
.home_visual .poster .graphic .col:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -6.25%; width: 6%; background-image: linear-gradient(180deg, #00FF69 0 82.5%, rgba(0 0 0/0) 82.5% 100%); background-size: 100% 20%; background-repeat: repeat-y; animation: gr_line_up 7s linear infinite; animation-delay: calc(var(--c) * -.44s); animation-delay: calc((sin(var(--c) * 24deg) - 1) * 1.6s);}
@keyframes gr_line_up{ 0%{ background-position-y: 0%;} 100%{ background-position-y: -100%;}}
.home_visual .poster .graphic .bar{ display: block; position: absolute; z-index: 2; top: 0; left: 50%; width: var(--w); height: var(--h); background: #00FF69; transform: translate(-50%,0); transform-origin: 50% 0; animation: gr_bar 2.8s ease-in-out infinite alternate; animation-delay: calc(var(--c) * -.22s);}
.home_visual .poster .graphic .dot{ display: block; position: absolute; z-index: 100; top: var(--t); left: 50%; width: 96%; aspect-ratio: 1; border-radius: 50%; background: #F247FA; transform: translate(-50%,-50%) perspective(500px); animation: gr_spin 3.2s linear infinite; animation-delay: calc((var(--c) - var(--i)) * -.2s);}
@keyframes gr_bar{ 0%{ transform: translate(-50%,0) scaleY(.75);} 100%{ transform: translate(-50%,0) scaleY(1.12);}}
@keyframes gr_spin{ 0%{ transform: translate(-50%,-50%) perspective(500px) rotateY(0deg);} 100%{ transform: translate(-50%,-50%) perspective(500px) rotateY(360deg);}}
.home_visual .poster:after{ content: ""; display: block; padding-top: 100%;}

.home_visual .dday{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 20; left: calc(50% - 200px); bottom: 20%; width: 130px; height: 130px; cursor:crosshair; transition: all .3s;}
.home_visual .dday .ring{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; animation: home_ring 10s linear infinite;}
.home_visual .dday .ring text{ font-size: 14px; font-weight: 500; letter-spacing: 2px; fill: rgba(255 255 255/60%);}
.home_visual .dday .num{ display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; z-index: 10; width: 100px; height: 100px; border-radius: 50%;}
.home_visual .dday .num .t1{ font-size: 24px; font-weight: 800; color: #00FF69;}
.home_visual .dday .num .t2{ margin: 4px 0 0 0; line-height: 1; font-size: 12px; font-weight: 500; color: rgba(255 255 255/60%);}
.home_visual .dday:hover{ transform: scale(1.3) rotate(45deg);}
@keyframes home_ring{ 0%{ transform: rotate(0deg);} 100%{ transform: rotate(360deg);}}

.home_visual .logo{ display: flex; align-items: flex-start; grid-gap: 30px; position: absolute; z-index: 20; bottom: 60px; left: calc(50% - 750px);}
.home_visual .logo .wrap{}
.home_visual .logo .wrap .tit{ font-size: 14px; color: rgba(255 255 255/60%);}
.home_visual .logo .wrap .img{ display: flex; align-items: center; grid-gap: 20px; margin: 5px 0 0 0; height: 30px;}
.home_visual .logo .wrap .img img{ display: block; width: auto; height: 100%;}
.home_visual .logo .wrap .img .img1{ height: 20px;}
.home_visual .logo .wrap .img .img2{ margin-top: 5px; height: 20px;}
.home_visual .logo .wrap .img .img3{ margin-top: 2px; height: 20px;}
.home_visual .logo .wrap .img .img4{ height: 30px;}

.home_visual .sns{ display: flex; flex-direction: column; grid-gap: 20px; position: absolute; z-index: 20; bottom: 60px; left: 80px;}
.home_visual .sns a{ display: block; width: 20px; transition: all .3s;}
.home_visual .sns a:nth-child(3){ width: 16px;}
.home_visual .sns a:nth-child(4){ width: 16px;}
.home_visual .sns a img{ display: block; width: 100%; height: auto;}
.home_visual .sns a:hover{ opacity: .6;}

.scroll_down{ display: flex; align-items: flex-start; grid-gap: 10px; position: absolute; z-index: 20; right: 80px; bottom: 0;}
.scroll_down p{ position: absolute; top: 40px; right: -15px; transform: rotate(90deg); font-size: 12px; letter-spacing: 1px; color: rgba(255 255 255/100%); white-space: nowrap;}
.scroll_down span{ display: block; overflow: hidden; position: relative; margin: 12px 0 0 0; width: 2px; height: 140px; background: rgba(255 255 255/20%);}
.scroll_down span:after{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 2px; height: 60px; background: #00FF69; animation: home_scroll 1s ease-in-out infinite;}
@keyframes home_scroll{ 0%{ transform: translate(0,-60px);} 100%{ transform: translate(0,200px);}}

.home_visual .bg{ overflow: hidden; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: #000; --mx1: 0px; --my1: 0px; --mx2: 0px; --my2: 0px;}
.home_visual .bg:before{ content: ""; display: block; position: absolute; z-index: 2; top: 40%; left: 30%; width: 30vw; height: 30vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(242 71 250/70%) 0%, rgba(242 71 250/38%) 32%, rgba(196 40 235/14%) 60%, rgba(120 20 180/0) 100%); mix-blend-mode: screen; translate: var(--mx1) var(--my1); transition: translate 1.2s cubic-bezier(.22,.61,.36,1); animation: home_light_m 6s ease-in-out infinite alternate;}
.home_visual .bg:after{ content: ""; display: block; position: absolute; z-index: 1; top: -50%; left: -10%; width: 50vw; height: 50vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(0 255 105/65%) 0%, rgba(0 255 105/34%) 34%, rgba(0 255 105/12%) 62%, rgba(0 255 105/0) 100%); mix-blend-mode: screen; translate: var(--mx2) var(--my2); transition: translate 1.6s cubic-bezier(.22,.61,.36,1); animation: home_light_g 3s ease-in-out infinite alternate;}
@keyframes home_light_m{ 0%{ transform: translate(0,0) scale(1); opacity: .7;} 100%{ transform: translate(5vw,-3vw) scale(1.3); opacity: 1;}}
@keyframes home_light_g{ 0%{ transform: translate(0,0) scale(1); opacity: .8;} 100%{ transform: translate(4vw,4vw) scale(1.15); opacity: 1;}}

@media(max-width: 1800px){
    .home_visual .sns{ left: 30px;}
    .scroll_down{ right: 30px;}
}
@media(max-width: 1700px){
    .home_visual{ padding: 0 90px;}
    .home_visual .modle_min{ grid-gap: 140px;}
    .home_visual .fl .tit img.t1{ width: 40%;}
    .home_visual .fl .tit img.t2{ width: 80%;}
    .home_visual .fl .tit img.t3{ width: 80%;}
    .home_visual .fl .date{ font-size: 16px;}
    .home_visual .logo{ left: 90px;}
    .home_visual .dday{ bottom: 15%; left: 40%;}
}
@media(max-width: 1560px){
    .home_visual .bg:before{ top: 40%; left: 30%; width: 40vw; height: 40vw;}
    .home_visual .bg:after{ top: -50%; left: -10%; width: 70vw; height: 70vw;}
}
@media(max-width: 1000px){
    /* 세로로 쌓이면 텍스트+영상이 100dvh 안에 들어가지 않아 높이를 열어 준다 */
    .home_visual .modle_min{ flex-direction: column-reverse; justify-content: center; align-items: center; grid-gap: 50px; height: auto; min-height: 100dvh;}
    .home_visual .fl{ align-items: center; width: 70%;}
    .home_visual .fl .tit{ align-items: center;}
    .home_visual .fl .btn{ margin-top: 30px;}
    .home_visual .fr{ width: 50%;}
    .home_visual .video{ max-width: calc((52dvh) * 510 / 720); border-radius: 16px;}
    .home_visual .poster{}
    .home_visual .logo{ bottom: 30px;}
    .home_visual .sns{ bottom: 30px;}
    .home_visual .dday{ right: 10%; bottom: 10%; left: initial;}

    .home_visual .bg:before{ top: 40%; left: 40%; width: 60vw; height: 60vw;}
    .home_visual .bg:after{ top: -40%; left: -40%; width: 120vw; height: 120vw;}
}
@media(max-width: 767px){
    .home_visual{ padding: 0 3.5rem;}
    .home_visual .modle_min{ padding: 5rem 0; grid-gap: 2rem;}
    .home_visual .fl{ width: 100%;}
    .home_visual .fl .tit{ grid-gap: 0.5rem;}
    .home_visual .fl .tit img.t1{ width: 30%;}
    .home_visual .fl .tit img.t2{ width: 60%;}
    .home_visual .fl .tit img.t3{ width: 60%;}
    .home_visual .fl .tit img.t4{ margin-top: 0.5rem; width: 50%;}
    .home_visual .fl .date{ flex-wrap: wrap; justify-content: center; margin-top: 1rem; width: 70%; line-height: 1.2; font-size: 1rem;}
    .home_visual .fl .btn{ margin: 1.5rem 0 0 0; padding: 0 1.2rem; width: 10rem; height: 2.6rem; border-radius: 3rem;}
    .home_visual .fl .btn p{ font-size: 1rem;}
    .home_visual .fl .btn svg{ width: 1.2rem; height: 1.2rem;}
    .home_visual .fr{ width: 80%;}
    .home_visual .video{ max-width: calc((48dvh) * 510 / 720); border-radius: 1.2rem;}

    .home_visual .logo{ grid-gap: 1rem; bottom: 2rem; left: 3rem;}
    .home_visual .logo .wrap .tit{ font-size: 0.9rem;}
    .home_visual .logo .wrap .img{ grid-gap: 1rem; margin: 0.2rem 0 0 0; height: 1.6rem;}
    .home_visual .logo .wrap .img .img1{ height: 1.2rem;}
    .home_visual .logo .wrap .img .img2{ margin-top: 0.5rem; height: 1rem;}
    .home_visual .logo .wrap .img .img3{ margin-top: 0.2rem; height: 1.1rem;}
    .home_visual .logo .wrap .img .img4{ height: 1.6rem;}

    .home_visual .sns{ grid-gap: 1rem; bottom: 2rem; left: 1rem;}
    .home_visual .sns a{ width: 1rem;}
    .home_visual .sns a:nth-child(3){ width: 0.8rem;}
    .home_visual .sns a:nth-child(4){ width: 0.8rem;}

    .home_visual .dday{ right: 5%; bottom: 7%; transform: scale(0.6);}
    .home_visual .dday:hover{ transform: scale(0.6);}

    .scroll_down{ grid-gap: 0.5rem; right: 1rem;}
    .scroll_down p{ top: 2.2rem; right: -1.4rem; font-size: 0.8rem;}
    .scroll_down span{ margin: 0; height: 8rem;}

    .home_visual .bg:before{ top: 40%; left: 45%; width: 70vw; height: 70vw;}
    .home_visual .bg:after{ top: -40%; left: -60%; width: 160vw; height: 160vw;}
}


.home_program{ overflow: hidden; position: relative;}
.home_program .modle_min{ position: relative; z-index: 10; padding: 160px 0;}
.home_program .bg{ position: absolute; top: 0; right: 0; left: 0; height: 560px; background: url(/images/hp_bg.jpg) repeat-x top; background-size: auto 100%;}

.home_program .head{ display: flex; flex-direction: column; align-items: flex-start;}
.home_program .head .t1{ font-family: "Chonburi", Arial, Helvetica, sans-serif; font-size: 30px; color: #000;}
.home_program .head .fb{ display: flex; align-items: center; grid-gap: 10px; margin: 15px 0 0 0;}
.home_program .head .t2{ font-family: "Chonburi", Arial, Helvetica, sans-serif; font-size: 60px; letter-spacing: -2px; color: #000;}
.home_program .head .t3{ line-height: 1.2; font-size: 20px; font-weight: 400; color: rgba(0 0 0/80%);}

.home_program .list{ display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 30px; margin: 60px 0 0 0;}
.home_program .list a{ display: block; cursor: pointer;}
.home_program .list a .img{ display: flex; justify-content: center; align-items: center; overflow: hidden; position: relative; border-radius: 20px;}
.home_program .list a .img:before{ content: ""; display: block; padding: 0 0 100% 0;}
.home_program .list a .img .tit{ display: block; position: absolute; z-index: 10; padding: 5px; height: 30px; border-radius: 5px; background: #000; transition: all .2s;}
.home_program .list a .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: all .5s;}
.home_program .list a .info{ padding: 30px 0 0 0;}
.home_program .list a .info .t1{ font-family: "Chonburi", Arial, Helvetica, sans-serif; font-size: 30px; color: #000; letter-spacing: -1px; transition: all .3s;}
.home_program .list a .info .t2{ margin: 15px 0 0 0; line-height: 1.2; font-size: 20px; font-weight: 600; color: rgba(0 0 0/100%);}
.home_program .list a .info .t2 span{ padding-left: 2px; font-size: 12px; font-weight: 400; vertical-align: top; color: rgba(0 0 0/100%);}
.home_program .list a .info .t3{ margin: 10px 0 0 0; font-size: 20px; font-weight: 600; color: rgba(0 0 0/100%);}
.home_program .list a:hover .img .tit{ background: #F247FA;}
.home_program .list a:hover .img .box{ transform: scale(1.06);}
.home_program .list a:hover .info .t1{ color: #F247FA;}

.home_program .list a:nth-child(2):hover .img .tit{ background: #7acc00;}
.home_program .list a:nth-child(2):hover .info .t1{ color: #7acc00;}
.home_program .list a:nth-child(3):hover .img .tit{ background: #ffdd00;}
.home_program .list a:nth-child(3):hover .info .t1{ color: #ffdd00;}
@media(max-width: 1560px){
    .home_program .list a .img .tit{ padding: 2px; height: 10px;}
}
@media(max-width: 1000px){
    .home_program .head .t1{ font-size: 24px;}
    .home_program .head .t2{ font-size: 50px;}
    .home_program .head .t3{ font-size: 18px;}
    .home_program .list a .info .t1{ font-size: 24px;}
    .home_program .list a .info .t2{ font-size: 16px;}
    .home_program .list a .info .t2 span{ font-size: 10px;}
    .home_program .list a .info .t3{ font-size: 16px;}
    .home_program .bg{ height: 400px;}
}
@media(max-width: 767px){
    .home_program .modle_min{ padding: 5rem 0;}
    .home_program .bg{ height: 30rem;}

    .home_program .head .t1{ font-size: 1.2rem;}
    .home_program .head .fb{ display: block; margin: 1rem 0 0 0;}
    .home_program .head .t2{ font-size: 3rem;}
    .home_program .head .t3{ margin-top: 1rem; font-size: 1.2rem;}

    .home_program .list{ grid-template-columns: repeat(1,1fr); gap: 2rem; margin: 2rem 0 0 0;}
    .home_program .list a .img{ border-radius: 1.5rem;}
    .home_program .list a .img .tit{ padding: 0.5rem; border-radius: 0.5rem; height: 2rem;}
    .home_program .list a .info{ padding: 1.5rem 0 0 0;}
    .home_program .list a .info .t1{ font-size: 2rem;}
    .home_program .list a .info .t2{ margin: 1rem 0 0 0; font-size: 1.2rem;}
    .home_program .list a .info .t2 span{ padding-left: 0.2rem; font-size: 0.9rem;}
    .home_program .list a .info .t3{ margin: 0.5rem 0 0 0; font-size: 1.2rem;}
    .home_program .list a:hover .img .box{ transform: scale(1);}
}


.home_news{ display: none; overflow: hidden; background: #FBF5EE;}
.home_news .modle_min{ padding: 160px 0 100px 0;}
.home_news .head{ display: flex; justify-content: space-between; align-items: center;}
.home_news .head .tit{ display: flex; align-items: center; gap: 15px;}
.home_news .head .tit .t1{ font-size: 60px; font-weight: 600; letter-spacing: -2px; color: #000;}
.home_news .head .tit .t2{ line-height: 1.2; font-size: 20px; font-weight: 400; color: rgba(0 0 0/80%);}
.home_news .head .more{ display: flex; justify-content: space-between; align-items: center; padding: 0 20px; width: 200px; height: 50px; border-radius: 30px; border: 1px solid rgba(0 0 0/20%); transition: all .3s;}
.home_news .head .more p{ font-size: 16px; font-weight: 500; color: #000; letter-spacing: 0;}
.home_news .head .more svg{ display: block; width: 20px; height: 20px; color: #000;}
.home_news .head .more:hover{ border-color: #000;}

.home_news .list{ overflow: hidden; position: relative; margin: 55px 0 0 0;}
.home_news .list .swiper-wrapper{ align-items: center;}
.home_news .list .swiper-slide{}
.home_news .list .swiper-slide a{ display: block; opacity: 0.5; cursor: pointer; transition: all .3s;}
.home_news .list .swiper-slide a .img{ overflow: hidden; display: flex; align-items: center; position: relative; border-radius: 20px;}
.home_news .list .swiper-slide a .img:after{ content: ""; display: block; padding: 100% 0 0 0; transition: all .5s;}
.home_news .list .swiper-slide a .img .box{ position: absolute; right: 0; left: 0; height: 60%; border-radius: 20px; transition: all .5s;}
.home_news .list .swiper-slide a .info{ padding: 20px 0 0 0; opacity: 0; transition: all .5s;}
.home_news .list .swiper-slide a .info .t1{ line-height: 1.2; font-size: 24px; font-weight: 600; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;}
.home_news .list .swiper-slide a .info .t2{ margin: 5px 0 0 0; font-size: 16px; color: rgba(0 0 0/60%);}
.home_news .list .swiper-slide-prev{ opacity: .35;}
.home_news .list .swiper-slide-active + .swiper-slide a{ opacity: 1;}
.home_news .list .swiper-slide-active + .swiper-slide a .img .box{ height: 100%;}
.home_news .list .swiper-slide-active + .swiper-slide a .info{ opacity: 1;}
.home_news .list .swiper-slide a:hover .img .box{ transform: scale(1.06);}

.home_news .control{ display: flex; align-items: center; gap: 20px; margin: 40px 0 0 calc((100% - 90px) / 4 + 30px); width: calc((100% - 90px) / 4);}
.home_news .control .bar{ overflow: hidden; flex: 1; position: relative; height: 2px; background: rgba(0 0 0/12%);}
.home_news .control .bar span{ display: block; position: absolute; top: 0; left: 0; width: 20%; height: 100%; background: #000; transition: all .3s;}
.home_news .control .btn{ display: flex; align-items: center; gap: 5px;}
.home_news .control .btn > div{ display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(0 0 0/20%); cursor: pointer; transition: all .3s;}
.home_news .control .btn > div svg{ display: block; width: 20px; height: 20px; color: #000; transition: all .3s;}
.home_news .control .btn .play svg:nth-child(1){ display: none;}
.home_news .control .btn .play svg:nth-child(2){ display: block; width: 12px; height: 12px;}
.home_news .control .btn .play.on svg:nth-child(1){ display: block;}
.home_news .control .btn .play.on svg:nth-child(2){ display: none;}
.home_news .control .btn > div:hover{ border-color: #000; background: #000;}
.home_news .control .btn > div:hover svg{ color: #FFF;}

.home_news .roll{ margin: 0 -30px; height: 100px; background: url(/images/news_text.png) 0 50%/1500px auto repeat-x; opacity: .6; animation: home_news 25s linear infinite;}
@keyframes home_news{ 0%{ background-position-x: 0;} 100%{ background-position-x: -1500px;}}

@media(max-width: 1560px){
    .home_news .control{ margin: 40px 0 0 calc((100% - 60px) / 3 + 30px); width: calc((100% - 60px) / 3);}
}
@media(max-width: 1000px){

    .home_news .roll{ height: 80px; background-size: 1100px auto; animation-name: home_news_t;}
    @keyframes home_news_t{ 0%{ background-position-x: 0;} 100%{ background-position-x: -1100px;}}
}
@media(max-width: 767px){
    .home_news .modle_min{ padding: 5rem 0 3rem 0;}
    .home_news .head{ display: grid; gap: 1.2rem;}
    .home_news .head .tit{ display: grid; gap: 1rem;}
    .home_news .head .tit .t1{ font-size: 3rem;}
    .home_news .head .tit .t2{ font-size: 1.2rem;}
    .home_news .head .tit .t2 br{ display: none;}
    .home_news .head .more{ padding: 0 1.2rem; width: 8rem; height: 2.6rem; border-radius: 3rem;}
    .home_news .head .more p{ font-size: 1rem;}
    .home_news .head .more svg{ width: 1.2rem; height: 1.2rem;}
    .home_news .list{ margin-top: 2rem;}
    .home_news .list .swiper-slide a .img{ border-radius: 1rem;}
    .home_news .list .swiper-slide a .img .box{ border-radius: 1rem;}
    .home_news .list .swiper-slide a .info{ padding: 1rem 0 0 0;}
    .home_news .list .swiper-slide a .info .t1{ font-size: 1.2rem;}
    .home_news .list .swiper-slide a .info .t2{ margin-top: 0.5rem; font-size: 1rem;}
    .home_news .list .swiper-slide a:hover .img .box{ transform: scale(1);}
    
    .home_news .list .swiper-slide-active + .swiper-slide a{ opacity: 0.5;}
    .home_news .list .swiper-slide-active + .swiper-slide a .img .box{ height: 60%;}
    .home_news .list .swiper-slide-active + .swiper-slide a .info{ opacity: 0;}
    .home_news .list .swiper-slide-active a{ opacity: 1;}
    .home_news .list .swiper-slide-active a .img .box{ height: 100%;}
    .home_news .list .swiper-slide-active a .info{ opacity: 1;}

    .home_news .control{ gap: 1rem; margin: 1rem 0 0 0; width: 100%;}
    .home_news .control .btn{ gap: 0.5rem;}
    .home_news .control .btn > div{ width: 2.4rem; height: 2.4rem;}
    .home_news .control .btn > div svg{ width: 1.2rem; height: 1.2rem;}
    .home_news .control .btn .play svg:nth-child(2){ width: 0.9rem; height: 0.9rem;}

    .home_news .roll{ height: 50px; background-size: 700px auto; animation-name: home_news_m;}
    @keyframes home_news_m{ 0%{ background-position-x: 0;} 100%{ background-position-x: -700px;}}
}


.home_overview{ overflow: hidden; position: relative; background: linear-gradient(90deg, #f247fa, #000);}
.home_overview:before{ content: ""; display: none; position: absolute; z-index: 2; top: 0; right: 0; bottom: 80%; left: 0; background: linear-gradient(180deg, rgba(0 0 0/40%), rgba(0 0 0/0));}
.home_overview:after{ content: ""; display: none; position: absolute; z-index: 2; top: 80%; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0 0 0/0), rgba(0 0 0/40%));}
.home_overview .modle_min{ display: flex; align-items: center; position: relative; z-index: 10; padding: 160px 0;}
.home_overview .fl{ flex: 1; display: flex; justify-content: center;}
.home_overview .fl .circle{ display: flex; justify-content: center; align-items: center; position: relative; width: 200px; height: 200px;}
.home_overview .fl .circle .ring{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; animation: home_ring 24s linear infinite;}
.home_overview .fl .circle .ring text{ font-size: 15px; font-weight: 300; letter-spacing: 2px; fill: rgba(255 255 255/60%);}
.home_overview .fl .circle img{ display: block; width: auto; height: 50px;}

.home_overview .fr{ width: 50%;}
.home_overview .fr .t1{ font-family: "Chonburi", Arial, Helvetica, sans-serif; font-size: 60px; letter-spacing: -2px; color: #FFF;}
.home_overview .fr .t2{ margin: 30px 0 0 0; line-height: 1.4; font-size: 20px; font-weight: 400; color: rgba(255 255 255/100%);}
.home_overview .fr .btn{ display: flex; justify-content: space-between; align-items: center; margin: 40px 0 0 0; padding: 0 20px; width: 200px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/40%); transition: all .3s;}
.home_overview .fr .btn p{ font-size: 16px; font-weight: 500; color: #FFF; transition: all .3s;}
.home_overview .fr .btn svg{ display: block; width: 20px; height: 20px; color: #FFF; transition: all .3s;}
.home_overview .fr .btn:hover{ border-color: #00FF69;}
.home_overview .fr .btn:hover p{ color: #00FF69;}
.home_overview .fr .btn:hover svg{ color: #00FF69;}

.home_overview .bar{ display: flex; align-items: flex-start; position: absolute; z-index: 1;}
.home_overview .bar span{ display: block; position: relative; margin: 0 0 0 8px; width: 14px; animation: ov_wave 2.4s ease-in-out infinite alternate;}
.home_overview .bar .dot{ display: block; position: absolute; z-index: 2; top: var(--t); left: 50%; width: 100%; aspect-ratio: 1; transform: translate(-50%,-50%) scaleY(1.613); animation: ov_dot 2.4s ease-in-out infinite alternate; animation-delay: inherit;}
.home_overview .bar .dot i{ display: block; width: 100%; height: 100%; border-radius: 50%; background: #F247FA; transform: perspective(500px); animation: ov_spin 3.2s linear infinite; animation-delay: calc(var(--i) * -.35s);}
@keyframes ov_dot{ 0%{ transform: translate(-50%,-50%) scaleY(1.613);} 100%{ transform: translate(-50%,-50%) scaleY(1);}}
@keyframes ov_spin{ 0%{ transform: perspective(500px) rotateY(0deg);} 100%{ transform: perspective(500px) rotateY(360deg);}}
.home_overview .bar span:first-child{ margin: 0;}
.home_overview .bar.t{ top: 0; left: 8%;}
.home_overview .bar.t span{ transform-origin: 50% 0; background: linear-gradient(180deg, rgba(0 255 105/12%) 0%, #00FF69 100%);}
.home_overview .bar.t span:nth-child(1){ height: 150px; animation-delay: -.15s;}
.home_overview .bar.t span:nth-child(2){ height: 170px; animation-delay: -.30s;}
.home_overview .bar.t span:nth-child(3){ height: 180px; animation-delay: -.45s;}
.home_overview .bar.t span:nth-child(4){ height: 245px; animation-delay: -.60s;}
.home_overview .bar.t span:nth-child(5){ height: 215px; animation-delay: -.75s;}
.home_overview .bar.t span:nth-child(6){ height: 200px; animation-delay: -.90s;}
.home_overview .bar.t span:nth-child(7){ height: 155px; animation-delay: -1.05s;}
.home_overview .bar.t span:nth-child(8){ height: 130px; animation-delay: -1.20s;}
.home_overview .bar.t span:nth-child(9){ height: 100px; animation-delay: -1.35s;}
.home_overview .bar.t span:nth-child(10){ height: 80px; animation-delay: -1.50s;}
.home_overview .bar.t span:nth-child(11){ height: 62px; animation-delay: -1.65s;}
.home_overview .bar.t span:nth-child(12){ height: 45px; animation-delay: -1.80s;}
.home_overview .bar.t span:nth-child(13){ height: 75px; animation-delay: -1.95s;}
.home_overview .bar.t span:nth-child(14){ height: 55px; animation-delay: -2.10s;}
.home_overview .bar.t span:nth-child(15){ height: 105px; animation-delay: -2.25s;}
.home_overview .bar.t span:nth-child(16){ height: 90px; animation-delay: -2.40s;}
.home_overview .bar.b{ align-items: flex-end; right: 8%; bottom: 0;}
.home_overview .bar.b span{ transform-origin: 50% 100%; background: linear-gradient(0deg, rgba(0 255 105/12%) 0%, #00FF69 100%);}
.home_overview .bar.b span:nth-child(1){ height: 138px; animation-delay: -.15s;}
.home_overview .bar.b span:nth-child(2){ height: 112px; animation-delay: -.30s;}
.home_overview .bar.b span:nth-child(3){ height: 75px; animation-delay: -.45s;}
.home_overview .bar.b span:nth-child(4){ height: 70px; animation-delay: -.60s;}
.home_overview .bar.b span:nth-child(5){ height: 80px; animation-delay: -.75s;}
.home_overview .bar.b span:nth-child(6){ height: 112px; animation-delay: -.90s;}
.home_overview .bar.b span:nth-child(7){ height: 130px; animation-delay: -1.05s;}
.home_overview .bar.b span:nth-child(8){ height: 162px; animation-delay: -1.20s;}
.home_overview .bar.b span:nth-child(9){ height: 180px; animation-delay: -1.35s;}
.home_overview .bar.b span:nth-child(10){ height: 212px; animation-delay: -1.50s;}
.home_overview .bar.b span:nth-child(11){ height: 230px; animation-delay: -1.65s;}
.home_overview .bar.b span:nth-child(12){ height: 250px; animation-delay: -1.80s;}
.home_overview .bar.b span:nth-child(13){ height: 225px; animation-delay: -1.95s;}
.home_overview .bar.b span:nth-child(14){ height: 150px; animation-delay: -2.10s;}
@keyframes ov_wave{ 0%{ transform: scaleY(.62);} 100%{ transform: scaleY(1);}}
@media(max-width: 1600px){
    .home_overview .fr .t2 br{ display: none;}
}
@media(max-width: 1560px){
}
@media(max-width: 1000px){
    .home_overview .modle_min{ flex-direction: column; align-items: flex-start; gap: 80px;}
    .home_overview .fl{ width: 100%;}
    .home_overview .fr{ width: 100%;}
    .home_overview .bar span{ width: 10px;}
    .home_overview .bar.t{ left: 4%;}
    .home_overview .bar.b{ right: 4%;}
}
@media(max-width: 767px){
    .home_overview .modle_min{ gap: 0; padding: 5rem 0;}
    .home_overview .fl{ padding: 3rem 0;}
    .home_overview .fl .circle{ width: 10rem; height: 10rem;}
    .home_overview .fl .circle .ring text{ font-size: 1.1rem; letter-spacing: 0.2rem;}
    .home_overview .fl .circle img{ height: 2rem;}

    .home_overview .fr .t1{ font-size: 3rem;}
    .home_overview .fr .t2{ margin: 1.2rem 0 0 0; font-size: 1.2rem;}
    .home_overview .fr .btn{margin: 1.5rem 0 0 0; padding: 0 1.2rem; width: 10rem; height: 2.6rem; border-radius: 3rem;}
    .home_overview .fr .btn p{ font-size: 1rem;}
    .home_overview .fr .btn svg{ width: 1.2rem; height: 1.2rem;}
    .home_overview .bar.t{ top: -10%; left: 4%;}
    .home_overview .bar.b{ bottom: -10%; right: 4%;}
    .home_overview .bar span{ margin: 0 0 0 5px; width: 7px;}
}


.home_media{ display: none;}
.home_media .modle_min{ padding-top: 160px;}
.home_media .head{ display: flex; justify-content: space-between; align-items: center;}
.home_media .head .t1{ font-size: 60px; font-weight: 600; letter-spacing: -2px; color: #000;}
.home_media .head .more{ display: flex; justify-content: space-between; align-items: center; padding: 0 20px; width: 200px; height: 50px; border-radius: 30px; border: 1px solid rgba(0 0 0/20%); transition: all .3s;}
.home_media .head .more p{ font-size: 16px; font-weight: 500; color: #000; letter-spacing: 0;}
.home_media .head .more svg{ display: block; width: 20px; height: 20px; color: #000;}
.home_media .head .more:hover{ border-color: #000;}

.home_media .list{ display: grid; grid-template-columns: repeat(4,1fr); align-items: start; gap: 30px; margin: 60px 0 0 0;}
.home_media .list .slide{ grid-column: span 1;}
.home_media .list .slide.big{ grid-column: span 2;}
.home_media .list .slide a{ display: block; cursor: pointer;}
.home_media .list .slide a .img{ overflow: hidden; position: relative; border-radius: 20px;}
.home_media .list .slide a .img:before{ content: ""; display: block; padding: 0 0 56.8% 0;}
.home_media .list .slide a .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: all .5s;}
.home_media .list .slide a .img .play{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: calc(50% - 25px); left: calc(50% - 25px); width: 50px; height: 50px; transition: all .3s;}
.home_media .list .slide a .img .play img{ display: block; width: 100%; height: auto;}
.home_media .list .slide a .info{ padding: 18px 0 0 0;}
.home_media .list .slide a .info .t1{ line-height: 1.2; font-size: 24px; font-weight: 600; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; transition: all .3s;}
.home_media .list .slide a .info .t2{ margin: 5px 0 0 0; font-size: 16px; font-weight: 300; color: rgba(0 0 0/50%);}
.home_media .list .slide a:hover .img .box{ transform: scale(1.06);}
.home_media .list .slide a:hover .img .play{ transform: scale(1.3);}
.home_media .list .slide a:hover .info .t1{ color: #F247FA;}
@media(max-width: 1560px){
}
@media(max-width: 1000px){
    .home_media .list{ grid-template-columns: repeat(2,1fr);}
}
@media(max-width: 767px){
    .home_media .modle_min{ padding-top: 5rem;}
    .home_media .head .t1{ font-size: 3rem;}
    .home_media .head .more{ padding: 0 1.2rem; width: 8rem; height: 2.6rem; border-radius: 3rem;}
    .home_media .head .more p{ font-size: 1rem;}
    .home_media .head .more svg{ width: 1.2rem; height: 1.2rem;}

    .home_media .list{ grid-template-columns: 1fr; gap: 1.5rem; margin: 2rem 0 0 0;}
    .home_media .list .slide.big{ grid-column: span 1;}
    .home_media .list .slide a .img{ border-radius: 1rem;}
    .home_media .list .slide.big a .img .play{ width: 3rem; height: 3rem;}
    .home_media .list .slide a .info{ padding: 1rem 0 0 0;}
    .home_media .list .slide a .info .t1{ font-size: 1.4rem;}
    .home_media .list .slide a .info .t2{ margin-top: 0.5rem; font-size: 1rem;}
    .home_media .list .slide a:hover .img .box{ transform: scale(1);}
    .home_media .list .slide a:hover .img .play{ transform: translate(-50%,-50%);}
    .home_media .list .slide a:hover .info .t1{ color: #000;}
}
















.sub_nav{ display: flex; flex-direction: column; align-items: flex-end; grid-gap: 6px; position: fixed; z-index: 50; top: 50%; right: 50px; transform: translate(0,-50%);}
.sub_nav a{ display: flex; justify-content: center; align-items: center; padding: 0 20px; height: 40px; border-radius: 30px; border: 1px solid transparent; font-size: 15px; font-weight: 500; color: #999; transition: all .3s; cursor: pointer;}
.sub_nav a:hover{ color: #FFF;}
.sub_nav.light a{ color: rgba(0 0 0/45%);}
.sub_nav.light a:hover{ color: #000;}
.sub_nav a.on, .sub_nav.light a.on{ border-color: #00FF69; background: rgba(0 255 105/12%); color: #04e260;}
@media(max-width: 1560px){
    .sub_nav{ right: 30px;}
}
@media(max-width: 1200px){
    .sub_nav{ display: none;}
}


.sub_head{ position: relative; text-align: center;}
.sub_head .t1{ font-family: "Chonburi", sans-serif; font-size: 60px; letter-spacing: -2px;  color: #FFF;}
.sub_head .t2{ display: inline-block; margin: 20px 0 0 0; font-size: 30px; font-weight: 500; color: rgba(255 255 255/100%);}
.sub_head .t2 em{ vertical-align: top; padding: 0 0 0 10px; font-style: normal; font-size: 18px; color: rgba(255 255 255/60%);}
.sub_head .t3{ margin: 30px 0 0 0; line-height: 1.4; font-size: 20px; color: rgba(0 0 0/60%);}
.sub_head.white .t1{ color: #000;}
.sub_head.white .t2{ color: rgba(0 0 0/80%);}
.sub_head.white .t2 em{ color: rgba(0 0 0/60%);}
@media(max-width: 1560px){
    .sub_head .t1, .sub_head .eng{ font-size: 46px;}
}
@media(max-width: 1000px){
    .sub_head .t1, .sub_head .eng{ font-size: 36px;}
    .sub_head .t2, .sub_head .stit{ font-size: 17px;}
    .sub_head .t3{ font-size: 14px;}
}
@media(max-width: 767px){
    .sub_head .t1, .sub_head .eng{ font-size: 2.6rem;}
    .sub_head .t2, .sub_head .stit{ margin: 0.8rem 0 0 0; font-size: 1.4rem;}
    .sub_head .t3{ margin-top: 1.5rem; font-size: 1.1rem;}
}


.sub_visual{ display: flex; align-items: center; position: relative; z-index: 20; background: #000;}
.sub_visual .modle_min{ position: relative; z-index: 20; padding: 260px 0 0 0;}
.sub_visual .fl{ display: flex; flex-direction: column; align-items: center;}
.sub_visual .fl .t1{ font-size: 20px; font-weight: 300; color: rgba(255 255 255/80%);}
.sub_visual .fl .t2{ margin-top: 20px; text-align: center; font-family: "Chonburi", sans-serif; font-size: 80px; color: #FFF; letter-spacing: -2px;}
.sub_visual .fl .t3{ display: flex; align-items: center; margin-top: 60px; gap: 15px;}
.sub_visual .fl .t31{ font-size: 60px; font-weight: 700; color: #FFF;}
.sub_visual .fl .t32{ line-height: 1.2; font-size: 24px; font-weight: 400; color: #FFF;}
.sub_visual .fl .t3 svg{ width: 30px; height: 30px;}
.sub_visual .fl .t3 svg path{ color: rgba(255 255 255/40%);}

.sub_visual .fr{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: relative; margin: 100px auto -250px auto; width: 900px; border-radius: 20px; box-shadow: 0 30px 60px rgba(0 0 0/45%); --tx: 0deg; --ty: 0deg; --ts: 1; --px: 0px; --py: 0px; --gx: 50%; --gy: 50%; --sx: 330px; --go: .45; transform: perspective(1100px) rotateX(var(--tx)) rotateY(var(--ty)) scale(var(--ts)); transition: transform .45s cubic-bezier(.22,.61,.36,1), box-shadow .5s;}
.sub_visual .fr:hover{ --ts: 1.02; --go: 1; box-shadow: 0 45px 90px rgba(0 0 0/60%);}
.sub_visual .fr .tit{ display: block; position: absolute; z-index: 10; padding: 5px; height: 30px; border-radius: 5px; background: #000;}
.sub_visual .fr .img{ overflow: hidden; height: 500px;}
.sub_visual .fr .img img{ display: block; width: 100%; height: auto; transform: translate(var(--px), var(--py)) scale(1.06); transition: transform .45s cubic-bezier(.22,.61,.36,1);}
.sub_visual .fr:before{ content: ""; display: block; position: absolute; z-index: 3; top: 0; right: 0; bottom: 0; left: 0; opacity: var(--go); background: radial-gradient(circle at var(--gx) var(--gy), rgba(255 255 255/50%) 0%, rgba(0 255 105/20%) 20%, rgba(242 71 250/15%) 36%, rgba(255 255 255/0) 62%); mix-blend-mode: screen; transition: opacity .5s; pointer-events: none;}
.sub_visual .fr:after{ content: ""; display: block; position: absolute; z-index: 4; top: -30%; bottom: -30%; left: -25%; width: 40%; opacity: var(--go); background: linear-gradient(90deg, rgba(255 255 255/0) 0%, rgba(255 255 255/26%) 50%, rgba(255 255 255/0) 100%); mix-blend-mode: screen; transform: translateX(var(--sx)) rotate(14deg); transition: opacity .5s, transform .45s cubic-bezier(.22,.61,.36,1); pointer-events: none;}

.sub_visual .bg{ overflow: hidden; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: #000; --mx1: 0px; --my1: 0px; --mx2: 0px; --my2: 0px;}
.sub_visual .bg:before{ content: ""; display: block; position: absolute; z-index: 2; top: 40%; left: 30%; width: 30vw; height: 30vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(242 71 250/70%) 0%, rgba(242 71 250/38%) 32%, rgba(196 40 235/14%) 60%, rgba(120 20 180/0) 100%); mix-blend-mode: screen; translate: var(--mx1) var(--my1); transition: translate 1.2s cubic-bezier(.22,.61,.36,1); animation: home_light_m 6s ease-in-out infinite alternate;}
.sub_visual .bg:after{ content: ""; display: block; position: absolute; z-index: 1; top: -50%; left: -10%; width: 50vw; height: 50vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(0 255 105/65%) 0%, rgba(0 255 105/34%) 34%, rgba(0 255 105/12%) 62%, rgba(0 255 105/0) 100%); mix-blend-mode: screen; translate: var(--mx2) var(--my2); transition: translate 1.6s cubic-bezier(.22,.61,.36,1); animation: home_light_g 3s ease-in-out infinite alternate;}
@media(max-width: 1560px){
    .sub_visual .modle_min{ padding: 220px 0 0 0;}
    .sub_visual .fl .t2{ font-size: 72px;}
    .sub_visual .fl .t3{ margin-top: 45px;}
    .sub_visual .fl .t31{ font-size: 48px;}
    .sub_visual .fl .t32{ font-size: 20px;}
    .sub_visual .fr{ margin: 90px auto -230px auto; width: 820px;}
    .sub_visual .fr .img{ height: 460px;}
}
@media(max-width: 1200px){
    .sub_visual .modle_min{ padding: 200px 0 0 0;}
    .sub_visual .fl .t1{ font-size: 18px;}
    .sub_visual .fl .t2{ font-size: 64px;}
    .sub_visual .fl .t3{ margin-top: 40px; gap: 12px;}
    .sub_visual .fl .t31{ font-size: 40px;}
    .sub_visual .fl .t32{ font-size: 18px;}
    .sub_visual .fl .t3 svg{ width: 26px; height: 26px;}
    .sub_visual .fr{ margin: 80px auto -210px auto; width: 700px;}
    .sub_visual .fr .img{ height: 420px;}
}
@media(max-width: 1000px){
    .sub_visual .modle_min{ padding: 170px 0 0 0;}
    .sub_visual .fl .t1{ font-size: 17px;}
    .sub_visual .fl .t2{ font-size: 56px;}
    .sub_visual .fl .t3{ flex-direction: column; gap: 10px; margin-top: 35px; text-align: center;}
    .sub_visual .fl .t3 svg{ width: 22px; height: 22px;}
    .sub_visual .fl .t31{ font-size: 34px;}
    .sub_visual .fl .t32{ font-size: 16px;}
    .sub_visual .fr{ margin: 70px auto -200px auto; width: 600px;}
    .sub_visual .fr .img{ height: 400px;}
}
@media(max-width: 767px){
    .sub_visual .modle_min{ padding: 9rem 0 0 0;}
    .sub_visual .fl .t1{ font-size: 1.3rem;}
    .sub_visual .fl .t2{ margin-top: 1.2rem; font-size: 3.2rem;}
    .sub_visual .fl .t3{ margin-top: 2.4rem; gap: .8rem;}
    .sub_visual .fl .t3 svg{ width: 1.6rem; height: 1.6rem;}
    .sub_visual .fl .t31{ font-size: 2.4rem;}
    .sub_visual .fl .t32{ font-size: 1.3rem;}
    .sub_visual .fr{ margin: 3.5rem auto -8rem auto; width: 100%; border-radius: 1rem;}
    .sub_visual .fr .tit{ padding: 0.5rem; height: 1.8rem; border-radius: 0.5rem;}
    .sub_visual .fr .img{ height: 16rem;}
}


.sub_visual .step{ position: relative; margin: 120px auto 0 auto; padding: 0 0 130px 0; max-width: 1000px; width: 100%;}
.sub_visual .step .list{ display: grid; grid-template-columns: repeat(5,1fr); position: relative; z-index: 10;}
.sub_visual .step .list .wrap{ position: relative; display: flex; flex-direction: column; align-items: center; padding: 0 10px 30px 10px; text-align: center;}
.sub_visual .step .list .wrap .t1{ font-size: 14px; letter-spacing: 0; color: rgba(255 255 255/30%); transition: color .3s;}
.sub_visual .step .list .wrap .t2{ margin: 10px 0 0 0; font-size: 24px; font-weight: 700; color: rgba(255 255 255/40%); white-space: nowrap; transition: color .3s;}
.sub_visual .step .list .wrap:after{ content: ""; position: absolute; z-index: 2; bottom: -6px; left: 50%; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255 255 255/25%); background: #000; transform: translate(-50%,0); transition: all .3s;}
.sub_visual .step .list .wrap:has(~ .wrap.on) .t1{ color: rgba(0 255 105/70%);}
.sub_visual .step .list .wrap:has(~ .wrap.on) .t2{ color: rgba(255 255 255/70%);}
.sub_visual .step .list .wrap:has(~ .wrap.on):after{ border-color: #00FF69; background: #00FF69;}
.sub_visual .step .list .wrap.on .t1{ color: #F247FA;}
.sub_visual .step .list .wrap.on .t2{ color: #FFF;}
.sub_visual .step .list .wrap.on:after{ width: 18px; height: 18px; bottom: -8px; border-color: #F247FA; background: #F247FA; box-shadow: 0 0 0 6px rgba(242 71 250/20%), 0 0 20px rgba(242 71 250/70%);}
.sub_visual .step .line{ position: relative; margin: 0 10%; margin-top: -4px; height: 2px; border-radius: 2px; background: rgba(255 255 255/14%);}
.sub_visual .step .line span{ display: block; width: 0; height: 100%; border-radius: 2px; background: linear-gradient(90deg, #00FF69, #F247FA); box-shadow: 0 0 12px rgba(242 71 250/50%); transition: width .6s cubic-bezier(.22,.61,.36,1);}
.sub_visual .step:has(.wrap:nth-child(1).on) .line span{ width: 0;}
.sub_visual .step:has(.wrap:nth-child(2).on) .line span{ width: 25%;}
.sub_visual .step:has(.wrap:nth-child(3).on) .line span{ width: 50%;}
.sub_visual .step:has(.wrap:nth-child(4).on) .line span{ width: 75%;}
.sub_visual .step:has(.wrap:nth-child(5).on) .line span{ width: 100%;}
@media(max-width: 1560px){
    .sub_visual .step{ margin: 100px auto 0 auto; padding: 0 0 110px 0; max-width: 1000px;}
    .sub_visual .step .list .wrap .t2{ font-size: 19px;}
}
@media(max-width: 1200px){
    .sub_visual .step{ margin: 90px auto 0 auto; padding: 0 0 100px 0;}
    .sub_visual .step .list .wrap{ padding: 0 8px 26px 8px;}
    .sub_visual .step .list .wrap .t1{ font-size: 13px;}
    .sub_visual .step .list .wrap .t2{ margin: 10px 0 0 0; font-size: 17px;}
}
@media(max-width: 1000px){
    .sub_visual .step{ margin: 70px auto 0 auto; padding: 0 0 80px 0;}
    .sub_visual .step .list .wrap{ padding: 0 6px 24px 6px;}
    .sub_visual .step .list .wrap .t1{ font-size: 12px; letter-spacing: 0;}
    .sub_visual .step .list .wrap .t2{ margin: 9px 0 0 0; font-size: 15px;}
    .sub_visual .step .list .wrap:after{ width: 12px; height: 12px; bottom: -5px;}
    .sub_visual .step .list .wrap.on:after{ width: 16px; height: 16px; bottom: -7px;}
}
@media(max-width: 767px){
    .sub_visual .step{ margin: 4rem auto 0 auto; padding: 0 0 5rem 0;}
    .sub_visual .step .list .wrap{ padding: 0 0.3rem 1.8rem 0.3rem;}
    .sub_visual .step .list .wrap .t1{ font-size: 0.95rem;}
    .sub_visual .step .list .wrap .t2{ margin: 0.7rem 0 0 0; font-size: 1.15rem;}
    .sub_visual .step .list .wrap:after{ width: 1rem; height: 1rem; bottom: -0.4rem; border-width: 0.15rem;}
    .sub_visual .step .list .wrap.on:after{ width: 1.3rem; height: 1.3rem; bottom: -0.55rem; box-shadow: 0 0 0 0.4rem rgba(242 71 250/20%), 0 0 1.4rem rgba(242 71 250/70%);}
    .sub_visual .step .line{ margin: 0 10%; margin-top: -0.2rem; height: 0.15rem;}
}


.about_visual{ display: flex; align-items: center; position: relative; z-index: 20; background: #000;}
.about_visual .modle_min{ display: flex; position: relative; z-index: 20; padding: 260px 0 160px 0;}
.about_visual .fl{ display: flex; flex-direction: column;}
.about_visual .fl .t1{ font-size: 20px; font-weight: 300; color: rgba(255 255 255/80%);}
.about_visual .fl .t2{ margin-top: 20px; font-family: "Chonburi", sans-serif; font-size: 120px; color: #FFF; letter-spacing: -2px;}
.about_visual .fl .t2 span{ display: block; margin-top: 20px; font-family: "Chonburi", sans-serif; font-size: 40px; color: #FFF; letter-spacing: -2px;}
.about_visual .fl .t3{ display: flex; align-items: center; margin-top: 60px; gap: 15px;}
.about_visual .fl .t31{ font-size: 60px; font-weight: 700; color: #FFF;}
.about_visual .fl .t32{ line-height: 1.2; font-size: 24px; font-weight: 400; color: #FFF;}
.about_visual .fl .t3 svg{ width: 30px; height: 30px;}
.about_visual .fl .t3 svg path{ color: rgba(255 255 255/40%);}

.about_visual .fr{ overflow: hidden; position: relative; margin: 0 0 -400px auto; width: 600px;}
.about_visual .fr .img{ overflow: hidden; border-radius: 10px; border: 3px solid #F247FA;}
.about_visual .fr .img img{ display: block; width: 100%; height: auto; transform: translate(var(--px), var(--py)) scale(1.06); transition: transform .45s cubic-bezier(.22,.61,.36,1);}

.about_visual .bg{ overflow: hidden; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: #000; --mx1: 0px; --my1: 0px; --mx2: 0px; --my2: 0px;}
.about_visual .bg:before{ content: ""; display: block; position: absolute; z-index: 2; top: 40%; left: 30%; width: 30vw; height: 30vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(242 71 250/70%) 0%, rgba(242 71 250/38%) 32%, rgba(196 40 235/14%) 60%, rgba(120 20 180/0) 100%); mix-blend-mode: screen; translate: var(--mx1) var(--my1); transition: translate 1.2s cubic-bezier(.22,.61,.36,1); animation: home_light_m 6s ease-in-out infinite alternate;}
.about_visual .bg:after{ content: ""; display: block; position: absolute; z-index: 1; top: -50%; left: -10%; width: 50vw; height: 50vw; border-radius: 50%; background: radial-gradient(circle closest-side, rgba(0 255 105/65%) 0%, rgba(0 255 105/34%) 34%, rgba(0 255 105/12%) 62%, rgba(0 255 105/0) 100%); mix-blend-mode: screen; translate: var(--mx2) var(--my2); transition: translate 1.6s cubic-bezier(.22,.61,.36,1); animation: home_light_g 3s ease-in-out infinite alternate;}
@media(max-width: 1560px){
    .about_visual .modle_min{ padding: 220px 0 130px 0;}
    .about_visual .fl .t1{ font-size: 18px;}
    .about_visual .fl .t2{ font-size: 92px;}
    .about_visual .fl .t2 span{ margin-top: 15px; font-size: 32px;}
    .about_visual .fl .t3{ margin-top: 45px;}
    .about_visual .fl .t31{ font-size: 48px;}
    .about_visual .fl .t32{ font-size: 20px;}
    .about_visual .fr{ margin: 0 0 -330px auto; width: 500px;}
}
@media(max-width: 1200px){
    .about_visual .modle_min{ padding: 190px 0 110px 0;}
    .about_visual .fl .t2{ font-size: 70px;}
    .about_visual .fl .t2 span{ margin-top: 12px; font-size: 26px;}
    .about_visual .fl .t3{ margin-top: 36px;}
    .about_visual .fl .t31{ font-size: 38px;}
    .about_visual .fl .t32{ font-size: 17px;}
    .about_visual .fr{ margin: 0 0 -260px auto; width: 400px;}
}
@media(max-width: 1000px){
    .about_visual .modle_min{ flex-direction: column; align-items: center; padding: 150px 0 100px 0;}
    .about_visual .fl{ align-items: center; text-align: center;}
    .about_visual .fl .t1{ font-size: 16px;}
    .about_visual .fl .t2{ font-size: 56px;}
    .about_visual .fl .t2 span{ margin-top: 10px; font-size: 22px;}
    .about_visual .fl .t3{ flex-direction: column; gap: 10px; margin-top: 32px;}
    .about_visual .fl .t3 svg{ width: 22px; height: 22px;}
    .about_visual .fl .t31{ font-size: 34px;}
    .about_visual .fl .t32{ font-size: 16px;}
    .about_visual .fr{ margin: 45px auto 0 auto; width: 340px;}
}
@media(max-width: 767px){
    .about_visual .modle_min{ padding: 9rem 0 5rem 0;}
    .about_visual .fl .t1{ font-size: 1.3rem;}
    .about_visual .fl .t2{ margin-top: 1rem; font-size: 3.4rem;}
    .about_visual .fl .t2 span{ margin-top: .6rem; font-size: 1.6rem;}
    .about_visual .fl .t3{ margin-top: 2.4rem; gap: .8rem;}
    .about_visual .fl .t3 svg{ width: 1.6rem; height: 1.6rem;}
    .about_visual .fl .t31{ font-size: 2.4rem;}
    .about_visual .fl .t32{ font-size: 1.3rem;}
    .about_visual .fr{ margin: 3rem auto 0 auto; width: 78%;}
}


.about_info{ position: relative; background: #FFF;}
.about_info .modle_min{ padding: 160px 0;}
.about_info .sub_head{ text-align: left;}
.about_info .list{ display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; margin: 60px 0 0 0;}
.about_info .list .wrap{ position: relative; padding: 40px; border-radius: 15px; border: 1px solid rgba(0 0 0/5%); background: #f9f9f9;}
.about_info .list .wrap:before{ content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; border-radius: 15px; border-top: 3px solid #000;}
.about_info .list .wrap .tit{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 0 0 30px 0; padding: 10px 20px; border-radius: 30px; background: #000; font-size: 16px; font-weight: 700; color: #FFF;}
.about_info .list .wrap .date{ font-size: 30px; font-weight: 700; letter-spacing: -.02em; color: #0A0A0A;}
.about_info .list .wrap .date em{ vertical-align: top; margin: 0 2px; font-size: 16px; font-style: normal; font-weight: 400; color: #666;}
.about_info .list .wrap .time{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 20px 0 0 0; font-size: 16px; font-weight: 500; color: #333;}
.about_info .list .wrap .time svg{ display: block; width: 20px; height: 20px; color: #000;}

.about_info .list .wrap .address p{ position: relative; padding-left: 15px; line-height: 1.4; font-size: 18px; font-weight: 700; color: #0A0A0A;}
.about_info .list .wrap .address p:before{ content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #F247FA;}
.about_info .list .wrap .address p + p{ margin: 8px 0 0 0; font-size: 16px; font-weight: 400; color: #888;}
.about_info .list .wrap .address p + p:before{ display: none;}

.about_info .list .wrap .pro p{ position: relative; margin: 0 0 16px 0; padding: 0 0 16px 15px; border-bottom: 1px solid rgba(0 0 0/10%); line-height: 1.4; font-size: 18px; font-weight: 700; color: #0A0A0A;}
.about_info .list .wrap .pro p em{ font-style: normal; font-size: 16px; font-weight: 400; color: #666;}
.about_info .list .wrap .pro p:before{ content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #F247FA;}
.about_info .list .wrap .pro p:last-child{ margin: 0; padding-bottom: 0; border-bottom: 0;}
@media(max-width: 1560px){
    .about_info .modle_min{ padding: 130px 0;}
    .about_info .list{ gap: 20px; margin: 50px 0 0 0;}
    .about_info .list .wrap{ padding: 34px 30px;}
    .about_info .list .wrap .date{ font-size: 26px;}
    .about_info .list .wrap .date em{ font-size: 15px;}
    .about_info .list .wrap .address p{ font-size: 17px;}
    .about_info .list .wrap .pro p{ font-size: 17px;}
    .about_info .list .wrap .pro p em{ font-size: 15px;}
}
@media(max-width: 1200px){
    .about_info .modle_min{ padding: 110px 0;}
    .about_info .list .wrap{ padding: 30px 26px;}
    .about_info .list .wrap .tit{ margin: 0 0 22px 0;}
    .about_info .list .wrap .date{ font-size: 23px;}
    .about_info .list .wrap .address p, .about_info .list .wrap .pro p{ font-size: 16px;}
}
@media(max-width: 1000px){
    .about_info .modle_min{ padding: 100px 0;}
    .about_info .list{ grid-template-columns: repeat(1,1fr); gap: 16px; margin: 40px 0 0 0;}
    .about_info .list .wrap{ padding: 34px 30px;}
    .about_info .list .wrap .date{ font-size: 26px;}
}
@media(max-width: 767px){
    .about_info .modle_min{ padding: 5rem 0;}
    .about_info .list{ gap: 1.2rem; margin: 2.6rem 0 0 0;}
    .about_info .list .wrap{ padding: 2.2rem 1.8rem; border-radius: 1rem;}
    .about_info .list .wrap:before{ border-radius: 1rem;}
    .about_info .list .wrap .tit{ margin: 0 0 1.6rem 0; padding: .7rem 1.4rem; font-size: 1.2rem;}
    .about_info .list .wrap .date{ font-size: 2rem;}
    .about_info .list .wrap .date em{ font-size: 1.15rem;}
    .about_info .list .wrap .time{ margin: 1.2rem 0 0 0; grid-gap: .6rem; font-size: 1.2rem;}
    .about_info .list .wrap .time svg{ width: 1.5rem; height: 1.5rem;}
    .about_info .list .wrap .address p{ padding-left: 1.2rem; font-size: 1.45rem;}
    .about_info .list .wrap .address p:before{ top: .75rem; width: .4rem; height: .4rem;}
    .about_info .list .wrap .address p + p{ margin: .6rem 0 0 0; font-size: 1.25rem;}
    .about_info .list .wrap .pro p{ margin: 0 0 1.2rem 0; padding: 0 0 1.2rem 1.2rem; font-size: 1.4rem;}
    .about_info .list .wrap .pro p em{ font-size: 1.2rem;}
    .about_info .list .wrap .pro p:before{ top: .75rem; width: .4rem; height: .4rem;}
}


.about_map{ overflow: hidden; position: relative; isolation: isolate; background: #000;}
.about_map .modle_min{ padding-top: 160px;}
.about_map .sub_head{}
.about_map .map{ flex: 1; position: relative; padding: 60px 0 160px 0;}
.about_map .map:after{ display: none; content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0 0 0/100%), rgba(0 0 0/0%), rgba(0 0 0/0%), rgba(0 0 0/0%));}
.about_map .map:before{ display: none; content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, rgba(0 0 0/100%), rgba(0 0 0/0%), rgba(0 0 0/0%), rgba(0 0 0/100%));}
.about_map .map img{ display: block; width: 100%; height: auto;}
@media(max-width: 1560px){
    .about_map .modle_min{ padding-top: 130px;}
}
@media(max-width: 1200px){
    .about_map .modle_min{ padding-top: 110px;}
}
@media(max-width: 1000px){
    .about_map .modle_min{ padding-top: 100px;}
}
@media(max-width: 767px){
    .about_map .modle_min{ padding-top: 5rem;}
    .about_map .map{ overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -1rem; padding: 2rem 0 3rem 0;}
    .about_map .map:before, .about_map .map:after{ display: none;}
    .about_map .map img{ width: 220%; max-width: none;}
}


.about_a{ overflow: hidden; position: relative; isolation: isolate; background: #F8F9FC;}
.about_a .modle_min{ display: flex; position: relative; z-index: 1; padding: 160px 0;}
.about_a .sub_head{ width: 40%; text-align: left;}
.about_a .text{ flex: 1; display: grid; gap: 30px;}
.about_a .text .lead{ margin: 0; line-height: 1.4; font-size: 32px; font-weight: 700; letter-spacing: -1.5px; color: #171A26;}
.about_a .text p{ line-height: 1.6; font-size: 18px; font-weight: 400; color: #333; word-break: keep-all;}
@media(max-width: 1560px){
    .about_a .modle_min{ padding: 130px 0;}
    .about_a .text{ gap: 26px;}
    .about_a .text .lead{ font-size: 28px;}
}
@media(max-width: 1200px){
    .about_a .modle_min{ padding: 110px 0;}
    .about_a .sub_head{ width: 32%;}
    .about_a .text .lead{ font-size: 25px;}
    .about_a .text p{ font-size: 17px;}
}
@media(max-width: 1000px){
    .about_a .modle_min{ flex-direction: column; gap: 32px; padding: 100px 0;}
    .about_a .sub_head{ width: 100%;}
    .about_a .text{ gap: 24px;}
    .about_a .text .lead{ font-size: 22px;}
    .about_a .text .lead br{ display: none;}
    .about_a .text p{ font-size: 16px;}
}
@media(max-width: 767px){
    .about_a .modle_min{ gap: 2.4rem; padding: 5rem 0;}
    .about_a .text{ gap: 1.8rem;}
    .about_a .text .lead{ font-size: 1.8rem; letter-spacing: -1px;}
    .about_a .text p{ font-size: 1.35rem;}
}


.about_program{ overflow: hidden; position: relative; isolation: isolate; background: #000;}
.about_program .modle_min{ padding: 160px 0;}
.about_program .sub_head{}
.about_program .list{ position: relative; margin-top: 80px; padding-top: 2px;}
.about_program .list:after{ content: ""; position: absolute; top: 0; right: 0; left: 0; height: 1px; background: linear-gradient(90deg, rgba(255 255 255/10%), rgba(0 255 105/100%), rgba(255 255 255/10%)); transition: all .3s;}
.about_program .list .item{ display: flex; align-items: center; gap: 60px; padding: 50px 0; border-bottom: 1px solid rgba(255 255 255/15%);}
.about_program .list .item .img{ flex: 0 0 500px; display: flex; justify-content: center; align-items: center; overflow: hidden; position: relative; border-radius: 15px;}
.about_program .list .item .img:before{ content: ""; display: block; padding-top: 60%;}
.about_program .list .item .img .tit{ display: block; position: absolute; z-index: 10; padding: 5px; width: auto; height: auto; max-width: 88%; max-height: 30px; border-radius: 5px; background: rgba(0 0 0/90%); transition: all .2s;}
.about_program .list .item .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; filter: grayscale(100%); transition: all .2s;}
.about_program .list .item .fr{ flex: 1;}
.about_program .list .item .t1{ font-size: 20px; font-weight: 300; letter-spacing: 0; color: rgba(255 255 255/60%);}
.about_program .list .item .t2{ margin: 10px 0 0; font-size: 34px; font-weight: 700; color: #FFF; letter-spacing: -1px;}
.about_program .list .item .t3{ margin: 15px 0 0; line-height: 1.4; font-size: 18px; font-weight: 400; color: rgba(255 255 255/80%);}
.about_program .list .item .btn{ display: flex; justify-content: space-between; align-items: center; margin: 60px 0 0 0; padding: 0 30px; width: 200px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/40%); transition: all .3s;}
.about_program .list .item .btn p{ font-size: 16px; font-weight: 500; color: #FFF;}
.about_program .list .item .btn svg{ display: block; width: 24px; height: 24px;}
.about_program .list .item .btn svg path{ color: #FFF;}
.about_program .list .item:hover .img .tit{ background: #F247FA;}
.about_program .list .item:hover .img .box{ filter: grayscale(0%);}
.about_program .list .item:hover .btn{ border-color: #F247FA; background: rgba(83, 6, 44, 0.1);}
.about_program .list .item:hover .btn p{ color: #F247FA;}
.about_program .list .item:hover .btn svg path{ color: #F247FA;}

.about_program .list .item:nth-child(2):hover .img .tit{ background: #7acc00;}
.about_program .list .item:nth-child(2):hover .btn{ border-color: #7acc00; background: rgba(3, 87, 38, 0.1);}
.about_program .list .item:nth-child(2):hover .btn p{ color: #7acc00;}
.about_program .list .item:nth-child(2):hover .btn svg path{ color: #7acc00;}

.about_program .list .item:nth-child(3):hover .img .tit{ background: #ffdd00;}
.about_program .list .item:nth-child(3):hover .btn{ border-color: #ffdd00; background: rgba(70, 69, 2, 0.1);}
.about_program .list .item:nth-child(3):hover .btn p{ color: #ffdd00;}
.about_program .list .item:nth-child(3):hover .btn svg path{ color: #ffdd00;}
@media(max-width: 1560px){
    .about_program .modle_min{ padding: 130px 0;}
    .about_program .list{ margin-top: 60px;}
    .about_program .list .item{ gap: 44px; padding: 40px 0;}
    .about_program .list .item .img{ flex: 0 0 420px;}
    .about_program .list .item .t2{ font-size: 30px;}
    .about_program .list .item .t3{ font-size: 17px;}
    .about_program .list .item .btn{ margin: 40px 0 0 0;}
}
@media(max-width: 1200px){
    .about_program .modle_min{ padding: 110px 0;}
    .about_program .list .item{ gap: 34px;}
    .about_program .list .item .img{ flex: 0 0 330px;}
    .about_program .list .item .t2{ font-size: 26px;}
    .about_program .list .item .t3{ font-size: 16px;}
    .about_program .list .item .btn{ margin: 30px 0 0 0; padding: 0 24px; width: 180px; height: 46px;}
}
@media(max-width: 1000px){
    .about_program .modle_min{ padding: 100px 0;}
    .about_program .list{ margin-top: 45px;}
    .about_program .list .item{ flex-direction: column; align-items: stretch; gap: 24px; padding: 36px 0;}
    .about_program .list .item .img{ flex: 0 0 auto; width: 100%;}
    .about_program .list .item .img:before{ padding-top: 52%;}
    .about_program .list .item .btn{ margin: 26px 0 0 0;}
}
@media(max-width: 767px){
    .about_program .modle_min{ padding: 5rem 0;}
    .about_program .list{ margin-top: 3rem;}
    .about_program .list .item{ gap: 1.6rem; padding: 2.4rem 0;}
    .about_program .list .item .img{ border-radius: 1rem;}
    .about_program .list .item .img .tit{ padding: .4rem; max-height: 2.4rem; border-radius: .4rem;}
    .about_program .list .item .t2{ margin-top: 0; font-size: 2rem;}
    .about_program .list .item .t3{ margin-top: 1rem; font-size: 1.3rem;}
    .about_program .list .item .btn{ margin: 1.8rem 0 0 0; padding: 0 1.6rem; width: 13rem; height: 3.8rem;}
    .about_program .list .item .btn p{ font-size: 1.2rem;}
    .about_program .list .item .btn svg{ width: 1.8rem; height: 1.8rem;}
}


.about_way{ overflow: hidden; position: relative; background: #f9f9f9;}
.about_way .modle_min{ position: relative; z-index: 10; padding: 160px 0;}
.about_way .inner{ display: flex; grid-gap: 60px; margin: 80px 0 0 0;}
.about_way .inner .map{ position: relative; padding: 20px; width: 50%; border-radius: 10px; border: 1px solid #ddd; background: #fff;}
.about_way .inner .map iframe{ display: block; width: 100%; height: 100%; border: 0; pointer-events: none;}
.about_way .inner .way{ overflow: hidden; width: 50%; border-radius: 10px; }
.about_way .inner .way .wrap{ padding: 30px 0; border-top: 1px dashed #ddd;}
.about_way .inner .way .wrap:first-child{ border-top: 0;}
.about_way .inner .way .wrap .t1{ font-size: 24px; font-weight: 700; color: #000;}
.about_way .inner .way .wrap .t2{ margin: 15px 0 0 0; line-height: 1.2; font-size: 16px; color: #333;}
.about_way .inner .way .wrap .t3{ display: grid; gap: 10px; margin: 15px 0 0 0;}
.about_way .inner .way .wrap .t3 p{ display: flex; line-height: 1.2; font-size: 16px; color: #333;}
.about_way .inner .way .wrap .t3 b{ display: inline-flex; justify-content: center; align-items: center; flex: 0 0 80px; margin: 0 5px 0 0; height: 25px; border-radius: 20px; background: #000; font-size: 13px; font-weight: 500; color: #FFF;}
.about_way .note{ display: grid; gap: 10px; padding: 30px; border-radius: 10px; background: rgba(0 0 0/4%);}
.about_way .note p{ position: relative; padding: 0 0 0 15px; line-height: 1.4; font-size: 15px; color: rgba(0 0 0/80%);}
.about_way .note p:before{ content: "※"; position: absolute; top: 0; left: 0; color: #F00;}
.about_way + .footer{ margin-top: 0;}
@media(max-width: 1560px){
    .about_way .modle_min{ padding: 130px 0;}
    .about_way .inner{ grid-gap: 40px; margin: 60px 0 0 0;}
    .about_way .inner .way .wrap{ padding: 26px 0;}
    .about_way .inner .way .wrap .t1{ font-size: 22px;}
}
@media(max-width: 1200px){
    .about_way .modle_min{ padding: 110px 0;}
    .about_way .inner{ grid-gap: 30px;}
    .about_way .inner .way .wrap{ padding: 22px 0;}
    .about_way .inner .way .wrap .t1{ font-size: 20px;}
    .about_way .inner .way .wrap .t2, .about_way .inner .way .wrap .t3 p{ font-size: 15px;}
    .about_way .inner .way .wrap .t3 b{ flex: 0 0 70px;}
}
@media(max-width: 1000px){
    .about_way .modle_min{ padding: 100px 0;}
    .about_way .inner{ flex-direction: column; grid-gap: 30px; margin: 45px 0 0 0;}
    .about_way .inner .map{ width: 100%; aspect-ratio: 16/9;}
    .about_way .inner .way{ width: 100%;}
    .about_way .inner .way .wrap .t1{ font-size: 21px;}
    .about_way .inner .way .wrap .t2, .about_way .inner .way .wrap .t3 p{ font-size: 16px;}
}
@media(max-width: 767px){
    .about_way .modle_min{ padding: 5rem 0;}
    .about_way .inner{ grid-gap: 2rem; margin: 3rem 0 0 0;}
    .about_way .inner .map{ padding: 1rem; aspect-ratio: 4/3; border-radius: 1rem;}
    .about_way .inner .way .wrap{ padding: 2rem 0;}
    .about_way .inner .way .wrap .t1{ font-size: 1.7rem;}
    .about_way .inner .way .wrap .t2{ margin: 1rem 0 0 0; line-height: 1.5; font-size: 1.3rem;}
    .about_way .inner .way .wrap .t3{ gap: .8rem; margin: 1rem 0 0 0;}
    .about_way .inner .way .wrap .t3 p{ flex-wrap: wrap; line-height: 1.5; font-size: 1.3rem;}
    .about_way .inner .way .wrap .t3 b{ flex: 0 0 6rem; margin: 0 .5rem .3rem 0; height: 2.2rem; font-size: 1.05rem;}
    .about_way .note{ gap: .8rem; padding: 2rem; border-radius: 1rem;}
    .about_way .note p{ padding-left: 1.4rem; font-size: 1.2rem;}
}















.laser_info{ position: relative;}
.laser_info .modle_min{ padding: 350px 0 160px 0;}
.laser_info .list{ display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; margin: 60px 0 0 0;}
.laser_info .list .wrap{ position: relative; padding: 40px; border-radius: 15px; border: 1px solid rgba(0 0 0/5%); background: #f9f9f9;}
.laser_info .list .wrap:before{ content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; border-radius: 15px; border-top: 3px solid #000;}
.laser_info .list .wrap:nth-child(1){ display: grid; align-content: start; gap: 34px;}
.laser_info .list .wrap .tit{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 0 0 30px 0; padding: 10px 20px; border-radius: 30px; background: #000; font-size: 16px; font-weight: 700; color: #FFF;}
.laser_info .list .wrap .tit.mb0{ margin-bottom: 0;}
.laser_info .list .wrap .row .tit{ margin: 0 0 18px 0;}

.laser_info .list .wrap .date{ font-size: 30px; font-weight: 700; letter-spacing: -.02em; color: #0A0A0A;}
.laser_info .list .wrap .date em{ vertical-align: top; margin: 0 2px; font-size: 16px; font-style: normal; font-weight: 400; color: #666;}
.laser_info .list .wrap .time{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 10px 0 0 0; font-size: 16px; font-weight: 500; color: #333;}
.laser_info .list .wrap .time svg{ display: block; width: 20px; height: 20px; color: #000;}
.laser_info .list .wrap .txt{ position: relative; padding-left: 15px; line-height: 1.4; font-size: 18px; font-weight: 700; color: #0A0A0A;}
.laser_info .list .wrap .txt:before{ content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #F247FA;}
.laser_info .list .wrap .txt em{ vertical-align: top; margin: 0 2px; font-size: 15px; font-style: normal; font-weight: 400; color: #666;}
.laser_info .list .wrap .txt span{ display: block; margin: 6px 0 0 0; line-height: 1.4; font-size: 15px; font-weight: 400; color: #888;}

.laser_info .list .wrap .ul_tit{ margin: 40px 0 20px 0; padding-bottom: 10px; border-bottom: 2px solid #000; font-size: 24px; font-weight: 700; color: #000;}
.laser_info .list .wrap ul{ margin: 0;}
.laser_info .list .wrap li{ position: relative; margin: 0 0 16px 0; padding: 0 0 16px 26px; border-bottom: 1px solid rgba(0 0 0/10%); line-height: 1.4;}
.laser_info .list .wrap li:last-child{ margin: 0; padding-bottom: 0; border-bottom: 0;}
.laser_info .list .wrap li span{ position: absolute; top: 0; left: 0; line-height: 1.8; font-size: 14px; font-weight: 500; letter-spacing: 0; color: #F247FA;}
.laser_info .list .wrap li strong{ font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: #0A0A0A;}
.laser_info .list .wrap li em{ display: block; margin: 4px 0 0 0; font-size: 16px; font-style: normal; font-weight: 400; color: #666;}
.laser_info .list .wrap ul + .txt{ margin: 24px 0 0 0; padding: 20px 0 0 0; border-top: 1px solid rgba(0 0 0/10%); font-size: 15px; font-weight: 400; color: #888;}
.laser_info .list .wrap ul + .txt:before{ display: none;}
@media(max-width: 1560px){
    .laser_info .modle_min{ padding: 310px 0 130px 0;}
    .laser_info .list{ gap: 20px; margin: 50px 0 0 0;}
    .laser_info .list .wrap{ padding: 34px 30px;}
    .laser_info .list .wrap:nth-child(1){ gap: 28px;}
    .laser_info .list .wrap .txt{ font-size: 17px;}
    .laser_info .list .wrap .date{ font-size: 26px;}
    .laser_info .list .wrap .date em{ font-size: 15px;}
    .laser_info .list .wrap li strong{ font-size: 17px;}
    .laser_info .list .wrap li em{ font-size: 15px;}
}
@media(max-width: 1200px){
    .laser_info .modle_min{ padding: 280px 0 110px 0;}
    .laser_info .list .wrap{ padding: 30px 26px;}
    .laser_info .list .wrap:nth-child(1){ gap: 24px;}
    .laser_info .list .wrap .tit{ margin: 0 0 22px 0;}
    .laser_info .list .wrap .row .tit{ margin: 0 0 16px 0;}
    .laser_info .list .wrap .txt{ font-size: 16px;}
    .laser_info .list .wrap .date{ font-size: 23px;}
    .laser_info .list .wrap li strong{ font-size: 16px;}
}
@media(max-width: 1000px){
    .laser_info .modle_min{ padding: 270px 0 100px 0;}
    .laser_info .list{ grid-template-columns: repeat(1,1fr); gap: 16px; margin: 40px 0 0 0;}
    .laser_info .list .wrap{ padding: 34px 30px;}
    .laser_info .list .wrap:nth-child(1){ gap: 30px;}
    .laser_info .list .wrap .txt{ font-size: 17px;}
    .laser_info .list .wrap .date{ font-size: 26px;}
    .laser_info .list .wrap li strong{ font-size: 17px;}
    .laser_info .list .wrap li em{ font-size: 16px;}
}
@media(max-width: 767px){
    .laser_info .modle_min{ padding: calc(8rem + 5rem) 0 5rem 0;}
    .laser_info .list{ gap: 1.2rem; margin: 2.6rem 0 0 0;}
    .laser_info .list .wrap{ padding: 2.2rem 1.8rem; border-radius: 1rem;}
    .laser_info .list .wrap:before{ border-radius: 1rem;}
    .laser_info .list .wrap:nth-child(1){ gap: 2.4rem;}
    .laser_info .list .wrap .tit{ margin: 0 0 1.6rem 0; padding: .7rem 1.4rem; font-size: 1.2rem;}
    .laser_info .list .wrap .row .tit{ margin: 0 0 1.2rem 0;}
    .laser_info .list .wrap .txt{ padding-left: 1.2rem; font-size: 1.45rem;}
    .laser_info .list .wrap .txt:before{ top: .75rem; width: .4rem; height: .4rem;}
    .laser_info .list .wrap .txt em{ font-size: 1.2rem;}
    .laser_info .list .wrap .txt span{ margin: .5rem 0 0 0; font-size: 1.2rem;}
    .laser_info .list .wrap .date{ font-size: 2rem;}
    .laser_info .list .wrap .date em{ font-size: 1.15rem;}
    .laser_info .list .wrap .time{ grid-gap: .6rem; margin: 1.2rem 0 0 0; font-size: 1.2rem;}
    .laser_info .list .wrap .time svg{ width: 1.5rem; height: 1.5rem;}

    .laser_info .list .wrap .ul_tit{ margin: 3rem 0 1.2rem 0; padding-bottom: 1rem; font-size: 1.6rem;}

    .laser_info .list .wrap li{ margin: 0 0 1.2rem 0; padding: 0 0 1.2rem 2rem;}
    .laser_info .list .wrap li span{ font-size: 1.1rem;}
    .laser_info .list .wrap li strong{ font-size: 1.4rem;}
    .laser_info .list .wrap li em{ margin: .3rem 0 0 0; font-size: 1.2rem;}
    .laser_info .list .wrap ul + .txt{ margin: 1.8rem 0 0 0; padding: 1.4rem 0 0 0; font-size: 1.2rem;}
}


.laser_about{ background: #F8F9FC;}
.laser_about .modle_min{ display: flex; padding: 160px 0;}
.laser_about .sub_head{ width: 40%; text-align: left;}
.laser_about .text{ flex: 1; display: grid; gap: 30px;}
.laser_about .text p{ padding: 0; border: 0; line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(0 0 0/80%);}
.laser_about .text .lead{ line-height: 1.4; font-size: 30px; font-weight: 700; letter-spacing: -1px; color: #0A0A0A;}
.laser_about .text .note{ padding: 30px 0 0 0; border-top: 1px solid rgba(0 0 0/10%); line-height: 1.4; font-size: 16px; font-weight: 500; color: rgba(0 0 0/55%);}
@media(max-width: 1560px){
    .laser_about .modle_min{ gap: 50px; padding: 130px 0;}
    .laser_about .text .lead{ font-size: 26px;}
}
@media(max-width: 1200px){
    .laser_about .modle_min{ gap: 40px; padding: 110px 0;}
    .laser_about .sub_head{ width: 32%;}
    .laser_about .text{ gap: 26px;}
    .laser_about .text p{ font-size: 17px;}
    .laser_about .text .lead{ font-size: 24px;}
    .laser_about .text .note{ padding: 26px 0 0 0; font-size: 15px;}
}
@media(max-width: 1000px){
    .laser_about .modle_min{ flex-direction: column; align-items: stretch; gap: 32px; padding: 100px 0;}
    .laser_about .sub_head{ width: 100%;}
    .laser_about .text{ gap: 24px;}
    .laser_about .text p{ font-size: 16px;}
    .laser_about .text .lead{ font-size: 22px;}
    .laser_about .text .note{ padding: 28px 0 0 0; font-size: 15px;}
}
@media(max-width: 767px){
    .laser_about .modle_min{ gap: 2.4rem; padding: 5rem 0;}
    .laser_about .text{ gap: 1.8rem;}
    .laser_about .text p{ font-size: 1.35rem;}
    .laser_about .text .lead{ font-size: 1.8rem;}
    .laser_about .text .note{ padding: 2rem 0 0 0; font-size: 1.2rem;}
}


.laser_work{ background: #000;}
.laser_work .modle_min{ padding: 160px 0;}
.laser_work .list{ margin: 80px 0 0 0; border-top: 1px solid rgba(255 255 255/15%);}
.laser_work .wrap{ display: flex; grid-gap: 60px; padding: 60px 0; border-bottom: 1px solid rgba(255 255 255/18%);}

.laser_work .wrap .fl{ flex: 0 0 300px;}
.laser_work .wrap .fl .img{ overflow: hidden; position: relative; border-radius: 10px;}
.laser_work .wrap .fl .img:before{ content: ""; display: block; padding: 0 0 100% 0;}
.laser_work .wrap .fl .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: transform .6s;}
.laser_work .wrap:hover .fl .img .box{ transform: scale(1.06);}
.laser_work .wrap .fl .name{ margin: 30px 0 0 0; text-align: center;}
.laser_work .wrap .fl .name p{ line-height: 1.2; font-size: 24px; font-weight: 700; color: #FFF;}
.laser_work .wrap .fl .name span{ display: block; margin: 5px 0 0 0; line-height: 1.2; font-size: 16px; letter-spacing: 0; color: rgba(255 255 255/60%);}

.laser_work .wrap .fr{ flex: 1; padding-top: 60px;}
.laser_work .wrap .fr .w1 .num{ font-family: "Chonburi", sans-serif; font-size: 20px; letter-spacing: 0; color: rgba(255 255 255/35%);}
.laser_work .wrap .fr .w1 .t1{ margin: 20px 0 0 0; line-height: 1.2; font-size: 36px; font-weight: 700; color: #FFF;}
.laser_work .wrap .fr .w1 .t1 em{ margin: 0 0 0 10px; font-size: 18px; font-style: normal; font-weight: 400; letter-spacing: 0; color: rgba(255 255 255/45%);}
.laser_work .wrap .fr .w1 .t3{ margin: 5px 0 0 0; line-height: 1.5; font-size: 15px; font-weight: 500; color: #F247FA;}
.laser_work .wrap .fr .w1 .t2{ margin: 20px 0 0 0; line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(255 255 255/60%);}

.laser_work .wrap .fr .w2{ margin: 50px 0 0 0;}
.laser_work .wrap .fr .w2 .t1{ line-height: 1.2; font-size: 24px; font-weight: 700; color: #FFF;}
.laser_work .wrap .fr .w2 .t2{ display: grid; gap: 16px; margin: 20px 0 0 0;}
.laser_work .wrap .fr .w2 .t2 p{ line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(255 255 255/60%);}
.laser_work .wrap .fr .w4{ margin: 50px 0 0 0;}
.laser_work .wrap .fr .w4 .t1{ line-height: 1.2; font-size: 24px; font-weight: 700; color: #FFF;}
.laser_work .wrap .fr .gallery{ display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 12px; margin: 20px 0 0 0;}
.laser_work .wrap .fr .gallery span{ display: block; aspect-ratio: 16/16; border-radius: 10px;}

.laser_work .wrap .fr .btn{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 30px 0 0 0; padding: 0 30px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/28%); transition: all .3s; cursor: pointer; user-select: none;}
.laser_work .wrap .fr .btn p{ font-size: 16px; font-weight: 500; color: rgba(255 255 255/100%); transition: all .3s;}
.laser_work .wrap .fr .btn svg{ display: block; width: 16px; height: 16px; color: rgba(255 255 255/100%); transition: all .4s;}
.laser_work .wrap .fr .btn:hover{ border-color: #00FF69;}
.laser_work .wrap .fr .btn:hover p, .laser_work .wrap .fr .btn:hover svg{ color: #00FF69;}
.laser_work .wrap .fr .btn.on svg{ transform: rotate(180deg);}

.laser_work .wrap .fr .open{ display: none;}

.laser_work.white{ background: #FFF;}
.laser_work.white .list{ display: flex; flex-wrap: wrap; border-top-color: rgba(10 10 10/15%);}
.laser_work.white .wrap{ width: 100%; border-bottom-color: rgba(10 10 10/18%);}
.laser_work.white .wrap .fl .name p{ color: #0A0A0A;}
.laser_work.white .wrap .fl .name span{ color: rgba(10 10 10/55%);}
.laser_work.white .wrap .fr .w1 .num{ color: rgba(10 10 10/25%);}
.laser_work.white .wrap .fr .w1 .t1, .laser_work.white .wrap .fr .w2 .t1, .laser_work.white .wrap .fr .w4 .t1{ color: #0A0A0A;}
.laser_work.white .wrap .fr .w1 .t1 em{ color: rgba(10 10 10/45%);}
.laser_work.white .wrap .fr .w1 .t2, .laser_work.white .wrap .fr .w2 .t2 p{ color: rgba(10 10 10/62%);}
.laser_work.white .wrap .fr .btn{ border-color: rgba(10 10 10/25%);}
.laser_work.white .wrap .fr .btn p, .laser_work.white .wrap .fr .btn svg{ color: #0A0A0A;}
.laser_work.white .wrap .fr .btn:hover{ border-color: #00FF69;}
.laser_work.white .wrap .fr .btn:hover p, .laser_work.white .wrap .fr .btn:hover svg{ color: #00FF69;}
@media(max-width: 1560px){
    .laser_work .modle_min{ padding: 130px 0;}
    .laser_work .list{ margin: 60px 0 0 0;}
    .laser_work .wrap{ grid-gap: 44px;}
    .laser_work .wrap .fl{ flex: 0 0 250px;}
    .laser_work .wrap .fl .name p{ font-size: 22px;}
    .laser_work .wrap .fr{ padding-top: 40px;}
    .laser_work .wrap .fr .w1 .t1{ font-size: 30px;}
    .laser_work .wrap .fr .gallery{ grid-template-columns: repeat(3,1fr);}
}
@media(max-width: 1200px){
    .laser_work .modle_min{ padding: 110px 0;}
    .laser_work .list{ margin: 50px 0 0 0;}
    .laser_work .wrap{ grid-gap: 36px; padding: 50px 0;}
    .laser_work .wrap .fl{ flex: 0 0 210px;}
    .laser_work .wrap .fl .name{ margin: 24px 0 0 0;}
    .laser_work .wrap .fl .name p{ font-size: 20px;}
    .laser_work .wrap .fl .name span{ margin: 10px 0 0 0; font-size: 15px;}
    .laser_work .wrap .fr{ padding-top: 26px;}
    .laser_work .wrap .fr .w1 .t1{ font-size: 27px;}
    .laser_work .wrap .fr .w1 .t1 em{ font-size: 16px;}
    .laser_work .wrap .fr .w1 .t2{ font-size: 17px;}
    .laser_work .wrap .fr .w2, .laser_work .wrap .fr .w4{ margin-top: 40px;}
    .laser_work .wrap .fr .w2 .t1, .laser_work .wrap .fr .w4 .t1{ font-size: 22px;}
    .laser_work .wrap .fr .w2 .t2 p{ font-size: 17px;}
    .laser_work .wrap .fr .btn{ margin: 26px 0 0 0; padding: 0 26px; height: 46px;}
}
@media(max-width: 1000px){
    .laser_work .modle_min{ padding: 100px 0;}
    .laser_work .list{ margin: 50px 0 0 0;}
    .laser_work .wrap{ flex-direction: column; grid-gap: 26px; padding: 40px 0;}
    .laser_work .wrap .fl{ display: flex; align-items: center; grid-gap: 20px; flex: 0 0 auto; width: 100%;}
    .laser_work .wrap .fl .img{ flex: 0 0 130px; width: 130px;}
    .laser_work .wrap .fl .name{ margin: 0; text-align: left;}
    .laser_work .wrap .fr{ padding-top: 0; width: 100%;}
    .laser_work .wrap .fr .w1 .t1{ font-size: 26px;}
    .laser_work .wrap .fr .w1 .t2, .laser_work .wrap .fr .w2 .t2 p{ font-size: 16px;}
    .laser_work .wrap .fr .w2, .laser_work .wrap .fr .w4{ margin-top: 34px;}
    .laser_work .wrap .fr .w2 .t1, .laser_work .wrap .fr .w4 .t1{ font-size: 20px;}
}
@media(max-width: 767px){
    .laser_work .modle_min{ padding: 5rem 0;}
    .laser_work .list{ margin: 3rem 0 0 0;}
    .laser_work .wrap{ grid-gap: 1.8rem; padding: 2.6rem 0;}
    .laser_work .wrap .fl{ grid-gap: 1.4rem;}
    .laser_work .wrap .fl .img{ flex: 0 0 8.5rem; width: 8.5rem; border-radius: 1.2rem;}
    .laser_work .wrap .fl .name p{ font-size: 1.8rem;}
    .laser_work .wrap .fl .name span{ margin: .6rem 0 0 0; font-size: 1.1rem;}
    .laser_work .wrap .fr .w1 .num{ font-size: 1.3rem;}
    .laser_work .wrap .fr .w1 .t1{ margin: 1rem 0 0 0; font-size: 2rem;}
    .laser_work .wrap .fr .w1 .t1 em{ display: block; margin: .5rem 0 0 0; font-size: 1.2rem;}
    .laser_work .wrap .fr .w1 .t3{ margin: 1rem 0 0 0; font-size: 1.15rem;}
    .laser_work .wrap .fr .w1 .t2{ margin: 1.4rem 0 0 0; font-size: 1.3rem;}
    .laser_work .wrap .fr .btn{ margin: 2rem 0 0 0; padding: 0 1.8rem; height: 3.8rem;}
    .laser_work .wrap .fr .btn p{ font-size: 1.2rem;}
    .laser_work .wrap .fr .btn svg{ width: 1.5rem; height: 1.5rem;}
    .laser_work .wrap .fr .w2, .laser_work .wrap .fr .w4{ margin-top: 2.6rem;}
    .laser_work .wrap .fr .w2 .t1, .laser_work .wrap .fr .w4 .t1{ font-size: 1.6rem;}
    .laser_work .wrap .fr .w2 .t2{ gap: 1.2rem; margin: 1.4rem 0 0 0;}
    .laser_work .wrap .fr .w2 .t2 p{ font-size: 1.3rem;}
    .laser_work .wrap .fr .gallery{ grid-template-columns: repeat(2,1fr); grid-gap: .8rem; margin: 1.4rem 0 0 0;}
    .laser_work .wrap .fr .gallery span{ border-radius: .8rem;}
}


.laser_artist{ background: #FBF5EE;}
.laser_artist .modle_min{ padding: 160px 0;}
.laser_artist .list{ display: grid; grid-template-columns: repeat(2,1fr); gap: 30px; margin: 80px 0 0 0;}
.laser_artist .list .wrap{ padding: 40px; border-radius: 10px; border: 1px solid rgba(0 0 0/12%); background: #FFF;}
.laser_artist .list .wrap .img{ overflow: hidden; position: relative; border-radius: 10px;}
.laser_artist .list .wrap .img:before{ content: ""; display: block; padding: 0 0 56.25% 0;}
.laser_artist .list .wrap .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; filter: grayscale(1) contrast(1.06); transition: filter .6s;}
.laser_artist .list .wrap:hover .img .box{ filter: grayscale(0) contrast(1);}
.laser_artist .list .wrap .info{ margin: 26px 0 0 0;}
.laser_artist .list .wrap .info .tit{ line-height: 1.3; font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: #0A0A0A;}
.laser_artist .list .wrap .info .txt{ display: grid; gap: 14px; margin: 18px 0 0 0;}
.laser_artist .list .wrap .info .txt p{ line-height: 1.7; font-size: 16px; font-weight: 400; color: rgba(10 10 10/62%);}
@media(max-width: 1560px){
    .laser_artist .modle_min{ padding: 130px 0;}
    .laser_artist .list{ gap: 20px; margin: 60px 0 0 0;}
    .laser_artist .list .wrap{ padding: 30px;}
    .laser_artist .list .wrap .info .tit{ font-size: 22px;}
}
@media(max-width: 1200px){
    .laser_artist .modle_min{ padding: 110px 0;}
    .laser_artist .list{ gap: 16px; margin: 50px 0 0 0;}
    .laser_artist .list .wrap{ padding: 26px;}
    .laser_artist .list .wrap .info{ margin: 22px 0 0 0;}
    .laser_artist .list .wrap .info .tit{ font-size: 20px;}
    .laser_artist .list .wrap .info .txt{ gap: 12px; margin: 14px 0 0 0;}
    .laser_artist .list .wrap .info .txt p{ font-size: 15px;}
}
@media(max-width: 1000px){
    .laser_artist .modle_min{ padding: 100px 0;}
    .laser_artist .list{ margin: 50px 0 0 0;}
    .laser_artist .list{ grid-template-columns: repeat(1,1fr); gap: 16px;}
}
@media(max-width: 767px){
    .laser_artist .modle_min{ padding: 5rem 0;}
    .laser_artist .list{ margin: 3rem 0 0 0;}
    .laser_artist .list .wrap{ padding: 2rem; border-radius: 1.2rem;}
    .laser_artist .list .wrap .img{ border-radius: 1rem;}
    .laser_artist .list .wrap .info{ margin: 1.8rem 0 0 0;}
    .laser_artist .list .wrap .info .tit{ font-size: 1.7rem;}
    .laser_artist .list .wrap .info .txt{ gap: 1rem; margin: 1.2rem 0 0 0;}
    .laser_artist .list .wrap .info .txt p{ font-size: 1.3rem;}
}








.lecture_info{ position: relative;}
.lecture_info .modle_min{ padding: 350px 0 160px 0;}
.lecture_info .list{ display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; margin: 60px 0 0 0;}
.lecture_info .list .wrap{ position: relative; padding: 40px; border-radius: 15px; border: 1px solid rgba(0 0 0/5%); background: #f9f9f9;}
.lecture_info .list .wrap:before{ content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; border-radius: 15px; border-top: 3px solid #000;}
.lecture_info .list .wrap:nth-child(1){ display: grid; align-content: start; gap: 34px;}
.lecture_info .list .wrap .tit{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 0 0 30px 0; padding: 10px 20px; border-radius: 30px; background: #000; font-size: 16px; font-weight: 700; color: #FFF;}
.lecture_info .list .wrap .row .tit{ margin: 0 0 18px 0;}
.lecture_info .list .wrap .row > p:not(.tit):not(.txt){ margin: 0 0 30px 0; line-height: 1.6; font-size: 17px; font-weight: 400; color: rgba(0 0 0/80%); word-break: keep-all;}
.lecture_info .list .wrap .row:nth-child(1) > p:not(.tit):not(.txt){ line-height: 1.4; font-size: 20px; font-weight: 700; letter-spacing: -.5px; color: #0A0A0A;}
.lecture_info .list .wrap .txt{ position: relative; padding-left: 15px; line-height: 1.4; font-size: 18px; font-weight: 700; color: #0A0A0A;}
.lecture_info .list .wrap .txt:before{ content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #F247FA;}
.lecture_info .list .wrap .txt + .txt{ margin: 8px 0 0 0;}
.lecture_info .list .wrap ul{ margin: 0;}
.lecture_info .list .wrap li{ margin: 0 0 16px 0; padding: 0 0 16px 0; border-bottom: 1px solid rgba(0 0 0/10%); line-height: 1.4;}
.lecture_info .list .wrap li:last-child{ margin: 0; padding-bottom: 0; border-bottom: 0;}
.lecture_info .list .wrap li span{ display: inline-block; min-width: 46px; margin: 0 10px 0 0; font-size: 14px; font-weight: 500; letter-spacing: 0; color: #F247FA;}
.lecture_info .list .wrap li strong{ font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: #0A0A0A;}
.lecture_info .list .wrap li em{ display: block; margin: 4px 0 0 0; padding-left: 56px; font-size: 16px; font-style: normal; font-weight: 400; color: #666;}
@media(max-width: 1560px){
    .lecture_info .modle_min{ padding: 310px 0 130px 0;}
    .lecture_info .list{ gap: 20px; margin: 50px 0 0 0;}
    .lecture_info .list .wrap{ padding: 34px 30px;}
    .lecture_info .list .wrap:nth-child(1){ gap: 28px;}
    .lecture_info .list .wrap .row > p:not(.tit):not(.txt){ margin: 0 0 26px 0; font-size: 16px;}
    .lecture_info .list .wrap .row:nth-child(1) > p:not(.tit):not(.txt){ font-size: 19px;}
    .lecture_info .list .wrap .txt{ font-size: 17px;}
    .lecture_info .list .wrap li strong{ font-size: 17px;}
    .lecture_info .list .wrap li em{ font-size: 15px;}
}
@media(max-width: 1200px){
    .lecture_info .modle_min{ padding: 280px 0 110px 0;}
    .lecture_info .list .wrap{ padding: 30px 26px;}
    .lecture_info .list .wrap:nth-child(1){ gap: 24px;}
    .lecture_info .list .wrap .row > p:not(.tit):not(.txt){ margin: 0 0 22px 0; font-size: 15px;}
    .lecture_info .list .wrap .row:nth-child(1) > p:not(.tit):not(.txt){ font-size: 18px;}
    .lecture_info .list .wrap .tit{ margin: 0 0 22px 0;}
    .lecture_info .list .wrap .row .tit{ margin: 0 0 16px 0;}
    .lecture_info .list .wrap .txt{ font-size: 16px;}
    .lecture_info .list .wrap li span{ min-width: 42px; margin: 0 8px 0 0; font-size: 13px;}
    .lecture_info .list .wrap li strong{ font-size: 16px;}
    .lecture_info .list .wrap li em{ padding-left: 50px;}
}
@media(max-width: 1000px){
    .lecture_info .modle_min{ padding: 270px 0 100px 0;}
    .lecture_info .list{ grid-template-columns: repeat(1,1fr); gap: 16px; margin: 40px 0 0 0;}
    .lecture_info .list .wrap{ padding: 34px 30px;}
    .lecture_info .list .wrap:nth-child(1){ gap: 30px;}
    .lecture_info .list .wrap .row > p:not(.tit):not(.txt){ margin: 0 0 26px 0; font-size: 17px;}
    .lecture_info .list .wrap .row:nth-child(1) > p:not(.tit):not(.txt){ font-size: 20px;}
    .lecture_info .list .wrap .txt{ font-size: 17px;}
    .lecture_info .list .wrap li span{ min-width: 46px; margin: 0 10px 0 0; font-size: 14px;}
    .lecture_info .list .wrap li strong{ font-size: 17px;}
    .lecture_info .list .wrap li em{ padding-left: 56px; font-size: 16px;}
}
@media(max-width: 767px){
    .lecture_info .modle_min{ padding: calc(8rem + 5rem) 0 5rem 0;}
    .lecture_info .list{ gap: 1.2rem; margin: 2.6rem 0 0 0;}
    .lecture_info .list .wrap{ padding: 2.2rem 1.8rem; border-radius: 1rem;}
    .lecture_info .list .wrap:before{ border-radius: 1rem;}
    .lecture_info .list .wrap:nth-child(1){ gap: 2.4rem;}
    .lecture_info .list .wrap .row > p:not(.tit):not(.txt){ margin: 0 0 2rem 0; font-size: 1.4rem;}
    .lecture_info .list .wrap .row:nth-child(1) > p:not(.tit):not(.txt){ font-size: 1.65rem;}
    .lecture_info .list .wrap .tit{ margin: 0 0 1.6rem 0; padding: .7rem 1.4rem; font-size: 1.2rem;}
    .lecture_info .list .wrap .row .tit{ margin: 0 0 1.2rem 0;}
    .lecture_info .list .wrap .txt{ padding-left: 1.2rem; font-size: 1.45rem;}
    .lecture_info .list .wrap .txt:before{ top: .75rem; width: .4rem; height: .4rem;}
    .lecture_info .list .wrap .txt + .txt{ margin: .6rem 0 0 0;}
    .lecture_info .list .wrap li{ margin: 0 0 1.2rem 0; padding: 0 0 1.2rem 0;}
    .lecture_info .list .wrap li span{ min-width: 3.6rem; margin: 0 .8rem 0 0; font-size: 1.1rem;}
    .lecture_info .list .wrap li strong{ font-size: 1.4rem;}
    .lecture_info .list .wrap li em{ margin: .3rem 0 0 0; padding-left: 4.4rem; font-size: 1.2rem;}
}


.lecture_about{ background: #F8F9FC;}
.lecture_about .modle_min{ padding: 160px 0;}
.lecture_about .sub_head{}
.lecture_about .text{ flex: 1; display: grid; gap: 40px; margin-top: 60px; text-align: center;}
.lecture_about .text p{ padding: 0; border: 0; line-height: 1.6; font-size: 20px; font-weight: 400; color: rgba(0 0 0/80%);}
.lecture_about .text .note{ padding: 40px 0 0 0; border-top: 1px solid rgba(0 0 0/10%); line-height: 1.4; font-size: 16px; color: rgba(0 0 0/60%);}
@media(max-width: 1560px){
    .lecture_about .modle_min{ gap: 50px; padding: 130px 0;}
}
@media(max-width: 1200px){
    .lecture_about .modle_min{ gap: 40px; padding: 110px 0;}
}
@media(max-width: 1000px){
    .lecture_about .modle_min{ flex-direction: column; align-items: stretch; gap: 32px; padding: 100px 0;}
    .lecture_about .sub_head{ width: 100%;}
    .lecture_about .text{ gap: 28px;}
    .lecture_about .text p{ font-size: 16px;}
    .lecture_about .text .note{ padding: 28px 0 0 0; font-size: 15px;}
}
@media(max-width: 767px){
    .lecture_about .modle_min{ gap: 2.4rem; padding: 5rem 0;}
    .lecture_about .text{ margin-top: 2rem;}
    .lecture_about .text p{ font-size: 1.2rem;}
    .lecture_about .text .note{ padding: 2rem 0 0 0; font-size: 1.2rem;}
}


.lecture_day{ background: #000;}
.lecture_day .modle_min{ padding: 160px 0;}
.lecture_day .list{ margin: 80px 0 0 0; border-top: 1px solid rgba(255 255 255/15%);}
.lecture_day .wrap{ display: flex; grid-gap: 60px; padding: 60px 0; border-bottom: 1px solid rgba(255 255 255/18%);}
.lecture_day .wrap .fl{ flex: 0 0 300px;}
.lecture_day .wrap .fl .img{ overflow: hidden; position: relative; border-radius: 10px;}
.lecture_day .wrap .fl .img:before{ content: ""; display: block; padding: 0 0 120% 0;}
.lecture_day .wrap .fl .img .box{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; filter: grayscale(1) contrast(1.06); transition: filter .6s, transform .6s;}
.lecture_day .wrap .fl .name{ margin: 30px 0 0 0; text-align: center;}
.lecture_day .wrap .fl .name p{ font-size: 30px; font-weight: 700; color: #FFF;}
.lecture_day .wrap .fl .name p em{ font-style: initial; font-size: 20px; font-weight: 400; color: #666;}
.lecture_day .wrap .fl .name span{ display: block; margin: 15px 0 0 0; font-size: 16px; color: rgba(255 255 255/60%); letter-spacing: 0;}
.lecture_day .wrap:hover .fl .img .box{ filter: grayscale(0) contrast(1); transform: scale(1);}

.lecture_day .wrap .fr{ flex: 1; padding-top: 100px;}
.lecture_day .wrap .fr .w1 .t1{ line-height: 1.2; font-size: 36px; font-weight: 700; color: #FFF;}
.lecture_day .wrap .fr .w1 .t2{ margin: 20px 0 0 0; line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(255 255 255/60%);}
.lecture_day .wrap .fr .w2{ margin-top: 50px;}
.lecture_day .wrap .fr .w2 .t1{ line-height: 1.2; font-size: 24px; font-weight: 700; color: #FFF;}
.lecture_day .wrap .fr .w2 .t2{ margin: 20px 0 0 0; line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(255 255 255/60%);}
.lecture_day .wrap .fr .w3{ margin: 50px 0 0 0;}
.lecture_day .wrap .fr .w3 .t1{ line-height: 1.2; font-size: 24px; font-weight: 700; color: #FFF;}
.lecture_day .wrap .fr .w3 .t2{ display: grid; gap: 10px; margin: 20px 0 0 0;}
.lecture_day .wrap .fr .w3 .t2 p{ position: relative; padding-left: 15px; line-height: 1.4; font-size: 16px; font-weight: 400; color: rgba(255 255 255/50%);}
.lecture_day .wrap .fr .w3 .t2 p::before{ content: ""; position: absolute; top: calc(50% - 2px); left: 0; width: 4px; height: 4px; border-radius: 50%; background: #FFF;}

.lecture_day .wrap .fr .btn{ display: inline-flex; align-items: center; grid-gap: 10px; margin: 30px 0 0 0; padding: 0 30px; height: 50px; border-radius: 30px; border: 1px solid rgba(255 255 255/28%); transition: all .3s; cursor: pointer; user-select: none;}
.lecture_day .wrap .fr .btn p{ font-size: 16px; font-weight: 500; color: rgba(255 255 255/100%); transition: all .3s;}
.lecture_day .wrap .fr .btn svg{ display: block; width: 16px; height: 16px; color: rgba(255 255 255/100%); transition: all .4s;}
.lecture_day .wrap .fr .btn:hover{ border-color: #00FF69;}
.lecture_day .wrap .fr .btn:hover p, .lecture_day .wrap .fr .btn:hover svg{ color: #00FF69;}
.lecture_day .wrap .fr .btn.on svg{ transform: rotate(180deg);}

.lecture_day .wrap .fr .open{ display: none;}
.lecture_day .wrap .fr .open.on{ display: block;}

.lecture_day.white{ background: #FFF;}
.lecture_day.white .sub_head:after{ background: linear-gradient(90deg, rgba(0 0 0/10%), rgba(0 0 0/100%), rgba(0 0 0/10%));}
.lecture_day.white .sub_head .t2{ color: #0A0A0A;}
.lecture_day.white .list{ border-top-color: rgba(10 10 10/15%);}
.lecture_day.white .wrap{ border-bottom-color: rgba(10 10 10/18%);}
.lecture_day.white .wrap .fl .name p{ color: #0A0A0A;}
.lecture_day.white .wrap .fl .name p .em{}
.lecture_day.white .wrap .fl .name span{ color: rgba(10 10 10/55%);}
.lecture_day.white .wrap .fr .w1 .t1, .lecture_day.white .wrap .fr .w2 .t1, .lecture_day.white .wrap .fr .w3 .t1{ color: #0A0A0A;}
.lecture_day.white .wrap .fr .w1 .t2, .lecture_day.white .wrap .fr .w2 .t2{ color: rgba(10 10 10/62%);}
.lecture_day.white .wrap .fr .w3 .t2 p{ color: rgba(10 10 10/55%);}
.lecture_day.white .wrap .fr .w3 .t2 p::before{ background: #0A0A0A;}
.lecture_day.white .wrap .fr .btn{ border-color: rgba(10 10 10/25%);}
.lecture_day.white .wrap .fr .btn p, .lecture_day.white .wrap .fr .btn svg{ color: #0A0A0A;}
.lecture_day.white .wrap .fr .btn:hover{ border-color: #00FF69;}
.lecture_day.white .wrap .fr .btn:hover p, .lecture_day.white .wrap .fr .btn:hover svg{ color: #00FF69;}
@media(max-width: 1560px){
    .lecture_day .modle_min{ padding: 130px 0;}
    .lecture_day .list{ margin: 60px 0 0 0;}
    .lecture_day .wrap{ grid-gap: 44px;}
    .lecture_day .wrap .fl{ flex: 0 0 250px;}
    .lecture_day .wrap .fl .name p{ font-size: 22px;}
    .lecture_day .wrap .fr{ padding-top: 70px;}
    .lecture_day .wrap .fr .w1 .t1{ font-size: 30px;}
}
@media(max-width: 1200px){
    .lecture_day .modle_min{ padding: 110px 0;}
    .lecture_day .list{ margin: 50px 0 0 0;}
    .lecture_day .wrap{ grid-gap: 36px; padding: 50px 0;}
    .lecture_day .wrap .fl{ flex: 0 0 210px;}
    .lecture_day .wrap .fl .name{ margin: 24px 0 0 0;}
    .lecture_day .wrap .fl .name p{ font-size: 20px;}
    .lecture_day .wrap .fl .name span{ margin: 10px 0 0 0; font-size: 15px;}
    .lecture_day .wrap .fr{ padding-top: 50px;}
    .lecture_day .wrap .fr .w1 .t1{ font-size: 27px;}
    .lecture_day .wrap .fr .w1 .t2{ font-size: 17px;}
    .lecture_day .wrap .fr .w2, .lecture_day .wrap .fr .w3{ margin-top: 40px;}
    .lecture_day .wrap .fr .w2 .t1, .lecture_day .wrap .fr .w3 .t1{ font-size: 22px;}
    .lecture_day .wrap .fr .w2 .t2{ font-size: 17px;}
    .lecture_day .wrap .fr .w3 .t2 p{ font-size: 15px;}
    .lecture_day .wrap .fr .btn{ margin: 26px 0 0 0; padding: 0 26px; height: 46px;}
}
@media(max-width: 1000px){
    .lecture_day .modle_min{ padding: 100px 0;}
    .lecture_day .list{ margin: 50px 0 0 0;}
    .lecture_day .wrap{ flex-direction: column; grid-gap: 26px; padding: 40px 0;}
    .lecture_day .wrap .fl{ display: flex; align-items: center; grid-gap: 20px; flex: 0 0 auto; width: 100%;}
    .lecture_day .wrap .fl .img{ flex: 0 0 130px; width: 130px;}
    .lecture_day .wrap .fl .img:before{ padding: 0 0 100% 0;}
    .lecture_day .wrap .fl .name{ margin: 0; text-align: left;}
    .lecture_day .wrap .fr{ padding-top: 0; width: 100%;}
    .lecture_day .wrap .fr .w1 .t1{ font-size: 26px;}
    .lecture_day .wrap .fr .w1 .t2, .lecture_day .wrap .fr .w2 .t2{ font-size: 16px;}
    .lecture_day .wrap .fr .w2, .lecture_day .wrap .fr .w3{ margin-top: 34px;}
    .lecture_day .wrap .fr .w2 .t1, .lecture_day .wrap .fr .w3 .t1{ font-size: 20px;}
}
@media(max-width: 767px){
    .lecture_day .modle_min{ padding: 5rem 0;}
    .lecture_day .list{ margin: 3rem 0 0 0;}
    .lecture_day .wrap{ grid-gap: 1.8rem; padding: 2.6rem 0;}
    .lecture_day .wrap .fl{ grid-gap: 1.4rem;}
    .lecture_day .wrap .fl .img{ flex: 0 0 8.5rem; width: 8.5rem; border-radius: 1.2rem;}
    .lecture_day .wrap .fl .name p{ font-size: 1.8rem;}
    .lecture_day .wrap .fl .name span{ margin: .6rem 0 0 0; font-size: 1.1rem;}
    .lecture_day .wrap .fr .w1 .t1{ font-size: 2rem;}
    .lecture_day .wrap .fr .w1 .t2{ margin: 1.4rem 0 0 0; font-size: 1.3rem;}
    .lecture_day .wrap .fr .btn{ margin: 2rem 0 0 0; padding: 0 1.8rem; height: 3.8rem;}
    .lecture_day .wrap .fr .btn p{ font-size: 1.2rem;}
    .lecture_day .wrap .fr .btn svg{ width: 1.5rem; height: 1.5rem;}
    .lecture_day .wrap .fr .open.on{ margin: 2rem 0 0 0;}
    .lecture_day .wrap .fr .w2, .lecture_day .wrap .fr .w3{ margin-top: 2.6rem;}
    .lecture_day .wrap .fr .w2 .t1, .lecture_day .wrap .fr .w3 .t1{ font-size: 1.6rem;}
    .lecture_day .wrap .fr .w2 .t2{ margin: 1.2rem 0 0 0; font-size: 1.25rem;}
    .lecture_day .wrap .fr .w3 .t2{ gap: .8rem; margin: 1.2rem 0 0 0;}
    .lecture_day .wrap .fr .w3 .t2 p{ padding-left: 1.2rem; font-size: 1.2rem;}
}

































.light_info{ position: relative; background: #FFF;}
.light_info .modle_min{ padding: 350px 0 160px 0;}
.light_info .table{ overflow: hidden; margin: 60px 0 0 0; border-radius: 15px; border: 1px solid rgba(0 0 0/10%);}
.light_info .thead{ display: grid; grid-template-columns: 220px 1fr 1fr; background: #0A0A0A;}
.light_info .thead > div{ padding: 22px 30px; text-align: center; font-size: 18px; font-weight: 700; color: #FFF;}
.light_info .row{ display: grid; grid-template-columns: 220px 1fr; border-top: 1px solid rgba(0 0 0/10%);}
.light_info .row .day{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 24px 20px; border-right: 1px solid rgba(0 0 0/10%); background: #f9f9f9; line-height: 1.3; text-align: center; font-size: 20px; font-weight: 700; color: #0A0A0A;}
.light_info .row .day em{ margin: 4px 0 0 0; font-size: 16px; font-style: normal; font-weight: 500; color: rgba(0 0 0/55%);}
.light_info .row .items{ display: grid;}
.light_info .row .item{ display: grid; grid-template-columns: 1fr 1fr; align-items: center; transition: background .3s;}
.light_info .row .item + .item{ border-top: 1px solid rgba(0 0 0/10%);}
.light_info .row .item .tit{ padding: 24px 30px; line-height: 1.4; text-align: center; font-size: 19px; font-weight: 700; color: #0A0A0A;}
.light_info .row .item .time{ padding: 24px 30px; border-left: 1px solid rgba(0 0 0/10%); line-height: 1.4; text-align: center; font-size: 18px; font-weight: 500; color: rgba(0 0 0/70%);}
.light_info .row .item em{ padding: 0 0 0 4px; font-size: 16px; font-style: normal; font-weight: 500; color: rgba(0 0 0/50%);}
.light_info .row .item.on{ background: rgba(242 71 250/6%);}
.light_info .row .item.on .tit{ color: #F247FA;}
.light_info .row .item.on .time{ color: rgba(242 71 250/85%);}
.light_info .row .item.on em{ color: rgba(242 71 250/65%);}
.light_info .note{ margin: 20px 0 0 0; text-align: right; font-size: 16px; font-weight: 500; color: rgba(0 0 0/55%);}
@media(max-width: 1560px){
    .light_info .modle_min{ padding: 350px 0 130px 0;}
    .light_info .table{ margin: 50px 0 0 0;}
    .light_info .thead{ grid-template-columns: 190px 1fr 1fr;}
    .light_info .thead > div{ padding: 20px 24px; font-size: 17px;}
    .light_info .row{ grid-template-columns: 190px 1fr;}
    .light_info .row .day{ font-size: 19px;}
    .light_info .row .item .tit{ padding: 22px 24px; font-size: 18px;}
    .light_info .row .item .time{ padding: 22px 24px; font-size: 17px;}
}
@media(max-width: 1200px){
    .light_info .modle_min{ padding: 300px 0 110px 0;}
    .light_info .thead{ grid-template-columns: 160px 1fr 1fr;}
    .light_info .thead > div{ padding: 18px 20px; font-size: 16px;}
    .light_info .row{ grid-template-columns: 160px 1fr;}
    .light_info .row .day{ padding: 20px 16px; font-size: 18px;}
    .light_info .row .day em{ font-size: 15px;}
    .light_info .row .item .tit{ padding: 20px 20px; font-size: 17px;}
    .light_info .row .item .time{ padding: 20px 20px; font-size: 16px;}
    .light_info .row .item em{ font-size: 15px;}
    .light_info .note{ font-size: 15px;}
}
@media(max-width: 1000px){
    .light_info .modle_min{ padding: 260px 0 100px 0;}
    .light_info .table{ margin: 40px 0 0 0;}
    .light_info .thead{ grid-template-columns: 130px 1fr 1fr;}
    .light_info .row{ grid-template-columns: 130px 1fr;}
    .light_info .row .day{ font-size: 17px;}
}
@media(max-width: 767px){
    .light_info .modle_min{ padding: calc(8rem + 5rem) 0 5rem 0;}
    .light_info .table{ margin: 2.6rem 0 0 0; border-radius: 1rem;}
    .light_info .thead{ display: none;}
    .light_info .row{ grid-template-columns: 1fr;}
    .light_info .row .day{ flex-direction: row; justify-content: flex-start; grid-gap: .6rem; padding: 1.1rem 1.6rem; border-right: 0; border-bottom: 1px solid rgba(0 0 0/10%); font-size: 1.4rem;}
    .light_info .row .day em{ margin: 0; font-size: 1.25rem;}
    .light_info .row .item{ grid-template-columns: 1fr;}
    .light_info .row .item .tit{ padding: 1.4rem 1.6rem .4rem 1.6rem; text-align: left; font-size: 1.45rem;}
    .light_info .row .item .time{ padding: 0 1.6rem 1.4rem 1.6rem; border-left: 0; text-align: left; font-size: 1.3rem;}
    .light_info .row .item em{ font-size: 1.2rem;}
    .light_info .note{ margin: 1.4rem 0 0 0; font-size: 1.2rem;}
}


.light_show{ overflow: hidden; position: relative; isolation: isolate; background: #000;}
.light_show .modle_min{ padding: 160px 0;}
.light_show .inner{ display: flex; align-items: center; grid-gap: 80px; margin: 80px 0 0 0;}
.light_show .inner .fl{ flex: 0 0 38%;}
.light_show .inner .fl .label{ display: inline-flex; align-items: center; padding: 9px 22px; border-radius: 30px; background: #F247FA; font-size: 15px; font-weight: 700; color: #FFF;}
.light_show .inner .fl .lead{ margin: 24px 0 0 0; font-family: "Chonburi", sans-serif; line-height: 1.2; font-size: 44px; letter-spacing: -1px; color: #FFF;}
.light_show .inner .fl .sub{ margin: 14px 0 0 0; line-height: 1.4; font-size: 24px; font-weight: 700; letter-spacing: -.5px; color: rgba(255 255 255/85%);}
.light_show .inner .fl .txt{ margin: 34px 0 0 0; padding: 34px 0 0 0; border-top: 1px solid rgba(255 255 255/20%); line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(255 255 255/70%); word-break: keep-all;}
.light_show .inner .fr{ flex: 1;}
.light_show .inner .fr .img{ overflow: hidden; position: relative; border-radius: 15px;}
.light_show .inner .fr .img:before{ content: ""; display: block; padding: 0 0 66% 0;}
.light_show .inner .fr .img img{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
@media(max-width: 1560px){
    .light_show .modle_min{ padding: 130px 0;}
    .light_show .inner{ grid-gap: 60px; margin: 70px 0 0 0;}
    .light_show .inner .fl .lead{ font-size: 38px;}
    .light_show .inner .fl .sub{ font-size: 22px;}
    .light_show .inner .fl .txt{ font-size: 17px;}
}
@media(max-width: 1200px){
    .light_show .modle_min{ padding: 110px 0;}
    .light_show .inner{ grid-gap: 40px; margin: 60px 0 0 0;}
    .light_show .inner .fl{ flex: 0 0 42%;}
    .light_show .inner .fl .lead{ font-size: 32px;}
    .light_show .inner .fl .sub{ font-size: 20px;}
    .light_show .inner .fl .txt{ margin: 28px 0 0 0; padding: 28px 0 0 0; font-size: 16px;}
}
@media(max-width: 1000px){
    .light_show .modle_min{ padding: 100px 0;}
    .light_show .inner{ flex-direction: column; align-items: stretch; grid-gap: 34px; margin: 50px 0 0 0;}
    .light_show .inner .fl{ flex: 1;}
    .light_show .inner .fl .lead{ font-size: 30px;}
}
@media(max-width: 767px){
    .light_show .modle_min{ padding: 5rem 0;}
    .light_show .inner{ grid-gap: 2.6rem; margin: 2.6rem 0 0 0;}
    .light_show .inner .fl .label{ padding: .7rem 1.4rem; font-size: 1.15rem;}
    .light_show .inner .fl .lead{ margin: 1.6rem 0 0 0; font-size: 2.2rem;}
    .light_show .inner .fl .sub{ margin: 1rem 0 0 0; font-size: 1.5rem;}
    .light_show .inner .fl .txt{ margin: 2rem 0 0 0; padding: 2rem 0 0 0; font-size: 1.35rem;}
    .light_show .inner .fr .img{ border-radius: 1rem;}
}


.light_off{ overflow: hidden; position: relative; background: #F8F9FC;}
.light_off .modle_min{ padding: 160px 0;}
.light_off .inner{ display: flex; align-items: center; grid-gap: 80px; margin: 80px 0 0 0;}
.light_off .inner .fl{ flex: 1;}
.light_off .inner .fl .logo{ display: block; width: 180px; height: auto;}
.light_off .inner .fl .slogan{ margin: 34px 0 0 0; line-height: 1.3; font-size: 30px; font-weight: 700; letter-spacing: -1px; color: #0A0A0A;}
.light_off .inner .fl .text{ display: grid; grid-gap: 20px; margin: 34px 0 0 0; padding: 34px 0 0 0; border-top: 1px solid rgba(0 0 0/10%);}
.light_off .inner .fl .text p{ line-height: 1.6; font-size: 18px; font-weight: 400; color: rgba(0 0 0/80%); word-break: keep-all;}
.light_off .inner .fr{ flex: 0 0 52%;}
.light_off .inner .fr .img{ overflow: hidden; position: relative; border-radius: 15px;}
.light_off .inner .fr .img:before{ content: ""; display: block; padding: 0 0 66% 0;}
.light_off .inner .fr .img img{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
@media(max-width: 1560px){
    .light_off .modle_min{ padding: 130px 0;}
    .light_off .inner{ grid-gap: 60px; margin: 70px 0 0 0;}
    .light_off .inner .fl .logo{ width: 160px;}
    .light_off .inner .fl .slogan{ font-size: 26px;}
    .light_off .inner .fl .text p{ font-size: 17px;}
}
@media(max-width: 1200px){
    .light_off .modle_min{ padding: 110px 0;}
    .light_off .inner{ grid-gap: 40px; margin: 60px 0 0 0;}
    .light_off .inner .fl .logo{ width: 140px;}
    .light_off .inner .fl .slogan{ margin: 28px 0 0 0; font-size: 24px;}
    .light_off .inner .fl .text{ grid-gap: 16px; margin: 28px 0 0 0; padding: 28px 0 0 0;}
    .light_off .inner .fl .text p{ font-size: 16px;}
}
@media(max-width: 1000px){
    .light_off .modle_min{ padding: 100px 0;}
    .light_off .inner{ flex-direction: column; align-items: stretch; grid-gap: 34px; margin: 50px 0 0 0;}
    .light_off .inner .fr{ flex: 1;}
}
@media(max-width: 767px){
    .light_off .modle_min{ padding: 5rem 0;}
    .light_off .inner{ grid-gap: 2.6rem; margin: 2.6rem 0 0 0;}
    .light_off .inner .fl .logo{ width: 10rem;}
    .light_off .inner .fl .slogan{ margin: 2rem 0 0 0; font-size: 1.8rem;}
    .light_off .inner .fl .text{ grid-gap: 1.2rem; margin: 2rem 0 0 0; padding: 2rem 0 0 0;}
    .light_off .inner .fl .text p{ font-size: 1.35rem;}
    .light_off .inner .fr .img{ border-radius: 1rem;}
}


.reserve_show{ position: relative; background: #FFF;}
.reserve_show .modle_min{ padding: 100px 0 160px 0; max-width: 900px;}
.reserve_show .head .t1, .reserve_time .head .t1, .reserve_auth .head .t1, .reserve_info .head .t1, .reserve_agree .head .t1{ position: relative; padding-left: 20px; line-height: 1.2; font-size: 34px; font-weight: 700; letter-spacing: -1px; color: #0A0A0A;}
.reserve_show .head .t1:before, .reserve_time .head .t1:before, .reserve_auth .head .t1:before, .reserve_info .head .t1:before, .reserve_agree .head .t1:before{ content: ""; position: absolute; top: .45em; left: 0; width: .26em; height: .26em; border-radius: 50%; background: #F247FA; box-shadow: 0 0 0 .16em rgba(242 71 250/16%), 0 0 .9em rgba(242 71 250/85%); animation: reserve_dot 2.6s ease-in-out infinite alternate;}
@keyframes reserve_dot{ 0%{ box-shadow: 0 0 0 .14em rgba(242 71 250/12%), 0 0 .6em rgba(242 71 250/60%);} 100%{ box-shadow: 0 0 0 .3em rgba(242 71 250/0%), 0 0 1.2em rgba(242 71 250/95%);}}
.reserve_show .head .t2, .reserve_time .head .t2{ margin: 16px 0 0 0; line-height: 1.5; font-size: 18px; font-weight: 400; color: rgba(0 0 0/55%);}
.reserve_show .list{ display: grid; gap: 20px; margin: 50px 0 0 0;}
.reserve_show .list .wrap{ display: flex; align-items: center; grid-gap: 26px; padding: 24px 30px; border-radius: 30px; border: 1px solid rgba(0 0 0/8%); background: #f9f9f9; cursor: pointer; transition: all .3s;}
.reserve_show .list .wrap .thumb{ flex: 0 0 90px; display: flex; justify-content: center; align-items: center; overflow: hidden; height: 90px; border-radius: 20px; background-size: cover; background-position: center;}
.reserve_show .list .wrap .thumb span{ padding: 0 6px; text-align: center; line-height: 1.2; font-size: 16px; font-weight: 700; letter-spacing: 0; color: #FFF;}
.reserve_show .list .wrap .info{ flex: 1;}
.reserve_show .list .wrap .info .t1{ line-height: 1.3; font-size: 16px; font-weight: 700; color: #F247FA;}
.reserve_show .list .wrap .info .t2{ margin: 0 0 0 0; line-height: 1.2; font-size: 24px; font-weight: 700; letter-spacing: -.5px; color: #0A0A0A; word-break: keep-all;}
.reserve_show .list .wrap .info .t3{ margin: 12px 0 0 0; line-height: 1.5; font-size: 15px; font-weight: 400; color: rgba(0 0 0/55%); word-break: keep-all;}
.reserve_show .list .wrap .arrow{ flex: 0 0 24px;}
.reserve_show .list .wrap .arrow svg{ display: block; width: 24px; height: 24px; color: rgba(0 0 0/25%); transition: all .3s;}
.reserve_show .list .wrap:hover{ border-color: #F247FA; background: #FFF; box-shadow: 0 12px 30px rgba(0 0 0/8%);}
.reserve_show .list .wrap:hover .arrow svg{ color: #F247FA; transform: translate(4px,0);}
@media(max-width: 1560px){
    .reserve_show .modle_min{ padding: 120px 0 130px 0;}
    .reserve_show .head .t1, .reserve_time .head .t1, .reserve_auth .head .t1, .reserve_info .head .t1, .reserve_agree .head .t1{ font-size: 30px;}
    .reserve_show .head .t2, .reserve_time .head .t2{ font-size: 17px;}
    .reserve_show .list{ margin: 44px 0 0 0;}
    .reserve_show .list .wrap .info .t2{ font-size: 22px;}
}
@media(max-width: 1200px){
    .reserve_show .modle_min{ padding: 100px 0 110px 0;}
    .reserve_show .head .t1, .reserve_time .head .t1, .reserve_auth .head .t1, .reserve_info .head .t1, .reserve_agree .head .t1{ font-size: 27px;}
    .reserve_show .head .t2, .reserve_time .head .t2{ margin: 14px 0 0 0; font-size: 16px;}
    .reserve_show .list{ gap: 16px; margin: 38px 0 0 0;}
    .reserve_show .list .wrap{ grid-gap: 22px; padding: 22px 24px;}
    .reserve_show .list .wrap .thumb{ flex: 0 0 80px; height: 80px;}
    .reserve_show .list .wrap .thumb span{ font-size: 15px;}
    .reserve_show .list .wrap .info .t1{ font-size: 15px;}
    .reserve_show .list .wrap .info .t2{ font-size: 20px;}
    .reserve_show .list .wrap .info .t3{ margin: 10px 0 0 0; font-size: 16px;}
}
@media(max-width: 1000px){
    .reserve_show .modle_min{ padding: 90px 0 100px 0;}
    .reserve_show .head .t1, .reserve_time .head .t1, .reserve_auth .head .t1, .reserve_info .head .t1, .reserve_agree .head .t1{ font-size: 25px;}
    .reserve_show .list .wrap .thumb{ flex: 0 0 72px; height: 72px; border-radius: 10px;}
    .reserve_show .list .wrap .thumb span{ font-size: 14px;}
    .reserve_show .list .wrap .info .t2{ font-size: 19px;}
    .reserve_show .list .wrap .info .t3{ font-size: 15px;}
}
@media(max-width: 767px){
    .reserve_show .modle_min{ padding: 3rem 0 5rem 0;}
    .reserve_show .head .t1, .reserve_time .head .t1, .reserve_auth .head .t1, .reserve_info .head .t1, .reserve_agree .head .t1{ font-size: 1.9rem;}
    .reserve_show .head .t2, .reserve_time .head .t2{ margin: 1rem 0 0 0; font-size: 1.25rem;}
    .reserve_show .list{ gap: 1.2rem; margin: 2.6rem 0 0 0;}
    .reserve_show .list .wrap{ grid-gap: 1.4rem; padding: 1.6rem; border-radius: 1rem;}
    .reserve_show .list .wrap .thumb{ flex: 0 0 5.4rem; height: 5.4rem; border-radius: .8rem;}
    .reserve_show .list .wrap .thumb span{ font-size: 1.1rem;}
    .reserve_show .list .wrap .info .t1{ font-size: 1.15rem;}
    .reserve_show .list .wrap .info .t2{ margin: .7rem 0 0 0; font-size: 1.5rem;}
    .reserve_show .list .wrap .info .t3{ margin: .8rem 0 0 0; font-size: 1.2rem;}
    .reserve_show .list .wrap .arrow{ flex: 0 0 1.6rem;}
    .reserve_show .list .wrap .arrow svg{ width: 1.6rem; height: 1.6rem;}
}


.reserve_time{ position: relative; background: #FFF;}
.reserve_time .modle_min{ padding: 100px 0 160px 0; max-width: 900px;}
.reserve_time .head{ display: flex; justify-content: space-between; align-items: center; grid-gap: 20px;}
.reserve_time .head .back{ flex: 0 0 auto; display: inline-flex; align-items: center; grid-gap: 6px; padding: 0 15px; height: 36px; border-radius: 30px; border: 1px solid rgba(0 0 0/12%); cursor: pointer; transition: all .3s;}
.reserve_time .head .back svg{ display: block; width: 18px; height: 18px; color: rgba(0 0 0/45%); transition: all .3s;}
.reserve_time .head .back p{ font-size: 15px; font-weight: 500; color: rgba(0 0 0/55%); white-space: nowrap; transition: all .3s;}
.reserve_time .head .back:hover{ border-color: #F247FA; background: rgba(242 71 250/4%);}
.reserve_time .head .back:hover svg, .reserve_time .head .back:hover p{ color: #F247FA;}
.reserve_time .show{ margin: 26px 0 0 0;}
.reserve_time .show .t1{ font-size: 16px; font-weight: 700; color: #F247FA;}
.reserve_time .show .t2{ margin: 5px 0 0 0; font-size: 24px; font-weight: 700; letter-spacing: -.5px; color: #0A0A0A; word-break: keep-all;}
.reserve_time .list{ display: grid; gap: 16px; margin: 34px 0 0 0;}
.reserve_time .list .wrap{ padding: 24px 28px; border-radius: 15px; border: 1px solid rgba(0 0 0/8%); background: #f9f9f9; cursor: pointer; transition: all .3s;}
.reserve_time .list .wrap .top{ display: flex; justify-content: space-between; align-items: flex-start; grid-gap: 16px;}
.reserve_time .list .wrap .date{ line-height: 1.3; font-size: 20px; font-weight: 700; color: #0A0A0A;}
.reserve_time .list .wrap .time{ margin: 10px 0 0 0; line-height: 1.3; font-size: 16px; font-weight: 400; color: rgba(0 0 0/50%);}
.reserve_time .list .wrap .state{ flex: 0 0 auto; padding: 9px 16px; border-radius: 30px; font-size: 14px; font-weight: 700; white-space: nowrap;}
.reserve_time .list .wrap .bar{ overflow: hidden; margin: 20px 0 0 0; height: 6px; border-radius: 6px; background: rgba(0 0 0/8%);}
.reserve_time .list .wrap .bar span{ display: block; height: 100%; border-radius: 6px; background: #00B85A; transition: width .6s cubic-bezier(.22,.61,.36,1);}
.reserve_time .list .wrap .seat{ margin: 14px 0 0 0; font-size: 15px; font-weight: 400; color: rgba(0 0 0/45%);}
.reserve_time .list .wrap.ok .state{ background: rgba(0 184 90/12%); color: #00A050;}
.reserve_time .list .wrap.soon .state{ background: rgba(245 158 11/14%); color: #D97706;}
.reserve_time .list .wrap.soon .bar span{ background: #F59E0B;}
.reserve_time .list .wrap.end{ background: #FCFCFC; cursor: default;}
.reserve_time .list .wrap.end .date{ color: rgba(0 0 0/28%);}
.reserve_time .list .wrap.end .time, .reserve_time .list .wrap.end .seat{ color: rgba(0 0 0/25%);}
.reserve_time .list .wrap.end .state{ background: rgba(0 0 0/5%); color: rgba(0 0 0/30%);}
.reserve_time .list .wrap.end .bar span{ background: rgba(0 0 0/10%);}
.reserve_time .list .wrap:not(.end):hover{ border-color: #F247FA; background: #FFF; box-shadow: 0 12px 30px rgba(0 0 0/8%);}
@media(max-width: 1560px){
    .reserve_time .modle_min{ padding: 90px 0 130px 0;}
    .reserve_time .show .t2{ font-size: 22px;}
    .reserve_time .list .wrap .date{ font-size: 19px;}
}
@media(max-width: 1200px){
    .reserve_time .modle_min{ padding: 80px 0 110px 0;}
    .reserve_time .head .back{ padding: 0 16px; height: 40px;}
    .reserve_time .head .back p{ font-size: 14px;}
    .reserve_time .show{ margin: 22px 0 0 0;}
    .reserve_time .show .t1{ font-size: 15px;}
    .reserve_time .show .t2{ font-size: 20px;}
    .reserve_time .list{ gap: 14px; margin: 30px 0 0 0;}
    .reserve_time .list .wrap{ padding: 22px 24px;}
    .reserve_time .list .wrap .date{ font-size: 18px;}
    .reserve_time .list .wrap .time{ font-size: 15px;}
    .reserve_time .list .wrap .state{ padding: 8px 14px; font-size: 13px;}
    .reserve_time .list .wrap .seat{ font-size: 14px;}
}
@media(max-width: 1000px){
    .reserve_time .modle_min{ padding: 70px 0 100px 0;}
    .reserve_time .show .t2{ font-size: 19px;}
    .reserve_time .list .wrap .date{ font-size: 17px;}
}
@media(max-width: 767px){
    .reserve_time .modle_min{ padding: 3rem 0 5rem 0;}
    .reserve_time .head{ align-items: flex-start; grid-gap: 1rem;}
    .reserve_time .head .back{ grid-gap: .3rem; padding: 0 1rem; height: 2.4rem; border-radius: 3rem;}
    .reserve_time .head .back svg{ width: 1.3rem; height: 1.3rem;}
    .reserve_time .head .back p{ font-size: 1.1rem;}
    .reserve_time .show{ margin: 1.8rem 0 0 0;}
    .reserve_time .show .t1{ font-size: 1.15rem;}
    .reserve_time .show .t2{ margin: .7rem 0 0 0; font-size: 1.5rem;}
    .reserve_time .list{ gap: 1.1rem; margin: 2.4rem 0 0 0;}
    .reserve_time .list .wrap{ padding: 1.6rem; border-radius: 1rem;}
    .reserve_time .list .wrap .top{ grid-gap: 1rem;}
    .reserve_time .list .wrap .date{ font-size: 1.5rem;}
    .reserve_time .list .wrap .time{ margin: .7rem 0 0 0; font-size: 1.2rem;}
    .reserve_time .list .wrap .state{ padding: .6rem 1.1rem; border-radius: 3rem; font-size: 1.05rem;}
    .reserve_time .list .wrap .bar{ margin: 1.4rem 0 0 0; height: .5rem;}
    .reserve_time .list .wrap .seat{ margin: 1rem 0 0 0; font-size: 1.15rem;}
}


.reserve_auth{ position: relative; background: #FFF;}
.reserve_auth .modle_min{ padding: 100px 0 160px 0; max-width: 900px;}
.reserve_auth .head{ display: flex; justify-content: space-between; align-items: center; grid-gap: 20px;}
.reserve_auth .head .back{ flex: 0 0 auto; display: inline-flex; align-items: center; grid-gap: 6px; padding: 0 15px; height: 36px; border-radius: 30px; border: 1px solid rgba(0 0 0/12%); cursor: pointer; transition: all .3s;}
.reserve_auth .head .back svg{ display: block; width: 18px; height: 18px; color: rgba(0 0 0/45%); transition: all .3s;}
.reserve_auth .head .back p{ font-size: 15px; font-weight: 500; color: rgba(0 0 0/55%); white-space: nowrap; transition: all .3s;}
.reserve_auth .head .back:hover{ border-color: #F247FA; background: rgba(242 71 250/4%);}
.reserve_auth .head .back:hover svg, .reserve_auth .head .back:hover p{ color: #F247FA;}
.reserve_auth .desc{ margin: 16px 0 0 0; line-height: 1.5; font-size: 18px; font-weight: 400; color: rgba(0 0 0/55%); word-break: keep-all;}
.reserve_auth .pick{ display: flex; align-items: center; grid-gap: 14px; margin: 40px 0 0 0; padding: 26px 30px; border-radius: 15px; background: #f6f6f6;}
.reserve_auth .pick .dot{ flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: #00B85A; box-shadow: 0 0 0 5px rgba(0 184 90/14%);}
.reserve_auth .pick p{ line-height: 1.4; font-size: 20px; font-weight: 500; color: rgba(0 0 0/70%);}
.reserve_auth .pick p b{ font-weight: 700; color: #0A0A0A;}
.reserve_auth .btn{ display: flex; justify-content: center; align-items: center; margin: 24px 0 0 0; height: 76px; border-radius: 20px; background: #0A0A0A; font-size: 22px; font-weight: 700; color: #FFF; cursor: pointer; transition: all .3s;}
.reserve_auth .btn:hover{ background: #F247FA; box-shadow: 0 14px 34px rgba(242 71 250/30%);}
.reserve_auth .note{ display: flex; align-items: flex-start; grid-gap: 14px; margin: 24px 0 0 0; padding: 24px 28px; border-radius: 15px; border: 1px solid rgba(242 71 250/50%);}
.reserve_auth .note .ico{ flex: 0 0 auto; display: block; margin: 1px 0 0 0; width: 20px; height: 20px; color: #F247FA;}
.reserve_auth .note .txt{ display: grid; grid-gap: 10px;}
.reserve_auth .note .txt p{ position: relative; padding-left: 13px; line-height: 1.6; font-size: 15px; font-weight: 400; color: rgba(0 0 0/50%); word-break: keep-all;}
.reserve_auth .note .txt p:before{ content: ""; position: absolute; top: .68em; left: 0; width: 4px; height: 4px; border-radius: 50%; background: rgba(242 71 250/45%);}
@media(max-width: 1560px){
    .reserve_auth .modle_min{ padding: 90px 0 130px 0;}
    .reserve_auth .desc{ font-size: 17px;}
    .reserve_auth .pick p{ font-size: 19px;}
    .reserve_auth .btn{ height: 70px; font-size: 20px;}
}
@media(max-width: 1200px){
    .reserve_auth .modle_min{ padding: 80px 0 110px 0;}
    .reserve_auth .head .back{ padding: 0 16px; height: 40px;}
    .reserve_auth .head .back p{ font-size: 14px;}
    .reserve_auth .desc{ margin: 14px 0 0 0; font-size: 16px;}
    .reserve_auth .pick{ margin: 34px 0 0 0; padding: 22px 24px;}
    .reserve_auth .pick p{ font-size: 17px;}
    .reserve_auth .btn{ height: 64px; border-radius: 16px; font-size: 18px;}
    .reserve_auth .note{ grid-gap: 12px; margin: 20px 0 0 0; padding: 20px 22px;}
    .reserve_auth .note .ico{ width: 18px; height: 18px;}
    .reserve_auth .note .txt{ grid-gap: 8px;}
    .reserve_auth .note .txt p{ font-size: 14px;}
}
@media(max-width: 1000px){
    .reserve_auth .modle_min{ padding: 70px 0 100px 0;}
    .reserve_auth .pick p{ font-size: 16px;}
    .reserve_auth .btn{ height: 60px; font-size: 17px;}
}
@media(max-width: 767px){
    .reserve_auth .modle_min{ padding: 3rem 0 5rem 0;}
    .reserve_auth .head{ align-items: flex-start; grid-gap: 1rem;}
    .reserve_auth .head .back{ grid-gap: .3rem; padding: 0 1rem; height: 2.4rem; border-radius: 3rem;}
    .reserve_auth .head .back svg{ width: 1.3rem; height: 1.3rem;}
    .reserve_auth .head .back p{ font-size: 1.1rem;}
    .reserve_auth .desc{ margin: 1rem 0 0 0; font-size: 1.25rem;}
    .reserve_auth .pick{ grid-gap: 1rem; margin: 2.4rem 0 0 0; padding: 1.6rem; border-radius: 1rem;}
    .reserve_auth .pick .dot{ width: .8rem; height: .8rem; box-shadow: 0 0 0 .4rem rgba(0 184 90/14%);}
    .reserve_auth .pick p{ font-size: 1.35rem;}
    .reserve_auth .btn{ margin: 1.4rem 0 0 0; height: 4.6rem; border-radius: 1.2rem; font-size: 1.5rem;}
    .reserve_auth .note{ grid-gap: 1rem; margin: 1.6rem 0 0 0; padding: 1.6rem; border-radius: 1rem;}
    .reserve_auth .note .ico{ margin: .1rem 0 0 0; width: 1.5rem; height: 1.5rem;}
    .reserve_auth .note .txt{ grid-gap: .8rem;}
    .reserve_auth .note .txt p{ padding-left: 1rem; font-size: 1.15rem;}
    .reserve_auth .note .txt p:before{ width: .35rem; height: .35rem;}
}


.reserve_info, .reserve_agree{ position: relative; background: #FFF;}
.reserve_info .modle_min, .reserve_agree .modle_min{ padding: 100px 0 160px 0; max-width: 900px;}
.reserve_info .head, .reserve_agree .head{ display: flex; justify-content: space-between; align-items: center; grid-gap: 20px;}
.reserve_info .head .back, .reserve_agree .head .back{ flex: 0 0 auto; display: inline-flex; align-items: center; grid-gap: 6px; padding: 0 15px; height: 36px; border-radius: 30px; border: 1px solid rgba(0 0 0/12%); cursor: pointer; transition: all .3s;}
.reserve_info .head .back svg, .reserve_agree .head .back svg{ display: block; width: 18px; height: 18px; color: rgba(0 0 0/45%); transition: all .3s;}
.reserve_info .head .back p, .reserve_agree .head .back p{ font-size: 15px; font-weight: 500; color: rgba(0 0 0/55%); white-space: nowrap; transition: all .3s;}
.reserve_info .head .back:hover, .reserve_agree .head .back:hover{ border-color: #F247FA; background: rgba(242 71 250/4%);}
.reserve_info .head .back:hover svg, .reserve_info .head .back:hover p, .reserve_agree .head .back:hover svg, .reserve_agree .head .back:hover p{ color: #F247FA;}
.reserve_info .done{ display: flex; align-items: center; grid-gap: 12px; margin: 34px 0 0 0; padding: 22px 28px; border-radius: 15px; border: 1px solid rgba(0 184 90/25%); background: rgba(0 184 90/7%);}
.reserve_info .done svg{ flex: 0 0 auto; display: block; width: 22px; height: 22px; color: #00A050;}
.reserve_info .done p{ line-height: 1.4; font-size: 18px; font-weight: 500; color: #00934A;}
.reserve_info .done p b{ font-weight: 700;}
.reserve_info .field{ margin: 30px 0 0 0;}
.reserve_info .field .label{ font-size: 16px; font-weight: 700; color: #0A0A0A;}
.reserve_info .field input{ display: block; margin: 12px 0 0 0; padding: 0 22px; width: 100%; height: 64px; border-radius: 15px; border: 1px solid rgba(0 0 0/12%); background: #FFF; font-size: 17px; font-weight: 400; color: #0A0A0A; transition: all .3s;}
.reserve_info .field input::placeholder{ color: rgba(0 0 0/32%);}
.reserve_info .field input:focus{ border-color: #F247FA; box-shadow: 0 0 0 4px rgba(242 71 250/10%);}
.reserve_info .check, .reserve_agree .check{ display: flex; justify-content: space-between; align-items: center; grid-gap: 20px; margin: 16px 0 0 0; padding: 24px 28px; border-radius: 15px; border: 1px solid rgba(0 0 0/8%); background: #f9f9f9; transition: all .3s;}
.reserve_info .check .in, .reserve_agree .check .in{ flex: 1; display: flex; align-items: flex-start; grid-gap: 16px; cursor: pointer;}
.reserve_info .check .terms, .reserve_agree .check .terms{ flex: 0 0 auto; display: inline-flex; align-items: center; padding: 0 20px; height: 44px; border-radius: 30px; border: 1px solid rgba(0 0 0/14%); background: #FFF; font-size: 15px; font-weight: 500; color: rgba(0 0 0/55%); white-space: nowrap; cursor: pointer; transition: all .3s;}
.reserve_info .check .terms:hover, .reserve_agree .check .terms:hover{ border-color: #F247FA; color: #F247FA; background: rgba(242 71 250/4%);}
.reserve_info .check input, .reserve_agree .check input{ position: absolute; width: 1px; height: 1px; opacity: 0;}
.reserve_info .check .mark, .reserve_agree .check .mark{ flex: 0 0 auto; display: flex; justify-content: center; align-items: center; margin: 1px 0 0 0; width: 24px; height: 24px; border-radius: 7px; border: 2px solid rgba(0 0 0/18%); background: #FFF; transition: all .25s;}
.reserve_info .check .mark:after, .reserve_agree .check .mark:after{ content: ""; display: block; width: 5px; height: 10px; border: solid #FFF; border-width: 0 2.5px 2.5px 0; opacity: 0; transform: translate(0,-1px) rotate(45deg) scale(.6); transition: all .25s;}
.reserve_info .check .txt, .reserve_agree .check .txt{ display: block;}
.reserve_info .check .txt .t1, .reserve_agree .check .txt .t1{ display: block; line-height: 1.4; font-size: 18px; font-weight: 700; color: #0A0A0A;}
.reserve_info .check .txt .t1 em, .reserve_agree .check .txt .t1 em{ font-style: normal; font-weight: 700; color: #F247FA;}
.reserve_info .check .txt .t2, .reserve_agree .check .txt .t2{ display: block; margin: 10px 0 0 0; line-height: 1.5; font-size: 16px; font-weight: 400; color: rgba(0 0 0/45%); word-break: keep-all;}
.reserve_info .check:hover, .reserve_agree .check:hover{ border-color: rgba(242 71 250/40%); background: #FFF;}
.reserve_info .check input:checked ~ .mark, .reserve_agree .check input:checked ~ .mark{ border-color: #F247FA; background: #F247FA;}
.reserve_info .check input:checked ~ .mark:after, .reserve_agree .check input:checked ~ .mark:after{ opacity: 1; transform: translate(0,-1px) rotate(45deg) scale(1);}
.reserve_info .check input:checked ~ .txt .t1, .reserve_agree .check input:checked ~ .txt .t1{ color: #F247FA;}
.reserve_info .btn, .reserve_agree .btn{ display: flex; justify-content: center; align-items: center; margin: 30px 0 0 0; height: 76px; border-radius: 20px; background: #EFEFEF; font-size: 22px; font-weight: 700; color: rgba(0 0 0/28%); cursor: default; transition: all .3s;}
.reserve_info .btn.on, .reserve_agree .btn.on{ background: #0A0A0A; color: #FFF; cursor: pointer;}
.reserve_info .btn.on:hover, .reserve_agree .btn.on:hover{ background: #F247FA; box-shadow: 0 14px 34px rgba(242 71 250/30%);}
@media(max-width: 1560px){
    .reserve_info .modle_min, .reserve_agree .modle_min{ padding: 90px 0 130px 0;}
    .reserve_info .done p{ font-size: 17px;}
    .reserve_info .check .txt .t1, .reserve_agree .check .txt .t1{ font-size: 17px;}
    .reserve_info .btn, .reserve_agree .btn{ height: 70px; font-size: 20px;}
}
@media(max-width: 1200px){
    .reserve_info .modle_min, .reserve_agree .modle_min{ padding: 80px 0 110px 0;}
    .reserve_info .head .back, .reserve_agree .head .back{ padding: 0 16px; height: 40px;}
    .reserve_info .head .back p, .reserve_agree .head .back p{ font-size: 14px;}
    .reserve_info .done{ margin: 30px 0 0 0; padding: 20px 24px;}
    .reserve_info .done p{ font-size: 16px;}
    .reserve_info .field{ margin: 26px 0 0 0;}
    .reserve_info .field .label{ font-size: 15px;}
    .reserve_info .field input{ padding: 0 18px; height: 58px; border-radius: 12px; font-size: 16px;}
    .reserve_info .check, .reserve_agree .check{ grid-gap: 16px; padding: 22px 24px;}
    .reserve_info .check .in, .reserve_agree .check .in{ grid-gap: 14px;}
    .reserve_info .check .terms, .reserve_agree .check .terms{ padding: 0 16px; height: 40px; font-size: 14px;}
    .reserve_info .check .mark, .reserve_agree .check .mark{ width: 22px; height: 22px; border-radius: 6px;}
    .reserve_info .check .mark:after, .reserve_agree .check .mark:after{ width: 5px; height: 9px; border-width: 0 2px 2px 0;}
    .reserve_info .check .txt .t1, .reserve_agree .check .txt .t1{ font-size: 16px;}
    .reserve_info .check .txt .t2, .reserve_agree .check .txt .t2{ margin: 8px 0 0 0; font-size: 15px;}
    .reserve_info .btn, .reserve_agree .btn{ margin: 26px 0 0 0; height: 64px; border-radius: 16px; font-size: 18px;}
}
@media(max-width: 1000px){
    .reserve_info .modle_min, .reserve_agree .modle_min{ padding: 70px 0 100px 0;}
    .reserve_info .done p{ font-size: 15px;}
    .reserve_info .btn, .reserve_agree .btn{ height: 60px; font-size: 17px;}
}
@media(max-width: 767px){
    .reserve_info .modle_min, .reserve_agree .modle_min{ padding: 3rem 0 5rem 0;}
    .reserve_info .head, .reserve_agree .head{ align-items: flex-start; grid-gap: 1rem;}
    .reserve_info .head .back, .reserve_agree .head .back{ grid-gap: .3rem; padding: 0 1rem; height: 2.4rem; border-radius: 3rem;}
    .reserve_info .head .back svg, .reserve_agree .head .back svg{ width: 1.3rem; height: 1.3rem;}
    .reserve_info .head .back p, .reserve_agree .head .back p{ font-size: 1.1rem;}
    .reserve_info .done{ grid-gap: .8rem; margin: 2.4rem 0 0 0; padding: 1.5rem 1.6rem; border-radius: 1rem;}
    .reserve_info .done svg{ width: 1.6rem; height: 1.6rem;}
    .reserve_info .done p{ font-size: 1.25rem;}
    .reserve_info .field{ margin: 2rem 0 0 0;}
    .reserve_info .field .label{ font-size: 1.2rem;}
    .reserve_info .field input{ margin: .9rem 0 0 0; padding: 0 1.4rem; height: 4.4rem; border-radius: 1rem; font-size: 1.25rem;}
    .reserve_info .check, .reserve_agree .check{ grid-gap: 1.2rem; margin: 1.2rem 0 0 0; padding: 1.6rem; border-radius: 1rem;}
    .reserve_info .check .in, .reserve_agree .check .in{ grid-gap: 1.1rem;}
    .reserve_info .check .terms, .reserve_agree .check .terms{ padding: 0 1.1rem; height: 3rem; border-radius: 3rem; font-size: 1.1rem;}
    .reserve_info .check .mark, .reserve_agree .check .mark{ width: 1.8rem; height: 1.8rem; border-radius: .5rem; border-width: .15rem;}
    .reserve_info .check .mark:after, .reserve_agree .check .mark:after{ width: .4rem; height: .8rem; border-width: 0 .18rem .18rem 0;}
    .reserve_info .check .txt .t1, .reserve_agree .check .txt .t1{ font-size: 1.3rem;}
    .reserve_info .check .txt .t2, .reserve_agree .check .txt .t2{ margin: .7rem 0 0 0; font-size: 1.15rem;}
    .reserve_info .btn, .reserve_agree .btn{ margin: 2rem 0 0 0; height: 4.6rem; border-radius: 1.2rem; font-size: 1.5rem;}
}


.reserve_agree .box{ overflow-y: auto; margin: 34px 0 0 0; padding: 34px 36px; max-height: 460px; border-radius: 15px; border: 1px solid rgba(0 0 0/10%); background: #FCFCFC;}
.reserve_agree .box::-webkit-scrollbar{ width: 6px; background: transparent;}
.reserve_agree .box::-webkit-scrollbar-thumb{ border-radius: 6px; background: rgba(0 0 0/18%);}
.reserve_agree .box .tag{ font-size: 17px; font-weight: 700; color: #F247FA;}
.reserve_agree .box .group{ margin: 30px 0 0 0;}
.reserve_agree .box .group .tit{ padding: 0 0 14px 0; border-bottom: 1px solid rgba(0 0 0/10%); font-size: 19px; font-weight: 700; color: #0A0A0A;}
.reserve_agree .box .group ul{ display: grid; grid-gap: 14px; margin: 18px 0 0 0;}
.reserve_agree .box .group li{ position: relative; padding-left: 15px; line-height: 1.65; font-size: 16px; font-weight: 400; color: rgba(0 0 0/62%); word-break: keep-all;}
.reserve_agree .box .group li:before{ content: ""; position: absolute; top: .72em; left: 0; width: 5px; height: 5px; border-radius: 50%; background: rgba(242 71 250/55%);}
.reserve_agree .box .group li b{ font-weight: 700; color: #0A0A0A;}
@media(max-width: 1560px){
    .reserve_agree .box{ padding: 30px 32px; max-height: 420px;}
    .reserve_agree .box .group .tit{ font-size: 18px;}
}
@media(max-width: 1200px){
    .reserve_agree .box{ margin: 30px 0 0 0; padding: 26px 26px; max-height: 380px;}
    .reserve_agree .box .tag{ font-size: 16px;}
    .reserve_agree .box .group{ margin: 26px 0 0 0;}
    .reserve_agree .box .group .tit{ padding: 0 0 12px 0; font-size: 17px;}
    .reserve_agree .box .group ul{ grid-gap: 12px; margin: 16px 0 0 0;}
    .reserve_agree .box .group li{ font-size: 15px;}
}
@media(max-width: 1000px){
    .reserve_agree .box{ max-height: 340px;}
}
@media(max-width: 767px){
    .reserve_agree .box{ margin: 2.4rem 0 0 0; padding: 1.8rem 1.6rem; max-height: 30rem; border-radius: 1rem;}
    .reserve_agree .box .tag{ font-size: 1.25rem;}
    .reserve_agree .box .group{ margin: 2rem 0 0 0;}
    .reserve_agree .box .group .tit{ padding: 0 0 1rem 0; font-size: 1.35rem;}
    .reserve_agree .box .group ul{ grid-gap: 1rem; margin: 1.2rem 0 0 0;}
    .reserve_agree .box .group li{ padding-left: 1.1rem; font-size: 1.2rem;}
    .reserve_agree .box .group li:before{ width: .35rem; height: .35rem;}
}


.reserve_done{ position: relative; background: #FFF;}
.reserve_done .modle_min{ padding: 100px 0 160px 0; max-width: 700px; text-align: center;}
.reserve_done .ico{ display: flex; justify-content: center; align-items: center; margin: 0 auto; width: 86px; height: 86px; border-radius: 50%; background: #0A0A0A;}
.reserve_done .ico svg{ display: block; width: 38px; height: 38px; color: #00FF69;}
.reserve_done .tit{ margin: 28px 0 0 0; line-height: 1.3; font-size: 32px; font-weight: 700; letter-spacing: -1px; color: #0A0A0A;}
.reserve_done .num{ margin: 14px 0 0 0; font-size: 17px; font-weight: 400; color: rgba(0 0 0/45%);}
.reserve_done .num b{ font-weight: 700; color: rgba(0 0 0/60%);}
.reserve_done .info{ margin: 44px 0 0 0; padding: 10px 30px; border-radius: 15px; border: 1px solid rgba(0 0 0/8%); background: #FCFCFC; text-align: left;}
.reserve_done .info .row{ display: flex; justify-content: space-between; align-items: center; grid-gap: 20px; padding: 22px 0;}
.reserve_done .info .row + .row{ border-top: 1px solid rgba(0 0 0/7%);}
.reserve_done .info .row .t1{ flex: 0 0 auto; font-size: 16px; font-weight: 500; color: rgba(0 0 0/45%);}
.reserve_done .info .row .t2{ line-height: 1.4; text-align: right; font-size: 18px; font-weight: 700; color: #0A0A0A; word-break: keep-all;}
.reserve_done .talk{ margin: 20px 0 0 0; padding: 26px 28px; border-radius: 15px; background: #f6f6f6; text-align: left;}
.reserve_done .talk .t1{ font-size: 15px; font-weight: 500; color: rgba(0 0 0/45%);}
.reserve_done .talk .msg{ display: grid; grid-gap: 8px; margin: 16px 0 0 0; padding: 22px 24px; border-radius: 12px; border: 1px solid rgba(0 0 0/8%); background: #FFF;}
.reserve_done .talk .msg p{ line-height: 1.6; font-size: 16px; font-weight: 400; color: rgba(0 0 0/62%); word-break: keep-all;}
.reserve_done .talk .msg p:first-child{ margin: 0 0 4px 0; font-weight: 700; color: #0A0A0A;}
.reserve_done .btn{ display: flex; justify-content: center; align-items: center; margin: 40px 0 0 0; height: 70px; border-radius: 20px; border: 1px solid rgba(0 0 0/15%); background: #FFF; font-size: 20px; font-weight: 700; color: #0A0A0A; cursor: pointer; transition: all .3s;}
.reserve_done .btn:hover{ border-color: #F247FA; color: #F247FA; background: rgba(242 71 250/4%);}
@media(max-width: 1560px){
    .reserve_done .modle_min{ padding: 90px 0 130px 0;}
    .reserve_done .tit{ font-size: 29px;}
    .reserve_done .info .row .t2{ font-size: 17px;}
}
@media(max-width: 1200px){
    .reserve_done .modle_min{ padding: 80px 0 110px 0;}
    .reserve_done .ico{ width: 76px; height: 76px;}
    .reserve_done .ico svg{ width: 34px; height: 34px;}
    .reserve_done .tit{ margin: 24px 0 0 0; font-size: 26px;}
    .reserve_done .num{ font-size: 16px;}
    .reserve_done .info{ margin: 38px 0 0 0; padding: 6px 24px;}
    .reserve_done .info .row{ padding: 20px 0;}
    .reserve_done .info .row .t1{ font-size: 15px;}
    .reserve_done .info .row .t2{ font-size: 16px;}
    .reserve_done .talk{ padding: 22px 24px;}
    .reserve_done .talk .msg{ padding: 20px 20px;}
    .reserve_done .talk .msg p{ font-size: 15px;}
    .reserve_done .btn{ margin: 34px 0 0 0; height: 64px; border-radius: 16px; font-size: 18px;}
}
@media(max-width: 1000px){
    .reserve_done .modle_min{ padding: 70px 0 100px 0;}
    .reserve_done .tit{ font-size: 24px;}
    .reserve_done .btn{ height: 60px; font-size: 17px;}
}
@media(max-width: 767px){
    .reserve_done .modle_min{ padding: 4rem 0 5.5rem 0;}
    .reserve_done .ico{ width: 6rem; height: 6rem;}
    .reserve_done .ico svg{ width: 2.6rem; height: 2.6rem;}
    .reserve_done .tit{ margin: 1.8rem 0 0 0; font-size: 1.9rem;}
    .reserve_done .num{ margin: 1rem 0 0 0; font-size: 1.2rem;}
    .reserve_done .info{ margin: 2.6rem 0 0 0; padding: .4rem 1.6rem; border-radius: 1rem;}
    .reserve_done .info .row{ grid-gap: 1.2rem; padding: 1.5rem 0;}
    .reserve_done .info .row .t1{ font-size: 1.2rem;}
    .reserve_done .info .row .t2{ font-size: 1.3rem;}
    .reserve_done .talk{ margin: 1.4rem 0 0 0; padding: 1.6rem; border-radius: 1rem;}
    .reserve_done .talk .t1{ font-size: 1.15rem;}
    .reserve_done .talk .msg{ grid-gap: .6rem; margin: 1.2rem 0 0 0; padding: 1.4rem; border-radius: .8rem;}
    .reserve_done .talk .msg p{ font-size: 1.2rem;}
    .reserve_done .btn{ margin: 2.6rem 0 0 0; height: 4.6rem; border-radius: 1.2rem; font-size: 1.5rem;}
}


.popup_contact{ display: flex; justify-content: center; align-items: center; position: fixed; z-index: 300; top: -100%; right: 0; bottom: 100%; left: 0; padding: 20px;}
.popup_contact .inner{ overflow: hidden; position: relative; z-index: 10; width: 600px; height: 600px; border-radius: 20px; opacity: 0; transform: scale(.5); transition: opacity .5s, transform .5s;}
.popup_contact .inner .close_btn{ display: block; position: absolute; z-index: 4; top: 30px; right: 30px; width: 40px; height: 40px; color: #000; cursor: pointer; transition: all .3s;}
.popup_contact .inner .close_btn:hover{ transform: scale(1.1) rotate(90deg); color: #000;}
.popup_contact .inner .box{ overflow: auto; position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 50px; background: #FFF; transition: all .3s;}
.popup_contact > .close{ position: absolute; z-index: 2; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/0.0000001%);}
.popup_contact > .bg{ position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; transition: opacity .5s;}

.popup_contact h3{ position: relative; margin: 0 0 50px 0; line-height: 30px; font-size: 30px; font-weight: 800; color: #000;}
.popup_contact .write{ display: grid; gap: 20px;}
.popup_contact .write .wrap{}
.popup_contact .write .tit{ padding: 0 0 10px 0; font-size: 16px; font-weight: 600; color: #000;}
.popup_contact .write .tit span{ padding: 0 0 0 5px; color: #F00;}

.popup_contact .write .menu{ display: flex; gap: 10px;}
.popup_contact .write .menu a{ display: flex; justify-content: center; align-items: center; width: 50%; height: 50px; border-radius: 5px; border: 1px solid #ddd; cursor: pointer;}
.popup_contact .write .menu a p{ font-size: 16px; font-weight: 500; color: #666;}
.popup_contact .write .menu a:hover{ background: #f5f5f5;}
.popup_contact .write .menu a.on{ border: 1px solid #000; background: #000;}
.popup_contact .write .menu a.on p{ font-weight: 600; color: #FFF;}

.popup_contact .write input{ display: flex; align-items: center; margin: 0; padding: 0 20px; width: 100%; height: 45px; border-radius: 5px; border: 1px solid #DDD; background: #FFF; font-size: 15px; color: #000; outline: none; -webkit-appearance: none;}
.popup_contact .write input:focus{ border: 1px solid #000;}
.popup_contact .write select{ display: flex; align-items: center; margin: 0; padding: 0 40px 0 20px; width: 100%; height: 45px; border-radius: 5px; border:1px solid #DDD; background:url(/images/basic_select_icon.png) no-repeat center right 20px #FFF; background-size: 10px auto; font-size: 15px; color: #000; outline: none; -webkit-appearance: none;}
.popup_contact .write select::-ms-expand{ display: none;}
.popup_contact .write select:focus{ border: 1px solid #000;}
.popup_contact .write textarea{ display: flex; align-items: center; margin: 0; padding: 20px 20px; width: 100%; height: 140px; border-radius: 5px; border: 1px solid #DDD; background: #FFF; font-size: 15px; color: #000; outline: none; -webkit-appearance: none;}
.popup_contact .write textarea:focus{ border: 1px solid #000;}

.popup_contact .write .file{ display: flex; gap: 10px;}
.popup_contact .write .file input{ flex: 1;}
.popup_contact .write .file .btn{ display: flex; justify-content: center; align-items: center; width: 45px; height: 45px; border-radius: 5px; background: #333; cursor: pointer;}
.popup_contact .write .file .btn svg{ display: block; width: 18px; height: 18px; color: #FFF;}

.popup_contact .check{ display: flex; flex-direction: column; align-items: center; margin: 50px 0 0 0;}
.popup_contact .check .txt{ text-align: center; line-height: 1.4; font-size: 16px; color: #000;}
.popup_contact .check .fb{ display: flex; align-items: center; margin: 20px 0 0 0;}
.popup_contact .check .btn{ display: flex; align-items: center; cursor: pointer;}
.popup_contact .check .btn svg{ display: flex; justify-content: center; align-items: center; padding: 5px; width: 25px; height: 25px; border-radius: 50%; border: 1px solid #DDD; color: #666;}
.popup_contact .check .btn p{ margin: 0 0 0 5px; font-size: 16px; color: #666;}
.popup_contact .check span{ margin: 0 0 0 10px; font-size: 16px; font-weight: 600; color: #000; cursor: pointer;}
.popup_contact .check .btn.on svg{ border-color: #000; background: #000; color: #FFF;}
.popup_contact .check .btn.on p{ font-weight: 600; color: #000;}

.popup_contact .box > .btn{ display: flex; justify-content: center; align-items: center; margin: 50px 0 0 0;}
.popup_contact .box > .btn a{ display: flex; justify-content: center; align-items: center; margin: 0 5px; padding: 0 30px; height: 50px; border-radius: 30px; background: #000; font-size: 16px; font-weight: 600; color: #FFF; transition: all .3s; cursor: pointer;}
.popup_contact .box > .btn a:first-child{ border: 1px solid #000; background: #FFF; color: #000;}
.popup_contact .box > .btn a:first-child:hover{ background: #f5f5f5;}

.popup_contact.on{ top: 0; bottom: 0;}
.popup_contact.on > .inner{ opacity: 1; transform: scale(1);}
.popup_contact.on > .bg{ opacity: 1;}

.popup_contact .inner .box::-webkit-scrollbar{ width: 3px; background: #fff;}
.popup_contact .inner .box::-webkit-scrollbar-thumb{ background-color: #00FF69; border-radius: 10px;}
@media(max-width: 767px){
    .popup_contact .inner{ width: 100%; height: 40rem; border-radius: 0.5rem;}
    .popup_contact .inner .close_btn{ top: 1.5rem; right: 1.5rem; width: 3rem; height: 3rem;}
    .popup_contact .inner .close_btn:hover{ transform: scale(1) rotate(0deg);}
    .popup_contact .inner .box{ padding: 2rem;}

    .popup_contact h3{ margin: 0 0 3rem 0; font-size: 2rem;}
    .popup_contact .write{ gap: 1.2rem;}
    .popup_contact .write .tit{ padding: 0 0 0.6rem 0; font-size: 1.1rem;}

    .popup_contact .write .menu{ gap: 0.5rem;}
    .popup_contact .write .menu a{ height: 3.2rem; border-radius: 0.5rem;}
    .popup_contact .write .menu a p{ font-size: 1.2rem;}

    .popup_contact .write input{ padding: 0 1.2rem; height: 3.2rem;}
    .popup_contact .write select{ padding: 0 3rem 0 1.2rem; height: 3.2rem;}
    .popup_contact .write textarea{ padding: 1rem 1.2rem; height: 8rem;}

    .popup_contact .write .file{ gap: 0.5rem;}
    .popup_contact .write .file .btn{ width: 3.2rem; height: 3.2rem;}
    .popup_contact .write .file .btn i{ font-size: 1.4rem;}

    .popup_contact .check{ margin: 2rem 0 0 0;}
    .popup_contact .check .txt{ font-size: 1.1rem;}
    .popup_contact .check .fb{ margin: 1rem 0 0 0;}
    .popup_contact .check .btn p{ font-size: 1.1rem;}
    .popup_contact .check span{ font-size: 1.1rem;}

    .popup_contact .box > .btn{ margin: 2rem 0 0 0;}
    .popup_contact .box > .btn a{ padding: 0 1.5rem; height: 3.5rem; font-size: 1.2rem;}
}


.popup_policy_terms{ display: flex; justify-content: center; align-items: center; position: fixed; z-index: 310; top: -100%; right: 0; bottom: 100%; left: 0; padding: 20px;}
.popup_policy_terms .inner{ overflow: hidden; position: relative; z-index: 20; width: 600px; height: 600px; border-radius: 10px; opacity: 0; transform: scale(.5); transition: opacity .5s, transform .5s;}
.popup_policy_terms .inner .close_btn{ display: block; position: absolute; z-index: 4; top: 30px; right: 30px; width: 40px; height: 40px; color: #000; cursor: pointer; transition: all .3s;}
.popup_policy_terms .inner .close_btn:hover{ transform: scale(1.1) rotate(90deg); color: #000;}
.popup_policy_terms .inner .box{ overflow: auto; position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 50px; background: #FFF; transition: all .3s;}
.popup_policy_terms .close{ position: absolute; z-index: 2; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/0.0000001%);}
.popup_policy_terms .bg{ position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; transition: opacity .5s;}

.popup_policy_terms .text{}
.popup_policy_terms .text h3{ position: relative; margin: 0 0 50px 0; line-height: 30px; font-size: 30px; font-weight: 800; color: #000;}
.popup_policy_terms .text h4{ display: block; position: relative; width: auto; margin-top: 30px; font-size: 20px; font-weight: 600; color: #333; line-height: 30px;}
.popup_policy_terms .text h4:first-child{ margin-top: 0;}
.popup_policy_terms .text p{ margin-top: 10px; font-size: 16px; font-weight: 400; color: #666; line-height: 24px;}
.popup_policy_terms .text ul{ display: block; position: relative; width: auto; margin-top: 10px; margin-left: 10px;}
.popup_policy_terms .text ul li{ position: relative; margin: 5px 0; padding-left: 10px; line-height: 24px; font-size: 14px; color: #666;}
.popup_policy_terms .text ul li:before{ content: ""; position: absolute; left: 0; top: 12px; width: 3px; height: 3px; border-radius: 50%; background-color: #999; transform: translate(0,-50%);}
.popup_policy_terms .btn{ display: flex; justify-content: center; align-items: center; margin: 50px auto 0 auto; width: 140px; height: 45px; border-radius: 30px; border: 1px solid #000; font-size: 16px; font-weight: 600; color: #000; transition: all .3s; cursor: pointer;}
.popup_policy_terms .btn:hover{ background: #f5f5f5;}

.popup_policy_terms.on{ top: 0; bottom: 0;}
.popup_policy_terms.on .inner{ opacity: 1; transform: scale(1);}
.popup_policy_terms.on .bg{ opacity: 1;}

.popup_policy_terms .inner .box::-webkit-scrollbar{ width: 3px; background: #fff;}
.popup_policy_terms .inner .box::-webkit-scrollbar-thumb{ background-color: #00FF69; border-radius: 10px;}
@media(max-width: 767px){
    .popup_policy_terms .inner{ width: 100%; height: 40rem; border-radius: 0.5rem;}
    .popup_policy_terms .inner .close_btn{ top: 1.5rem; right: 1.5rem; width: 3rem; height: 3rem;}
    .popup_policy_terms .inner .close_btn:hover{ transform: scale(1) rotate(0deg);}
    .popup_policy_terms .inner .box{ padding: 2rem;}

    .popup_policy_terms .text h3{ margin: 0 0 30px 0; line-height: 30px; font-size: 24px;}
    .popup_policy_terms .text h4{ margin-top: 20px; font-size: 18px;}
    .popup_policy_terms .text p{ font-size: 15px;}
    .popup_policy_terms .btn{ margin: 30px auto 0 auto; width: 120px; height: 40px; font-size: 15px;}
}


.popup_policy_privacy{ display: flex; justify-content: center; align-items: center; position: fixed; z-index: 310; top: -100%; right: 0; bottom: 100%; left: 0; padding: 20px;}
.popup_policy_privacy .inner{ overflow: hidden; position: relative; z-index: 20; width: 600px; height: 600px; border-radius: 10px; opacity: 0; transform: scale(.5); transition: opacity .5s, transform .5s;}
.popup_policy_privacy .inner .close_btn{ display: block; position: absolute; z-index: 4; top: 30px; right: 30px; width: 40px; height: 40px; color: #666; cursor: pointer; transition: all .3s;}
.popup_policy_privacy .inner .close_btn:hover{ transform: scale(1.1) rotate(90deg); color: #000;}
.popup_policy_privacy .inner .box{ overflow: auto; position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 50px; background: #FFF; transition: all .3s;}
.popup_policy_privacy .close{ position: absolute; z-index: 2; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/0.0000001%);}
.popup_policy_privacy .bg{ position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); opacity: 0; transition: opacity .5s;}

.popup_policy_privacy .text{}
.popup_policy_privacy .text h3{ position: relative; margin: 0 0 50px 0; line-height: 30px; font-size: 30px; font-weight: 800; color: #000;}
.popup_policy_privacy .text h4{ display: block; position: relative; width: auto; margin-top: 30px; font-size: 20px; font-weight: 600; color: #333; line-height: 30px;}
.popup_policy_privacy .text h4:first-child{ margin-top: 0;}
.popup_policy_privacy .text p{ margin-top: 10px; font-size: 16px; font-weight: 400; color: #666; line-height: 24px;}
.popup_policy_privacy .text ul{ display: block; position: relative; width: auto; margin-top: 10px; margin-left: 10px;}
.popup_policy_privacy .text ul li{ position: relative; margin: 5px 0; padding-left: 10px; line-height: 24px; font-size: 14px; color: #666;}
.popup_policy_privacy .text ul li:before{ content: ""; position: absolute; left: 0; top: 12px; width: 3px; height: 3px; border-radius: 50%; background-color: #999; transform: translate(0,-50%);}
.popup_policy_privacy .btn{ display: flex; justify-content: center; align-items: center; margin: 50px auto 0 auto; width: 140px; height: 45px; border-radius: 30px; border: 1px solid #000; font-size: 16px; font-weight: 600; color: #000; transition: all .3s; cursor: pointer;}
.popup_policy_privacy .btn:hover{ background: #f5f5f5;}

.popup_policy_privacy.on{ top: 0; bottom: 0;}
.popup_policy_privacy.on .inner{ opacity: 1; transform: scale(1);}
.popup_policy_privacy.on .bg{ opacity: 1;}

.popup_policy_privacy .inner .box::-webkit-scrollbar{ width: 3px; background: #FFF;}
.popup_policy_privacy .inner .box::-webkit-scrollbar-thumb{ background-color: #00FF69; border-radius: 10px;}
@media(max-width: 767px){
    .popup_policy_privacy .inner{ width: 100%; height: 40rem; border-radius: 0.5rem;}
    .popup_policy_privacy .inner .close_btn{ top: 1.5rem; right: 1.5rem; width: 3rem; height: 3rem;}
    .popup_policy_privacy .inner .close_btn:hover{ transform: scale(1) rotate(0deg);}
    .popup_policy_privacy .inner .box{ padding: 2rem;}

    .popup_policy_privacy .text h3{ margin: 0 0 20px 0; line-height: 30px; font-size: 24px;}
    .popup_policy_privacy .text h4{ margin-top: 20px; font-size: 18px;}
    .popup_policy_privacy .text p{ font-size: 15px;}
    .popup_policy_privacy .btn{ margin: 30px auto 0 auto; width: 120px; height: 40px; font-size: 15px;}
}
