/* section */
section { padding: 5vw 0; }
section >* { z-index: 3; }
section .title_box {margin-bottom: 50px;}
section .title_box p{
    display: none;
}
section .title_box font {line-height: 130%;letter-spacing: 0px;font-weight: 400;font-size: 18px;color: #404040;font-family: 'Cardo', serif;}
section .title_box font:first-child {margin-right: 5px;}
section .title_box .page_title {font-weight: 400;font-size: 28px;color: #242424;margin-bottom: 50px;font-family: 'Cardo', serif;}
section .title_box h2{position:relative}
section .title_box .page_title span{font-weight:400;font-size:28px;color:#4e2749;vertical-align:bottom;font-family: 'Cardo', serif;margin-right: 10px;}
section.bg_box { background: no-repeat 50% / cover; background-attachment: fixed; }
section.bg_box:before , section.bg_box:after {position: absolute;width: 100%;height: 100%;background: #ffffff;top: 0;left: 0;z-index: 1;content: "";opacity: 1;}
section .title_box h2:before{content:"";width:60px;height:1px;background:var(--primary);display:block;position:absolute;bottom:-20px;left:0}
section .title_box h2:after{content:"";width: 170%;height:1px;background:#262626;display:block;position:absolute;bottom:-20px;left:0;opacity:0.1}

.more_btn{margin-top: 30px;}
.more_btn a{position:relative;overflow:hidden;width:130px;padding:10px 30px;display:flex;align-items:center;justify-content:space-between;z-index:3}
.more_btn font{text-align:left;font-weight:500;color:#ffffff;letter-spacing:1px;font-size:13px;font-family:'Cardo',serif;z-index:10}
.more_btn a:before{content:"";height:100%;width:0;display:block;position:absolute;bottom:0;left:0px;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;background-color:#31192e}
.more_btn a::after{content:'';position:absolute;height:100%;width:100%;top:0;left:0;background-color:#4e2749;z-index:-1;transform-origin:top left;transition:all 1.1s ease-in-out;-webkit-transition:all 1.1s ease-in-out}
.more_btn .arrow{position:relative;display:inline-block;vertical-align:middle;width:18px;height:18px}
.more_btn .arrow:after,.more_btn .arrow:before{content:"";position:absolute;top:50%;left:0;z-index:1;width:100%;height:1px;margin-top:-0.5px;background-color:#ffffff}
.more_btn .arrow:after{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
.more_btn:hover .arrow:after{-webkit-transform:rotate(270deg);transform:rotate(270deg)}

/* about_area */
#about_area{background-color:#f4f4f4;padding: 8vw 0 4vw 0;}
section .slogan{-webkit-text-stroke:0.5px #dedede;line-height:120%;letter-spacing:5px;font-weight:600;font-size:80px;color:transparent;text-transform:uppercase;font-family:'Cardo',serif;z-index:20;position:absolute}
#about_area .sloganTop{width:30%;top:0px;transform: translate(42%,30%);}
#about_area .sloganBtm{position:absolute;top:0;left:49%;transform:translate(-50%,0%);-webkit-writing-mode:vertical-lr;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;font-size: 110px;letter-spacing:9.5px;z-index:0}
#about_area .workframe{display:flex;align-items:flex-end;justify-content:center;width:var(--width-xl);font-family: 'Cardo', serif;}
#about_area .sideLogo{position:absolute;top: -50px;right:70px}
#about_area .img_item{margin-bottom:30px;width:calc(40% - 0px);transform:translateX(-7%)}
#about_area .info_item{transform:translate(25%,-10%);width:calc(40% - 30px);}
#about_area .img_item img{width:90%}
#about_area .info_item article{margin-bottom:30px;width:90%;line-height:210%;letter-spacing:2px;font-weight:100}
#about_area .info_item article .Txt{color:#6c6c6c}

/* list_box */
.list_box .info_box h3 { height: 30px; font-weight: 400; font-size: 18px; }

/* news_area */
#news_area .list_box .row { padding-bottom: 30px; }
#news_area .list_box .row img { height: 320px; }
#news_area .list_box .row .info_box { padding: 15px; width: calc(100% - 70px); box-shadow: 0 0 10px rgba(var(--black-rgb), .3); left: 20px; bottom: 0; }
#news_area .list_box .row .info_box p * { font-weight: 100; font-size: 14px; }
#news_area .list_box .row .info_box p a { margin-right: 10px; padding: 0 2px; max-width: calc(100% - 82px); height: 23px; z-index: 2; }

/* product_area */
#product_area img{height:100%}
#product_area{padding:4vw 0 3vw 0;position:relative}
#product_area .workframe{width:100%}
#product_area .title_box{display:flex;flex-direction:column;align-items:center;margin-bottom:70px}
#product_area .title_box h2{margin-bottom:10px}
#product_area .title_box h2:before,#product_area .title_box h2:after{display:none}
#product_area .title_box .ellipsis{color:#6c6c6c;text-align:center;margin-top:20px}
#product_area ul li{position:relative}
#product_area ul li .img{background:no-repeat 50% 45% / cover;display:inline-block}
#product_area ul li .img img{max-width:initial}
#product_area ul li .txt_box{position:absolute;padding:40px 40px 40px;width:430px;height:400px;background:#ffffff;bottom:100px;right:-70px;z-index:10;opacity:0}
#product_area ul li.slick-active{margin:0;transform:translate(0%,0%)}
#product_area ul li.slick-active .txt_box{opacity:1;transition-delay:1s}
#product_area ul li a.moreP{position:absolute;width:100%;height:100%;left:0;top:0;z-index:30}
#product_area ul li .txt_box:before{position:absolute;width:calc(100% - 22px);height:calc(100% - 22px);border:1px #c5b49f solid;top:10px;left:10px;content:""}
#product_area ul li .txt_box .title{font-weight:500;line-height:25px;letter-spacing:0;font-size:16px;color:#404040;margin-right:12px;padding-right:12px;position:relative}
#product_area ul li .txt_box .title:before{content:"";width:2px;height:12px;background-color:#e8e8e8;display:block;position:absolute;top:calc(50% - 6px);right:0}
#product_area ul li .txt_box .specText{color:#767676;font-size: 14px;}
#product_area ul li .roomInfoList{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid rgb(0 0 0 / 18%);padding-bottom:10px;margin-bottom:20px}
#product_area ul li .txt_box h2{font-weight:400;line-height:160%;letter-spacing: 0;font-size:20px;color:#3e3e3e;font-family: 'Cardo', serif;}
#product_area ul li .roomSepcList{height: 190px;}
#product_area ul li .txt_box span{letter-spacing: 0;font-weight:300;font-size: 16px;color: #959595;opacity:.8;font-family: 'Cardo', serif;}
#product_area ul li article{font-weight:300;letter-spacing:.04em;line-height:190%;color:#493e30}
#product_area ul li article .Txt h3{color:#6c6c6c;margin-bottom: 10px;font-size: 15px;overflow: hidden;height: 60px;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
#product_area ul li article .Txt .space{display:flex;align-items:baseline;margin-bottom: 5px;}
#product_area ul li .txt_box .button{padding-top:40px}
#product_area ul li .txt_box .button a{overflow:hidden;position:relative;padding:10px;min-width:180px;background:rgb(73 62 48 / 66%);border:none;text-align:center;font-size:14px;color:#fff}
#product_area ul li .txt_box .button a span{position:relative;color:#fff;z-index:5}
#product_area ul li .txt_box .button a::before,#product_area ul li .txt_box .button a::after{position:absolute;width:0;height:0;border-style:solid;border-width:50px 0 0 210px;border-color:transparent transparent transparent #b1a08b;display:block;top:0;left:0;-webkit-transform:translate(0%,100%);-ms-transform:translate(0%,100%);transform:translate(0%,100%);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;z-index:1;content:""}
#product_area ul li .txt_box .button a::after{-webkit-transform:translate(0%,-100%);-ms-transform:translate(0%,-100%);transform:translate(0%,-100%);border-width:0 210px 50px 0;border-color:transparent #b1a08b transparent transparent}
#product_area ul li .txt_box .button a:hover::before,#product_area ul li .txt_box .button a:hover::after{-webkit-transform:translate(0%,0%);-ms-transform:translate(0%,0%);transform:translate(0%,0%)}
#product_area .more{margin-top:10px}
#product_area .more a{position:relative;padding:0px 60px;border:1px rgb(255 255 255 / 0%) solid;background-color:rgb(255 255 255 / 0%);display:inline-block;color:#464646}
#product_area .more font{text-align:center;color:#3e3e3e}
#product_area .more a svg.arrow{position:absolute;width:20px;right:7px;top:calc((100% - 11.41px) / 2)}
#product_area .btns{position:absolute;right:29.4%;bottom:27%;z-index:20;display:-webkit-box;display:-ms-flexbox;display:flex}
#product_area .btns a.facarrow{display:inline-block;width:50px;height:45px;background:#4e2749}
#product_area .btns a.facarrow i{padding:14px 20px;color:#fff}
#product_area .btns a.facarrow:hover{background:#aba094}
#product_area .list_box{position:relative;width: 100%;}


/* facilities_area */
#facilities_area{padding:0vw 0 5vw 0}
#facilities_area .workframe{display:flex;justify-content: center;}
#facilities_area .sloganTop{transform:translate(29%,-70%);width: auto;bottom:0;font-size:140px;letter-spacing:12px;-webkit-text-stroke:0.5px #dedede;z-index:0}
#facilities_area .sidePeople{position:absolute;bottom: 40px;left:-200px;z-index:10}
#facilities_area .leftBox{width:50%}
#facilities_area .leftBox .Img{position:relative}
#facilities_area .leftBox .linkBox{margin-top:80px;width:70%}
#facilities_area .rightBox{margin-left:60px;width:35%;position:relative}
#facilities_area .rightBox .textEditor{margin-bottom:110px}
#facilities_area .rightBox .textEditor .Img img{width:100%;height:100%}
#facilities_area .more_btn{text-align:right;display:flex;justify-content:flex-end;transform:translate(10%,0%)}

@media screen and (max-width: 1680px){
	#product_area .btns{right:9.4%;bottom:27%}
	#product_area ul li.slick-active .txt_box{right:70px}
}

@media screen and (min-width: 1281px){
	#about_area .d_flex { align-items: center; }
	#news_area .list_box .row:hover .info_box { bottom: 30px; }
	#product_area .row:hover .info_box .line { width: 100%; }
	#book_area .row:hover .info_box { bottom: 0; }
	#about_area .img_item:after{position:absolute;display:block;bottom:-190px;left:-80px;content:"";background:#ede5ea;z-index:-1;height:440px;width:300px}
	#about_area .workframe:after{position:absolute;display:block;top:-115px;right:0;content:"";background:#cec1ca;z-index:-1;height:270px;width:180px}
	#about_area .sloganBtm:after{position:absolute;display:block;top:0;right:-30px;content:"";background:#262626;z-index:-1;height: 120%;width:1px;opacity:0.1}
	.more_btn a:hover:before{width:100%}
	#product_area .list_box:after{position:absolute;display:block;top: -60px;right: -80px;content:"";background:#ede5ea;z-index:-1;height: 510px;width: 830px;}
	#product_area .list_box:before{position:absolute;display:block;top: -150px;right: 220px;content:"";background-image: url(/images/39/img-p-logo.png);z-index: 0;height: 430px;width: 430px;}
	#product_area:after{position:absolute;display:block;top: 630px;left: 0px;content:"";background: #f4f4f4;z-index: 1;height: 580px;width: 40%;}
	#facilities_area .leftBox .Img:after{position:absolute;display:block;bottom: -20px;left: -20px;content:"";background: #4e2749;z-index: -1;height: 320px;width: 470px;}
	#about_area .more_btn{position:absolute;bottom:60px;right:-50px}
	#about_area .more_btn a{width:50px;display:flex;flex-direction:column;align-items:center;padding:20px 25px}
	#about_area .more_btn font{text-align:center;margin-bottom:20px}
	#product_area ul li{margin:60px auto 0;transform:translate(10%,0%);-o-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8)}
}
@media screen and (max-width: 1280px){
	#about_area .workframe{width:90%}
	#about_area .img_item:before,#about_area .img_item img{width:100%}
	#about_area .img_item img{}
	#product_area .row .info_box{background:rgba(var(--secondary-rgb),.5)}
	#product_area .row .img_box{opacity:.1}
	#facilities_area .sloganTop{display:none}
	#facilities_area .rightBox{width:42%}
	#about_area .sloganTop{transform:translate(22%,20%)}
	#about_area .info_item{transform:translate(10%,0%)}
	#about_area .info_item article{width:100%}
	#product_area .btns{right:4.4%;bottom:-4%}
	#product_area{padding:4vw 0 12vw 0}
	#product_area ul li .txt_box{width:400px}
}
@media screen and (max-width: 1024px){
	#about_area .img_item:before{border:0;background:rgba(var(--secondary-rgb),.6);top:0;right:0;z-index:2}
	#about_area .info_item{margin-top:-80px;z-index:4}
	#facilities_area .sidePeople{display:none}
	#facilities_area .leftBox .linkBox{width:100%;margin-top:30px}
	footer .track p{font-size:70px}
	#about_area .sideLogo,#about_area .sloganTop,#about_area .sloganBtm{display:none}
}
@media screen and (max-width: 768px){
	#product_area .list_box{margin:auto}
	#product_area .row .info_box >div{width:calc(100% - 60px)}
	#product_area .row .info_box article{height:50px;-webkit-line-clamp:2}
	#book_area .row img{height:350px}
	#facilities_area .workframe{display:flex;flex-direction:column}
	#facilities_area .leftBox,#facilities_area .rightBox{width:auto;margin-left:0}
	section .title_box h2:after{width:100%}
	#facilities_area .rightBox{display:flex;flex-direction:column}
	#facilities_area .rightBox .textEditor{margin-bottom:50px}
	#facilities_area .more_btn{transform:translate(0%,0%);display:flex;justify-content:center}
	#about_area .workframe{display:flex;flex-direction:column;align-items:flex-start}
	#about_area .img_item{width:auto;transform:translateX(0%)}
	#about_area .info_item{margin-top:0;transform:translate(0%,0%);width:auto}
	#product_area  ul li .txt_box,#product_area  ul li.slick-active .txt_box{position:relative;margin-top:0px;width:calc(90% - 70px);height:auto;right:0;bottom: 20px;}
	#product_area ul li .img img{max-width:100%}
}
@media screen and (max-width: 640px){
	#about_area .img_item:before { background: rgba(var(--secondary-rgb), 0); }
	#about_area .info_item {margin-top: 0px;}
}
@media screen and (max-width: 500px){
	#product_area .list_box { width: 100%; }
}