0@charset "utf-8";

/* Layout */
/* CSS스타일시트상에 적용방법 아래 두가지중 하나를 선택하여 사용하면 됩니다.  */

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

/* 위처럼 적용시 body에 속해 있는 모든 폰트가 나눔스퀘어로 적용됨을 알수 있습니다.*/
body,
html {
    width: 100%;
    height: 100%;
    margin:0;
    background:#fff;
}
body{
    max-width:1920px;
    margin:0 auto;
}
body,
select,
button,
table {
    font-family: 'Pretendard-Regular';
    font-size: 15px;
    -webkit-font-smoothing: antialiased
}

.wrap-section:after{
    content:"";
    display:block;
    clear:both;
}

img,
fieldset,
button {
    border: 0
}

ul,
ol {
    list-style: none
}

em,
address {
    font-style: normal
}

a {
    text-decoration: none
}

a:hover,
a:active,
a:focus {
    text-decoration: none
}

.blind {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    font-size: 0;
    line-height: 0
}

.edge {
    position: absolute;
    top: 12px;
    right: 4px;
    width: 0;
    height: 0;
    border-width: 0 8px 8px;
    border-style: solid;
    border-color: transparent transparent #333
}

.clear {
    clear: both
}
.sub-header .m-header.in-header h1{
    padding:15px 0;
}
/* Skip to content */
.skip {
    margin: 0
}
.skip>a {
    display: block;
    overflow: hidden;
    height: 0;
    line-height: 28px;
    text-align: center
}

.skip>a:focus {
    height: auto
}

/* 작업용 */
section{
    position:relative;
}
.target-span{
    position:absolute;
    height:100px;
    width:1px;
    display:block;
    top:-100px;
}
.wrap-section {
    max-width: 1920px;
 
    margin: 0 auto;
}
.m_wrap-section{
    padding-top:100px;
}
.xe_width{
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
}
.root-width {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

header {
    position: fixed;
    top: 0;
    width: 100%;
    background: transparent;
    z-index: 999;
   
}
header.quick_header{
    background: #e5ddd0;
    -moz-box-shadow: 0px 3px 6px rgb(0 0 0 / 7%);;
    -webkit-box-shadow:0px 3px 6px rgb(0 0 0 / 7%);;
    box-shadow:0px 3px 6px rgb(0 0 0 / 7%);;
}
.m-header{
    position:absolute;
}
.m-header.quick_header{
    position:fixed;
    top:-107px;
}
.in-header {
    position: relative;
    padding-left: 240px;
}

.in-header h1 {
    position: absolute;
    left: 0;
    top: 50%;
    width:114px;
    margin:0;
    margin-top: -34px;
    background: url(img/logo_bg.png) no-repeat center center;
    background-size: cover;
}
.quick_header .in-header h1{
    background:none;
}
.m-header.in-header{
    padding:0;
}
.m-header.in-header h1 {
    position:relative;
    width:100%;
    text-align:center;
    top:0;
    padding-top:60px;
    margin:0;
}
.in-header h1 img {
    vertical-align: middle;
    width:100%;
    
}

nav ul {
    display: flex;
    justify-content: flex-end;
    margin:1px 0 0;
}
.m-header nav ul {
    width: 100%;
    justify-content: space-around;
}
nav ul li {
    text-align: right;
    padding: 0 0 0 40px;
}

nav ul li a {
    line-height: 25px;
    font-family: 'Pretendard-Regular';
    color: #fff; 
    font-size: 22px;
    padding: 45px 0px 40px;
    display: block;
    font-weight:600;
}
.ec nav ul li a,
header.quick_header nav ul li a{
    color: #38322c;
}


.m-header nav ul{
    display:flex;
}
.m-header nav ul li{
    padding:0;
}
.m-header nav ul li a{
    padding: 32px 0 28px;
}
.box-section {
    background-size: cover;
    background-position: 50% top;
    height: 0;
    overflow-x: hidden;
    position: relative;
    z-index: 1;
}

.box-section1 {
    padding-top: 940px;
    background-color:#fbf9f7;
    background-image: url("img/section1_bg.webp");
    background-position: 50% top;
}
.title-section1{ 
    top:200px; 
}
@keyframes handle-rotate {
    0%   { transform: translateY(-50%) rotate(-2deg); }
    20%  { transform: translateY(-52%) rotate(-1deg); }
    40%  { transform: translateY(-49%) rotate(0deg); }
    60%  { transform: translateY(-50%) rotate(1deg); }
    80%  { transform: translateY(-51%) rotate(0deg); }
    100% { transform: translateY(-50%) rotate(-2deg); }
}
.section1_right{
    position: absolute;
    top: 50%;
    left: 54%;
    transform: translateY(-50%);
    
}
.section1_right img{
    animation: handle-rotate 3s infinite linear;
}
.title-section1B{ 
    top:500px; 
    opacity: 1 !important;
}
/* 부모 div에 대한 스타일 */
.box-section6 img.over_slide{
    position: absolute;
    z-index:99;
}
.title-section8 img,
.title-section7-bottom img,
.title-section1B img{
    position: relative;
    z-index:99;
    vertical-align: middle;
}

.hlight{
    display:inline-block;
    position:absolute;
    width:0;
    transition: width 0.5s ease;
}

/* hlight1에 대한 초기 스타일 */
.hlight1 {
   
}

/* hlight2에 대한 초기 스타일 */
.hlight2 {
    transition-delay: 0.5s; /* hlight1의 변화 후에 시작 */
}
.title-section1B .hlight{
    background:#4e3929;
    height:115px;
}
/* hover 시에만 넓이 변화 적용 */
.title-section1B.aos-animate .hlight1  {
    width: 290px;
}

.title-section1B.aos-animate .hlight2  {
    width: 390px;
    top:125px;
}
.box-section4B  .hlight,
.box-section7 .hlight,
.box-section3 .hlight{
    background:#ffe156;
    height: 30px;
    transition-delay: 0.5s; 
}
.box-section3 .hlight1{
    left: 5%;
    bottom: 18.1%;
}
.box-section3 .swiper-slide-active .hlight1{
    width:38%;
}
.box-section3 .hlight2{
    left: 5%;
    bottom: 36.5%;
}
.box-section3 .swiper-slide-active .hlight2{
    width:25%;
}
.box-section3 .hlight3{
    left: 5%;
    bottom: 42.3%;
}
.box-section3 .swiper-slide-active .hlight3{
    width:26%;
}
.title-section7-bottom1.aos-animate .hlight1  {
    width: 42%;
    left: 29%;
    top: 57%;
}
.title-section7-bottom2.aos-animate .hlight2  {
    width: 41.5%;
    left: 34.6%;
    top: 42.9%;
    transition-delay: 0.6s;
}
.title-section7-bottom3.aos-animate .hlight3  {
    width: 81%;
    left: 9.5%;
    top: 63%;
    transition-delay: 0.7s;
}
.title-section8 .hlight1{
    background:#ffe156;
    height: 30px;
    transition-delay: 0.5s; 
}
.title-section8.aos-animate .hlight1  {
    width: 23%;
    left: 38.5%;
    top: 52%;
}
.title-section{
    width:100%;
    text-align: left;
    position: absolute;
    box-sizing: border-box;
    padding:0 5%;
}
.title-section img{
    max-width:90%;
}


.to-form{
    position: absolute;
    width: 340px;
    height: 0px;
    padding-top:80px;
    overflow: hidden;
    text-indent: -9999px;
    top: 65%;
    left: 50%;
    margin-left: -542px;
    display:block;
}


.box-section2 {
    padding-top: 190px;
    padding-bottom: 200px;
    background-image: url("img/bg_section2.jpg");
    text-align: center;
    background-repeat: repeat-y;
    background-size: 100%;
    overflow: visible;
    height:auto;
    overflow-x: hidden;
}
.section2-w1{
    position: absolute;
    height:344px;
    width:416px;
    max-width:25.2%;
    top: 100px;
    left: -3%;
    animation-name: animation21;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.section6-w3 img,
.section6-w1 img{
    max-width:100%;
}
.section2-w3{
    position: absolute;
    right:-3%;
    height:338px;
    width:432px;
    max-width:25.4%;
    animation-name: animation21;
    animation-duration: 2.2s;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@keyframes animation23 {
    0%   {bottom: 0px;}
    50%  {bottom: -12px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {bottom: 0px;}
}

@keyframes animation21 {
    0%   {top: 100px;}
    50%  {top: 90px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {top: 100px;}
}

.title-section2B{
    padding-top:130px;
}
.title-section2C{
    margin-top:70px;
    background: url(img/section2_center.png) no-repeat center center;
}
.section2_ul{
    max-width: 1200px !important;
    margin: 0 auto;
    display: flex;
    padding: 0;
    flex-wrap: wrap;
    text-align: left;
}
.section2_ul li{
    width:50%;
    margin-bottom:42px;
    box-sizing: border-box;
}
.section2_ul li:nth-child(2n){
    text-align: right;
}
.section2_ul li:nth-child(1){
    padding-left:50px;
}
.section2_ul li:nth-child(2){
    padding-right:80px;
}
.section2_ul li:nth-child(4){
    padding-right:25px;
}
.section2_ul li:nth-child(5){
    padding-left:140px;
}
.section2_ul li:nth-child(6){
    padding-right:143px;
}
.title-section2d{
    padding-top:50px;
}
.section2_ulB{
    max-width: 1160px !important;
    margin: 0 auto;
    display: flex; 
    justify-content: space-between;
    padding-top:135px !important;
}

.wrap-slide1 .swiper-slide{
    width:auto;
}

.box-section3 {
    padding-top: 160px;
    padding-bottom: 140px;
    height:1005px;
    background-size: auto;
    box-sizing: border-box;
    background-image: url("img/box-section3.webp");
}
.swiper-button-next:after,  .swiper-button-prev:after{
    color:#fff;
    font-size:28px;
}
.box-section3 .swiper-button-prev{
    left: calc(50% + 45px);
}
.title-section3{  
    padding-top:0px;
    text-align: center;
    position: relative;
}
.section3_ul {
    max-width: 1055px !important;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-top: 60px !important;
}
.box3 {
    position: absolute;
    animation-name: animation1;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.box3-left{
    top: 130px;
    left:0%;
    width: 25.421%;
}
.box3-right {
    top: auto;
    right:0;
    bottom: 38%;
    text-align: right;
    animation-name: animation2;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    width: 27.631%;
}
@keyframes animation1 {
    0%   {margin-top:0px;}
    50%  { margin-top:40px;}
    100% {margin-top:0px;}
}
.box3 img{
    max-width:100%;
    vertical-align:middle;
	width:100%;
}
@keyframes animation2 {
    0%   {margin-bottom:0px;}
    50%  {margin-bottom:40px;}
    100% {margin-bottom:0px;}
}
.to-form2{
    position: absolute;
    width: 392px;
    height: 0px;
    padding-top:67px;
    overflow: hidden;
    text-indent: -9999px;
    top: 78.2%;
    left: 83.6%;
    margin-left: -542px;
    display:block;
}

/* section4 */
.box-section4 {
    padding-top: 86px;
    height:auto;
    background-image: url("img/section4_top.webp");
    padding-bottom:70px;
}
.title-section4{ 
    top:0; 
    position: relative;
    text-align: center;
}
.box-section4A {
    padding-top: 160px;
    height:auto;
    background-image: url("img/section4A_bg.webp");
    padding-bottom:160px;
}
.title-section4A{
    top:0; 
    padding-bottom:40px;
    position: relative;
    text-align: center; 
}
.section4_ul{
    max-width: 1070px !important;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.box-section4B{
    padding-top:170px;
    padding-bottom:160px;
    height:auto;
    background-image: url("img/section7.webp");
    background-position:50% top;
    background-color:#f3f3f3;
}
.title-section4B{
    top:0; 
    padding-bottom:40px;
    position: relative;
    text-align: center; 
}
.box-section4B .xe_width{
    margin:0 auto;
    max-width:767px;
    padding:0 5.2vw;
}

.section4-w1B,
.section4-w1{
    position: absolute;
    height:330px;
    width:516px;
    max-width:26.2%;
    top: 330px;
    left: 8.7%;
    animation-name: animation4;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.section4-w1B{
    left: -7%;
    margin-top: 150px;
    height:403px;
    width:721px;
    max-width:43.2%;
}
.section4-w3B img,
.section4-w1B img,
.section4-w3 img,
.section4-w1 img{
    max-width:100%;
}
.section4-w3B,
.section4-w3{
    position: absolute;
    bottom:0;
    margin-bottom:280px;
    left:50%;
    height:314px;
    width:482px;
    max-width:25.4%;
    margin-left:320px;
    animation-name: animation3;
    animation-duration: 2.2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.section4-w3B{
    bottom:auto;
    height:489px;
    width:617px;
    max-width:45.4%;
    margin-left: 550px;
    margin-bottom: 600px;
}
@keyframes animation3 {
    0%   {bottom: 0px;}
    50%  {bottom: -12px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {bottom: 0px;}
}

@keyframes animation4 {
    0%   {top: 680px;}
    50%  {top: 670px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {top: 680px;}
}

.box-section4C{
    padding-top:150px;
    padding-bottom:160px;
    height:auto;
    background-image: url("img/section4c.webp");
    background-position:50% top;
    background-color:#f3f3f3;
}
.title-section4C{
    top:0; 
    padding-bottom:40px;
    position: relative;
    text-align: center; 
}
.box-section4C .middle_Swiper{
    width: 1650px;
    position: relative;
    right: 450px;
}
.wrap-section4C{
    height:670px;
    position: relative;
}
.swiper-button-next3{
    position: absolute;
    right:-40px;
    top:50%;
    margin-top:-21px;
    width:22px;
    height:42px;
    cursor: pointer;
    background:url(img/section6_next.png) no-repeat center center;
}
.swiper-button-prev4{
    position: absolute;
    left:-40px;
    top:50%;
    margin-top:-21px;
    cursor: pointer;
    width:22px;
    height:42px;
    background:url(img/section6_pre.png) no-repeat center center;

}
.section3-Swiper .swiper-slide{
    width:60%;
    max-width:314px;
}
.section4-Swiper .swiper-slide{
    width:60%;
    max-width:557px;
}
.middle_SwiperB{
    position: absolute;
    top: 335px;
    left: 640px;
    overflow: hidden;
}
.wrap-slide2{
    position: absolute;
    width:calc(100% + 140px);
    top:440px;
    left:-70px;
}

.wrap-slide2 .swiper-slide{
    width:378px;
    -moz-box-shadow:0px 3px 10px rgb(0 0 0 / 64%);
	-webkit-box-shadow:0px 3px 10px rgb(0 0 0 / 64%);
	box-shadow:0px 3px 10px rgb(0 0 0 / 64%);
}
.box-section4D{
    padding-top:140px;
    padding-bottom:190px;
    height:auto;
    background-image: url("img/section4D.webp");
    background-position:50% top;
    background-color:#f3f3f3;
    background-size: auto;
}
.title-section4D{
    top:0; 
    padding-bottom:70px;
    position: relative;
    text-align: center; 
}
.title-section4D1{
    padding-bottom:30px;
}
.wrap-section4D1{
    display: flex;
    justify-content: space-between;
    max-width: 1000px;
    margin: 0 auto;
    align-items: flex-end;
}
.title-section-bottom{
    text-align: center;
}
.section5-section-bottomA{
    padding:120px 0 40px;
}
.section5-section-bottomB{
    padding:50px 0 70px;
}
.section5-section-bottomC{
    padding:30px 0 50px;
}

.fade-box{
    position:absolute;
}
.fade-box1{
    left:10%;
    top:1%;
}
.fade-box2{
    right:10%;
    top:1.5%;
}
.fade-box3{
    left:0%;
    top:37%;
}
.fade-box4{
    right:0%;
    top:37.5%;
}
.fade-box5{
    left:50%;
    top:0%;
    width:380px;
    transform: translateX(-50%);
}
.fade-box6{
    left:15%;
    bottom:0%;
}
.fade-box7{
    right:15%;
    bottom:1%;
}
.fade-box1,
.fade-box2{
    width:29.1%;
}
.fade-box3,
.fade-box4{
    width:31.8%;
}
.fade-box6{
    width:35.3%;
}
.fade-box7{
    width:32.6%;
}
.fade-box5{
    width:34.5%;
}
.fade-box img{
    max-width:100%;
}
.text-section4{
    text-align:center;
    max-width:614px;
    margin:0 auto;
    padding:0 15px 2% 15px;
}
.m-box-section4 .text-section4{
    max-width:580px;
    padding:0 12.1% 20px;
}
.m-box-section4 .text-section4 img{
    max-width:100%;
}
.slide-section4{
    padding:1% 0 3%;
}
.m-box-section4 .slide-section4{
    padding:30px 0 60px;
   margin-left:-30%;
}
.m-box-section4 .slide-section4 .swiper-slide{
    background:none;
}
.m-box-section4 .slide-section4 img{
    box-sizing:border-box;
    padding:3%;
}
.mySwiper2 .swiper-slide{
    width:auto;
}
.m-box-section4 .mySwiper2 .swiper-slide{
    width:270px;
}

/* section5 */
.box-section5 {
    padding-top:115px;
    height:auto;
    background-image: url("img/section5_top_wrap.webp");
    background-position:50% 50%;
    background-color:#f7f1e3;
    padding-bottom:100px;
    background-size:auto;
}
.section5_top{
    width:1400px;
    height:563px;
    background: url(img/section5_top.jpg) no-repeat center center;
    background-size: 100% 100%;
    margin:0 auto;
    border-radius: 80px;
    text-align: center;
    box-sizing: border-box;
    padding:70px;
}
.box-section5B{
    padding-top:160px;
    height:auto;
    background-image: url("img/section5_bottom_wrap.webp");
    background-position:50% 50%;
    background-color:#f7f1e3;
    padding-bottom:0px;
    background-size:auto;
    
}
.section5_top2{
    padding:25px 0 25px;
}
.title-section5{ 
    padding-top:340px; 
    text-align: center;
    position: relative;
}
.title-section5B{ 
    padding-top:0px; 
}
.wrap-section5{
    display: flex;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
}
.wrap-section5C{
    display: flex;
    justify-content: space-between;
    max-width: 970px;
    margin: 0 auto;
}

/* section6 */
.box-section6-top{
    height:281px;
    background-image: url("img/box-section6-top.webp");
    background-position:50% bottom;
    background-size:auto;
    background-repeat: no-repeat;
}
.box-section6 {
    padding-top:0px;
    background-image: url("img/section6.webp");
    background-position:50% bottom;
    background-size: auto;
    background-color:#f7f1e3;
    height:auto;
    background-repeat:repeat-y;
    padding-bottom:180px;
}
.title-section6{ 
    padding-bottom:70px; 
    text-align: center;
    position: relative; 
}
.wrap-slide0{
    padding-bottom:100px;
    max-width:1020px;
}
.box-section6 .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
}
.box-section6 .hlight{
    background:#ffe156;
    height: 24px;
    transition-delay: 0.5s; 
}
.box-section6 .hlight1{
    left: 5.5%;
    top: 36.2%;
}
.box-section6 .swiper-slide-active .hlight1{
    width: 19.8%;
}
.box-section6 .hlight1A{
    left: 19%;
    top: 44.2%;
}
.box-section6 .swiper-slide-active .hlight1A{
    width: 192px;
    transition-delay: 0.8s; 
}
.box-section6 .hlight2{
    left: 5.5%;
    bottom: 17%;
}
.box-section6 .swiper-slide-active .hlight2{
    width:234px;
}
.box-section6 .hlight2A{
    left: 5.5%;
    bottom: 12.3%;
}
.box-section6 .swiper-slide-active .hlight2A{
    width: 147px;
    transition-delay: 0.8s;
}
.box-section6 .hlight3{
    left: 5%;
    bottom: 42.3%;
}
.box-section6 .swiper-slide-active .hlight3{
    width:26%;
}
.box-section6 .swiper-pagination0{
    bottom:50px;
}
.box-section6 .swiper-pagination-bullet{
    width:16px;
    height:16px;
    opacity: 1;
    background:#fff;
    margin:0 8px !important;
}

.box-section6 .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background:#d6a466;
}
/* section7 */
.box-section7 {
    padding-top:380px;
    padding-bottom:160px;
    height:auto;
    background-image: url("img/section7.webp");
    background-position:50% top;
    background-color:#f3f3f3;
}
.title-section7{ 
    top:150px; 
    text-align: center;
}
.box-section7 .xe_width{
    text-align: center;
}
.title-section7-bottom{
    background: #fff;
    display:inline-block;
    margin:15px 0;
    opacity: 1 !important;
    position: relative;
}

/* section8 */
.box-section8 {
    padding:170px 0 150px;
    height:auto;
    background-image: url("img/section8.webp");
    background-position:50% top;
    background-color:#f3f3f3;
    box-sizing: border-box;
    height:1221px;
    background-size: auto;
}
.title-section8{ 
    position: relative;
    text-align: center;
    opacity: 1;
}
.wrap-box8 {
    max-width: 1230px;
    margin: 0 auto;
    padding-top:60px;
}
.wrap-box8-2{
    margin-top:30px;
}
.box-section8 .swiper-button-next:after,.box-section8 .swiper-button-prev:after{
    color:#000;
}
.box-section8 .swiper-button-prev{

}
.box-section8 .swiper-slide{
    background:none !important;
}
.wrap-slide1{
    position: relative;
    padding:0 65px;
}

.title-section8-bottom{
    text-align: center;
    padding:50px 0 150px;
}
.in-box8{
    width:1100px;
    margin:0 auto;
    position: relative;
}
.in-box-top{
    display: flex;
    justify-content: space-between;
}
.in-box-top .box8{
    text-align: center;
}
.in-box-bottom{
    display: flex;
    justify-content: space-between;
    max-width:1010px;
    margin:0 auto;
    padding-top:20px;
}
.in-box-bottom .box8{
    padding-bottom:10px;
}
.box-bottom-left{
    text-align: right;
}
.box8 img{
    max-width:100%;
    vertical-align: middle;
}
.box-section8 .over_slideB{
    position: relative;
    z-index: 99;
}
.box-section8 .hlight{
    background:#ffe156;
    height: 30px;
    transition-delay: 0.5s; 
}
.box-section8 .hlight1{
    left: 29%;
    top: 18.8%;
}
.box-section8 .swiper-slide-active .hlight1{
    width:42%;
}
.box-section8 .hlight2{
    left: 27%;
    top: 22.8%;
}
.box-section8 .swiper-slide-active .hlight2{
    width:46%;
}
.box-section8 .swiper-pagination1{
    bottom:-80px;
}
.box-section8 .swiper-pagination-bullet{
    width:16px;
    height:16px;
    opacity: 1;
    background:#fff;
    margin:0 8px !important;
}
.box-section8 .swiper-button-next, .box-section8 .swiper-button-prev{
    margin-top:50px;
    opacity: 0.5;
}
.box-section8 .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background:#7a6a55;
}
/* section9 */
.box-section9 {
    padding-top:0px;
    background-image: url("img/section9.png");
    background-position:50% top;
    background-color:#f3f3f3;
    height:600px;
    background-size: auto;
}
.title-section9{ 
    top:150px; 
    text-align: center;
}
.flex-section9-1{
    display: flex;
    align-items: flex-start; 
    position: absolute;
    height:600px;
    right: 50%;
    width: 600px;
    flex-direction: column;
    justify-content: center;
    gap:40px;
    z-index: 99;
}
.flex-section9-2{
    position:absolute;
    left:50%;
    margin-left:-150px;
    top:50%;
    transform: translateY(-50%);
}
.flex-section9-2::after{
    content:'';
    display:block;
    left:0;
    top:0;
    bottom:0;
    width:100px;
    height:110%;
    background:url("img/over_section9.png") repeat-y center center;
    position:absolute;
    z-index: 9;
    opacity: 1;
}
.box-section9 .swiper-slide{
    width:auto;
}
.box-section9 .swiper-slide img{
    width:auto;
}
/* section10 */
.box-section10 {
    padding-top:150px;
    background-image: url("img/section10.jpg");
    height:auto;
    background-position:50% top;
}
.title-section10{ 
   text-align: center;
   position: relative;
   padding-top:90px;
}
.wrap-tab{
    padding: 45px 0 15px 0;
 }
 .wrap-tab ul{
     display:flex;
     max-width:815px;
     margin:0 auto;
     justify-content: center;
     padding:0;
 }
 .wrap-tab ul li{
     text-align: center;
    margin:10px;
 }
 .wrap-tab ul li a{
     font-size:22px;
     font-weight:bold;
     line-height: 21px;
     width:175px;
     height:22px;
     padding: 15px 0 19px 0;
     border-radius: 10px;
     background:#7b706c;
     color:#fff;
     display:inline-block;
     
 }
 .wrap-tab ul li a img{
    vertical-align: middle;
 }
 .wrap-tab ul li.on a{
    background: #c72424;
 }
 .tab-box{
    position:absolute;
    left:-99999px;
     max-width:1048px;
     margin:0 auto;
     overflow: hidden;
     text-align: center;
     font-weight:800;
     line-height: 20px;
 }
 .wrapTab_on {
    display: block;
    position: relative;
    left: 0;
}
 .tab-box h3{
     margin-bottom:30px;
 }
 .tab-box h4{
     font-size:25px;
 }
 .grid-box {display: flex;flex-wrap: wrap;width: 100%; padding:0 0px;box-sizing: border-box;   padding-bottom: 140px;font-size:19px;color:#282828;}
 .grid-box .box-line {width:25%;padding:5px;padding-bottom:30px;box-sizing: border-box;}
 .grid-box .box-line .box-image img {width:100%;}
 .grid-box span{
    display:block;
 }
 /* section11 */
.box-section11 {
    padding-top:290px;
    background-image: url("img/section11.webp");
    background-position:50% top;
    background-color:#f3f3f3;
    height:auto
}
.title-section11{ 
   text-align: center;
   position: relative; 
}
.box-section11 .swiper-button-next:after,.box-section11 .swiper-button-prev:after{
    color:#af8865;
}
.box-section11 .swiper-slide{
    -moz-box-shadow:0px 0px 2px rgb(0 0 0 / 50%); 
    -webkit-box-shadow:0px 0px 2px rgb(0 0 0 / 50%); 
    box-shadow:0px 0px 2px rgb(0 0 0 / 50%); 
}
.box-section11 .swiper-slide img{
    width: 100%;
    vertical-align: middle;
    margin-top:18px;
}
.foot-section11{
   text-align: center;
   padding-bottom:150px;
}
.swiper {
    width: 100%;
    height: 100%;
}
.wrap-box2{
    max-width:1200px;
    margin:0 auto;
    padding: 60px 0 100px;
    text-align: center;
}
.wrap-box2 h3{
    font-size:26px;
    margin:0;
    margin-bottom:10px;
}
.wrap-box2 span{
    font-size:18px;
    display:block;
}
.wrap-box2 .mySwiper2 {
    padding:2px 2px;
}
.box-section3 .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.wrap-slide01{
    max-width: 1125px;
}
.box-section6 .swiper-button-next, .box-section6 .swiper-button-prev{
    color:#000;
    display:inline-block;
    width: 22px;
    height: 44px;
}
.box-section6 .swiper-button-next{
    background: url("img/section6_n.png");
    right:-40px;
    background-repeat: no-repeat;
}
.box-section6 .swiper-button-prev{
    background: url("img/section6_p.png");
    left:-40px;
    background-repeat: no-repeat;
}
.box-section6 .swiper-button-next:after, .box-section6 .swiper-button-prev:after {
    color: #fff;
    font-size: 28px;
    display:none;
}
.mySwiper01 .swiper-slide{
    width:270px;
}
.swiper-slide img {
    display: block;
    width: 100%;
}
.box-section11 .swiper-slide {
    text-align: center;
    background:url("img/bg_ns.gif") no-repeat left top;
    padding-top:90px;
    color:#222;
}
.box-section11 .swiper-slide a{
    color:#222;
}
.box-section11 .swiper-slide img {
    display: block;
    width: 100%;
}
.swiper-slide img.over_slide{
    width:560px;
    left:0;
}
@keyframes pop-up {
    0% {
      opacity: 0;
      transform: translateY(4rem) scale(.8);
    }
    100% {
      opacity: 1;
      transform: none;
    }
  }
 /* section12 */
 .box-section12 {
    height:auto;
 }
.box-section12 .in-section12{
    padding:120px 0 116px;
    background-image: url("img/section12.jpg");
    background-position:50% top;
    background-color:#f3f3f3;
    height:auto;
}
.top-section12{
    height:90px;
    background:url(img/foot-section12.png) repeat-x 50% bottom;
}
.foot-section12{
    height:90px;
    background:url(img/foot-section12.png) repeat-x 50% bottom;
}
.sub_wrap{
    text-align: center;
}
.iframe{
    position: relative;
    max-width:1000px;
    margin:0 auto;
}
.iframe iframe{
    width:100%;
    bottom:0;
    height:562.5px;
}
.video ul{
    max-width:1110px;
    margin:0 auto;
    display:flex;
    padding:0;
}
.video .sub_wrap ul li{
    padding:5px;
    box-sizing: border-box;
    width: 25%;
    box-sizing: border-box;
}
.video ul img{
    max-width:100%;
    vertical-align: middle;
}
 /* section13 */
 .box-section13{
    background-image: url("img/section13.webp");
    background-position:50% top;
    background-color:#ececec;
    height: auto;
    padding:130px 0 0px;
    box-sizing: border-box;
    height:1234px;
    background-size: auto;
}


.wrap-qna{
    max-width:730px;
    margin:0 auto;
    padding-top:25px;
}
.wrap-qna .q-list{
    padding-top:15px;
}
.wrap-qna .q-list a{
    display:block;
    position: relative;
}
.wrap-qna .q-list a:after{
    content:'';
    display:block;
    width:100%;
    height:100%;
    background:url("img/qa.png") no-repeat left center;
    position:absolute;
    right:0;
    top:0;
    width:43px;
    height:43px;
    rotate: 180deg;
}
.wrap-qna .q-list a.on-qna:after{
    rotate: 0deg;
}
.wrap-qna .q-list a + div{
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
    visibility: hidden;
    max-height:0;
    padding:0 30px;
    padding-left:110px !important;
    background:rgb(255 255 255 / 60%);
    border-radius: 12px;
    position: relative;
    font-size:20px;
    line-height:1.5em;
    text-align: left;
}
.wrap-qna .q-list a.on-qna + div{
    opacity: 1;
    max-height:400px;
    visibility: visible;
    padding:25px 30px 20px;
    margin: 20px 0px 20px 0px;
}
.box-section13 div{
   
}
.q-list a{
    font-size:25px;
    font-weight:600;
    color:#2f2f2f;
    padding-left:60px;
    line-height:43px;
    background:url("img/q.png") no-repeat left center;
}
.wrap-qna .q-list a + div:before{
    position: absolute;
    content:"";
    width:43px;
    height:43px;
    background-image: url("img/ask.png");
    background-size:100%;
    background-repeat:no-repeat;
    left: 50px;
    top:50px;
}
.box-section13 .swiper-slide{
    background: none;
}
.title-section13{ 
    text-align: center;
    position: relative;
}
.title-section13B{
    margin-top:45px;
}
.box-section13 .swiper-pagination10{
    bottom:100px;
    left:50%;
    width:50%;
}
.box-section13 .swiper-pagination-bullet{
    width:16px;
    height:16px;
    opacity: 1;
    background:#fff;
    margin:0 8px !important;
}
.box-section13 .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background:#72b4ac;
}
.wrap-slide10{
    max-width:1900px;
    margin:0 auto;
}


.box-section10{
    background-image: url("img/section10.webp");
   background-position:50% 50%;
   background-color:#ececec;
   height: auto;
   color:#fff;
   padding:0px;
   text-align:center;
   background-size: auto;
   height:650px;
}
.wrap-flex-section10{
    max-width: 830px;
    margin: 0 auto;
    margin-top: 225px;
}
.flex-section10{
    display: flex;
    justify-content: space-between;
}
/* section15 */
.box-section15{
   background-image: url("img/section15.webp");
   background-position:50% 50%;
   background-size: auto;
   background-color:#ececec;
   height: auto;
   color:#fff;
   padding:370px 0 10px;
   text-align:center;
   box-sizing: border-box;
   height:1222px;
}

.title-section15{ 
   top:150px; 
   text-align: center;
}
.box-foot-band{
    background-image: url("img/foot_band_pc.webp");
    background-position:50% 50%;
    background-size: auto;
    height: auto;
    color:#fff;
    
    text-align:center;
    box-sizing: border-box;
    height:421px;
}
.a-section15{
    display: inline-block;
    width: 800px;
    height: 100px;
    position: absolute;
    bottom: 0px;
    left: 50%;
    margin-left: -400px;
    }
 /* section14 */
.box-section14{
    background:#837562;
    height: auto;
    color:#fff;
    padding:0 0 70px;
    text-align:center;
}
.box-section14 .title-section14{
    padding:120px 0 50px;
}



footer{
    background:#222;
    padding:50px 0 50px;
    text-align:center;
}
footer img{
    max-width:100%;
    vertical-align: middle;
}
.m_wrap-section .title-section{
    padding:0;
}
.m_wrap-section .title-section img{
    max-width:100%;
}
.m_wrap-section .box-section{
    background-size: 100%;
}
.m_wrap-section .title-section1 {
    top: 15vw;
}
.m_wrap-section .title-section1B {
    top: 58vw;
    padding:1vw 5%;
}
.m_wrap-section .title-section1B.aos-animate .hlight1 {
    width: 38vw;
    top:0;
}
.m_wrap-section .title-section1B.aos-animate .hlight2 {
    width: 51vw;
    top: 16vw;
}
.m_wrap-section .title-section1B .hlight {
    background: #4e3929;
    height: 14vw;
}
.m_wrap-section .box-section1{
    padding:0;
    height:123.85vw;
    box-sizing: border-box;
    background-image:url("img/section_m1.webp");
    background-size:100%;
    background-position: 50% 50%;
}
.m_wrap-section .box-section1 .section1_rightm{
    width: 92.17vw;
    left: 0%;
    top: 0vw;
    padding-top:0;
  
}
@keyframes handle-rotate1 {
    0%   { transform: translateY(-0%) rotate(-2deg); }
    20%  { transform: translateY(-2%) rotate(-1deg); }
    40%  { transform: translateY(1%) rotate(0deg); }
    60%  { transform: translateY(-0%) rotate(1deg); }
    80%  { transform: translateY(-1%) rotate(0deg); }
    100% { transform: translateY(-0%) rotate(-2deg); }
}

.box-section1 .section1_rightm img{
    animation: handle-rotate1 3s infinite linear;
    width: 92.17vw;
    height: 60vw;
    object-fit: cover;
    object-position: 50% 100%;
}
.m_wrap-section .box-section2{
    padding-top:42.76vw;
    padding-bottom:0;
    background-image:url("img/section_m2.webp");
    height:327.379vw;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 50% top;
}
.box-section2 img{max-width:90%;}
.m_wrap-section .box-section2 img{
    max-width:100%;
}
.m_wrap-section .title-section2_1{
    padding-top: 15vw;
}
.m_wrap-section .box-section2-middle{
    padding-top: 57vw;
}
.title-section2_2{
    padding-top: 5vw;
}
.m_wrap-section .box-section2-bottom{
    padding-top: 13vw;
    
}
.m_wrap-section .box-section2-bottom > div{
    margin:1vw 0;
}
.m_wrap-section .box-section3{
    padding-top:22vw;
    padding-bottom:0;
    background-image:url("img/section3_m.webp");
    border:0;
    height: 189.178vw;
    box-sizing: border-box;
    background-position: 50% top;
    background-size: 100%;
}
.m_wrap-section .title-section3 {
    padding:0;
    top: 0vw;
}
.m_wrap-section  .section3_ul{
    padding-top: 5vw !important;
    flex-direction: column;
    gap:2vw;
}

.m_wrap-section .box-section3-bottom{
    padding-top:9vw;
    background-image: url("img/section3-bottom.webp");
    height:31.24vw;
    box-sizing: border-box;

}
.m_wrap-section .wrap-slide0{
    max-width:90%;
}
.m_wrap-section .wrap-slide0 .swiper-slide img.over_slide{
    width:100%;
    top:auto;
    bottom:10vw;
}
.m_wrap-section .box-section3 .swiper-button-prev {
    left: 10px;
    top:20%;
}
.m_wrap-section .box-section3 .swiper-button-next{
    right:10px;
    top:20%;
}
.m_wrap-section  .box-section7 .hlight, .m_wrap-section  .box-section3 .hlight {
    height: 4.5vw;
}
.m_wrap-section .box-section3 .hlight1{
    left: 5%;
    bottom: 5.7%;
}
.m_wrap-section .box-section3 .swiper-slide-active .hlight1{
    width:80%;
}
.m_wrap-section .box-section3 .hlight2 {
    left: 5%;
    bottom: 21.1%;
}
.m_wrap-section .box-section3 .swiper-slide-active .hlight2{
    width:52%;
}
.m_wrap-section .box-section3 .hlight3 {
    left: 5%;
    bottom: 27.3%;
}
.m_wrap-section .box-section3 .swiper-slide-active .hlight3{
    width:55%;
}
.m_wrap-section .box-section4{
    padding-top:17vw;
    padding-bottom:0;
    height:113.82vw;
    box-sizing: border-box;
    background-image:url("img/section4_m.webp");
}
.m_wrap-section .foot-section4{
    margin-top:7vw;
    padding:0 5vw;
}
.m_wrap-section .section4_ul{
    gap:2vw;
}

.m_wrap-section .box-section4B{
    padding-top:20.8vw;
    background-image:url("img/section4B_m.webp");
    position: relative;
    height:282.92vw;
    box-sizing: border-box;
    background-size: auto;
    background-position: 50% top;
    z-index:12;
    overflow: visible;
}
.m_wrap-section .box-section4C .middle_Swiper{
    width: auto;
    position: relative;
    margin-right: 14vw;
    right: 0;
}
.m_wrap-section .title-section4B{top:0vw;margin-bottom:10.4vw;}
.m_wrap-section  .title-section4B-bottom img{
    position: relative;
    z-index: 2;
}
.m_wrap-section .title-section4B-bottom{
    margin:2vw 0;
    background: #fff;
}
.m_wrap-section .title-section4B-bottom1.aos-animate .hlight1{
    width: 66%;
    left: 17%;
    top: 55.5%;
}
.m_wrap-section .title-section4B-bottom2.aos-animate .hlight2{
    width: 84%;
    left: 8%;
    top: 37.5%;
}
.m_wrap-section .title-section4B-bottom3.aos-animate .hlight3{
    width: 63%;
    left: 18.5%;
    top: 60%;
}
.m_wrap-section .title-section4B-bottom3.aos-animate .hlight4 {
    width: 68%;
    left: 16%;
    top: 70%;
    transition-delay: 0.8s;
}
.m_wrap-section  .box-section4B .hlight, .m_wrap-section  .box-section7 .hlight, .m_wrap-section .box-section3 .hlight {
    background: #ffe156;
    height: 4.4vw;
    transition-delay: 0.5s;
}


.m_wrap-section .section4-w1{
    height: auto;
    top:0;
    left:2%;
    max-width:50%;
    animation-name: animation44;
    transform: translateY(-50%);
}

.m_wrap-section .section4-w3{
    height: auto;
    margin: 0;
    left: auto;
    right: 3%;
    margin-bottom:-10vw;
    animation-name: animation333;
    max-width:50%;
    transform: translateY(20%);
}
@keyframes animation333 {
    0%   {bottom: 0px;}
    50%  {bottom: -12px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {bottom: 0px;}
}

@keyframes animation44 {
    0%   {top: 0px;}
    50%  {top: 20px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {top: 0px;}
}



.m_wrap-section .wrap-slide2{
    top:80vw;
    width: calc(100%);
    left: 0px;
}
.m_wrap-section .mySwiper2 .swiper-slide img{
    width:50vw;
}
.m_wrap-section .box-section11 .swiper-button-next:after,.m_wrap-section .box-section11 .swiper-button-prev:after{
    color:#fff;
    margin-top:-20vw;
}

.m_wrap-section .box-section4C{
    padding-top:20.8vw;
    background-image:url("img/section4c_m.webp");
    position: relative;
    height:165.05vw;
    box-sizing: border-box;
    background-size: auto;
    background-position: 50% top;
    z-index:2;
    overflow: visible;
}
.m_wrap-section .box-section4D{
    padding-top:20.8vw;
    background-image:url("img/section_m5.webp");
    position: relative;
    height:534.02vw;
    box-sizing: border-box;
    background-size: 100%;
    background-position: 50% bottom;
    z-index:2;
    overflow: visible;
}
.m_wrap-section .title-section4D1{
    padding-top:11vw;
}
.m_wrap-section .section3-Swiper .swiper-slide{
    width:40%;
    max-width:314px;
}
.m_wrap-section .section4-Swiper .swiper-slide{
    width: 70%;
    max-width:557px;
}
.m_wrap-section .middle_SwiperB {
    position: relative;
    left: 0;
    top: 0;
    margin-left: 16vw;
    margin-top:10px;
    overflow: visible;
}

.m_wrap-section .section5_top{
    width:auto;
    height:auto;
    background:none;
    padding:0;
}
.m_wrap-section .box-section5{
    padding-top:40vw;
    height:174.7vw;
    box-sizing: border-box;
    background-image:url("img/section5_top_m.webp");
    background-size:100%;
   
}

.m_wrap-section .section5_top2 {
    padding: 8vw 0 6vw;
}

.m_wrap-section .box-section5 img{
    max-width:100%;
}  
.m_wrap-section img{
    vertical-align: middle;
}
.m_wrap-section .box-section5B{
    padding-top:16.9vw;
    height:auto;
    box-sizing: border-box;
    background-image:url("img/section5B_m.webp");
    background-size:100%;
    background-position: 50% top;
    height:298vw;
}


.m_wrap-section .title-section5 {
    top: 15vw; 
}
.m_wrap-section .wrap-section5{
    padding:5vw 0%;
    flex-direction: column;
    text-align: center;
    gap:4vw;
}
.m_wrap-section .wrap-section5:nth-child(2) img{
    padding:15px 0 0;
}
.m_wrap-section .section5-section-bottomA {
    padding:19vw 0% 6vw;
}
.m_wrap-section .wrap-section5B .in-section5{
    padding:0px 0 0vw;
}
.m_wrap-section .wrap-section5 .in-section5{

}
.m_wrap-section .section5-section-bottomA{

}
.m_wrap-section .wrap-section5 img{
    max-width:100%;
}
.m_wrap-section .section5-section-bottomB{
    padding:4vw 0%;
}
.m_wrap-section .section5-section-bottomC{
    padding:20vw 0% 7vw;
}
.m_wrap-section .box-section6{
    padding-top:29vw;
    padding-bottom:0vw;
    box-sizing: border-box;
    height:auto;
    background-image:url("img/section6_m.webp");
    background-size:100%;
    background-position: 50% top;
    height:299.34vw;
}
.m_wrap-section .title-section6{
    top:0vw;
    padding-bottom:8vw;
}
.m_wrap-section .swiper-black0{
    bottom:50px;
}
.m_wrap-section .box-section6 .swiper-button-prev {
    background: url(img/section6_p.png);
    left: -6vw;
    background-repeat: no-repeat;
    background-size:4vw;
    background-size:12px;
    background-position: 50% 50%;
}
.m_wrap-section .box-section6 .swiper-button-next {
    background: url(img/section6_n.png);
    right: -6vw;
    background-repeat: no-repeat;
    background-size:4vw;
    background-size:12px;
    background-position: 50% 50%;
}

.m_wrap-section .box-section6 .hlight{
    background:#ffe156;
    height: 4.8vw;
    transition-delay: 0.5s; 
}
.m_wrap-section .box-section6 .hlight1{
    left: 7%;
    bottom: 9.4vw;
    top:auto;
}
.m_wrap-section .box-section6 .hlight2{
    left: 7%;
    bottom: 41.7%;
}
.m_wrap-section .box-section6 .swiper-slide-active .hlight2{
    width:44.5%;
}
.m_wrap-section .box-section6 .hlight3{
    left: 38.5%;
    bottom: 34%;
}
.m_wrap-section .box-section6 .swiper-slide-active .hlight3{
    width:42%;
    transition-delay: 0.8s;
}
.m_wrap-section  .wrap-slide01{
    width:86vw;
    margin:0 auto;
}
.m_wrap-section .mySwiper01 .swiper-slide{
    width:40vw;
}

.m_wrap-section .box-section6 .swiper-slide-active .hlight1{
    width:83%;
}
.m_wrap-section img{
    max-width:100%;
}
.m_wrap-section .box-section7{
    padding-top:56vw;
    background-image:url("img/section7_m.webp");
    position: relative;
    z-index: 23;
    overflow: visible;
    background-size: cover;
    padding-bottom:20vw;
}
.m_wrap-section .title-section7{top:20vw;}
.m_wrap-section .box-section7 .xe_width{
    padding:0 5%;
}
.m_wrap-section .title-section7-bottom{
    padding:7vw 0;
    margin:2vw 0;
}
.m_wrap-section .title-section7-bottom1.aos-animate .hlight1{
    width: 66%;
    left: 17%;
    top: 57%;
}
.m_wrap-section .title-section7-bottom2.aos-animate .hlight2{
    width: 84%;
    left: 8%;
    top: 38%;
}
.m_wrap-section .title-section7-bottom3.aos-animate .hlight3{
    width: 63%;
    left: 18.5%;
    top: 56.6%;
}
.m_wrap-section .title-section7-bottom3.aos-animate .hlight4 {
    width: 68%;
    left: 16%;
    top: 67.8%;
    transition-delay: 0.8s;
}
.m_wrap-section .section6-w1{
    height: auto;
    top:0;
    left:2%;
    max-width:50%;
    animation-name: animation44;
    transform: translateY(-50%);
}

.m_wrap-section .section6-w3{
    height: auto;
    margin: 0;
    left: auto;
    right: 3%;
    animation-name: animation33;
    max-width:50%;
    transform: translateY(20%);
}
@keyframes animation33 {
    0%   {bottom: 0px;}
    50%  {bottom: -12px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {bottom: 0px;}
}

@keyframes animation44 {
    0%   {top: 0px;}
    50%  {top: 20px; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);}
    100% {top: 0px;}
}
.m_wrap-section .box-section8{
    padding: 21vw 0 0vw;
    background-image:url("img/section8_m.webp");
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    height:323.46vw;
    overflow: visible;
    background-size: 100%;
    background-position: 50% 50%;
}
.m_wrap-section  .wrap-box8{
    padding-top:10vw;
}
.m_wrap-section .wrap-box8-2 {
    margin-top: 9vw;
}
.m_wrap-section .box-section8 .hlight{
   height:4.5vw;
}
.m_wrap-section .box-section8 .hlight1{
    top:23.5%;
    left:22%;
}
.m_wrap-section .box-section8 .swiper-slide-active .hlight1{
    width:56%
}
.m_wrap-section .box-section8 .hlight2{
    top:18.8%;
    left:11.5%;
}
.m_wrap-section .box-section8 .swiper-slide-active .hlight2{
    width:77%
}
.m_wrap-section .box-section9{
    padding-top:30vw;
    box-sizing: border-box;
    background-image:url("img/section9_m.png");
    height:130.37vw;
}
.m_wrap-section .flex-section9-1 {
    display: flex;
    align-items: flex-start;
    position: absolute;
    height:auto;
    right: 0%;
    width: 100%;
    top:20vw;
    flex-direction: column;
    justify-content: center;
    gap: 0px;
    z-index: 99;
}
.m_wrap-section .flex-section9-2 {
    position: absolute;
    left: 0%;
    margin-left:0px;
    top: 45%;
    transform: translateY(0%);
}
.m_wrap-section .flex-section9-2 img{
    width:28vw;
}
.m_wrap-section .title-section9{
    top:15vw;
}
.m_wrap-section .flex-section9-2::before {
    content: '';
    display: block;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100px;
    height: 110%;
    background: url(img/over_section9.png) repeat-y center center;
    position: absolute;
    z-index: 9;
    opacity: 1;
    transform: rotate(180deg); /* 180도 회전 추가 */
}
.m_wrap-section .box-section10{
    padding-top:20vw;
    height:117.34vw;
    box-sizing: border-box;
    background-image:url("img/section10_m.webp");
    background-size:100%;
    background-position: 50% 50%;
}
.m_wrap-section .wrap-flex-section10{
    max-width: 65vw;
    margin: 0 auto;
    gap:5vw 7vw;
    margin-bottom:7vw;
}
.m_wrap-section .flex-section10 {
    flex-wrap: wrap;
    gap:6vw 5vw;
}
.m_wrap-section .flex-section10 > div{
    width:29vw;
    height:27.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding:7vw;
    
}
.m_wrap-section .tab-bottom{
    padding:0 5%;
    margin:0 -7px;
}
.title-section10m img{
    width:100%;
    vertical-align: bottom;
}
.m_wrap-section .wrap-slide1{
    padding:0;
}
.m_wrap-section .box-section11{
    padding-top:40vw;
    background-image:url("img/section_m11.webp");
    background-size:cover;
}
.m_wrap-section .wrap-box2{
    padding: 10vw 0 0vw;
}
.m_wrap-section .foot-section11 {
    text-align: center;
    padding:0 5%;
    padding-top:45px;
    padding-bottom: 60px;
}
.m_wrap-section .foot-section12,
.m_wrap-section .top-section12{
    height: 45px;
    background-size: 960px;
}
.m_wrap-section .box-section12 .in-section12{
    padding:15vw 5%;
}
.m_wrap-section .iframe iframe{
    height:50vw;
}
.m_wrap-section .video ul{
    margin:0 -3px;
}
.m_wrap-section .video .sub_wrap ul li{
    padding:3px;
    padding-bottom:0;
}
.m_wrap-section .wrap-tab ul{
    flex-wrap: wrap;
    padding:0 15%;
    justify-content: space-between;
}
.m_wrap-section .wrap-tab ul li{
    margin: 1%;
    width: 48%;
}
.m_wrap-section .wrap-tab ul li a{
    width:auto;
    display:block;
}
.m_wrap-section .wrap-tab ul li:nth-child(1) {

    flex-grow: 0; /* 두 번째 li 오른쪽 여백 추가 (필요에 따라 조절) */
}
.m-footer{
    padding: 100px 8.27% 90px;   
}
.m_wrap-section .root-width{
    padding:0; 
}
.m_wrap-section .box-section13{
    padding-top:16.5vw;
    padding-bottom:16vw;
    background-image:url("img/section13_m.webp");
    background-size:cover;
    box-sizing: border-box;
    min-height:211.99vw;
    height:auto;
    overflow: visible;
   
}
.m_wrap-section .box-section13:after {
    height: 40px;
    background-image: url(img/section13_foot.jpg);
    margin-top: 40px;
    height:0;
    background:none;
}
.m_wrap-section .wrap-qna .q-list a + div:before {
    width:34px;
    height: 34px;
    left: 20px;
    top: 30px;
}
.m_wrap-section .wrap-qna .q-list a + div {
    padding-left:70px !important;
    font-size:15px;
}
.m_wrap-section .wrap-qna .q-list a.on-qna + div  {
    padding: 15px 20px 10px;
    margin: 20px 20px 20px 20px;
}
.m_wrap-section .wrap-qna .q-list a + div br{
    display:none;
}
.m_wrap-section .wrap-qna .q-list{
    padding-top:5px;
}
.m_wrap-section .title-section13{
    top:0vw;
    margin-top:10vw;
}
.m_wrap-section .box-section13 .swiper-pagination10{
    bottom: 15vw;
    left: 0%;
    width: 100%;
    height:auto;
}
.m_wrap-section .wrap-box13{
    padding:0 5.2vw;
}
.m_wrap-section .q-list a {
    font-size: 3.6vw;
    font-weight: 600;
    color: #2f2f2f;
    padding:0 4vw 0.5vw 8vw;
    line-height: 6.5vw;
    background: url(img/q.png) no-repeat left center;
    background-size: 7vw;
}
.m_wrap-section .wrap-qna .q-list a:after {
    content: '';
    display: block;
    background: url(img/qa.png) no-repeat left center;
    background-size: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 6vw;
    height:6vw;
    rotate: 180deg;
}
.m_wrap-section .wrap-qna .q-list a.on-qna:after {
    rotate: 0deg;
}
.m_wrap-section .wrap-qna .q-list a + div:before {
    width: 6vw;
    height: 6vw;
    left: 20px;
    top: 30px;
}
.m_wrap-section .box-section15 {
    background-image: url(img/section15_m.webp);
    padding: 20vw 0 15vw;
    text-align: center;
    background-size: 100%;
    height:202.47vw;
    box-sizing: border-box;
    background-position: 50% 50%;
}
.m_wrap-section .box-foot-band{
    background: none;
    height: auto;
    color: #fff;
    text-align: center;
    box-sizing: border-box;
}
.m_wrap-section .title-section15m{
    margin-bottom: 28vw;
}
.m_wrap-section .in-section15{
    padding:0 5%;
}
.m_wrap-section  .a-section15{
    height:12vw;
}
.m_wrap-section .box-section14{
    padding: 38vw 0 15vw;
}
.m_wrap-section .title-section14{
    top:15vw;
}
.wrap-form{
    max-width:1100px;
    margin:0 auto;
    padding:0 36px;
    padding-bottom:10px;
    box-sizing: border-box;

}
.wrap-form .ap_form fieldset > div{
    margin:12px 0px 3px ;
    width:calc(50% - 28px);
    padding: 11px 20px 11px 200px;
    border-radius: 34px;
    
}
 .js .box-section14 .floating-labels label{
    left:35px;
}
.ap_form fieldset > div.ap_extra{
	
}
.m_wrap-section .ap_form fieldset > div.ap_message label{
    text-align: left;
}
.wrap-form .ap_form input[type="email"],
.wrap-form .ap_form input[type="tel"],.wrap-form .ap_form input[type="text"],
.wrap-form .ap_form input:disabled, .wrap-form .ap_form select:disabled,.wrap-form .ap_form textarea:disabled{
    background:#fff !important;
    box-shadow: 0px 0px 7px rgb(0 0 0 / 20%) !important;
    border: 0 !important;
    font-size: 20px;
    font-weight: 400;
    color: #333;
    border-radius: 10px;
}
#box-section14 .root-width .ap_form .ap_submit_info input[type="submit"] {
    background: #2a241b !important;    
    width: 280px;
    line-height: 30px;
    padding: 20px 50px;
    height:70px;
    font-size: 23px;
    border-radius: 10px;
    box-shadow: 0px 0px 5px rgb(0 0 0 / 20%) !important;
    border:0 !important;
    
}
.box-foot-band img{
    vertical-align: middle;
    max-width:100%;
}
.js .wrap-form .floating-labels label{
    color:#fff;
    font-size:22px;
    font-weight:400;
}
.js .wrap-form .floating-labels .ap_privacy label{
    font-size:18px;
}
.js .wrap-form .floating-labels .ap_basic_info label{
    top: 11px;
    line-height: 60px;
    left:35px;
    text-align:left;
    overflow: hidden;
    width:140px;
    background-repeat: no-repeat;
    background-position: left 50%;
}
.js .wrap-form .floating-labels .ap_basic_info .rx_ev_radio label{
    width:128px;
}
.a-najoo{
    display: block;
    font-size: 16px;
    line-height: 20px;
    padding: 10px 0;
    border-radius: 10px;
    width: 100%;
    font-weight: 500;
    margin-top: 10px;
    color:#fff;
    margin-top:10px;
    background: #775a40 !important;
    font-family: 'NanumSquareNeo-Variable';
}
/*
div[rel="nick_name"] > label {
    background-image: url("img/f1.png");
    text-indent:-999px;
}
div[rel="phone_number"] > label {
    background-image: url("img/f2.png");
    text-indent:-999px;
}
div[rel="email"] > label {
    background-image: url("img/f3.png");
    text-indent:-999px;
}
div[data-idx="1"] > label {
    background-image: url("img/f4.png");
    text-indent:-999px;
}
div[data-idx="2"] > label  {
    background-image: url("img/f5.png");
    text-indent:-999px;
}
div[data-idx="3"] > label  {
    background-image: url("img/f6.png");
    text-indent:-999px;
}
div.ap_message > label {
    background-image: url("img/f7.png");
    text-indent:-999px;
    overflow: hidden;
    width:142px;
    background-repeat: no-repeat;
    background-position: left 50%;
}
    */
.js .wrap-form .floating-labels .ap_basic_info .rx_ev_radio label{
    top:0;
    text-align: center;
}
.form-top h2 {
    margin-bottom:15px;
}
.form-top h2 img{
    width:260px;
    max-width:60%;
}
.form-top h3{
    color:#4c4c4c;
    font-size:30px;
    margin-top:0;
    margin-bottom:34px;
}
.box-section11 .root-width{
    position:relative;
}
.form-right{
    position:absolute;
    right:215px;
    -webkit-transition: all 400ms;-moz-transition: all 400ms;-o-transition: all 400ms;transition: all 400ms;
    opacity: 0;
}
.quick_form{
    opacity: 1;
}
.wrap-form-right{
    position:fixed;
    top:200px;
    
}
.ap_form ul.rx_ev_radio {
    display: flex;
    padding: 0;
    margin: 0 -3px;
}
.ap_form ul.rx_ev_radio li {
    flex: 1;
    margin: 0 3px;
    top: 0;
}
.ap_form ul.rx_ev_radio li input[type=radio]+label {
    width: 100%;
    padding: 0;
    display: block;
    text-align: center;
    height: 60px;
    background: #fff;
    top: 0;
    line-height: 60px;
    cursor: pointer;
    border: 0;
    color: #000;
    border-radius: 10px;
    box-shadow: 0px 0px 5px rgb(0 0 0 / 20%) !important;
    border: 0 !important;
}
.ap_form ul.rx_ev_radio li input[type=radio]:checked+label{
    background: #ffebbc;
}
.ap_form .ap_item textarea{
    border-radius: 10px;
    box-shadow: 0px 0px 5px rgb(0 0 0 / 20%) !important;
}
.fix-right{
    width:210px;
    background:#fff;
    box-sizing: border-box;
    border-radius: 10px;
    padding:15px 20px;
    border:2px solid #af8865;

}
.fix-right h2{
    margin:0;
    padding-top:10px;
}
.fix-right h2 img{
    width:60%;
}
.ap_form .ap_submit_info ul.ap_section li:nth-child(2){
    display:block;
    margin-top:25px;
}
.to-home-quick{
    margin-top:15px;
    display:block;
}
.box-section11 .fix-right h2{
    margin-bottom:10px;
    font-size:0;
}
.quick_foot{
    position:fixed;
    z-index:9;
    bottom:0;
    left:0;
    width:100%;
}
.quick_foot ul {
    display: flex;
    align-items: center;
    justify-content: center;
    margin:0;
    background:#5f4f43;
    padding:3vw 0;
}
.quick_foot ul li{
    width: calc(100% / 2);
    text-align:center;
    position: relative;
}
.quick_foot ul li img{
    height:40px;
    max-width:80px;
    vertical-align: middle;
}
.quick_foot ul li:after{
    content:"";
    width:1px;
    height:38px;
    background:#fff;
    position:absolute;
    left:0;
    top:50%;
    margin-top:-19px;
}
.quick_foot ul li:first-child:after{
    display:none;
}
.ap_form .ap_submit_info .ap_privacy .ap_privacy_content{
    background:#af8865!important
}
.ec .complete{
    padding:42vh 0 30vh;
    text-align: center;
}
.ec .complete img{
    max-width:80%;
}

@media all and (max-width: 1500px) {
    .box3-left{
        left:-8%;
    }
    .box3-right {
        right:-8%; 
    }
}
@media all and (max-width: 992px) { 
    header{
        background: #e5ddd0;
        -moz-box-shadow: 0px 3px 6px rgb(0 0 0 / 7%);
        -webkit-box-shadow: 0px 3px 6px rgb(0 0 0 / 7%);
        box-shadow: 0px 3px 6px rgb(0 0 0 / 7%);
    }
    
    .wrap-mobile .in-header ul img{
        height:20px;
    }
    .wrap-form{
        padding:0;
    }
    .to-form{
        position: absolute;
        width: 52%;
        height: 0px;
        padding-top: 12%;
        overflow: hidden;
        text-indent: -9999px;
        top: 43%;
        left: 6%;
        margin-left: 0;
        display: block;
    }
    .to-form2{
        position: absolute;
        width: 78%;
        height: 0px;
        padding-top: 15%;
        overflow: hidden;
        text-indent: -9999px;
        top: 85.6%;
        left: 11%;
        margin-left: 0;
        display: block;
    }
    .in-header{
        padding:0;
    }
    .in-header h1 {
        position: relative;
        left: 0;
        top: 0%;
        width: 100%;
        text-align: center;
        margin: 0px;
        min-height: 60px;
        line-height:60px;
        background: none;
    }
    .in-header h1 img {
        vertical-align: middle;
        width: 180px;
        padding: 10px 0 5px 0;
    }
    nav ul {
        display: flex;
        justify-content: space-evenly;
        margin: 5px 0;
        padding:0;
        text-align: center;
    }
    nav ul li {
        padding: 0;
    }
  
    nav ul li a {
        line-height: 20px;
        color: #111;
        font-size: 18px;
        padding: 8px 0 12px;
    }
    .wrap-section{
        padding-top:0;
    }
    .m_wrap-section .target-span {
        top: -100px;
        height: 100px;
    }
    .m_wrap-section .target-span#target1{
        
    }
    .wrap-form-right{
        display:none;
    }
    .section5-top{
        height: 51.238vw;
        background-image: url(img/section5_top_m.png);
        background-position: 50% 70%;
        background-size:100%;
    }
    .section5-bottom {
        height: 21.1vw;
    }
    .box-section14 .title-section14{
        padding:0vw 0 4vw;
    }
    .box-section14 .title-section14 img{
        width:100%;
        vertical-align: middle;
    }
    footer{
        padding:0px 0;
    }
}
@media all and (max-width: 760px) {
    footer{
        padding-bottom:60px;
    }
   .m-footer{
        padding: 13vw 8.27% 90px;   
    }

    .wrap-form .ap_form fieldset > div{
        width:100%;
        padding: 4px 20px 4px 140px;
        margin-top:3px;
    }

    .grid-box{
        font-size:17px;
        padding-bottom:0vw;
    }
    .tab-box{
        font-weight:600;
    }
    .grid-box .box-line {
        width: 33.333%;
        padding: 0 7px 30px !important;
        box-sizing: border-box;
    }
    .js .wrap-form .floating-labels .ap_privacy label{
        font-size:12px;
    }
    .ap_form .ap_submit_info .ap_privacy .ap_popup_trigger{
        font-size:10px !important;
    }
    div.ap_message > label,
    .js .wrap-form .floating-labels .ap_basic_info label{
        left:15px;
        top:5px;
        background-size: 100px;
        width:120px;
    }
    
    .js .wrap-form .floating-labels .ap_basic_info .rx_ev_radio label{
        width:auto;
    }
}
@media all and (max-width: 520px) {
    
    .ec .complete{
        padding:35vh 0 20vh;
        text-align: center;
    }
   .m-header nav ul li a {
        font-size:18px;
       
    }
   .m-header.in-header h1{
        padding-top:35px;
    }
   .m-header.quick_header {
        position: fixed;
        top: -82px;
    }
   .m-box-section4 .middle-section4{
        margin: 9.12% 5.21%;
    }
   .m-box-section4 .text-section4 {
        padding: 0 12.1% 2.6%;
    }
   .m-box-section4 .mySwiper2 .swiper-slide{
        width:20%;
    }
   .m-box-section4 .mySwiper2 .swiper-slide img{
        width:100%;
    }
   .m-box-section4 .slide-section4{
        padding:4vw 0 8vw;
    }
   .m-box-section5 .tab-section5{
        padding-bottom:12.77%;
    }
   .m-box-section5 .tab-box{
        padding-top:39.3%;
    }
   .wrap-tab ul li a{
        width:40vw;
        font-size: 20px;
        line-height: 20px;
    }
    .wrap-tab ul li a img{
        height:4vw;
    }
    .grid-box .box-line {
        width: 50%;
        padding: 0 1.2vw 4vw !important;
        box-sizing: border-box;
    }
   .m-box-section5 h2{
        padding:13vw 10.2% 10vw;
    }
   .m-box-section5 .wrap-tab{
        padding-bottom:5vw;
    }
   .c-div{
        max-width:80%;
        margin:0 auto;
    }
   .c-div img{
        width:70%;
    }
   .c-div1 img{
        width:100%;
    }
    nav ul li a{
        font-size: 15px;
    }
    .box-section5 .swiper-slide{
        width:70%;
    }
    .form-top h3{
        font-size:5.5vw;
        margin-top:0;
        margin-bottom:34px;
    }
    #box-section14 .root-width .ap_form .ap_submit_info input[type="submit"] {  
        width: 220px;
        line-height: 30px;
        padding: 15px 50px;
        height:60px;
        font-size: 18px;
        border-radius: 10px;
        box-shadow: 0px 0px 5px rgb(0 0 0 / 20%) !important;
        border:0 !important;
    }
  
    .wrap-form .ap_form input[type="email"], .wrap-form .ap_form input[type="tel"], .wrap-form .ap_form input[type="text"], .wrap-form .ap_form input:disabled, .wrap-form .ap_form select:disabled, .wrap-form .ap_form textarea:disabled,
    .js .wrap-form .floating-labels label{
        font-size:16px;
    }
    .wrap-tab ul li{
        margin: 2vw
    }
    .wrap-tab {
        padding: 5vw 0 5vw 0;
    }
    .wrap-tab ul li a{
        padding: 12px 0 13px 0;
    }
}
@media all and (max-width: 420px) {
    .wrap-mobile .in-header ul img{
        height:16px;
    }
    .m_wrap-section .wrap-tab ul{
        padding:0 17%;
    }
    }
@media all and (max-width: 360px) {
   .m-header nav ul li a {
        font-size:16px;
    }
}
.wrap-new_pop{
    padding-bottom:10px;
  }
.wrap-new_pop input{display:none;}
.wrap-new_pop > div {padding-top:5px;}
.wrap-new_pop > div > a:first-child{right:34px !important;}
.wrap-new_pop{-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.3);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.3);box-shadow:0 1px 3px rgba(0,0,0,0.3);overflow:hidden;}
.wrap-new_pop a img{max-width:100%;}
.wrap-new_pop > div > a:last-child{font-family: Arial !important;font-weight:400 !important;padding-top:4px;}
.wrap-new_pop > div > a:first-child{white-space: nowrap;font-size:16px;}
.wrap-new_pop > div > a{color:#111;}
@media all and (max-width: 380px) {
    .wrap-new_pop > div > a:first-child {
         font-size:13px;
     }
 }
@media (max-width: 350px){
    .wrap-mobile .in-header ul img {
        height: 12px;
    }
    .ap_form .ap_submit_info .ap_privacy .ap_popup_trigger:before{
        clear:both;
        content:"";
    }
    .js .wrap-form .floating-labels .ap_privacy label{
        padding-left:24px;
        font-size:10px;
    }
 }
 .marquee2,
 .marquee1,
 .marquee{overflow:hidden;width:100%}
 .marquee .marquee__track{display:flex;will-change:transform;animation:marquee var(--marquee-speed,24s) linear infinite reverse;}
 .marquee1 .marquee__track{display:flex;will-change:transform;animation:marquee1 var(--marquee-speed,160s) linear infinite}
 .marquee2 .marquee__track{display:flex;will-change:transform;animation:marquee var(--marquee-speed,24s) linear infinite;}
 .marquee1:hover .marquee__track,
 .marquee:hover .marquee__track{animation-play-state:paused}
 .marquee .marquee__item{margin-right:20px;}
 .marquee1 .marquee__item{margin-right:20px;}
 .marquee2 .marquee__item{margin-right:45px;}
 .marquee__item img{display:block;height:auto}
 @keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
 @keyframes marquee1{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
 @media (prefers-reduced-motion: reduce){.marquee__track{animation:none}}



 .m_wrap-section .marquee .marquee__item{
    width: 40%;
    max-width: 314px;
    margin-right:10px;
 }