.section_area {padding: 5vw 0;}
.section_area .area_title { position: relative; padding-bottom: .3em; letter-spacing: .1em; text-align: center; }
.section_area .area_title:before { position: absolute; width: 3em; height: .1em; background: var(--primary); display: block; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); content: ""; }
.section_area .sub_title {font-weight: 500;font-size: 17px;color: #464747;font-family: "Poppins", serif;text-transform: uppercase;font-weight: 400;}
.section_area .sub_title:before{content:'';display: block;width: 12px;aspect-ratio: 1/1;background: var(--secondary);border-radius: 50%;box-shadow: 0 20px var(--primary);margin-bottom: 35px;}
.section_area .cn_title {font-size: 35px;color: #464747;font-weight: 500;text-align: center;margin-bottom: 4vw;}
.section_area .more_btn {padding: 15px 2.2em;background: var(--primary);font-weight: 300;color: var(--white);border-radius: 50px;display: inline-flex;align-items: center;}
.section_area .more_btn:hover {background:var(--info)}
.section_area .more_btn span{display: inline-flex;width: 15px;height: 1px;background: #fff;align-items: center;justify-content: center;margin-left: 25px;}
.section_area .more_btn span:after{content:'';height: 15px;width: 1px;background: #fff;position: absolute;}
.section_area .more_btn:hover span:after{transform:rotate(90deg);}
.section_area .list_box { margin-top: 2vmax; }
.section_area .list_box .slick-dots { position: relative; margin: 1em 0; bottom: 0; }

/* about_area */
#about_area {position: relative;padding-top: 8vw;}
#about_area:before{position:absolute;content:url(/images/01/show.png);bottom: 0;}
#about_area .fixTxt2{position:absolute;bottom: 0;color: #31302f;opacity: .10;font-size: max(9 * (1vw + 1vh) / 2, 55px);font-family: "Poppins", serif;font-weight: 700;right: 0;bottom: -20%;text-transform: uppercase;}
#about_area .sub_title{display:flex;flex-direction: row;align-items: center;}
#about_area .workframe {display: grid;align-items: center;grid-template-columns: 200px 1fr 33%;gap: 120px;}
#about_area .tt_box {writing-mode: vertical-rl;display: flex;flex-direction: column;align-items: flex-start;justify-content: flex-end;margin-top: -140px;}
#about_area .runnn ul{display:grid;grid-template-columns: repeat(3, 1fr);margin-bottom: 40px;}
#about_area .runnn li{border-left:1px solid #ddd;padding-left: 20px;padding-top: 20px;}
#about_area .runnn h2{display:flex;align-items: flex-start;font-weight: 400;font-size: 15px;}
#about_area .runnn h2 b{font-family: "Lato", serif;font-size: 40px;line-height: 1.1;margin-right: 7px;}
#about_area .runnn p{font-size:18px}
#about_area .tt_box h2{word-spacing: 100vw;height: 300px;font-size: 28px;writing-mode: vertical-lr;letter-spacing: 3px;font-weight: 500;margin-right: 10px;}
#about_area article{margin-bottom: 40px;}
#about_area .info_box{margin-left: 40px;}
#about_area .img_box{position:relative;display: flex;align-items: center;justify-content: center;}
#about_area .img_box:after{content:url(/images/01/circle.png);position: absolute;animation-name: circle;animation-iteration-count: infinite;animation-timing-function: linear;animation-duration: 30s;}
#about_area .img_box:before{content:url(/images/01/ccircle.png);position: absolute;z-index: -1;left: 25%;}
@keyframes circle{0%{transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);-webkit-transform:rotate(0);}50%{transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);-webkit-transform:rotate(90deg);}100%{transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);-webkit-transform:rotate(0);}}
#about_area .img_box .img_cover {border-radius: 50%;aspect-ratio: 1/1;}
#about_area .img_box .fixTxt{position:absolute;bottom: 0;left: -15%;z-index: 2;}
#about_area .img_box img { width: 100%; height: 100%; }

/* coust_area */
#coust_area{position:relative}
#coust_area:before {position: absolute;background: url(/images/01/dott.png);bottom: 3vw;right: 0;content: "";width: 100%;height: 30vmax;opacity: .6;-webkit-animation: goals_bg 50s linear infinite;animation: goals_bg 30s linear infinite;background-repeat: repeat-x;background-position: 0% 40%;background-size: 130%;}
@keyframes goals_bg{0%,100%{background-position: 85% 0;}50%{background-position:55% 0;}}
#coust_area .workframe{width:min(90%, 1220px)}
#coust_area .box{display:grid;grid-template-columns: repeat(5, 1fr);gap: 40px;}
#coust_area .info{position:relative;display: flex;flex-direction: column;align-items: center;}
#coust_area .box .img{background:#e9e9e9;display: flex;align-items: center;justify-content: center;aspect-ratio: 1/1;border-radius: 50%;position: relative;width: 180px;}
#coust_area .box .img:after{content:url(/images/01/fcircle.png);position: absolute;top: -10px;}
#coust_area .box .info:hover .img:after{animation-name: circle2;animation-iteration-count:infinite;animation-timing-function:linear;animation-duration: 10s;}
@keyframes circle2{0%{transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);-webkit-transform:rotate(0);}50%{transform: rotate(25deg);-moz-transform: rotate(25deg);-ms-transform: rotate(25deg);-o-transform: rotate(25deg);-webkit-transform: rotate(25deg);}100%{transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);-webkit-transform:rotate(0);}}
#coust_area .box .img img{width:75px;aspect-ratio: 1/1;object-fit: contain;}
#coust_area .box h3{margin-top: 40px;font-size: 20px;font-weight: 400;letter-spacing: 1px;}
#coust_area .box .info:hover h3{color:var(--primary)}
#coust_area .box .info:hover .img{background:var(--primary)}
#coust_area .box .info:hover .img img{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
#coust_area .box a{position:absolute;width: 100%;height: 100%;z-index: 2;top: 0;}

/* photo_area */
#photo_area .item_row { padding: 4% 6%; border: 2px var(--g_100) solid; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
#photo_area .item_row .img_box img { width: 100px; aspect-ratio: 1/1; }
#photo_area .item_row .info_box { margin-left: 6%; width: 1%; flex: 1 1 auto; }
#photo_area .item_row .info_box h3 { margin-bottom: .5em; max-height: 3.2em; height: auto; -webkit-line-clamp: 2; }
#photo_area .item_row .info_box font { padding: .5em 1em; background: var(--primary); border-radius: 2em; display: inline-block; line-height: 1; font-weight: 300; font-size: .9em; color: white; }

/* news_area */
#news_area{background:#f2f2f2;position: relative;}
#news_area:before{content:'';position: absolute;width: 37vw;height: 100%;background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;top: 0;left: 0;background-image: url(/images/01/abstract-background.jpg);}
#news_area .bg{position:absolute;right: 0;top: 0;height: 100%;width: 23vw;background-size: cover;background-position: 50% 50%;}
#news_area .workframe{width: min(90%, 1040px);margin-left: 18%;}
#news_area .tt_box h2{text-align:left;}
#news_area .sub_title{display:flex;flex-direction: row;align-items: center;}
#news_area .sub_title:before, #product_area .sub_title:before{box-shadow: 20px 0px var(--secondary);background: var(--primary);margin: 0 35px 0 0;}
#news_area .tt_box{position:relative;}
#news_area .tt_box a{position:absolute;right: 0;bottom: 0;}
#news_list li {background: #fff;margin: 5px 0;}
#news_list li .item_row{padding: 40px 30px;}
#news_list .info_box {display: grid;grid-template-columns: 120px 1fr 100px;align-items: center;justify-content: space-between;gap: 30px;}
#news_list .info_box a{background: var(--info);display: inline-block;padding: 9px 0;height: auto;font-weight: 300;}
#news_list li:hover .info_box a{background:#ececed;color: var(--info);}
#news_list .info_box .time {font-size: 14px;color: #a4a4a4;font-family: "Lato", serif;text-align: end;}
#news_list .info_box h3 {margin: .2em 0 .5em;font-weight: 500;font-size: 18px;}
#news_list li:hover .info_box h3{color:var(--primary)}
#news_list .info_box article { margin-bottom: .5em; height: 3.2em; font-size: .9em; color: var(--g_600); -webkit-line-clamp: 2; }

/* product_area */
#product_area .workframe{width: min(90%, 1540px);}
#product_area .sub_title{display:flex;flex-direction: row;align-items: center;justify-content: center;}
#product_area .boxx{display:grid;grid-template-columns: 65% 35%;justify-content: space-between;}
#product_list_box{position:relative;}
#product_list_box .btn{position:absolute;display: flex;align-items: center;justify-content: space-between;width: 105%;bottom: calc(50% - 28px);z-index: 2;padding: 0;left: -2.5%;}
#product_list_box .btn a{width: 55px;background: var(--primary);display: flex !important;!i;!;align-items: center;justify-content: center;aspect-ratio: 1/1;border-radius: 50%;}
#product_list_box .btn a svg{width:13px;height:13px;fill: #fff;}
#product_list_box .btn a#product_prev svg{transform:scaleX(-1);}
#product_area .list_box {margin:0}
#product_area .list_box li{margin: 20px;box-shadow: 0 0 15px rgb(0 0 0 / 10%);padding: 10px 0 30px;}
#product_area .list_box li img{aspect-ratio: 4/3;object-fit:contain}
#product_area .list_box li .info_box{padding:0 30px;}
#product_area .list_box li .info_box h3{-webkit-line-clamp:2;height: 60px;font-size: 18px;font-weight: 400;line-height: 1.6;}
#product_area .list_box li .info_box .price_box{display:flex;align-items: center;justify-content: space-between;flex-wrap: wrap;}
#product_area .list_box li .info_box .price_box p{color:#797979;font-family: "Lato", serif;font-size: 13px;}
#product_area .list_box li .info_box .price_box ins, #product_area .list_box li .info_box .price_box ins *{color:#921526;font-size: 20px;font-family: "Lato", serif;text-decoration: unset;}
#product_area .list_box li .info_box .price_box ins b{font-size:16px;margin-right: 3px;vertical-align: baseline;}
#product_area #product_list_box.list_box li{padding:0}
#product_area #product_list_box.list_box li img{aspect-ratio: 4.23/3;}

@media screen and (min-width: 1161px){
	#photo_area .item_row:hover { border-color: var(--primary); }
}
@media screen and (max-width: 1440px){
    #product_area #product_list_box.list_box li img{aspect-ratio: 3.83 / 3;}
    #news_area .workframe{margin-left: 8%;}
    #about_area .runnn ul{grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 1280px){
    #product_area #product_list_box.list_box li img{aspect-ratio: 2.8 / 3;}
    #about_area:before{zoom: 60%;}
    #about_area .img_box:after{zoom: 75%;}
    #about_area .img_box:before{zoom: 70%;}
}
@media screen and (max-width: 1024px){
    #product_area #product_list_box.list_box li img{aspect-ratio: 2.59 / 3;}
    #news_area .workframe{margin:0 auto;}
    #coust_area .box .img{width:100%}
    #about_area .workframe{gap: 30px;}
    #about_area .fixTxt2{bottom: -12%;}
    #coust_area .box .img:after{zoom: 84%;}
}
@media screen and (max-width: 768px){
    #product_area .boxx{display: block;}
    #product_list_box{display:none;}
    .section_area{padding:8vw 0}
    #news_area .bg{display:none;}
    #coust_area:before{height: 70vmax;background-size: 200%;}
    #coust_area .box .img:after{zoom: 101%;}
    #coust_area .box{grid-template-columns: repeat(3, 1fr);gap: 70px;}
    #about_area .fixTxt2{bottom: -2%;z-index: -1;}
    #about_area .runnn ul{grid-template-columns: repeat(3, 1fr);}
    #about_area .img_box:after{zoom: 105%;}
    #about_area .img_box:before{zoom: 100%;}
    #about_area:before{zoom:100%;bottom: 0;top: 50%;}
    #about_area .tt_box h2{writing-mode:unset;height: auto;}
    .section_area .sub_title:before{box-shadow: 20px 0px var(--secondary);background: var(--primary);margin: 0 35px 0 0;}
    #about_area .tt_box{margin-top:0;writing-mode: unset;}
    #about_area .workframe{grid-template-columns:1fr}
	#about_area .img_box {width: 80%;max-width: inherit;margin: 0 auto;}
	#about_area .info_box {margin: 50px 0 0;}
}
@media screen and (max-width: 640px) {
    #news_list .info_box{grid-template-columns: 90px 1fr;gap: 10px;}
    #news_list .info_box a{padding: 5px 0;font-size: 14px;}
    #news_list .info_box h3{order:2;grid-column: 1 / 3;margin: 0;}
    #news_list li .item_row{padding: 25px 20px;}
    #news_area:before{width: 20vw;}
    #news_area .tt_box a{display:none;}
    .section_area{padding: 13vw 0;}
    #coust_area:before{background-size: 490%;}
    #coust_area .box h3{margin-top:30px;}
    #coust_area .box .img:after{zoom: 74%;}
    #coust_area .box{display: flex;justify-content: center;flex-wrap: wrap;gap: 40px;}
    #coust_area .box .info{width: 35%;margin: 2%;}
    .section_area .cn_title{font-size:30px;margin-bottom: 9vw;}
    #about_area{padding-bottom: 25vw;}
    #about_area .fixTxt2{bottom: -2%;}
    #about_area .runnn p{font-size:16px}
    #about_area .runnn h2 b{font-size:30px;}
    #about_area:before{top: 40%;zoom: 70%;}
    #about_area .img_box .fixTxt{width: 50%;left: 5%;}
    #about_area .img_box:after{zoom: 60%;}
    #about_area .img_box:before{display: none;}
	#photo_area .item_row .img_box { width: 100%; }
	#photo_area .item_row .img_box img { width: 100%; aspect-ratio: 1/1; }
	#photo_area .item_row .info_box { margin: .5em 0 0; width: 100%; }
}