#wrap{z-index:2}
.bgTxt{position:absolute;right:-2vw;top:500px;width:23vw}
.bgTxt2{position:absolute;left:-5vw;top:70px;width:23vw}
.bgTxt3{position:absolute;right:39px;bottom:93%;width:212px}
.bgTxt3 img{-moz-transform:rotate(14deg);-webkit-transform:rotate(14deg);-o-transform:rotate(14deg);-ms-transform:rotate(14deg);transform:rotate(14deg)}
.bgTxt4{position:absolute;left:10%;width:220px;bottom:32%}
.bgTxt4 img{-moz-transform:rotate(11deg);-webkit-transform:rotate(11deg);-o-transform:rotate(11deg);-ms-transform:rotate(11deg);transform:rotate(11deg)}
/* section */

section{padding:4vw 0 2vw}
section>*{z-index:3}
section .title_box{padding-bottom:3vw;font-style:italic;font-size:38px}
section .clip{margin:auto;width:100%}
section .clip img{height:100%}
section .clip iframe{width:100%;height:100%;top:0;left:0}
section .clip video{width:auto;height:100%;top:50%;left:50%}
h1.ml8{font-weight:900;font-size:4.5em;color:#fff;width:3em;height:3em;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ml8 .letters-container{position:relative;top:4px;bottom:0;height:1em;display:flex;align-items:center;justify-content:center}
.ml8 .letters{position:relative;z-index:2;display:inline-block;line-height:0.7em;right:-0.12em;top:-0.2em;font-size:2.2em}
.ml8 *{color:white}
.ml8 .bang{font-size:2.2em;top:-5px;margin-left:4px}
.ml8 .circle{position:absolute;left:0;right:0;margin:auto;top:0;bottom:0}
.ml8 .circle-white{width:3em;height:3em;border:2px dashed #617685;border-radius:2em}
.ml8 .circle-dark{width:8.2em;height:8.2em;background-color:#617685;border-radius:14em;z-index:1}
.ml8 .circle-dark-dashed{border-radius:9.4em;background-color:transparent;border:2px dashed #7c8992;width:9.3em;height:9.3em}
.maJJtitle_box{position:relative;display:flex;flex-direction:column;align-items:center}
.maJJtitle_box:before{content:"";position:absolute;width:70px;height:1px;background:#585858;bottom:0}
.maJJtitle_box h2{font-size:max(4*(1vw + 1vh) / 2,40px);text-transform:lowercase;font-family:"Berkshire Swash",serif;letter-spacing:0.02em;line-height:120%;text-transform:capitalize}
.maJJtitle_box p{font-size:max(1*(1vw + 1vh) / 2,18px);padding:7px 0}
.maJJtitle_box:after{content:"";position:absolute;display:flex;width:31px;height:4px;background:#6f8493;align-items:center;bottom:-1px}
#gaJmap{position:relative;margin-top:50px;z-index:5}
#midmapbox .veeJdobox{position:absolute;height:890px;width:100%}
#midmapbox .veeJdobox video{height:100%;object-fit:cover;width:100%;opacity:0.9}
#midmapbox .veeJdobox .veseamask{position:absolute;top:0;z-index:1;height: 101%;}
#midmapbox .veeJdobox .veseamask img{height: 100%;}
#gaJmap section:before{content:"";position:absolute;width:100%;aspect-ratio:1/1;border:#e3e3e3 1px solid;border-radius:50%;top:0;z-index:0}
#gaJmap .gaimgbox{display:flex;flex-direction:column;align-items:center}
#gaJmap .leftteebox{position:absolute;display:flex;flex-direction:column;width:min(100%,337px);bottom:12%;left:9%;background:#f7f7f7;padding:35px 20px;border-radius:10px}
#gaJmap .righteebox{position:absolute;right:6%;top:25%;display:none}
#gaJmap .leftteebox h3{font-size:max(1.4*(1vw + 1vh) / 2,17px);margin-bottom:10px}
#gaJmap .leftteebox p{font-size:max(0.8*(1vw + 1vh) / 2,13px)}
#gaJmap .leftteebox:before{content:'';width:0;height:0;border-style:solid;border-width:0 0 16px 29px;border-color:transparent #f7f7f7 transparent;position:absolute;bottom:-16px;right:27%;-moz-transform:scalex(-1);-webkit-transform:scalex(-1);-o-transform:scalex(-1);-ms-transform:scalex(-1);transform:scalex(-1)}
#gaJmap .gaimgbox img{width:min(100%,1100px)}
.magJlink{display:flex;flex-direction:column;align-items:center;margin:40px 0 0px}
.magJlink *{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
a.boomlink{display:flex;align-items:center;padding:8px 9px;width:180px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;background:rgb(255 255 255 / 20%);justify-content:space-around;border-radius:50px;color:#4a4a4a;letter-spacing:0.15em;font-size:max(1.1 * (1vw + 1vh) / 2,14px);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;border:#acacac 1px solid}
a.boomlink:hover{background:#787878;border:#787878 1px solid}
a.boomlink:hover span{color:white}
a.boomlink:hover svg{}
a.boomlink span{color:#3d3d3d;font-size:max(1.1*(1vw + 1vh) / 2,14px)}
a.boomlink:hover svg{-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-o-transform:rotate(3deg);-ms-transform:rotate(3deg);transform:rotate(90deg);border-radius:50%;fill:#787878;background:white}
a.boomlink svg{width:16px;aspect-ratio:1/1;margin-left:10px;fill:#ffffff;-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-o-transform:rotate(3deg);-ms-transform:rotate(3deg);transform:rotate(90deg);transition:all 0s ease-in-out;-webkit-transition:all 0s ease-in-out;background:#787878;border-radius:50%;padding:8px}

/*matitleJtem*/

.matitleJtem{display:flex;flex-direction:column;align-items:center}
.matitleJtem h2{font-size:max(2.2 * (1vw + 1vh) / 2,24px);text-align:center;color:#5e676d}
.matitleJtem p{font-size:max(1.2 * (1vw + 1vh) / 2,18px);color:#6b747b;margin-bottom:20px}
.coootop{margin-top:50px}

/* about_area */

#about_area{padding-bottom:1vw;z-index:5}
#about_area .tit_box{display:flex;justify-content:space-between;padding:40px 35px;border:#e3e3e3 1px solid;border-radius:16px;margin:30px auto}
#about_area .tit_box .top_title{margin-bottom:0;font-size:max(2.2 * (1vw + 1vh) / 2,20px);color:#6b767e;display:flex;width:auto;font-weight:600}
#about_area .tit_box .top_info{width:100%;font-weight:300;color:#404040;display:flex;text-align:justify;padding-left:30px}
#about_area ul{margin:50px 30px 90px;grid-template-columns:repeat(3,1fr);grid-gap:3.5rem 2rem}
#about_area ul li img{width:110px}
#about_area ul li svg{margin-bottom:.8rem;width:115px;height:115px;fill:#29a6dd}
#about_area ul li *{font-size:max(1 * (1vw + 1vh) / 2,14px);color:#6b767e}
#about_area ul li p{margin-top:.5rem}
#about_area ul li p b{line-height:1;font-weight:900;font-size:36px;letter-spacing:2px}

@media screen and (max-width:786px) {
	#about_area ul li p b {font-size: max(1 * (1vw + 1vh) / 2, 18px);}
}

#about_area ul li.op_2 {opacity: .2;}



/* expertise_area */

#expertise_area{position: relative;padding:5vw 0 3vw;background-size:cover;background-repeat:no-repeat}
#expertise_area:before{content:"";position:absolute;width:200%;height:100%;left:-50%;background:#f2f2f2;border-radius:50%;z-index:-1}
#expertise_area .workframe{display:flex;flex-direction:column}
#expertise_area .txt_box{padding:0 2% 0 10%;width:100%;flex:1 auto;order:1}
#expertise_area .fmbox{width:100%;display:flex;justify-content:center}
#expertise_area .slick-prev:before,#expertise_area .slick-next:before{color:#171819}
#expertise_area .fmbox *{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
#expertise_area .fivelist{display:flex;width:100%;padding:20px;flex-wrap:wrap}
#expertise_area .fivelist .fiveitem{display:flex;justify-content:center;padding:20px 0;position:relative;width:20%}
#expertise_area .fivelist .fiveitem:hover .fiveJimg{background:#ffffff26}
#expertise_area .fivelist .fiveitem .fiveJimg{display:flex;flex-direction:column;align-items:center;background:#f0f0f0;margin:0 5px;padding:10px;padding:50px 20px 25px;box-shadow:0 0 0.35rem rgb(0 0 0 / 15%);border-radius:10px;border:#ffffff 1px solid}
#expertise_area .fivelist .fiveitem .fiveJimg p{margin-top:10px}
#expertise_area .fivelist .fiveitem .fiveJimg img{width:min(95%,180px);border-radius:20px}
#expertise_area .txt_box h3{font-weight:300;font-size:30px;color:#5F7584}
#expertise_area .txt_box p{margin:15px 0;font-size:18px;color:#404040}
#expertise_area .txt_box article{font-weight:300;color:#404040}
#expertise_area ul{width:100%;grid-template-columns:repeat(3,1fr);grid-gap:20px}
#expertise_area ul li{padding:1rem .5rem;background:#fff;box-shadow:0 0 0.35rem rgb(0 0 0 / 15%);border-radius:.3rem}
#expertise_area ul li svg{width:50px;height:50px;fill:#29a6dd}
#expertise_area ul li p{margin-top:15px;font-weight:300;font-size:14px;color:#333}
#servembox section{padding:30px 0 2vw}



/* service_area */

#service_area{position:relative;padding:0vw 0 2vw;background:url(/images/44/img_service_bg.png) no-repeat 50%;z-index:5}
#service_area .top_title{text-align:center;font-weight:300;font-size:30px}
#service_list{position:relative;margin:0px auto 0;width:100%}
#service_area .malistJbox{display:flex;flex-direction:column;align-items:center;margin-top:95px;position:relative}
#service_area .twmap{position:relative;display:flex;margin-top:45px;justify-content: center;gap: 20px;}
#service_area .twmap img{height: 600px;object-fit: contain;}
#service_area .malistJbox h3{font-size:max(1.8*(1vw + 1vh) / 2,18px);color:#6b767e}
#service_area .malistJbox p{font-size:max(1*(1vw + 1vh) / 2,13px)}
#service_list .top_title,#effort_area .top_title,#brand_area .top_title{text-align:center;font-weight:300;font-size:30px;color:#5F7584}
#service_list ul{position:relative;width:100%;top:0;bottom:0;left:0;right:0;box-sizing:border-box;display:flex;justify-content:center}
#service_list ul li{position:relative;border-radius:50%;display:flex;text-align:center;font-size:0;left:0;box-sizing:border-box;aspect-ratio:1/1;margin:0 20px;flex-direction:column;align-items:center}
#service_list ul li>div{text-decoration:none;font-size:18px;text-align:center;padding:10px}
#service_list ul li>div img{width:250px;aspect-ratio:22/27;object-fit:cover;border-radius:20px}
#service_list ul li img{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
#service_list ul li>div:hover img{transform:scale(0.95)}

#service_list ul li:nth-child(4){width:285px;transform:translate(-160%,50%) rotateZ(135deg)}
#service_list ul li:nth-child(5){width:197px;transform:translate(-80%,-50%) rotateZ(180deg);left:30px}
#service_list ul li:nth-child(6){width:255px;transform:translate(-130%,-110%) rotateZ(225deg)}
#service_list ul li:nth-child(7){width:184px;transform:translate(-50%,-50%) rotateZ(270deg)}
#service_list ul li:nth-child(8){width:253px;transform:translate(-70%,-100%) rotateZ(315deg)}

#service_list ul li:nth-child(4)>div{transform:translate(0%,-10%) rotateZ(-135deg)}
#service_list ul li:nth-child(5)>div{transform:translate(0%,-10%) rotateZ(-180deg)}
#service_list ul li:nth-child(6)>div{transform:translate(0%,-10%) rotateZ(-225deg)}
#service_list ul li:nth-child(7)>div{transform:translate(-10%,0%) rotateZ(-270deg)}
#service_list ul li:nth-child(8)>div{transform:translate(0%,-10%) rotateZ(-315deg)}



/* slogin_area */

#slogin_area{padding:5vw 0 0}
#slogin_area .title{font-size:36px;color:#006AA1}
#slogin_area .info{margin-left:10%;width:1%;flex:1 auto}
#slogin_area .info p{margin-bottom:20px;font-weight:300;font-size:18px;color:#5F7584}



/* effort_area */

#effort_area{padding:12vw 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1928.339 891.427'%3E%3Cpath d='M0 59.423s350.9-98.742 946.175-41.657 918.35 84.856 977.522 0c13.018 212.911-5.473 802.033-5.473 802.033s-212.917 124.621-808.279 45.105S0 886.267 0 886.267z' fill='%23f3f3f3' opacity='.5'/%3E%3C/svg%3E") no-repeat 50% / cover;display:none}
#effort_area ul{margin-top:60px}
#effort_area ul li{width:360px;height:360px;background:#0094A6;border-radius:50%}
#effort_area ul li:nth-child(2){background:#8FC31F;top:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
#effort_area ul li:nth-child(3){background:#3EBFF0}
#effort_area ul li svg{fill:#fff}
#effort_area ul li p{margin-top:30px;font-size:18px;color:#fff}



.arrow_btns_box{display:flex;justify-content:center;position:relative;bottom:0;flex-direction:column;align-items:center;cursor:pointer}
.arrow_btns_box .slick-arrow svg{width:30px;fill:#b7b7b7}
.arrow_btns_box .slick-arrow.prev{transform:scalex(-1);padding:0 0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.arrow_btns_box .slick-arrow.next{padding:0;height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}

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

	#about_area .about_sub_1,#about_area .about_sub_2,#about_area .about_sub_3{width:20vw}
	#about_area ul li img{width:90px}
	.bgTxt{width:220px;right:-66px}
	.bgTxt2{width:250px;left:-80px}
	#gaJmap .gaimgbox img{width:min(100%,700px)}
	#service_area .twmap img{}
	.ml8 .circle-dark{width:6.2em;height:6.2em}
	.ml8 .letters{font-size:2em}
	.ml8 .circle-dark-dashed{width:8.3em;height:8.3em}
	#gaJmap .righteebox{right:5%;top:19%}
	#gaJmap .leftteebox{width:min(80%,291px)}
	#service_list ul li>div img{width:140px}
	#service_list ul li>div{padding:17px 31px}
}

@media screen and (min-width: 1025px) {

	#wrap .workframe{width:980px}
	#expertise_area .workframe{width:min(95%,1280px)}

}

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

	.bgTxt,.bgTxt2{display:none;}
	#expertise_area .fmbox{width:90%;margin:0 auto}
	#expertise_area .fivelist .fiveitem{width:25%}
}

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

	#product_list{margin:auto}
	#news_area li h3{height:30px;-webkit-line-clamp:1}
	#about_area ul{margin:50px 0 30px}

}

@media screen and (max-width: 980px) {
	h1.ml8{width:2em;height:2em}
	#gaJmap .righteebox{top:0%;right:-1%}
	.ml8 .circle-white{width:2em;height:2em}
	.ml8 .letters{font-size:1em}
	.ml8 .circle-dark-dashed{width:4.3em;height:4.3em}
	.ml8 .circle-dark{width:3.2em;height:3.2em}
	#gaJmap .leftteebox{position:relative;margin:29px auto;left:0}
	#service_area .malistJbox{margin-top:30px}
	section{padding-top:10vw}
	#product_list{width:500px}
	#product_list li .clip{height:590px}
	#about_area #about_info{margin-bottom:8vw}
	#about_area .about_sub_2{top:auto;bottom:35vw;width:35vw}
	#about_area .about_sub_3{width:29vw;left:10vw}
	#expertise_area .workframe{display:block}
	#expertise_area .txt_box{padding:0;width:100%;margin:0 0 40px}
	#expertise_area ul{width:100%}
	#slogin_area .tit_box{display:block}
	#slogin_area .info{width:100%;margin:30px 0 0}
	#effort_area ul{display:flex;flex-direction:column;align-items:center}
	#effort_area ul li,#effort_area ul li:nth-child(2){margin-top:-30px;position:relative;left:0;transform:translateX(0%)}
	#service_area{padding:8vw 0}
	#service_list{width:100%;height:100%;margin:50px auto 0}
	#service_list ul{position:relative;display:flex;align-items:center;flex-wrap: wrap;}
	#service_list ul li,#service_list ul li:nth-child(1),#service_list ul li:nth-child(2),#service_list ul li:nth-child(3),#service_list ul li:nth-child(4),#service_list ul li:nth-child(5),#service_list ul li:nth-child(6),#service_list ul li:nth-child(7),#service_list ul li:nth-child(8){position:relative;width: 50%;margin:0;border-radius:0;padding:0;transform:unset;top:0;transform-origin:unset;margin-bottom:11px;aspect-ratio:unset}
	#service_list ul li>div{position:relative;padding:12px 24px;width:90%;border-radius:20px}
	#service_list ul li>div img{width: 100%;height: auto;aspect-ratio: 1/1;object-fit:contain;margin-bottom:20px}
	#expertise_area:before{border-radius:0;}

}

@media screen and (max-width: 760px) {
	.bgTxt3{width:100px}
	.bgTxt4{width:100px;display:none}
	#about_area ul{grid-template-columns:repeat(3,1fr)}
	#expertise_area .fivelist .fiveitem{display:flex;flex-wrap:wrap;justify-content:center;width:33.3%}
	#expertise_area .fivelist .fiveitem .fiveJimg{padding:10px 2px 20px}
	#expertise_area .fivelist .fiveitem .fiveJimg:last-child{}
	section,#expertise_area,#service_area,#slogin_area{padding: 15px 0 30px;}
	#midmapbox .veeJdobox .veseamask img{background-color: rgb(238 247 255 / 56%);}
	#service_area,#slogin_area{margin-top:38px}
	#product_sub_list>div{margin:10px auto 50px}
	#product_sub_list li{width:150px}
	#product_sub_list li .clip{height:150px}
	#product_list{width:70vw}
	#product_list li .clip{height:80vw}
	#product_list li .info_box{width:45vw;height:30vw}
	#about_area .tit_box{display:flex;flex-direction:column;padding:27px 8px}
	#about_area .tit_box .top_info{width:100%;line-height:200%;padding-left:0;border-left:none;font-size:max(0.8*(1vw + 1vh) / 2,13px);margin-top:10px}
	#service_list ul li>div p{font-size:14px}
	#service_list ul li>div img{margin-bottom:0}
	#effort_area ul li{width:300px;height:300px}
	#effort_area ul li svg{width:120px;height:120px}
	#effort_area ul li p{margin-top:15px}
	#about_area ul li img{width:84px}
	#about_area ul li p{margin-top:.2rem}
	#expertise_area .fivelist{padding:10px}
	#service_area .twmap{
    display: flex;
    flex-direction: column;
    align-items: center;
}
}

@media screen and (max-width: 550px) {
	.magJlink{margin:20px 0 0px}
	#product_sub_list li{margin:10px;width:35vw}
	#product_sub_list li .clip{height:35vw}
	#product_list{width:90vw}
	#product_list li .clip{height:100vw}
	#product_list li .info_box{width:55vw;height:40vw}
	#about_area #about_img{width:80vw}
	#about_area .about_sub_2{bottom:60vw}
	#news_area li .row{margin:auto;width:280px}
	#about_area ul{grid-template-columns:repeat(1,1fr)}
	.maJJtitle_box h2{line-height:100%}
	.maJJtitle_box p{margin:0;padding:0}
	.maJJtitle_box{margin-bottom:27px;margin-top:22px}
	#expertise_area .fivelist .fiveitem{width:50%}

}



@media screen and (max-width: 480px) {
	#gaJmap .righteebox{top:-24%;right:26%}
	#book_area li .row{margin:auto;width:250px}

}