.webBox * , .webBox :before , .webBox :after {transition: none;-webkit-transition: none;}
/* section */
section{padding: 4vw 0;}
section >*{z-index:5}
section .title_box .page_title{position: relative;margin-bottom: 40px;color: var(--primary);font-size: 20px;letter-spacing: 1.7px;line-height: 1.8;font-weight: 400;border-left: 1px solid #685842;border-right: 1px solid #685842;padding: 0px 15px;}
section .title_box{display:flex;flex-direction:column;align-items:center}
section .title_box .subtitle{font-size: 40px;font-family:"Gilda Display",sans-serif;line-height: 1.03;padding-bottom: 10px;position: relative;display: inline-block;color: var(--primary);}
section .title_box .subtitle::before{-webkit-animation:beat 1.5s ease-in-out infinite;animation:beat 1.5s ease-in-out infinite;border-radius:999px;border:1px solid var(--primary);content:"";height:14px;left:-30px;position:absolute;top:8px;width:14px}
section .title_box .subtitle::after{-webkit-animation:beat 1.5s ease-in-out infinite;animation:beat 1.5s ease-in-out infinite;background-color:var(--primary);border-radius:999px;content:"";height:6px;right:-26px;position:absolute;top:23px;width:6px}
@-webkit-keyframes beat{from{-webkit-transform:scale(1);transform:scale(1)}
50%{-webkit-transform:scale(1.3);transform:scale(1.3)}
100%{-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes beat{from{-webkit-transform:scale(1);transform:scale(1)}
50%{-webkit-transform:scale(1.3);transform:scale(1.3)}
100%{-webkit-transform:scale(1);transform:scale(1)}
}
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 */
.more_btn{color: #b19b6a;padding: 10px 30px;position:relative;text-align:center;margin:auto;width:120px;display:flex;flex-direction:column;justify-content:center;border: 1px solid #685842;transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.more_btn b{position:absolute;top:50%;right:0px}
.more_btn font{font-size: 12px;position:relative;letter-spacing:1px;font-family: "Gilda Display", sans-serif;text-align: center;}
.more_btn .line{position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px)}
.more_btn .line::before,.more_btn .line::after{content:"";position:absolute;background-color:var(--primary);z-index:1;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
.more_btn .lineColumn::before{top:0;left:0;width:1px;height:0}
.more_btn .lineColumn::after{bottom:0;right:0;width:1px;height:0}
.more_btn .lineRow::before{top:0;left:0;width:20px;height:1px}
.more_btn .lineRow::after{bottom:0;right:0;width:20px;height:1px}
.more_btn:hover .lineColumn::before,.more_btn:hover .lineColumn::after{height:100%}
.more_btn:hover .lineRow::before,.more_btn:hover .lineRow::after{width:100%}
.more_btn:before,.more_btn::after{content:"";position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:block;width:1px;height:calc(100% - 16px);background:#685842;z-index:10}
.more_btn::before{right:-7px}
.more_btn::after{left:-7px}

/* wrap */
#wrap{position:relative;}
#wrap::before{content:"";display:block;pointer-events:none;content:"";width:1px;height:100%;background-color: #44372a;position:absolute;top:0;right:auto;bottom:auto;left:70px;z-index:2}
#wrap::after{content:"";display:block;pointer-events:none;content:"";width:1px;height:100%;background-color: #44372a;position:absolute;top:0;right:70px;bottom:auto;left:auto;z-index:1}

/* about_area */
#about_area{position:relative;padding: 0;}
#about_area .serviceimg1,#about_area .serviceimg2{position:absolute;top:0;right:0;transform:translate(-110%,-45%);z-index:0;opacity:.5}
#about_area .serviceimg2{transform:translate(0%,120%)}
#about_area .serviceT{position:absolute;top:20%;right:-10%;z-index:0;opacity:.5}
#about_area .workframe{width: 100%;}
#about_area .fixTxt{position:absolute;top:-320px;left:36%}
#about_area .aboutArea{padding: 50px 0 0;margin:auto;display: grid;grid-template-columns: 55% 1fr;gap: 0;position: relative;align-items: center;}
#about_area .aboutArea .img_item{position: relative;overflow: hidden;}
#about_area .aboutArea .img_item::before{content:"";position:absolute;right:-1px;top:-1px;display:block;width:200%;height:101%;background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgb(9 8 8) 100%);z-index:10}
#about_area .aboutArea .img_item img{height: 460px;}
#about_area .aboutArea .topGroup{margin:50px 0;padding:0 40px}
#about_area .aboutArea .title_box .subtitle,#about_area .aboutArea .title_box h2{text-align:center}
#about_area .aboutArea article{padding-bottom:40px}
#about_area .aboutArea article p{font-size: 15px;line-height: 1.9;letter-spacing: 2px;text-align:center;}
#about_area .about_icon *{transition:unset;-webkit-transition:unset}

/* news_list */
#news_area,#about_area{z-index:10;position:relative}
#news_area .workframe{width:min(1140px,76%)}
#news_area .titleBox{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;align-items:center;margin:0px 20px 30px}
#news_area .title_box .page_title{margin-bottom:0}
#news_list{margin: 70px 0;z-index:10;position:relative}
#news_list .bottom{display:flex;align-items:center;justify-content:space-between}
#news_list .linen{display:block;w;width:80%;height:4px;background:#faf8f4;position:relative}
#news_list .linen:before{content:'';position:absolute;top:0;left:0;height:4px;background:var(--primary);width:46%}
#news_list .info_box{margin-top:.5em}
#news_list .info_box .time{font-size:.9em;color:var(--g_500)}
#news_list .info_box h3{margin:.2em 0 .5em}
#news_list .info_box article{margin-bottom:.5em;height:3.2em;font-size:.9em;color:var(--g_600);-webkit-line-clamp:2}
#news_list ul{margin-bottom:40px}
#news_list li{border-bottom: 1px solid #483d2e;padding: 30px 40px;position: relative;}
#news_list li::after{content:"";position:absolute;background-color:#987d62;z-index:1;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;bottom:0;left:0;width: 0;height:1px}
#news_list li:hover::after{width:100%}
#news_list li .Txt{align-items:center;display:grid;grid-template-columns: 220px 1fr;gap: 60px;}
#news_list li .date font{font-family:"Gilda Display",sans-serif;font-size:15px;color:var(--primary);font-weight:600;display:flex;align-items:center;gap:10px;position:relative}
#news_list li .date font b{font-family:"Gilda Display",sans-serif;font-size:15px;color: #685842;}
#news_list li .date font a{color: var(--primary);font-weight:400;border: 1px solid #685842;display:inline-block;height:auto;font-size: 12px;padding:3px 20px;position:absolute;right:0;}
#news_list li .title{display: grid;grid-template-columns: 1fr 50px;}
#news_list li .title h3{font-size: 17px;-webkit-line-clamp:2;height: auto;line-height:1.6;font-weight: 300;}
#news_list li .more_btn{width:auto;padding:15px 30px;border:none}
#news_list li .more_btn b::before{content:"";position:absolute;top:calc(50% - 0px);right:25px;width:18px;height: 1px;background: var(--primary);}
#news_list li .more_btn b::after{content:"";position:absolute;top:calc(50% - 5px);right:25px;width:10px;height:10px;border-top: 1px solid var(--primary);border-right: 1px solid  var(--primary);transform:rotate(45deg)}
#news_list .more_btn:before, #news_list .more_btn::after {display: none;}
#news_list li article{-webkit-line-clamp: 1;height: auto;font-size: 16px;text-align: justify;margin-bottom: 0;font-weight: 300;}
#news_list li p{display:flex;align-items: center;gap: 60px;color: var(--primary);}
#news_list li p span{display:inline-block;width: 7px;aspect-ratio: 1/1;background: linear-gradient(90deg, var(--primary), var(--secondary));border-radius: 50px;}
#news_list li:hover p span{border:1px solid var(--primary);background:none}


@media screen and (max-width: 1680px) {
	#about_area .serviceimg1 img,#about_area .serviceimg2 img{width:75%}
	#about_area .serviceimg1,#about_area .serviceimg2{right:-130px}
	#about_area .serviceimg2{transform:translate(-50%,305%)}
}
@media screen and (max-width:1560px){
	#about_area .serviceimg1 img,#about_area .serviceimg2 img{width:60%}
	#about_area .serviceimg1,#about_area .serviceimg2{right:-130px}
	#about_area .serviceimg2{transform:translate(-50%,295%)}
}
@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}
}
@media (min-width:1201px){
}
@media (max-width:1200px){
	.more_btn a{padding:6px 30px 6px 20px}
	#about_area .aboutArea{grid-template-columns: 1fr;}
}
@media screen and (max-width:1024px){
	#wrap::before{left: 20px;}
	#wrap::after{right: 20px;}
    section .title_box .subtitle{font-size:32px}
    #news_list .linen{width:70%}
}
@media (min-width:961px){
	.bottombtn{position:absolute;bottom:60px;right:0}
}
@media (max-width: 960px){
	section{padding:8vw 0 4vw 0}
	#news_list li .Txt{grid-template-columns: 1fr;gap: 10px;}
	#news_area .titleBox{display:flex;flex-direction:column;align-items:center;margin-top:20px}
    #about_area .aboutArea .img_item img{height: 100%;}
}
@media screen and (max-width:640px){
	#news_list .bottom{justify-content: center;}
    #news_list .linen{display:none;}
    #news_list{margin-top: 8vw;}
    #news_list li:nth-child(even){margin-top:0}
	#news_list li{padding: 25px 10px;}
    #news_area .titleBox .h2_title{writing-mode: unset;}
    #news_area .titleBox .btn{display:none;}
    #news_area .workframe{display:block}
}