/* 여기에 작업 또는 수정할 당신의 css style을 설정하세요. (customizations) */
@font-face {
    font-family: 'Gyeonggi_Batang_Regular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2410-3@1.0/Batang_Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'NostalgicDesertYeonwoo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2508-2@1.0/Griun_YEONWOO-Rg.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,400;6..96,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital,wght@0,400..700;1,400..700&family=Noto+Sans+KR:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital@0;1&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+KR:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&display=swap" rel="stylesheet">
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@600;700&display=swap');




*{margin:0;padding:0;font-family: "Montserrat", sans-serif;}
a,span,div,button,input,label,tr,td,th,table,caption,h1,h2,h3,h4,h5,h6,em,strong,b,p,ul,li{color:#000;}
a{text-decoration:none;}
/*a:hover{color:inherit !important;}*/
ul,li{list-style:none;}

.eng{font-family: "EB Garamond", serif;}
.font{font-family: "bodoni-std", sans-serif;font-weight: 500;}
.font2{font-family: 'NostalgicDesertYeonwoo';}
.eb-backtotop:after{display: none;}

.back-to-top svg.icon__arrow-up{fill: #fff !important;}
.eb-backtotop svg path{fill:#fff !important;}
.navbar-nav .dropdown-mega-menu,.header-title{display: none !important;}
.top-header{text-align: center;width:100%; background: #4c4948; height:50px; line-height: 50px; border-bottom: none;}
.top-header.active{display: none;}
.main-wrap{margin:0;}
.header-wrap.close .nav-wrap{top:0;}
.top-header > div{width:100%; max-width:none; padding:0; position: relative;}
.top-header a{color:#fff; display: block; width:100%;}
.top-header .top-close{color:#fff; position: absolute; right:60px; bottom:0; cursor:pointer; z-index:5;} 
.top-header .top-close i{font-weight: 600;font-size: 17px;}	
.nav-wrap{display: flex; height: 100px;align-items: center;border-bottom: 1px solid rgba(207, 215, 227, 0.4); width:95%; margin:0 auto; position: fixed;top: 50px;
left: 0; right: 0; z-index: 100; transition: all 0.4s;  background: none;}
.nav-wrap .container{}
.nav-wrap .title-logo{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.header-wrap{color:#fff; border-bottom: none; background: none;}
.header-wrap.active{}
.header-wrap.active .nav-wrap{border-bottom: none; top:0;background: #d1cdcce6; width:100%;}
.header-wrap.active .nav-wrap .header-con{width:95%; margin:0 auto;}
.header-wrap.active .navbar-nav a{color:#4c4948;}
.basic-body{padding:0;}
.main-con{width:100%;max-width:100%;padding-right:0;padding-left:0;}
.basic-body-main.left-main {width: 100% !important; padding:0;}
.navbar-nav{gap:25px;}
.navbar-nav-home{display: none;}
.navbar-nav a, .navbar-toggler{color:#fff;}
.navbar-nav a:hover,.navbar-toggler{color:#fff;}
.navbar-nav>li>.nav-link{font-weight: 400;}
.navbar-nav>li>.nav-link:hover{color:#fff;}
.header-wrap.active .navbar-nav>li>.nav-link:hover{color:#4c4948}
.header-con { max-width: none;align-items: center;justify-content: space-between; padding:0; transition: all 0.3s; }
.eb-backtotop{right:28px;}
.eb-backtotop svg.backtotop-progress path{stroke:#4c4948;}
.counsel-btn{display: none;}
.naver-btn{/*position: fixed;*/bottom: 80px;right: 23px; width: 55px;height: 55px;text-align: center; background: #000;font-size: 1.125rem;color: #fff !important;
border: 0;border-radius: 10px;z-index: 1000;box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);}
.naver-btn a{display: flex; flex-direction:column; align-items: center; justify-content: center; height:100%; gap:5px;}	
.naver-btn a img{}
.naver-btn a span{font-size: 10px; color:#fff;letter-spacing: -0.4px;}
.kakao-btn{/*position: fixed;*/bottom: 150px;right: 23px; width: 55px;height: 55px;text-align: center; background: #000;font-size: 1.125rem;color: #fff !important;
border: 0;border-radius: 10px;z-index: 1000;box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);}
.kakao-btn a{display: flex; flex-direction:column; align-items: center; justify-content: center; height:100%; gap:5px}	
.kakao-btn a span{font-size: 10px; color:#fff;letter-spacing: -0.4px;}
.header-flex{display: flex; gap:10px;}	
.overlay{display: none;z-index: 100;transition: all 0.4s;opacity: 1;min-height: 343px; width: calc(100% + 100px);position: absolute;left: -50px;top: 80px;background:#d1cdcce6;margin: 0 auto;}
.overlay-wrap{max-width: 1350px;margin: 0 auto;font-size: 0;padding: 60px 0 80px;}
.overlay-wrap > li{display: inline-block;vertical-align: top;width: calc(20% - 60px);margin-right: 75px;text-align: left;margin-bottom: 30px;}
.overlay-wrap li > a{font-size: 26px;color: #000;letter-spacing: 0.05em;font-weight: 500;display: block;}	
/*.overlay-wrap li ul{margin-top: 10px;}*/
/*.overlay-wrap li ul li{margin-top: 20px;}*/
/*.overlay-wrap li ul li a{line-height: 1;font-size: 14px;color: #637079;}*/
.overlay-wrap li ul li .b-menu{font-size: 30px;color: #3B3B3B;}
.overlay-wrap li ul li div{display: flex; flex-direction:column;}
.overlay-wrap li ul li .s-menu{font-size: 15px;color: #606060; margin-top:20px;}
.navbar-nav .dropdown-toggle::after{display: none;}
.navbar-nav .dropdown-menu{display: none;}

#modal_hd_pop .modal-header{display:none;}
#modal_hd_pop .modal-body{padding:0;}
#modal_hd_pop .modal-content{background-color:transparent;margin:0;border:0;}
#modal_hd_pop .modal-dialog .hd-pops-content{margin:0;}
#modal_hd_pop .hd-pops-content{width:100%;}
#hd_pop .slick-next{right:-35px !important;}
#hd_pop .slick-prev{left:-35px !important;}
#hd_pop .slick-next,#hd_pop .slick-prev{background:none !important;}
#hd_pop .slick-next:before, #hd_pop .slick-prev:before{color:#fff !important;font-size:24px !important;}
#modal_hd_pop .slick-dots li{display: none;}
#modal_hd_pop .modal-dialog .hd-pops-list > p{display: flex; justify-content:center;}
#modal_hd_pop .modal-footer{padding:0;/* background:#487f4f; */width: 500px;}
#modal_hd_pop .modal-footer button{font-size:16px;background-color:#4c4948;border-color:#4c4948;}
#modal_hd_pop #hd_pops_list br{display:none;}
@media(max-width:991px){
#modal_hd_pop .modal-dialog{width:90%; margin: 0 auto !important; top:10px;}
#hd_pop .slick-prev{left: -20px !important;}
#hd_pop .slick-next{right: -21px !important;}
#modal_hd_pop .modal-footer{width:auto;}
#modal_hd_pop .modal-footer button{font-size:13px;}
}

.main .swiper-slide{position: relative;}
.main .swiper-slide .main-text{position: absolute; left:50%;top:50%; transform: translate(-50%, -50%); text-align: center; font-family: 'Gyeonggi_Batang_Regular';}
.main .swiper-slide .main-text span{color:#fff; font-size: 15px; font-weight: 300;display: block;}
.main .swiper-slide .main-text h4{color:#fff; font-size: 60px; font-family: 'Gyeonggi_Batang_Regular'; font-weight: 500; margin:5px 0 10px;}
.main .swiper-slide .main-text p{color:#fff; font-size: 16px; font-weight: 300;}
.main .swiper-slide .mobile-main{display: none;}
.main .swiper-button-next, .main .swiper-button-prev{color:#fff; width:33px; height:62px;}
.main .swiper-button-next::after, .main .swiper-button-prev::after{display: none;}
.main .swiper-button-prev{left:50px; background: url("../image/main/main-prev.png") no-repeat;}
.main .swiper-button-next{right:50px; background: url("../image/main/main-next.png") no-repeat;}
.main .swiper-button-next,.main .swiper-button-prev{margin-top: 0; transform:translateY(-50%);}
.main .swiper-pagination{bottom:20px;}
.main .swiper-pagination-bullet {background: #fff;opacity: 0.5;margin: 0 10px !important; width: 8px;height: 8px;display: inline-block;border-radius: 100%;}
.main .swiper-pagination-bullet-active {background: transparent; opacity: 1;position: relative;}
.main .swiper-pagination-bullet-active::after{content: "";display: block;position: absolute;top: 50%;left: 50%; transform: translate(-50%, -50%);background: url("../image/main/main-pagination.png") no-repeat;
width: 14px;height: 14px;}
.main .triangle-title {position: relative; display: inline-block;padding-left: 20px;}
.main .triangle-title::after{content: "";position: absolute;left: 0;top: 0;transform: translateY(35%);width: 0; height: 0;border-left: 6px solid transparent;
border-right: 6px solid transparent; border-top: 7px solid #fff;}
.main .triangle-title::before { content: ""; position: absolute;left: 0;bottom: 0;transform: translateY(-35%);width: 0;height: 0; border-left: 6px solid transparent;
border-right: 6px solid transparent;border-bottom: 7px solid #fff;}

.content{padding: 110px 0; background: #fcf9f8e6;}
.content .title h4{font-size: 40px;font-family: "bodoni-std", sans-serif; font-weight: 500;}
.content .title p{font-size: 15px;line-height: 25px; font-weight: 400;}
.content .title strong{font-size: 18px; display: block;}
.content .img img{clip-path: inset(0 0 100% 0);}

.content .sec1{padding: 0 0 200px 459px;box-sizing: border-box;}
.content .sec1 .title{display: flex; align-items: center; gap:260px;}
.content .sec1 .img{margin-top: 120px;}

.content .sec2{text-align: center; margin-bottom: 180px; display: flex; align-items: center; justify-content: center;}
.content .sec2 .img{width:600px; display: inline-block; margin-right: 410px;}
.content .sec2 .title{width:488px;display: inline-block; text-align: left;}
.content .sec2 .title p{margin-top: 40px;}

.content .sec3{text-align:right; margin-bottom: 200px;display: flex;align-items: center; justify-content: end;}
.content .sec3 .img{display: inline-block;margin-left: 252px;}
.content .sec3 .title{display: inline-block; text-align: left;}
.content .sec3 .title p{margin-top: 40px;}

.content .sec4{text-align: center;display: flex;align-items: center;justify-content: center; margin-bottom: 200px;}
.content .sec4 .img{display: inline-block;}
.content .sec4 .title{display: inline-block; margin-right: 412px; text-align: left;}
.content .sec4 .title p{margin-top: 40px;}

.content .sec5{}
.content .sec5 .img{width: 1702px;margin: 0 auto;box-sizing: border-box; position: relative;}
.content .sec5 .img .swiper{width: 1500px;position: relative;margin: 70px auto 0;overflow: visible;}
.content .sec5 .swiper-button-next, .content .sec5 .swiper-button-prev{color:#fff; width:27px; height:44px;}
.content .sec5 .swiper-button-next::after, .content .sec5 .swiper-button-prev::after{display: none;}
.content .sec5 .swiper-button-prev{ background: url("../image/main/sub-prev.png") no-repeat;}
.content .sec5 .swiper-button-next{ background: url("../image/main/sub-next.png") no-repeat;}
.content .sec5 .swiper-button-prev svg,.content .sec5 .swiper-button-next svg{display: none;}
.content .sec5 .title{padding-top: 130px; text-align: center;}
.content .sec5 .title h4{margin-bottom: 30px; font-size: 37px;}
.content .sec5 .swiper-scrollbar{position: absolute; left:0; bottom:-55px; height:2px; background: #3b3b3b1a;}
.content .sec5 .img img{clip-path:none;}

.footer{border-top: none; background: #4c4948; padding:50px 0;}
.footer .container{display: flex; justify-content: space-between; align-items: center;}
.footer span,.footer strong{color:#FBF9F6;}
.footer strong{font-weight: 400;}
.footer-top{margin:0; padding:0;color:#FBF9F6; border-bottom: none;}
.footer .footer-logo img{height:105px;}
.footer .footer-top div{margin:40px 0 20px;}
.footer .footer-top .info-divider{margin:0 5px;}
.footer .footer-mid{color:#FBF9F6; line-height: 2;}
.footer .footer-cont-info{margin-top: 0;}
.footer .footer-cont-info a{display: flex; justify-content: center; align-items: center; gap:15px; width:200px; height:45px;/* border-radius:5px;*/ border: 1px solid #fff;
color:#FBF9F6; text-decoration:none; transition:0.7s;}
.footer .footer-cont-info a:hover{background: #ffffff14;}
.footer .footer-cont-info a.loca{width:410px;margin-top: 20px;}
.footer .footer-cont-info a.loca i{font-size: 19px;}
.footer .footer-cont-info .footer-flex{display: flex; gap:10px;}
.footer .root_daum_roughmap .cont .section.lst,.footer .root_daum_roughmap .wrap_controllers{display: none;}

.page-title-wrap{display: none;}
.s-mobile-main{display: none;}
.sub-main{position: relative;}
.sub-main img{width:100%;}
.sub-main .sub-text{position: absolute; top:50%; left:50%; /*transform:translate(-50%, -50%);*/}
.sub-main .sub-text p:first-child{text-align: center; font-size: 18px; color:#f6f6f6; letter-spacing:6px;}
.sub-main .sub-text h2{color:#fff; font-size: 60px;font-weight: 600;text-align: center; margin:10px 0 7px;}
.sub-mian .sub-text h3{color:#fff; text-align: center;}
.top-menu{height:70px;background: #fcf9f8e6; border-bottom: 1px solid #E1E1E1;}
.top-menu ul{display: flex; justify-content: center; align-items: center; height:100%; gap:50px;}
.top-menu ul li a{font-size: 16px;color: #3B3B3B;}
.top-menu ul li a.on{border-bottom: 1px solid #4c4948; padding-bottom: 4px; color:#4c4948;}

.sub-one{position: relative; padding-bottom: 150px;}
.sub-one::before{content:""; position: absolute;background: #fcf9f8e6; width:100%; height:1000px; left:0; top:0; z-index: -1;}
.sub-one-wrap{width:1200px; margin:0 auto; padding-top: 80px;}
.sub-one .title{margin-bottom: 60px; text-align: center;}
.sub-one .title span{font-size: 28px; color: #3B3B3B; margin-bottom:15px; display: block;}
.sub-one .title h3{font-size: 44px; margin-bottom: 45px;}
.sub-one .title p{font-size: 24px;}

.sub-one .circle{margin-bottom: 105px;}
.sub-one .circle ul{display: flex; justify-content: center; gap:35px;}
.sub-one .circle ul li{display: flex; gap:10px;flex-direction:column; justify-content: center; align-items: center; width:250px; height:250px; background: #fff; border-radius:100%;}
.sub-one .circle ul li p{width:90%; margin:0 auto; text-align: center; font-size: 17px; height: 52px;}
.sub-one .circle ul li p span{color:#b19f87;}

.sub-one .card-wrap{box-shadow: 0 0 60px rgba(0, 0, 0, 0.25);}
.sub-one .card01{padding: 78px 0 83px;text-align: center; background: #b19f87;}
.sub-one .card01 h4{font-size: 38px;margin-bottom: 18px; color:#fff;}
.sub-one .card01 span{font-size: 24px; letter-spacing:1px; color:#fff;}
.sub-one .card01 ul{display: flex; justify-content: space-evenly; margin-top: 55px;}
.sub-one .card01 ul li{padding: 37px 15px 30px;position: relative; width:48%;}
.sub-one .card01 ul li:last-child::after{content:""; position: absolute;  top: 0;left:-9px;width: 3px;height: 100%;background: #f3f8fe;}
.sub-one .card01 ul li p{color:#fff;font-size: 21px;line-height: 36px; margin-top: 27px;}
.sub-one .card02{padding: 78px 0 83px;text-align: center; background: #f4e6d2;}
.sub-one .card02 h4{font-size: 38px;margin-bottom: 18px; color:#b19f87}
.sub-one .card02 span{font-size: 24px; letter-spacing:1px; color:#b19f87;}
.sub-one .card02 ul{display: flex; justify-content: center; gap:40px; margin-top: 55px; margin-bottom: 75px;}
.sub-one .card02 ul li p{margin-top: 10px;}
.sub-one .card03{padding: 78px 0 83px;text-align: center; background: #f4e6d2;}
.sub-one .card03 h4{font-size: 38px;margin-bottom: 18px; color:#b19f87}
.sub-one .card03 span{font-size: 24px; letter-spacing:1px; color:#b19f87;}
.sub-one .card03 ul{ padding: 0 150px;}
.sub-one .card03 ul li{display: flex;justify-content: space-between;align-items: center;padding: 40px 30px;border-bottom: 1px solid #c6c6c6;}
.sub-one .card03 ul li .left{ display: flex;align-items: center;}
.sub-one .card03 ul li img{width:70px;}
.sub-one .card03 ul li .img{margin-right: 45px;}
.sub-one .card03 ul li .img p{color:#8b7252; margin-top: 5px;}
.sub-one .card03 ul li .left h5{font-size: 24px; text-align: left; color:#4c4948; margin-bottom: 6px;}
.sub-one .card03 ul li .left h5 br{display: none;}
.sub-one .card03 ul li .left .text p{font-size: 15px; display: block; text-align: left; color:#000;}
.sub-one .card03 ul li span{color:#4c4948;}
.sub-one .card03 ul li span strong{font-size: 60px; color:#4c4948;}

.sub-one .con1{padding:5% 5% 180px; display: flex;align-items: flex-end;}
.sub-one .con1 .tit{width:731px;}
.sub-one .con1 .tit h4{font-size: 76px; font-weight: 400;/*font-family: "Cormorant Garamond";*/color: #000; font-family: "EB Garamond", serif;}
.sub-one .con1 .tit span{display: block; margin:20px 0; font-size: 18px; color:#000; font-weight: 600;}
.sub-one .con1 .tit p{font-size: 16px;color:#282828;}
.sub-one .con1 > .flex p{font-size: 18px;color: #555;line-height: 30px;}
.sub-one .con2{padding:0 5% 180px; display: flex;align-items: center;}
.sub-one .con2 .tit{ width: 42.666%;}
.sub-one .con2 .tit span{font-size: 23px; color:#111;}
.sub-one .con2 .tit h4{font-size: 54px;margin: 40px 0 30px;color: #111;/*font-family: "Cormorant Garamond";*/ font-weight: 400;font-family: "EB Garamond", serif;}
.sub-one .con2 .tit p{font-size: 18px;color: #555;}
.sub-one .con2 ul{display: flex; justify-content: space-between;width: calc(100% - 42.666%);}
.sub-one .con2 ul li img{width:92%;}
/*.sub-one .con1 > .flex{display: flex; padding-top:5%; align-items: center; gap:66px;}*/
/*.sub-one .con1 > .flex .left{}*/
/*.sub-one .con1 > .flex .right{}*/
/*.sub-one .con1 > .flex .right ul li{display: flex; align-items: center; gap:20px; margin-bottom: 30px;}*/
/*.sub-one .con1 > .flex .right ul li:last-child{margin-bottom: 0;}*/
/*.sub-one .con1 > .flex .right ul li div span{color:#7c6c55; font-weight: 500;font-size: 18px;}*/
/*.sub-one .con1 > .flex .right ul li div p{color:#555; font-size: 18px; margin-top: 5px;}*/
/*.sub-one .con2{background: url('../image/sub/sub-one02.jpg')no-repeat; height: 620px; padding:5% 0;}*/
/*.sub-one .con2 .tit{text-align: center;}*/
/*.sub-one .con2 .tit h4{font-size: 45px; font-weight: 600;  font-family: "EB Garamond", serif;color: #fff;}*/
/*.sub-one .con2 .tit p{font-size: 16px;color:#fff; margin:50px 0;}*/
/*.sub-one .con2 ul{display: flex; width:60%; margin:0 auto; flex-wrap:wrap; justify-content: center; gap:20px;}*/
/*.sub-one .con2 ul li{width:500px; height:85px; display: flex; align-items: center; border: 1px solid #b19f87; border-radius:50px; padding:10px;}*/
/*.sub-one .con2 ul li span{width:60px; height:60px; background: #7c6c55;border-radius:100%; text-align: center; line-height:50px;}*/
/*.sub-one .con2 ul li span p{font-size: 32px; color:#fff;font-family: "Cardinal Classic", "Cormorant Garamond", "EB Garamond", serif; font-weight: 600;}*/
/*.sub-one .con2 ul li > p{font-size: 20px; color:#fff; margin-left: 30px;}*/


.sub-two{width: 1280px;margin: 80px auto; display: flex; justify-content: space-between;}
.sub-two .left img{height:128px;display: block; margin-bottom: 9%;}
.sub-two .left span{font-size: 17px; margin-bottom: 2%; font-weight:600; display: block;}
.sub-two .left p{font-size: 14px; color:#666;}
.sub-two .right{margin-top: 3%;}
.sub-two .right p{font-size: 18px; color:#999;text-align: right;}
.sub-two .right h4{font-size: 22px;font-weight: 600;}

/*.sub-two2{background: url('../image/sub/sub-two-bg.png')no-repeat right bottom -20px;}*/
.sub-two2 .img img{clip-path: inset(0 0 100% 0);}
.sub-two2{position: relative;width: 100%;padding: 0 260px;margin: 3% auto;z-index: 1;background: url('../image/sub/sub-two-bg.png')no-repeat right bottom -20px;}
.sub-two2 .img{position: relative;}
.sub-two2 .text{margin-top: -115px;}
.sub-two2 .text .tit{font-size: 71px; z-index: 2; position: relative;} 
.sub-two2 .text .tit span{font-size: 71px; color:#fff;}
.sub-two2 .text .box{margin-top: 75px;}
.sub-two2 .text .box h3{font-size: 25px;}
.sub-two2 .text .box p{font-size: 17px; color:#555; margin: 30px 0; line-height: 1.8;letter-spacing: -0.25px;}
.sub-two2 .text .back{position: absolute; bottom:0; right:-50px;text-align: center;}
.sub-two2 .text .back span{display: block;}
.sub-two2 .text .back span:first-child{font-size: 140px; color:#f4f4f4; letter-spacing:32px;}
.sub-two2 .text .back span:last-child{font-size: 76px; color:#f4f4f4;letter-spacing:10px; font-weight: 300;}


.sub-three{}
.sub-three-wrap{display: flex; align-items: center;}
.sub-three .left{width: 41%; background: url('../image/sub/about-bg.jpg')no-repeat; height: 790px;}
.sub-three .left h5{font-size: 18px; font-weight: 600;padding: 375px 0 40px 57%;}
.sub-three .left p{padding: 0 0 2.5% 57%;}
.sub-three .mid{width: 67px;height: 529px;margin: 3% 4% -7% 9%;}
.sub-three .mid span{ writing-mode: vertical-lr;  text-orientation: mixed;  transform: rotate(180deg);font-size:62px; font-weight: 300; letter-spacing:4px; color:#9cb2b0;}
.sub-three .mid span p{color:#b19f87; display: inline-block;}
.sub-three .right{width: 43.5%;}
.sub-three .right img{margin-bottom: 10px;}
.sub-three .right .box{background: #9cb2b0;}
.sub-three .right .box p{color:#fff; font-size: 17px; padding-bottom: 3%; padding-left: 76px;}
.sub-three .right .icon{padding-top: 37px;padding-bottom: 29px;    padding-left: 76px;}

.sub-four{position: relative;}
.sub-four .left .img02{margin-left: 25.2%;margin-bottom: 10px;}
.sub-four .left .box{width: 100%;height: 426px;background: #9cb2b0;}
.sub-four .left .box .icon{ padding: 37px 76px 29px 0;}
.sub-four .left .box p{font-size: 17px;padding-bottom: 3%;text-align: right;color: #fff;padding-right: 76px;}
.sub-four .left .text{width:43.5%;}
.sub-four .mid{position: absolute;top: 277px;left: 50%;margin-left: -10px;}
.sub-four .mid span{writing-mode: vertical-lr;  text-orientation: mixed;  transform: rotate(180deg);font-size:62px; font-weight: 300; letter-spacing:4px;color:#6c6c6c;}

.sub-five{margin:80px auto; width:1280px;}
.sub-five .tit{text-align: center;position: relative;}
/*.sub-five .tit::before{content:""; position: absolute; right:0; bottom:0; width:300px; height:300px; background:url('../image/sub/sub0102-logo.png')no-repeat;}*/
.sub-five .tit h2{}
/*.sub-five .tit span{width:100%; margin:40px auto; height:1px; background:#0000001f; display: block;}*/

.sub-six{width:1280px; margin:0 auto;}
.six-item{padding-top: 100px; margin-bottom: 50px; display: flex; border-top: 1px solid #0000001f;}
.six-item .left2{border: 1px solid #0000001f; width:615px; height:400px;}
.six-item .right{padding:37px 0 37px 90px;}
.six-item .right span{color:#9cb2b0; font-size: 14px; font-weight: 600;}
.six-item .right h2{font-size: 38px; margin:5px 0 30px;}
.six-item .right p{font-size: 17px; margin-bottom: 25px;}
.six-item .right a{display: block;}
.six-item .right .phone{font-size: 17px; margin-bottom: 25px;}
.six-item .right .cir{font-size: 14px; display: block; width:150px;height:50px;display: flex;align-items: center; color:#9cb2b0; border: 2px solid #9cb2b0;justify-content: center;
border-radius:30px;}
.six-item .right2 h2{font-size: 30px;}

.sub-seven{padding:100px 0;}
.seven-wrap{width:1385px; margin:0 auto;}
.sub-seven .flex{display: flex; justify-content: space-between;}
.sub-seven .flex .left{padding-right: 30px;}
.sub-seven .flex .left .tit{letter-spacing:8.5px;}
.sub-seven .flex .left .tit span{margin-bottom: 33px;font-size: 14px;}
.sub-seven .flex .left .tit h2{font-size: 50px;}
.sub-seven .flex .right{padding-top: 45px; width:65%;}
.sub-seven .flex .right .item{margin-bottom: 60px;}
.sub-seven .flex .right .item .img{width: 100%;height: 340px;border: 1px solid #dfdfdf;border-radius: 18px;margin-bottom: 35px; display: flex; justify-content: center; align-items: center;}
.sub-seven .flex .right .item .text{display: flex;}
.sub-seven .flex .right .item .text > div{font-size: 24px;font-weight: 500; color:#9cb2b0; width:300px;}
.sub-seven .flex .right .item .text p{font-size: 24px;}
.sub-seven .flex .right .item .text ul{}
.sub-seven .flex .right .item .text ul li{}

.sub-seven2 .right{}
.sub-seven2 .right h3{ font-size: 60px; color:#9cb2b0; margin-bottom: 55px;}
.sub-seven2 .right p{}

.sub-eight{/*background: #fcf9f8e6;*/background: url("../image/sub/sub-eight-bg.jpg");}
.eight-wrap{width:1385px; margin:0 auto; padding:100px; 80px;}
.sub-eight .img{width:50%;margin:0 auto;}
.sub-eight .img img{width:100%;}
.sub-eight .text{width:50%;margin:80px auto 0;}
.sub-eight .text p{text-align: right; margin-top: 30px; font-size: 18px;}

.sub-nine{/*width:1200px; margin:0 auto;*/display: flex;justify-content: space-between;height: 1967px; /*padding:3% 0;*/}
.sub-nine img{width:100%;}
.sub-nine .right img{width:80%;}
.sub-nine.sub-nine2{height:3280px;}
.sub-nine .left{width: 953px;position: sticky;top: 11%;left: 0;height: 820px;}
.sub-nine .right{width: 951px;}
/*.sub-nine .right img{margin-bottom: 4%;}*/
/*.sub-nine .right img:last-child{margin-bottom: 0;}*/
.sub-nine .right .img{width:951px; text-align: center;}

.sub-main .scale{overflow:hidden;}
.sub-section .scale{overflow:hidden;}
/*#sub-section0201 .sub-main{background: url('../image/sub/sub-main0201.jpg'); height:480px;background-size: cover;animation: sub-scale 10s infinite;}*/
#sub-section0201 .sub-main{background: url('../image/sub/sub0201-main.jpg'); height:100vh;background-size: cover;animation: none;}
/*#sub-section0202 .sub-main{background: url('../image/sub/sub-main0202.jpg'); height:480px;background-size: cover;animation: sub-scale 10s infinite;}*/
#sub-section0202 .sub-main{background: url('../image/sub/sub0202-main.jpg'); height:100vh;background-size: cover;animation: none;}
.sub0203-bg{background: url('../image/sub/sub-main0203.jpg'); height:480px;background-size: cover;animation: sub-scale 10s infinite;}

@keyframes sub-scale {
	0% {transform: scale(1);  animation-timing-function: ease-in;}
	50% {transform: scale(1.1);  animation-timing-function: ease-out;}
	100% {transform: scale(1); }
}

#sub-section0201 .book{display: flex;justify-content: center;align-items: center;height: 100vh;background: #f7f7f7;font-family: sans-serif;}
#sub-section0201 .book .book-wrapper{position: relative;width: 600px; height: 800px;perspective: 2000px;}
#sub-section0201 .book .flipbook {transform: rotateY(-180deg);opacity: 0.2;}
#sub-section0201 .book .page {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;transform-origin: left center;transform-style: preserve-3d;
transition: transform 1s ease, opacity 1s ease !important;opacity: 1; z-index: 0;}
#sub-section0201 .book .page.flipped {transform: rotateY(-180deg) !important; opacity: 0.2 !important;}



#sub-section0202 .book{display: flex;justify-content: center;align-items: center;height: 100vh;background: #f7f7f7;font-family: sans-serif;}
#sub-section0202 .book .book-wrapper{position: relative;width: 600px; height: 800px;perspective: 2000px;}
#sub-section0202 .book .flipbook {transform: rotateY(-180deg);opacity: 0.2;}
#sub-section0202 .book .page {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;transform-origin: left center;transform-style: preserve-3d;
transition: transform 1s ease, opacity 1s ease !important;opacity: 1; z-index: 0;}
#sub-section0202 .book .page.flipped {transform: rotateY(-180deg) !important; opacity: 0.2 !important;}
#flipbook {width: 495px;height: 700px;margin: 0 auto;}
.page-arrow {position: absolute;top: 50%;transform: translateY(-50%);width: 40px;height: 40px;background: white;border: 1px solid #aaa;text-align: center;line-height: 38px;
font-size: 20px;cursor: pointer;z-index: 100; border-radius:20px;}
.page-arrow i{ color:#3b3b3b; font-size: 17px;}
.page-arrow.left {left: -100px;}
.page-arrow.right {right: -100px;}


#sub-section02 .sub-section02-wrap {position: relative;height: 2000px;}
#sub-section02 .hero {position: absolute;top: 0;background: url('../image/sub/sub02-main.jpg');left: 0;width: 100%;height: 98vh;display: flex;align-items: center;justify-content: center;
z-index: 10;transition: transform 0.2s ease;}
#sub-section02 .hero-inner {text-align: center;}
#sub-section02 .hero h2 {font-size: 60px;color:#fff;margin-bottom: 20px;}
#sub-section02 .hero p {font-size: 15px;line-height: 27px;color: #fff; font-weight: 300;}
#sub-section02 .hero .scroll-icon{position: absolute;bottom: 180px;left: 50%;transform: translateX(-50%);animation: bottom 1s infinite;}
@keyframes bottom{
0% {bottom: 20px;}
50% {bottom: 10px;}
100% {bottom: 20px;}
}
#sub-section02 .hero .scroll-icon{color:#fff;}
#sub-section02 .split-links {position: fixed;top: 0;width: 100%;height: 100vh;font-size: 0;}
#sub-section02 .panel {display: inline-block;width: 50%;position: relative;height: 100vh;  color: #fff; z-index:2;}
#sub-section02 .panel.left::after{content:"";position: absolute; left:0; top:0;width:100%; height:100%;background-image: url('../image/sub/sub02-img01.jpg');
/*background: #111111;*/}    
#sub-section02 .panel.right::after {content:"";position: absolute; left:0; top:0;width:100%; height:100%; background-image: url('../image/sub/sub02-img02.jpg');}
#sub-section02 .overlay2 {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center; z-index:50;}
#sub-section02 .overlay2 h3{color:#fff;letter-spacing: 5px;font-weight: 500;font-size: 22px;}
#sub-section02 .overlay2 h2 {font-size: 42px; color:#fff;font-family: 'Gyeonggi_Batang_Regular'; margin-top: 30px;}
@media (hover: hover){
#sub-section02 .panel:hover h3,#sub-section02 .panel:hover h2{color:#1d1d1d; z-index:50;}
#sub-section02 .panel.left:hover::after ,#sub-section02 .panel.right:hover::after {filter: blur(3px); opacity: 0.5;}
#sub-section02 .panel.left:hover .hide,#sub-section02 .panel.right:hover .hide{display: block;}
}


#sub-section02 .hide{display: none;}
#sub-section02 .hide h5{font-size: 15px; color:#1d1d1d; margin:15px 0 30px; font-weight: 500; line-height: 1.6;}
#sub-section02 .hide h6{font-size: 15px; color:#1d1d1d;text-decoration-line: underline; font-weight: 400;}

#sub-section0101 .sub-main .sub-text h2{font-weight: 500;}
#sub-section0101 .sub-main .sub-text h3{color:#fff; font-size: 15px; letter-spacing: -0.5px; line-height: 27px; text-align: center;}

.m11 .syg{box-sizing:border-box;display:flex;flex-wrap:wrap;width:100%;height:100vh;padding:5% 0 0!important;}
.m11 .syg .imgarea{overflow:hidden;position:relative;width:50%;height:100%;}
.m11 .syg .imgarea>div{position:absolute;left:0;top:0;width:90%;height:100%;}
.m11 .syg .imgarea>div:nth-child(1){background:url(../image/sub/syg-bg1.jpg) no-repeat center;background-size:cover;}
.m11 .syg .imgarea>div:nth-child(2){background:url(../image/sub/syg-bg2.jpg) no-repeat center;background-size:cover;}
.m11 .syg .imgarea>div:nth-child(3){background:url(../image/sub/syg-bg3.jpg) no-repeat center;background-size:cover;}
.m11 .syg .imgarea>div:nth-child(4){background:url(../image/sub/syg-bg4.jpg) no-repeat center;background-size:cover;}
.m11 .syg .imgarea>div:nth-child(5){background:url(../image/sub/syg-bg5.jpg) no-repeat center;background-size:cover;}
#sub-section0202 .m11 .syg .imgarea>div:nth-child(1){background:url(../image/sub/syg-bg6.jpg) no-repeat center;background-size:cover;}
#sub-section0202 .m11 .syg .imgarea>div:nth-child(2){background:url(../image/sub/syg-bg2.jpg) no-repeat center;background-size:cover;}
#sub-section0202 .m11 .syg .imgarea>div:nth-child(3){background:url(../image/sub/syg-bg7.jpg) no-repeat center;background-size:cover;}
#sub-section0202 .m11 .syg .imgarea>div:nth-child(4){background:url(../image/sub/syg-bg3.jpg) no-repeat center;background-size:cover;}
#sub-section0202 .m11 .syg .imgarea>div:nth-child(5){background:url(../image/sub/syg-bg5.jpg) no-repeat center;background-size:cover;}
.m11 .syg .conarea{overflow:hidden;display:flex;align-items:center;box-sizing:border-box;width:50%;padding:0 5% 0 1%;}
.m11 .syg .conarea ul{width:100%;}
.m11 .syg .conarea ul li{border-top:1px solid #c4c2be;}
.m11 .syg .conarea ul li:first-child{border-top: none;}
.m11 .syg .conarea ul li .front{display:flex;justify-content:space-between;padding:20px 0;}
.m11 .syg .conarea ul li .front .tit1{font-size:40px;color:#cbc8c5;font-weight:400; font-family: "EB Garamond", serif;}
.m11 .syg .conarea ul li .front .tit1 span{color:#000;}
.m11 .syg .conarea ul li .front .tit2{width:340px;font-size:50px;color:#111;/*font-weight:600;*/font-family: "EB Garamond", serif; font-weight: 400;}
.m11 .syg .conarea ul li .hidden{height:0;transform:scaleY(0);transition:all 0.6s;}
.m11 .syg .conarea ul li .hidden .tit3{font-size:23px;color:#111;opacity:0;transform:translateY(40px);}
.m11 .syg .conarea ul li .hidden .txt{margin-top:10px;font-size:17px;color:#666;opacity:0;transform:translateY(40px);}
.m11 .syg .conarea ul li.open .hidden{padding:20px 0 20px;height:auto;transform:scaleY(1);}
.m11 .syg .conarea ul li.open .hidden .tit3{opacity:1;transform:translateY(0);transition:all 0.6s 0.2s;}
.m11 .syg .conarea ul li.open .hidden .txt{opacity:1;transform:translateY(0);transition:all 0.6s 0.4s;}
.m11 .syg .conarea ul li.open .front .tit1 span{animation:spanAni 0.6s infinite alternate;}

@keyframes spanAni{
	0%{color:#000;}
	100%{color:#cbc8c5;}
}

.back-to-top {background-color: #4c4948;text-decoration: none;cursor: pointer;width: 56px;height: 56px;z-index: 999;position: fixed;right: 32px;bottom: 32px;display:none;
align-items: center;justify-content: center;border: 0;border-radius: 100%;box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.4);}
.back-to-top:hover {background-color: #8e8a89;}
.back-to-top.active {display: flex;}
.back-to-top svg.icon__arrow-up {fill: white;width: 32px;height: 32px;} 
@media screen and (max-width: 500px){
    br.none{ display: none; }
}


/* ===== Root ===== */
#sub0101{ width: 100%; position: relative; overflow: hidden; }

/* ===== S1 ===== */
#sub0101 .syg1{ position: relative; width: 100%; }
#sub0101 .syg1 .scrollH{ height: 100vh; }
#sub0101 .syg1 .pins{ width: 100%; position: absolute; top: 0; left: 0; }
/* height: 100vh; overflow: hidden; */
#sub0101 .syg1 .centerline{ position: absolute; left: 50%; width: 1px; height: 100%; background-color: rgba(251, 251, 251, 0.2); top: 0; }
#sub0101 .syg1 .bg{background-image: url('../image/sub/sub0101bg.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }

#sub0101 .scrollcircle{ top: calc(195 / 960 * 100vh); bottom: auto; right: 0; transform: translateY(0); mix-blend-mode: unset; }

#sub0101 .syg1 .underbx{ width: 100%; height: 100vh; color: #fcfbfa; display: flex; flex-direction: column; justify-content: center; position: absolute; left: 0; top: 0; }

#sub0101 .syg1 .underbx .bg{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; clip-path: polygon(34% 30%, 68% 30%, 68% 68% ,34% 68%); }
#sub0101 .syg1 .underbx .bg .filter{ display: block; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,0.4); width: 100%; height: 100%; opacity: 0; z-index: 2; }
/*   */
#sub0101 .syg1 .underbx .bg > div{ background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; opacity: 0; transition-duration: 1.5s; transform: scale(1.2); }
#sub0101 .syg1 .underbx .bg > div.max1{background-image: url('../image/sub/sub0101-sub-bg.jpg');}
#sub0101 .syg1 .underbx .bg > div.max2{background-image: url('../image/sub/sub0101-sub-bg2.jpg');}
#sub0101 .syg1 .underbx .bg > div.max2 video{width:100%; height:100%; object-fit:cover;background:#000; display:block;border:0; outline:0;backface-visibility:hidden;
transform:translateZ(0);}
#sub0101 .syg1 .underbx .bg > div.on{ opacity: 1; transform: scale(1); }

#sub0101 .syg1 .underbx .txtmotion{ position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; opacity: 0; }
#sub0101 .syg1 .underbx .txtmotion > .name{ position: absolute; top: calc(100% + 80px); left: 0; width: 100%; text-align: center; color: #fff; font-size: 32px; letter-spacing: -0.045em; }
#sub0101 .syg1 .underbx .txtmotion > div{ position: relative; }
#sub0101 .syg1 .underbx .txtmotion > div:not(.cbx, .name){ /*width: calc(545 / 1600 * 100%); */}
#sub0101 .syg1 .underbx .txtmotion strong{ display: block; width: 100%; }
#sub0101 .syg1 .underbx .txtmotion strong img{ filter: saturate(0) brightness(300);/*width:1268px;*/height:300px;}
#sub0101 .syg1 .underbx .txtmotion strong img.on{ filter: saturate(1) brightness(1); }
#sub0101 .syg1 .underbx .txtmotion .caption{ position: absolute; top: calc(100% + 80px); left: 50%; transform: translateX(-50%); color: #4c4841;font-size: 32px; 
letter-spacing: -0.045em; font-family: 'Pretendard'; font-weight: 600; white-space: nowrap; }
#sub0101 .syg1 .underbx .txtmotion .caption.caption2{ top: calc(100% + 130px);font-size: 23px;}

#sub0101 .syg1 .underbx .txtmotion .cbx{ margin: 0 calc(40 / 1600 * 100%); width: calc(100 / 1600 * 100%); }
#sub0101 .syg1 .underbx .txtmotion .cbx .plus{ position: relative; width: 100%; margin-top: 13%; }
#sub0101 .syg1 .underbx .txtmotion .cbx .plus::after{ content: ''; display: block; padding-bottom: 100%; }
#sub0101 .syg1 .underbx .txtmotion .cbx .plus span{ display: block; width: 100%; height: 4px; background-color: #4c4841; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#sub0101 .syg1 .underbx .txtmotion .cbx .plus span:last-of-type{ transform: translate(-50%, -50%) rotate(90deg); }

#sub0101 .syg1 .underbx .last_txt{ position: absolute; top: 50%; left: 50px; width: calc(100% - 100px); text-align: center; display: flex; align-items: center; justify-content: center; font-family: 'Pretendard'; flex-direction: column; transform: translateY(-50%); color: #4c4841; }
#sub0101 .syg1 .underbx .last_txt dt{ font-size: 80px; letter-spacing: -0.045em; font-weight: 600; }
#sub0101 .syg1 .underbx .last_txt dd{ font-size: 26px; letter-spacing: -0.045em; line-height: calc(46 / 26); margin-top: 60px; }
#sub0101 .syg1 .underbx .last_txt dd span{ font-weight: 600; color:#4c4841;}

#sub0101 .syg1 .coverbx{ width: 100%; position: relative; height: 100vh;}
#sub0101 .syg1 .coverbx .wrap{ position: relative; height: 100vh; display: flex; flex-direction: column; justify-content: center;width:1600px; margin:0 auto;}
#sub0101 .syg1 .coverbx .wrap .titlebx{ mix-blend-mode: difference; display: flex; flex-direction: column; gap: calc(170 / 960 * 100vh); padding: 0 calc(80 / 1600 * 100%) }
#sub0101 .syg1 .coverbx .wrap .titlebx h1{ font-size: 11.4583vw; color: #fbfbfb;}
#sub0101 .syg1 .coverbx .wrap .titlebx h1:first-of-type{ text-align: left; }
#sub0101 .syg1 .coverbx .wrap .titlebx h1:last-of-type{ text-align: right; }
#sub0101 .syg1 .coverbx .wrap .smallbx{ position: absolute; left: 0; bottom: 100px; }
#sub0101 .syg1 .coverbx .wrap .smallbx dt{ font-size: 24px; letter-spacing: -0.05em; color: #fbfbfbb3; font-style: italic; display: flex; align-items: center; }
#sub0101 .syg1 .coverbx .wrap .smallbx dt span{ display: block; margin-right: 10px; color:#fbfbfbb3;}
#sub0101 .syg1 .coverbx .wrap .smallbx dt em{ display: block; width: 50px; height: 1px; background-color: rgb(251, 251, 251, 0.2); }
#sub0101 .syg1 .coverbx .wrap .smallbx dd{ font-size: 18px; letter-spacing: -0.045em; line-height: calc(32 / 18); margin-top: 30px; font-family: 'Pretendard'; color: #fbfbfb;}

/* S1 Responsive */
@media screen and (max-width: 1280px){
  #sub0101 .syg1 .underbx .last_txt dt{ font-size: 60px; }
  #sub0101 .syg1 .underbx .last_txt dd{ font-size: 20px; margin-top: 30px; }

  #sub0101 .syg1 .coverbx .wrap .smallbx dt{ font-size: 20px; }
  #sub0101 .syg1 .coverbx .wrap .smallbx dd{ font-size: 16px; margin-top: 15px; }
  
  #sub0101 .syg1 .underbx .txtmotion .caption{ font-size: 16px; top: calc(100% + 20px); }
  #sub0101 .syg1 .underbx .txtmotion > .name{ font-size: 18px; top: calc(100% + 20px); }
}
@media screen and (max-width: 991px){
  #sub0101 .syg1 .coverbx .wrap{width:90%;}
  #sub0101 .syg1 .underbx .last_txt{ width: 90%; left: 5%; }
  #sub0101 .syg1 .underbx .last_txt dt{ font-size: 35px; }
  #sub0101 .syg1 .underbx .last_txt dd{ font-size: 16px; margin-top: 15px; }
  #sub0101 .syg1 .underbx .txtmotion strong img{width:100%; height:auto;}	
  #sub0101 .syg1 .underbx .txtmotion .cbx .plus span{ height: 2px; }
  #sub0101 .syg1 .underbx .txtmotion .caption{ font-size: 20px; top: calc(100% + 10px); }
  #sub0101 .syg1 .underbx .txtmotion .caption.caption2{font-size: 12px;top: calc(100% + 50px);}
  #sub0101 .syg1 .underbx .txtmotion > .name{ font-size: 16px; }
  
/*  #sub0101 .syg1 .coverbx .wrap .titlebx{gap: calc(40 / 960 * 100vh);}*/
  #sub0101 .syg1 .underbx .txtmotion > div:not(.cbx, .name){width:25%;}
  #sub0101 .syg1 .underbx .txtmotion .cbx{width: calc(100 / 1600 * 100%);}
  #sub0101 .syg1 .coverbx .wrap .smallbx{bottom:140px;}
  #sub0101 .syg1 .coverbx .wrap .smallbx dt{ font-size: 18px; }
  #sub0101 .syg1 .coverbx .wrap .smallbx dd{ font-size: 14px; margin-top: 10px; }
  #sub0101 .syg2 .wrap{width:90% !important;}
  #sub0101 .syg2 .wrap .rbx{padding-right: 29px !important;}
}
@media screen and (max-width: 500px){
/*  #sub0101 .syg1 .underbx .txtmotion .caption{ font-size: 12px; }*/
  #sub0101 .syg1 .underbx .txtmotion > .name{ font-size: 14px; }
  #sub0101 .syg1 .underbx .last_txt dt{ font-size: 22px; }
  #sub0101 .syg1 .underbx .last_txt dd{ font-size: 14px; margin-top: 10px; }
  #sub0101 .syg1 .underbx .last_txt dd br{ display: none; }
}

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

#sub0101 .syg1 .coverbx .wrap .smallbx{bottom:100px;}

}

/* ===== S2 ===== */
#sub0101 .syg2{ position: relative; overflow: hidden; background-color: #f1f1f1; word-break: keep-all; }
#sub0101 .syg2 .scrollH{ height: 100vh; }
#sub0101 .syg2 .pins{ width: 100%; position: absolute; top: 0; left: 0; }
#sub0101 .syg2 .wrap{ height: 100vh; display: flex; justify-content: space-between; position: relative; width:1600px; margin:0 auto;}

#sub0101 .syg2 .wrap .lbx{ width: 62%; box-sizing: border-box; height: 100vh; display: flex; flex-direction: column; justify-content: center; padding-left: calc(80 / 1200 * 100%); padding-bottom: 21vh; }
#sub0101 .syg2 .wrap .title{ position: relative; font-size: 4.6875vw; height: 1.1em; }
#sub0101 .syg2 .wrap .title li{ position: absolute; top: 0; left: 0; white-space: nowrap; transition-duration: 0.6s; opacity: 0; transform: translateX(-40px); }
#sub0101 .syg2 .wrap .title li.on{ opacity: 1; transform: translateX(0); }

#sub0101 .syg2 .wrap .subtxt{ font-size: 22px; letter-spacing: -0.045em; font-family: 'Pretendard'; line-height: calc(40 / 22); height: calc(40 / 22 * 2em); margin-top: 25px; }
#sub0101 .syg2 .wrap .subtxt li{ position: absolute; opacity: 0; transform: translateX(-40px); transition-duration: 0.6s; transition-delay: 0.2s; }
#sub0101 .syg2 .wrap .subtxt li.on{ opacity: 1; transform: translateX(0); }

#sub0101 .syg2 .wrap .lbx.txtfilter{ position: absolute; color: #fff; z-index: 2; mix-blend-mode: difference; 
/*clip-path:polygon(60% 0, 100% 0, 100% 100%, 60% 100%);*/    clip-path: polygon(60% 0, 103% 0, 100% 100%, 59% 100%);}
#sub0101 .syg2 .wrap .lbx.txtfilter li span{color:#fff;}

#sub0101 .syg2 .wrap .imgbx{ width: 100%; position: absolute; left: 50%; top: 50%; display: flex; justify-content: center; align-items: center; /*z-index: 3;*/ transform: translate(-50%, -50%); z-index: 0; width: calc(420 / 1600 * 100%); }
#sub0101 .syg2 .wrap .imgbx .img{ position: relative; width: 100%; }
#sub0101 .syg2 .wrap .imgbx .img::after{ content: ''; display: block; padding-bottom: calc(560 / 420 * 100%); }
#sub0101 .syg2 .wrap .imgbx .img li{ position: absolute; left: 0; top: 0; overflow: hidden; transition-duration: 0.6s; clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%); height: 100%; }
/* height: 0; */
#sub0101 .syg2 .wrap .imgbx .img li.on{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
/* height: 100%; */

#sub0101 .syg2 .wrap .rbx{ width: calc(590 / 1600 * 100%); box-sizing: border-box; padding-left: calc(60 / 1600 * 100%); position: relative; height: 100vh; padding-bottom: calc(80 / 970 * 100%); display: flex; flex-direction: column; justify-content: flex-end; }
#sub0101 .syg2 .wrap .rbx .number{ font-size: 13.0208vw; opacity: 0.1; transform: translateX(-0.5em); font-style: italic; height: 1em; }
#sub0101 .syg2 .wrap .rbx .number li{ position: absolute; transition-duration: 0.6s; opacity: 0; transform: translateX(-40px); }
#sub0101 .syg2 .wrap .rbx .number li.on{ opacity: 1; transform: translateX(0); }

#sub0101 .syg2 .wrap .rbx .lines{ position: relative; font-size: 18px; letter-spacing: -0.045em; font-family: 'Pretendard'; line-height: calc(40 / 18); height: calc(40 / 18 * 4em); /*margin-top: calc(90 / 970 * 100%);*/
    margin-top: 104px;}
#sub0101 .syg2 .wrap .rbx .lines li{ transition-duration: 0.6s; opacity: 0; transform: translateX(-40px); position: absolute; left: 0; top: 0; transition-delay: 0.2s; }
#sub0101 .syg2 .wrap .rbx .lines li p{ background: linear-gradient(90deg, rgba(76, 72, 65, 1) 0%, rgba(76, 72, 65, 0.3) 0%); -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; display: inline; }
#sub0101 .syg2 .wrap .rbx .lines li.on{ opacity: 1; transform: translateX(0); }

/* S2 wide */
@media screen and (min-width: 1921px){
  #sub0101 .syg2 .wrap .lbx{ width: 63%; }
  #sub0101 .syg2 .wrap .lbx.txtfilter{ clip-path: polygon(58.7% 0, 100% 0, 100% 100%, 58.7% 100%); }
}

/* S2 mid */
@media screen and (max-width: 1600px){
  #sub0101 .syg2 .wrap .rbx .lines{ font-size: 15px; }
}

/* S2 <= 1440 */
@media screen and (max-width: 1440px){
  #sub0101 .syg2 .wrap .rbx{ width: calc(585 / 1600 * 100%); padding-left: calc(90 / 1600 * 100%); }
  #sub0101 .syg2 .wrap .rbx .number{ transform: translateX(-0.3em); }
  #sub0101 .syg2 .wrap .rbx .lines{ margin-top: 0; }

  #sub0101 .syg2 .wrap .imgbx{ width: calc(580 / 1600 * 100%); }
  #sub0101 .syg2 .wrap .lbx.txtfilter{ clip-path: polygon(63.8% 0, 100% 0, 100% 100%, 63.8% 100%); }

  #sub0101 .syg2 .wrap .subtxt{ font-size: 18px; }
}

/* S2 <= 1280 */
@media screen and (max-width: 1280px){
  #sub0101 .syg2 .wrap .subtxt{ font-size: 16px; }

  #sub0101 .syg2 .wrap .rbx{ width: 100%; padding-left: 0; position: absolute; left: 0; padding: 0 7%; padding-bottom: 10vh; bottom: 0; display: flex; flex-direction: column; align-items: flex-end; }
  #sub0101 .syg2 .wrap .rbx .number{ transform: translateX(0); width: 100%; text-align: right; }
  #sub0101 .syg2 .wrap .rbx .number li{ width: 100%; right: 0; }
  #sub0101 .syg2 .wrap .rbx .lines{ text-align: right; width: 100%; }
  #sub0101 .syg2 .wrap .rbx .lines li{ right: 0; }
}

/* S2 <= 820 */
@media screen and (max-width: 820px){
  #sub0101 .syg2 .wrap{ padding: 100px 0; justify-content: center; box-sizing: border-box; }
  #sub0101 .syg2 .wrap .title{ font-size: 8.0875vw; }
  #sub0101 .syg2 .wrap .lbx{ width: 100%; height: calc(50vh - 50px); padding-left: 0; padding-bottom: 0; }
  #sub0101 .syg2 .wrap .imgbx{ width: 50%; height: calc(50vh - 50px); right: 0; top: 100px; left: auto; transform: translate(0, 0); }
  #sub0101 .syg2 .wrap .imgbx .img{ width: 100%; height: 100%; }
  #sub0101 .syg2 .wrap .imgbx .img::after{ display: none; }
  #sub0101 .syg2 .wrap .imgbx .img li img{ height: 100%; width: 100%; object-fit: cover; }

  #sub0101 .syg2 .wrap .lbx.txtfilter{ clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%); }

  #sub0101 .syg2 .wrap .subtxt{ font-size: 14px; }

  #sub0101 .syg2 .wrap .rbx{ height: calc(50vh - 50px); justify-content: flex-start; padding: 0; padding-top: 20px; }
  #sub0101 .syg2 .wrap .rbx .lines{ height: auto; }
  #sub0101 .syg2 .wrap .rbx .number{ text-align: left; }
  #sub0101 .syg2 .wrap .rbx .lines{ text-align: left; font-size: 14px; }
  #sub0101 .syg2 .wrap .rbx .lines li{ left: 0; right: auto; }
  #sub0101 .syg2 .wrap .rbx .lines li br{ display: none; }
}

/* ===== 다국어 ===== */
#sub0101.chn_{ word-break: break-all; }
#sub0101.jpn_{ word-break: break-all; }

#sub0101.eng_ .syg2 .wrap .rbx{ padding-bottom: calc(150 / 970 * 100%); }

#sub0101.chn_ .syg1 .underbx .txtmotion .caption{ font-family: 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }
#sub0101.chn_ .syg1 .underbx .last_txt{ font-family: 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }
#sub0101.chn_ .syg1 .coverbx .wrap .smallbx dd{ font-family: 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }
#sub0101.chn_ .syg2 .wrap .subtxt{ font-family: 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }
#sub0101.chn_ .syg2 .wrap .rbx .lines{ font-family: 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }

#sub0101.jpn_ .syg1 .coverbx .wrap .smallbx dd{ font-family: "Noto Sans JP", sans-serif; }
#sub0101.jpn_ .syg2 .wrap .subtxt{ font-family: "Noto Sans JP", sans-serif; }
#sub0101.jpn_ .syg2 .wrap .rbx .lines{ font-family: "Noto Sans JP", sans-serif; }

@media screen and (max-width: 1280px){
  #sub0101.eng_ .syg2 .wrap .rbx{ padding-bottom: 10vh; }
}
@media screen and (max-width: 820px){
  #sub0101.eng_ .syg2 .wrap .rbx{ padding: 0; padding-top: 20px; }
}


.m-book{display: none;}

@media (max-width:991px){

body{overflow: visible !important;}
.header-wrap.active .offcanvas-start.show{top:65px !important;}
.sidebar-left .navbar-nav .dropdown-item i{display: none;}

.eb-backtotop{width:40px; height:40px;}
.back-to-top svg.icon__arrow-up{width:25px; height:25px;}

.navbar-nav li:hover{background: none;}
.sidebar-left .navbar-nav .dropdown-submenu > a:hover{background: none;}
.top-header{height:35px; line-height: 35px;}
.top-header a{font-size: 13px;}
.top-header .top-close{right:20px;}
.top-header .top-close i{font-size: 14px; font-weight: 600;}
.nav-wrap{top:35px; height:65px;}
.nav-wrap .site-logo{height:33px;}
.sidebar-user-btn.mo-btn{display: none;}
.kakao-btn,.naver-btn{width:45px; height:45px; right:13px; transition:0.4s;}
.kakao-btn.active,.naver-btn.active{opacity:0;pointer-events: none;}
.kakao-btn a span,.naver-btn a span{font-size: 8px;}
.kakao-btn a,.naver-btn a{gap:6px;}
.kakao-btn a img{width:17px; object-fit:cover;}
.naver-btn a img{width:13px}
.header-title-mobile-btn{top:auto;}
.header-title-mobile-btn.active{z-index:9999;}
.header-title-mobile-btn .menu-btn-wrap::before {top: -8px;}
.header-title-mobile-btn .menu-btn-wrap::after {bottom: -8px;}
.navbar-mobile-toggler{display: none;}
/*.header-flex{position: absolute; top:50%; transform:translateY(-50%);}*/
.header-flex{position: fixed;right:12px;bottom: 80px; flex-direction:column;}
.offcanvas-header{display: none;}
.sidebar-left.offcanvas{left:-120%;}
.sidebar-left .navbar-nav > li > .dropdown-toggle{font-family: "bodoni-std", sans-serif; font-weight: 500; font-size: 18px;color: #3B3B3B; width:fit-content; display: inline;}
.sidebar-left .navbar-nav .dropdown-submenu > a:after{display: none;}
.sidebar-left .navbar-nav .dropdown-menu:after{display: none;}
/*.sidebar-left .navbar-nav > li{display: flex; align-items: center;}*/
/*.sidebar-left .navbar-nav > li a{pointer-events: none;}*/
.sidebar-left .navbar-nav > li > .cate-dropdown-open{width: 10px;height: 6px; display: inline-block; position: relative;margin-left: 2px;}
.sidebar-left .navbar-nav > li > .cate-dropdown-open::before{width: 10px;height: 6px; content:"";background: url("../image/main/m-drop-down.png"); position: absolute;
top:-3px; left:0;}
.sidebar-left .navbar-nav > li > .cate-dropdown-open.show:before{ transform: rotate(-180deg);}
.sidebar-left .navbar-nav > li > .cate-dropdown-open{position:relative; top:auto; right:auto; border-left: none;}
.sidebar-left .navbar-nav .dropdown-submenu > a{background: none;color: #444F57; font-size: 14px; padding:6px 15px 6px 25px !important;}
.sidebar-left .navbar-nav .dropdown-submenu > a.active{background: none; font-weight: 500;}
.eb-backtotop .progress-count{font-size: 10px;}

.header-title-mobile-btn.active .menu-btn {opacity: 0;}
.header-title-mobile-btn.active .menu-btn-wrap::before {top: 50%;background: #fff;transform: rotate(45deg); width:65%;}
.header-title-mobile-btn.active .menu-btn-wrap::after {bottom: auto;top: 50%;background: #fff;transform: rotate(-45deg); width:65%;}
.header-title-mobile-btn.active .menu-btn{opacity:0;}
.header-title-mobile-btn .navbar-toggler{border: none;}
.header-title-mobile-btn .navbar-toggler:focus{outline: none; border:none; box-shadow:none;}
.header-title-mobile-btn .navbar-toggler .menu-btn-wrap{width:34px;height:16px; position: relative; display: block;}
.header-title-mobile-btn .menu-btn{/*overflow: hidden;*/position: absolute;right: 0;width: 90%;height: 1px;background: #fff;display: block;top: 50%;margin-top: -1px;opacity: 1;
 transition: all 0.3s;}
.header-title-mobile-btn .menu-btn-wrap::after,.header-title-mobile-btn .menu-btn-wrap::before{overflow: hidden;position: absolute;right: 0;width: 100%;height: 1px;
background: #fff; transition: all 0.3s;}	
.header-title-mobile-btn .menu-btn-wrap::before{content: '';display: block;top: 0;transition: all 0.3s;width: 24px;}
.header-title-mobile-btn .menu-btn-wrap::after{content: '';display: block;bottom: 0;transition: all 0.3s;width: 20px;}
.header-wrap.active .header-title-mobile-btn .menu-btn-wrap::after,.header-wrap.active .header-title-mobile-btn .menu-btn-wrap::before{background: #000;}
.header-wrap.active .header-title-mobile-btn .menu-btn{background: #000;}
.sidebar-left .sidebar-member-menu{display: none;}
.sidebar-left .offcanvas-header{padding:0; height:80px; position: relative; border-bottom:1px solid #ffffff7d;}
.sidebar-left.offcanvas{width:100%;background-color: inherit; top:125px; transform:none; opacity:0; height:fit-content;}
.offcanvas-start.show{ animation: fadeIn 0.2s ease-in-out forwards;left:0; top:100px !important;}
.offcanvas-start.show .header-title-mobile-btn{z-index:9999;}
.offcanvas-backdrop{display: none;}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.sidebar-left.offcanvas .offcanvas-header a{position: absolute; left: 50%;top:50%;transform: translate(-50%,-50%);}
.sidebar-left .navbar-nav > li.navbar-nav-home{display: none;}
.sidebar-left .navbar-nav{padding:20px 10px;}
.sidebar-left .navbar-nav > li > a{font-size: 17px;}

.sidebar-left.show .sidebar-left-content{height:auto; background: #eae2df; overflow-y: hidden;}
.eb-backtotop{bottom: 15px; right: 15px;}

.main .swiper-slide img{width:100%;}
.main .swiper-slide .pc-main{display: none;}
.main .swiper-slide .mobile-main{display: block;}
.main .swiper-slide .main-text{width:100%;}
.main .swiper-slide .main-text span{font-size: 12px;}
.main .swiper-slide .main-text h4{font-size: 36px;}
.main .swiper-slide .main-text p{font-size: 12px;}
.main .swiper-button-next, .main .swiper-button-prev{display: none;}
.main .triangle-title{padding-left: 15px;}
.main .triangle-title::after{border-left: 4px solid transparent;border-right: 4px solid transparent;border-top: 4px solid #fff;transform: translateY(45%);top:2px;}
.main .triangle-title::before{border-left: 4px solid transparent;border-right: 4px solid transparent;border-bottom: 4px solid #fff;transform: translateY(-45%);bottom:2px;}

.content{padding: 50px 0 0;}
.content img{width:100%;}
.content .title h4{font-size: 25px;}
.content .title strong{font-size: 14px;}
.content .title p{font-size: 13px; margin-top: 15px;}
.content .sec1{padding:0;padding: 0 0 0 20px;margin-bottom: 100px;}
.content .sec1 .title{gap:0; display: block;}
.content .sec1 .img{margin-top: 45px;}
.content .sec2{display: block;margin-bottom: 90px;padding: 0 55px 0 20px;}
.content .sec2 .img{width:100%; margin-right: 0;}
.content .sec2 h4{margin-top: 25px;}
.content .sec2 .title{width:100%;}
.content .sec2 .title p{margin-top: 15px;}
.content .sec2 .title p br{display: none;}
.content .sec3{flex-direction: column-reverse;margin-bottom: 100px;padding: 0 40px 0 0;}
.content .sec3 .img{margin-left: 0;}
.content .sec3 .title{padding:0 0 0 20px;}
.content .sec3 .title h4{margin-top: 25px;}
.content .sec3 .title p{margin-top: 15px;}
.content .sec3 .title p br{display: none;}
.content .sec4{padding: 0 0 0 101px;flex-direction: column-reverse; margin-bottom: 80px;}
.content .sec4 .title h4{margin-top: 25px;}
.content .sec4 .title{margin-right: 0;padding:0 10px 0 0;}
.content .sec4 .title p{margin-top: 15px;}
.content .sec4 .title p br{display: none;}
.content .sec5{padding: 50px 20px 40px; background: #eae2dfe6;}
.content .sec5 .title{padding-top: 80px;}
.content .sec5 .img{width:100%;}
.content .sec5 .img .swiper{width:100%; margin:0;}
.content .sec5 .swiper-scrollbar{bottom:-30px;}
.content .sec5 .swiper-button-next, .content .sec5 .swiper-button-prev{display: none;}
.content .sec5 .title h4{font-size: 20px; margin-bottom: 16px; letter-spacing:-1px;}
.content .title p{ font-size: 12px;}

.footer{padding:30px 0;}
.footer .container{display: block;}
.footer .footer-logo img{height: 70px;}
.footer .footer-mid{margin:20px 0;}
.footer span, .footer strong,.footer .footer-mid{font-size: 12px;}
.footer .footer-cont-info .footer-flex{gap:0; justify-content: space-between;}
.footer .footer-cont-info a{font-size: 14px; width: 49%;}
.footer .footer-cont-info a:first-child img{width:15px;}
.footer .footer-cont-info a.loca{width:100%; margin-top: 10px;}
.footer .footer-cont-info a.loca i{font-size: 18px;}

.s-mobile-main{display: block;}
.sub-main img:first-child{display: none;}
.sub-main .sub-text p:first-child{font-size: 11px;}
.sub-main .sub-text h2{font-size: 36px;}
.sub-main .sub-text{width:100%;}
#sub-section0101 .sub-main .sub-text h3{font-size: 10px;}

.top-menu{height:50px;}
.top-menu ul li a{font-size: 13px;}



#sub-section0201 .sub-main{background: url('../image/sub/m-sub-main0201.jpg');background-size: cover;}
#sub-section0202 .sub-main{background: url('../image/sub/m-sub-main0202.jpg');background-size: cover;}

#sub-section0201 .book{height:65vh;}
#sub-section0201 .book .book-wrapper{height:auto; width:100%;}
#flipbook{width:100%;height:65vh;}
#sub-section0201 .book .page{width:100%; text-align: center; padding:8% 0;}
#sub-section0201 .book .page img{width:85%;}
#sub-section0202 .book{height:65vh;}
#sub-section0202 .book .book-wrapper{height:auto; width:100%;}
#sub-section0202 .book .page{width:100%; text-align: center; padding:8% 0;}
#sub-section0202 .book .page img{width:85%;}
.page-arrow{width:30px; height:30px;  display: flex; align-items: center; justify-content: center;}
.page-arrow i{font-size: 15px;}
.page-arrow.left{left:2px;}
.page-arrow.right{right:2px;}

.sub-one{padding-bottom: 50px;}
.sub-one::before{height:1500px;}
.sub-one-wrap{width:100%; padding:50px 0 0;}
.sub-one .title{padding:0 20px;}
.sub-one .title span{font-size: 20px;}
.sub-one .title h3{font-size: 28px;}
.sub-one .title p{font-size: 16px;}
.sub-one .title p br{display: none;}
.sub-one .circle ul{flex-wrap:wrap; justify-content: center;}
.sub-one .circle ul li{width:168px; height:100px; gap:12px; background: none; border-radius:0;}
.sub-one .circle ul li img{width:20px;}
.sub-one .circle ul li p{font-size: 15px; width:100%;}

.sub-one .card01{padding:45px 0 50px;}
.sub-one .card01 h4{font-size: 28px;}
.sub-one .card01 span{font-size: 18px;}
.sub-one .card01 ul{flex-wrap:wrap; margin-top: 20px;}
.sub-one .card01 ul li{width:100%; border-bottom: ;}
.sub-one .card01 ul li:last-child::after{width:100%; height:1px; left:0; top:0;}
.sub-one .card01 ul li img{width:140px;}
.sub-one .card01 ul li p{font-size: 16px;}

.sub-one .card02{padding: 45px 0 50px;}
.sub-one .card02 ul{flex-wrap:wrap;}
.sub-one .card02 ul li{width:100%;}
.sub-one .card02 ul li img{width:150px;}
.sub-one .card02 ul li p{font-size: 16px;}
.sub-one .card02 h4{font-size: 28px;}
.sub-one .card02 span{font-size: 18px;}
.sub-one .card02 .noti{font-size: 14px; padding:0 20px;}

.sub-one .card03{padding: 45px 20px 50px;}
.sub-one .card03 h4{font-size: 28px;}
.sub-one .card03 span{font-size: 18px;}
.sub-one .card03 ul{padding: 0 15px;}
.sub-one .card03 ul li{padding:25px 0;}
.sub-one .card03 ul li .img{margin-right: 15px;}
.sub-one .card03 ul li .img p{font-size: 10px;}
.sub-one .card03 ul li img{width:35px;}
.sub-one .card03 ul li .left h5{font-size: 16px; line-height: 1.5;}
.sub-one .card03 ul li .left h5 br{display: block;}
.sub-one .card03 ul li span strong{font-size: 28px;}
.sub-one .card03 ul li span{font-size: 14px;}

.sub-two2{padding:0 20px;}
.sub-two2 .img img{width:100%;}
.sub-two2 .text{margin-top: 60px;}
.sub-two2 .text .tit{font-size: 20px;}
.sub-two2 .text .tit span{font-size: 20px; color:#000;}
.sub-two2 .text .box h3{font-size: 17px;}
.sub-two2 .text .box p{font-size: 13px;}
.sub-two2 .text .back{display: none;}

.sub-six{width:100%;}
.six-item{display: block; border-top: none; margin-bottom: 0; position: relative; padding-top: 0; margin-top: 30px;}
.six-item:last-child{margin-top: 30px;}
.six-item .left{position: relative;}
.six-item .left::before{content:""; position: absolute; top:0; left:0; width:100%; height:100%;background: linear-gradient(90deg, #d1cdcc, 40%, transparent);}
.six-item:last-child .left::before{background: #adadad;}
.six-item .left img{width:100%;}
.six-item .right{padding:20px; position: absolute; top:50%; transform: translateY(-50%); width:100%;}
.six-item .right span{font-size: 11px; color:#000; font-weight: 700;} 
.six-item .right h2{font-size: 27px;margin: 5px 0 20px; color:#000;}
.six-item .right p{font-size: 13px; margin-bottom: 15px; color:#000; font-weight: 600;}
.six-item .right .phone{font-size: 14px; color:#000;}
.six-item .right .cir{width:110px;height:30px;font-size: 12px;border: 1px solid #000; color:#000; position: absolute; left:20px; bottom:0px;}
.six-item .left2{width:100%;height:250px; margin:0 auto 30px; border: none;}

.eight{padding:0 20px;}
.eight-wrap{width:100%; padding:30px;}
.sub-eight .img{width:90%;}

.sub-eight .text{width:90%; margin:40px auto 0;}
.sub-eight .text p{font-size: 13px;}

.sub-nine{display: block; height:auto; padding:0;}
.sub-nine .right img{width:100%;}
.sub-nine.sub-nine2{height:auto;}
.sub-nine .left{width:100%; height:auto; position: relative;top:auto; left:auto;}
.sub-nine .right{width:100%;}
.sub-nine .right .img{width:100%;}

#sub-section02 .hero{background: url('../image/sub/m-sub02-main.jpg') right bottom -90px;}
#sub-section02 .hero h2{font-size: 36px;}
#sub-section02 .hero p{font-size: 10px;}

#sub-section02 .split-links{display: flex; flex-direction:column;}
#sub-section02 .panel{width:100%;}
#sub-section02 .panel.left::after,#sub-section02 .panel.right::after{background-size: cover;}
#sub-section02 .hide{display: block;}
#sub-section02 .overlay2{width:100%;}
#sub-section02 .overlay2 > a{width:fit-content; margin:0 auto; display: block;}
#sub-section02 .overlay2 h3{color: #fff; font-size: 18px;}
#sub-section02 .overlay2 h2{color: #fff; font-size: 36px; margin-top: 20px;}
#sub-section02 .hide h5{color:#f6f6f6; font-size: 13px;}
#sub-section02 .hide h6{color:#f6f6f6; font-size: 14px;}
/*#sub-section02 .panel.left::after, #sub-section02 .panel.right::after{filter: blur(.5px);opacity: 0.8;}*/

.list-unstyled.float-end li:last-child{display: none;}

.m-book{display: block;}

}
@media (max-width:393px){
.sub-one .circle ul li p{font-size: 13px;}
.sub-one .circle ul li{width:155px;}
#sub-section0201 .book{height:70vh;}
#sub-section0202 .book{height:70vh;}
#flipbook{height:70vh;}
#sub-section0201 .sub-main{background: url('../image/sub/m-sub-main0201.jpg');background-size: cover;}
#sub-section0202 .sub-main{background: url('../image/sub/m-sub-main0202.jpg');background-size: cover;}
}

@media (max-width:375px){
#sub-section0201 .book{height:77vh;}
#sub-section0202 .book{height:77vh;}
#flipbook{height:77vh;}
.content .sec5 .title h4{font-size: 18px;}
.sub-eight .text p{font-size: 12px;}

#sub-section0201 .sub-main{height:729px;}
#sub-section0202 .sub-main{height:729px;}

}