/* section */
section{padding: 7vw 0;}
section >*{z-index:5}
section .title_box .page_title{font-weight: 700;font-size: 3rem;letter-spacing: 6px;position: relative;line-height: 120%;margin-bottom: 30px;font-family: "Noto Serif SC", serif;}
section .title_box .page_title::after{position:absolute;content:"";width:40px;height:1px;background-color:#ffffff;bottom:-30px;left:0}
section .title_box .subtitle{color: #000;font-family: "Gilda Display", serif;font-size: 18px;font-weight: 400;line-height: 1.03;text-transform: uppercase;letter-spacing: 2px;margin-bottom: 5px;}
section .title_box .subtitle .secondColor{color:var(--primary);vertical-align:top;padding:0;margin:0}
section .title_box .decoTitle{-webkit-text-stroke: 1px #b5b5b5;opacity:0.2;color: #ffffff00;font-size: 6rem;letter-spacing: 6px;font-weight: 400;line-height:calc(120 / 120);font-family:"Gilda Display",serif;position:absolute;top:50%;left:0;right:unset;bottom:unset;-webkit-transform:translate(0%,-50%);transform:translate(0%,-50%);z-index:1;text-transform: uppercase;}
section .title_box p{line-height: 170%;letter-spacing: 0.5px;font-weight: 500;font-size: 20px;color: var(--complement);position: relative;}
section.bg_box{background:no-repeat 50% / cover;}
.more_btn{margin-top:0px;position: relative;}
#about_area .rightBox .topGroup .more_btn b{position:absolute;top:50%;right:-10px}
.more_btn a{position:relative;overflow:hidden;width: 120px;padding: 12px 50px 12px 30px;display:inline-block;border-radius: 100px;}
.more_btn font{position:relative;font-family: "Gilda Display", serif;text-transform: uppercase;text-align: center;font-size: 15px;font-weight: 500;letter-spacing: 0.08rem;}
#course_tabs .more_btn b{top:50%;left:50%;transform:translate(-50%,70%);position:absolute;width:65px;height:30px}
.more_btn b{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}
.more_btn b img{width:50px;aspect-ratio:1;object-fit:contain}
.more_btn:hover b{-webkit-animation:movemove 1s infinite;animation:movemove 1s infinite}
@-webkit-keyframes movemove{0%{-webkit-transform:translate(0,0%);transform:translate(0,0%)}
50%{-webkit-transform:translate(10px,0%);transform:translate(10px,0%)}
100%{-webkit-transform:translate(0,0%);transform:translate(0,0%)}
}
@keyframes movemove{0%{-webkit-transform:translate(0,0%);transform:translate(0,0%)}
50%{-webkit-transform:translate(10px,0%);transform: translate(20px,0%);}
100%{-webkit-transform:translate(0,0%);transform:translate(0,0%)}
}
/* slick-dots */
section .slick-dots{display:flex}
section .slick-dots li,#news_area .left .img_box .slick-dots li{margin:11px;width:15px;height:15px}
section .slick-dots li button{padding:0;width:12px;height:12px;display:flex;flex-direction:column;align-content:center;align-items:center;justify-content:space-around}
section .slick-dots li button:before{content:"";position:absolute;border-radius:50%;border-style:solid;border-color:var(--yellow);border-width:2px;background-color:var(--yellow);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;transition:all .5s;transition-delay:0s;transition-timing-function:ease-in-out;width:4px;height:4px}
section .slick-dots li.slick-active button:before{border-color:var(--yellow);width:30px;height:30px;background-color:#ffffff00}
section .slick-dots li button:after{}
section .slick-dots li.slick-active button:after{}
section .slick-dots li button:after{content:"";display:inline-block;width:0;height:6px;background-color:var(--yellow);-webkit-transition:all 0.5s;transition:all 0.5s;border-radius:50%}
section .slick-dots li.slick-active button:after{margin:0;width:6px}
/* btn */
section .btn{position:absolute;top: -100px;right: 11em;display:flex;gap: 1.5em;padding: 0;}
section .btn a{font-size: 1.1em;color: #8c8c8c;text-decoration:none;letter-spacing:1px;transition:color 0.3s ease;display: flex;align-items: stretch;gap: 5px;font-family: "Gilda Display", serif;text-transform: uppercase;position: relative;line-height: 160%;}
section .btn a:not(:last-child):after{content:"";position:absolute;width:1px;height:60%;right: -13px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);background-color: #b9b9b9;z-index:5}
section .btn a:hover{color:#104B85}
section .btn .prev svg { -webkit-transform: scaleX(-1); transform: scaleX(-1); position: relative; }
section .btn .prev,  .btn .next {border-radius: 150px;}
section .btn .prev svg,  .btn .next svg {width: 24px;height: 24px;fill: #b7b7b7;display: flex;flex-direction: column;align-items: center;justify-content: center;border-radius: 150px;}
section .btn .next svg {fill: #b7b7b7;}

/* titleItem */
section .titleItem .decoTitle{-webkit-text-stroke:1px #e2e2e2;left:150px}
section .titleItem .subtitle,section .titleItem .page_title{color:#ffffff}
section .titleItem .Txt .title{font-size:1.6em;font-weight:600;margin-bottom:0.5em;font-family:"Noto Serif SC",serif}
section .titleItem .Txt .textEditor{font-size:1.1em;line-height:1.8;letter-spacing:1px;margin-bottom:4.5em;color:#515151;font-family:"Noto Serif SC",serif;font-weight:500;width:69%}
section .titleItem .more_btn{color:#fff;font-weight:500;text-decoration:none;display:flex;gap:0.5em;transition:all 0.3s ease;align-items:center;align-content:center}
section .titleItem .more_btn:hover{border-color:#fff}


#wrap{position:relative}


/* loadingArea */
.loadingArea{width:100%;height:100vh;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;pointer-events:none;position:fixed;left:0;top:0;z-index:9999;opacity:1;-webkit-transition:all 0.1s ease-in-out;transition:all 0.1s ease-in-out}
.loadingArea:before,.loadingArea:after{content:"";z-index:-1;position:absolute;top:0;height:100%;width:calc(50% + 1px);background-color:#fff;-webkit-transition:0.6s all ease-in-out;transition:0.6s all ease-in-out}
.loadingArea:before{left:0}
.loadingArea:after{right:0}
.loadingArea .loadLogo{opacity:0;width:260px}
.loadingArea .loadLogo img{width:100%;height:auto;display:block;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition:all 0.4s 0s ease-in-out;transition:all 0.4s 0s ease-in-out;opacity:1}
.loadingArea.show{pointer-events:auto}
.loadingArea.show .loadLogo{opacity:1;-webkit-animation:loadingAni 0.5s forwards ease-in-out;animation:loadingAni 0.5s forwards ease-in-out}
.loadingArea.show .loadLogo img{-webkit-transition:all 0.4s 1.2s ease-in-out;transition:all 0.4s 1.2s ease-in-out;opacity:0}
.loadingArea.hide:before,.loadingArea.hide:after{width:0}
@-webkit-keyframes loadingAni {
 0% {
  opacity: 0;
  -webkit-transform: translateY(-15%);
          transform: translateY(-15%);
 }
 100% {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
 }
}
@keyframes loadingAni {
 0% {
  opacity: 0;
  -webkit-transform: translateY(-15%);
          transform: translateY(-15%);
 }
 100% {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
 }
}


/* headBan */
#headBan {display: flex;flex-direction: column;align-items: center;position: relative;}

/* search_box */
#headBan #search_box { --search-w: 1520px; position: absolute; margin: -10% auto 0; width: min(92%, var(--search-w)); bottom: -6%; transform: none; z-index: 998; }
#headBan #search_box .search_tabs {width: 400px;}
#headBan #search_box .search_tabs li { justify-content: flex-start; }


/* news_area */
#news_area{padding:5vw 0;position:relative}
#news_area .title_box{margin-bottom:50px;display:flex;flex-direction:column;align-items:center}
#news_area .title_box .decoTitle{text-align:center;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
#news_area .title_box .subtitle{text-align:center}
#news_area .title_box .page_title::after{background-color:#252e34;left:50%;transform:translate(-50%,-50%)}
#news_area .right .list_box{margin-bottom: 30px;margin-left:15px}
#news_area .right .list_box *{font-family:"Noto Serif SC",serif}
#news_area .right .list_box .title{font-size:1.4rem;margin-bottom:10px;padding-bottom:10px;display:inline-block;font-weight:600;position:relative}
#news_area .right .list_box .title::after{position:absolute;content:"";width:16vw;height:1px;background-color:#bfbfbf;bottom:0;left:0}
#news_area .right .list_box .textEditor{letter-spacing:1px}
#news_area .right .right_box{position:relative}
#news_area #imglist{display:grid;grid-template-columns:49% 46%;gap:60px;width:100%;align-items:start}
#news_area li .item .Txt{font-size:1.1rem;letter-spacing:1px;-webkit-line-clamp:2;height:auto;font-weight:500;font-family:"Noto Serif SC",serif}
#news_area .left li .item .Txt{-webkit-line-clamp:1;font-size:1.2rem}
#news_area .left li .bottomBox{border-top:1px solid rgb(216 216 216 / 40%);padding:10px 0 0}
#news_area .left .img_box{position:relative}
#news_area .left .img_box:after{position:absolute;right:-70px;top:-70px;content:"";width:36%;height:35%;overflow:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);background-color:var(--triadic1);z-index:-1;border-radius:80px 20px 0px 20px}
#news_area .left .img_box li{position:relative;margin:10px}
#news_area .left .img_box li .leftItem{display:grid;gap:0px;overflow:hidden;border-radius:20px}
#news_area .left .img_box li .img_scale img{aspect-ratio:4 / 3;width:100%;height:100%}
#news_area .left .img_box li .item{padding:50px 30px;gap:10px;display:flex;flex-direction:column;justify-content:space-between;position:absolute;width:calc(100% - 80px);bottom:0px;left:50%;transform:translate(-50%,0%);padding:80px 40px 40px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgb(0 0 0 / 80%))}
#news_area .left .img_box li .item *{color:#fff}
#news_area li .item .info_box .Ntxt{padding:2px 8px;color:#fff;margin-bottom:10px;height:auto;font-size:14px;letter-spacing:1px;border-radius:5px;background:var(--yellow)}
#news_area .right .img_nav li .rightItem{display:flex;align-items:flex-start;flex-direction:column;padding:20px 0;position:relative}
#news_area .right .img_nav li .rightItem .img_scale{margin-bottom:20px}
#news_area .right .img_nav li .rightItem .img_scale img{aspect-ratio:4 / 3;object-fit:cover;border-radius:20px}
#news_area .right .img_nav li .info_box{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;flex-direction:column;align-content:flex-start}
#news_area  li .bottomBox{display:flex;justify-content:space-between;border-top:1px solid rgb(89 89 89 / 20%);padding:20px 0 0;align-items:baseline}
#news_area  li .bottomBox .year{font-family:"Gilda Display",serif;letter-spacing:1px}
#news_area  li .bottomBox .btn_next{display:flex;gap:10px;font-family:"Gilda Display",serif;color:var(--yellow);text-transform:uppercase;font-size:.8rem;align-items:stretch}
#news_area  li .bottomBox .btn_next svg{width:15px;aspect-ratio:1;fill:#fff}
#news_area .right .img_nav li .bottomBox .btn_next svg{fill:var(--yellow)}
#news_area .newsbtn{display:flex;justify-content:space-between;align-items:center;position:absolute;top:10%;right:20px;flex-direction:row}
#news_area .newsbtn .prev{display:flex}
#news_area #imglist .img_nav .slick-slide{transition:transform 0.5s ease;margin:15px}



/* reviews_area */
#reviews_area{display:flex;padding:0}
#reviews_area .bg{position:absolute;width:100%;height:100%;background-image:url(/images/01/img-reviews-bg.jpg);background-repeat:no-repeat;background-position:50% 50%;background-size:cover;top:0;right:0;z-index:-13}
#reviews_area .workframe{display:flex;width:100%;align-items:flex-end}
#reviews_area .titleItem{background-color:#fff;width:700px}
#reviews_area .titleItem .title_box{background:url(/images/01/img-reviews-top-bg.jpg);background-size:cover;color:#fff;padding: 6em 0 5vw 14vw;display:flex;flex-direction:column;justify-content:center;position:relative}
#reviews_area .titleItem .Txt{padding: 6em 0 9vw 14vw;}

#reviews_area .list_box{padding:0em 0 4em 9em;position:relative;width:55%}
#reviews_area .list_box:after{content:'';position:absolute;right:40px;top:-150px;background:url(/images/01/img-reviews-logo.png);background-repeat:no-repeat;background-size:inherit;width:1000px;height:100px;z-index:-1}
#reviews_area .list_box .partner{margin-right:-120px}
#reviews_area .partnerItem{border:1px solid #f1f1f1;margin:30px 30px;border-radius:30px;background-color:#ffff;}
#reviews_area .partnerItem:after{content:"";width:100%;height:100%;background-color:#dadada;display:block;position:absolute;bottom:0;right:0;z-index:-1;-webkit-transform:translate(40px,40px);transform:translate(20px,20px);border-radius:30px}
#reviews_area .partnerItem.activeFirst{background:#fff;transition:background 0.3s ease}
#reviews_area .partnerItem .item{position:relative;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,0.1);transition:transform 0.3s ease,box-shadow 0.3s ease;overflow:hidden;-webkit-transition:all 0.5s;transition:all 0.5s;cursor:pointer;border-radius:30px}
#reviews_area .partnerItem .item .Img{width:100%;height: 100%;-webkit-transition:all 0.5s;transition:all 0.5s;opacity:0}
#reviews_area .partnerItem .item .Img img{width: 100%;height: 100%;}
#reviews_area .partnerItem.activeFirst .item .Img{opacity:1}
#reviews_area .partnerItem .item .textBox{background-color:rgb(255 255 255 / 40%);width:-webkit-fill-available;height:-webkit-fill-available;margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;padding:50px 35px 30px 35px;-webkit-transition:all 0.5s;transition:all 0.5s;display: flex;flex-direction: column;align-items: center;justify-content: center;}
#reviews_area .partnerItem.activeFirst .item .textBox{ background-color: rgba(0, 0, 0, 0.4);}
#reviews_area .partnerItem.activeFirst .item .textBox *{color: #fff;}
#reviews_area .partnerItem .item .textBox *{text-align: center;}
#reviews_area .partnerItem .textBox .title{font-size: 1.5em;letter-spacing: 1.5px;font-weight:600;margin-bottom: 0.5em;font-family: "Noto Serif SC", serif;}
#reviews_area .partnerItem .textBox font{display:flex;margin-bottom:0.5em;justify-content: center;gap: 5px;}
#reviews_area .partnerItem .textBox font svg{width: 19px;height: 19px;fill: #b5985e;margin-right:2px}
#reviews_area .partnerItem .textBox .subtitle{font-size: 1.05em;line-height: 1.7;margin-top: 20px;padding-top: 20px;border-top: 1px solid #dddddd40;}
#reviews_area .partnerItem .item{height: 390px;}
#reviews_area .partnerItem .item .textBox{padding: 40px 20px;}


/* info_cards */
.info_cards ul{display:flex;justify-content:center;gap:10px 20px}
.info_cards ul li{position:relative;padding:20px}
.info_cards ul li::after{content:"";position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:-1;display:block;width:100%;height:100%;border:1px solid #d8d8d8}
.info_cards .card{position:relative;flex:1;width: 410px;border:1px solid #ddd;overflow:hidden;background:#fff;transition:transform 0.3s ease,box-shadow 0.3s ease}
.info_cards .card:hover{transform:translateY(-5px);box-shadow:0 6px 18px rgba(0,0,0,0.15)}
.info_cards .card .card_img{position:relative;width:100%;height:0;padding-top:40%;overflow:hidden}
.info_cards .card .card_img img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.info_cards .card_overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgb(0 0 0 / 7%);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#fff}
.info_cards .card_overlay em{font-size:0.9em;margin:0;font-weight:400;letter-spacing:1px;font-style:inherit;font-family:"Gilda Display",serif}
.info_cards .card_overlay .title{font-size:1.3em;margin:0.4em 0 0;color:#fff;font-weight:500;font-family:"Noto Serif SC",serif}


@media screen and (max-width: 1780px) {
   	#news_area{padding: 7vw 0 8vw 0;}
}
@media screen and (max-width:1560px){
    #reviews_area .titleItem .title_box{padding: 5vw 0 5vw 6vw;}
	#reviews_area .titleItem .Txt{
    padding: 5vw 2vw 7vw 6vw;
}
    #reviews_area .list_box{
    padding: 0em 0 4vw 6vw;
}
    #reviews_area .titleItem{
    width: 30%;
}
}
@media screen and (max-width:1440px){
	section .title_box .page_title{}
	section .title_box .page_title{font-size: 2.3rem;}
    .info_cards .card{
    width: 360px;
}
    #reviews_area .partnerItem .textBox .title{
    font-size: 1.2em;
}
    #reviews_area .partnerItem .textBox .subtitle{
    font-size: 1em;
}
section .btn{
    top: -50px;
    right: 0;
}
    #reviews_area .list_box{
    width: 60%;
}
    #reviews_area .list_box:after{
    top: -70px;
}
        section .title_box .decoTitle{
    font-size: 4rem;
}
}

@media screen and (min-width:1281px){
	.more_btn.white a:hover font{color:#ffffff}
	.more_btn.white a:hover{width:150px}
}

@media screen and (max-width:1280px){
	section .title_box{margin-bottom:0px}
	header .barBox #webmenu,header.scroll .barBox #webmenu{display:none}
    section .title_box .subtitle,section .title_box .subtitle .secondColor{}
	section .titleItem .decoTitle{
    display: none;
}
    #news_area{}
	#news_area li .item .Txt{}
	#news_area .right .img_nav li{margin-bottom:10px}
	#news_area .left .img_box li .img_scale img{aspect-ratio:4 / 3.2}
#reviews_area .titleItem .title_box,#reviews_area .titleItem .Txt{
    padding: 8vw 6vw;
}

}

@media (max-width:1200px){
	.more_btn a{padding:6px 30px 6px 20px}
	#imglist .img_nav{position:relative}
	#news_area::after{width:100%;height:45%}
        .info_cards .card{
    width: auto;
}
    .info_cards ul{
    flex-direction: column;
    gap: 28px 20px;
}
    .info_cards ul li{
    padding: 14px;
}
    section .title_box .decoTitle{
    display: none;
}
}
@media screen and (min-width: 1025px){
}
@media screen and (max-width:1024px){
    section .title_box .subtitle{}
	section .title_box .page_title,#conBox .tit h2{}
	section .title_box .page_title{font-size: 2.1rem;letter-spacing:1px}
    section .titleItem .Txt .title{
    font-size: 1.2em;
}
    section .titleItem .Txt .textEditor{
    font-size: 1em;
    width: -webkit-fill-available;
    margin-bottom: 1.5em;
}
	#news_area .right{order:1;width: 100%;}
    #news_area .left{display: none;}
	#news_area{padding:3vw 0 5vw 0}
	#news_area #imglist{display:flex;gap:0;justify-content: flex-start;align-items: center;}
    #news_area .right .img_nav{order:1;width:100%}
	#news_area .left .img_box li .item{width:calc(100% - 40px);padding:30px 20px}
	#news_area .left .img_box li .leftItem{grid-template-columns:1fr}
	#news_area .left .img_box li .img_scale img{aspect-ratio:4 / 2.7}
	#news_area .right .img_nav li .item .Txt{font-size:1.2rem}
	#news_prev svg,#news_next svg{width: 20px;height: 20px;padding: 12px;}
}

@media (min-width:961px){
	.bottombtn{position:absolute;bottom:60px;right:0}
#news_area:before{content:'';position:absolute;left:0;top:0;background:#dce9f1;background-size:cover;background-repeat:no-repeat;width:27vw;height:50vh;opacity:.6}
#news_area:after{content:'';position:absolute;right:0;bottom:0;background:#f4f4f4;background-repeat:no-repeat;width:73vw;height:55vh;z-index:-4}
}
@media (max-width: 960px){
    section .titleBox .subtitle{font-size:31px}
	#reviews_area .workframe{flex-direction:column}
	#reviews_area .titleItem{
    width: -webkit-fill-available;
    padding: 0;
    flex: auto;
}
    section .btn{
    position: relative;
    top: 0;
    right: -20px;
}
    section .titleItem{flex:0 0 100%;padding: 1em 0em;border-radius:0}
	#reviews_area .list_box{padding: 3em 0em;width: -webkit-fill-available;}
	#reviews_area .partnerList{gap:1em}
	#news_area{padding: 6vw 0;}
    #reviews_area .list_box .partner{
    margin-right: 0;
}
    #reviews_area .list_box:after{
    display: none;
}
    #reviews_area .partnerItem .item{
    height: auto;
}
    #news_area .newsbtn{
    position: relative;
    right: 0;
    top: 0;
    display: flex;
    justify-content: flex-start;
}
    #news_area .right .topright{
    margin-bottom: 40px;
}

}

@media (max-width:768px){
	.info_cards{padding: 13vw 0;}
}
@media screen and (max-width:640px){
    section .title_box .page_title{font-size: 28px;}
	section .title_box .subtitle,section .title_box .subtitle .secondColor{}
	#news_area .left .img_box li .item .info_box .time{margin-bottom:0}
	#news_area li .item .Txt{font-size:17px}
}
@media screen and (max-width: 550px){
	#product_list { margin: 2vmax auto 0; width: min(100%, 350px); }
	.newsbtn{right: -78px;}
	#news_prev svg,#news_next svg{width: 15px;height: 15px;padding: 11px;}
}
