.wrap {position: relative;background-image: url(/images/46/img_bg.jpg);padding-top: 0;z-index: 998;}
.wrap #wrapBox>div { position: relative; }
.wrap #wrapBox .bg { position: relative; width: 100%; height: 100%; top: 0; left: 0; opacity: 1; }

/*vavatitle*/
.vavatitle{display:flex;flex-direction:column;}
.vavatitle h2{font-size: max(4.1 * (1vw + 1vh) / 2,36px);text-transform:uppercase;font-weight: 700;letter-spacing:0.05em;line-height:110%;margin-bottom:10px}
.vavatitle p{font-size: max(1.7 * (1vw + 1vh) / 2, 21px);font-weight: 200;color: #3f3f3f;margin-left: 10px;margin-top: 15px;}
.vavatitle h2.booldtext{font-weight: 600;text-align: center;font-size: max(3.6 * (1vw + 1vh) / 2,24px);}

p.nntopinfo{font-size: max(1.5 * (1vw + 1vh) / 2, 18px);margin-top: 80px;font-weight: 400;margin-left: 10px;}
/*paJmore*/
.paJmore a{display:flex;align-items:center;background:#040000;color:#ffffff;width: min(200px,95%);padding:18px 26px;border-radius:25px 0px 25px 0px;justify-content: space-between;}
.paJmore a img{margin-left:10px}
.vanJbox .paJmore{margin-top:90px}
.paJmore a:hover{background: #617b5a;}

/*vantagesbox*/
#vantagesbox{position:relative;background-image:url(/images/46/bbJJ_bg.jpg);padding:0px 0 150px;z-index: 2;}
#vantagesbox .workframe{margin-right:0;width: min(90%, 1600px);}
#vantagesbox .vavaimg{position:relative;display:flex;align-items:center}
#vantagesbox .vavaimgchage{position: relative;top: 0px;}
#vantagesbox .vavaimgchage img{position: absolute;top: 0;}
#vantagesbox .vanJbox02{position:relative}
#vantagesbox .round-text:before{content:"";width:206px;aspect-ratio:1/1;position:absolute;background:url(/images/46/roundtext.png);background-size:cover;background-position:50%;z-index:0;animation:spin 16s linear infinite}
#vantagesbox .vavaimg:before{content:"";position:absolute;width:110%;left:-5%;height:320px;background:linear-gradient(to right,#bbbbbb,#e9e9e9,#f1ea0c);z-index:-1}
#vantagesbox:before{content:"";position:absolute;width:100%;height:100%;top:0;background:linear-gradient(to bottom,rgb(231 231 231),rgb(255 255 255 / 0%),#e7e7e7);z-index:0}
#vantagesbox .vanJbox{display:grid;grid-template-columns: 1fr 75%;gap:20px;z-index: 5;position: relative;}
#vantagesbox .vanJbox .vanJbox01{position:relative;}
#vantagesbox .nainfo{display:none}
#vantagesbox .vanrunn{margin: 0;}
#vantagesbox .tantext:hover .natitle span:before,#vantagesbox .tantext .natitle.show span:before{opacity:1}
#vantagesbox .tantext .natitle{position:relative;display:flex;align-items:center;flex-direction: column;background: #fff;margin: 10px;padding-bottom: 20px;}
#vantagesbox .tantext .natitle img{aspect-ratio:3/4;object-fit: cover;}
#vantagesbox .tantext .natitle span{position:relative;display:flex;width:5px;aspect-ratio:1/1;flex-direction:column;align-items:center;justify-content:center;background:#222222;border-radius:50%;margin-right:40px}
#vantagesbox .tantext .natitle span:before{content:"";position:absolute;border:#494949 1px solid;width:18px;aspect-ratio:1/1;border-radius:50%;opacity:0}
#vantagesbox .tantext .natitle h3{font-size: max(1.5 * (1vw + 1vh) / 2,20px);font-weight:500;margin-top: 20px;}
#vantagesbox .tantext .natitle p{padding:0 30px;text-align: center;font-size: 15px;letter-spacing: 0;height: 50px;}
#vantagesbox .tantext .natitle:before{content:"";position:absolute;width:0;left:-120%;height:1px;background:#1e1e1e}
.round-text{position:absolute;left: 40px;bottom: 70px;padding:20px;border-radius:50%;background:#627c5b;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center}
.round-text p{color: #ffffff;font-size: max(1.3 * (1vw + 1vh) / 2, 17px);margin: 0;}
 @keyframes spin {
	from {transform: rotate(0deg); }
    to {transform: rotate(360deg); }
}
#vantagesbox .btn{padding:0;display: flex;flex-direction: column;position: absolute;left: 23%;bottom: 40%;gap: 15px;}
#vantagesbox .btn a{width: 65px;aspect-ratio: 1/1;background: #e9eb00;text-align: center;line-height: 61px;border-radius: 50px;}
#vantagesbox .btn img{width: 25px;aspect-ratio: 1/1;}
#vantagesbox .btn a#vantages_prev img{transform:scaleX(-1);}

/*sideflyJJ*/
.sideflyJJ{position: absolute;}
.sideflyJJ.sebox01{top: 0;left: -70px;width: 11vw;}
.sideflyJJ.sebox02{right: 40px;bottom: 0;width: 13vw;}

/*joinJbox*/
#joinJbox{position: relative;padding: 80px 0;}
#joinJbox,#joinJbox *{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
#joinJbox .joinrightbox{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	grid-template-areas:
	"joinbtitle joinbtmun"
	"joinfaning joinfaning";
	width: min(90%, 1200px);
	margin: 0 auto;
	}
#joinJbox  .joinbtitle{grid-area:joinbtitle}
#joinJbox  .joinbtmun{grid-area:joinbtmun;display:grid;grid-template-columns:repeat(2,222px);align-items:center;justify-items:end;justify-content:end}
#joinJbox  .joinfaning{grid-area:joinfaning;display:grid;grid-template-columns:repeat(2,1fr);gap: 21px;margin-top:60px}
#joinJbox .paJmore{width:100%;display:flex;justify-content:flex-end}
#joinJbox .paJmore a{width: min(183px,100%);}
#joinJbox .jofunitem{position:relative;}
#joinJbox .jofunitem .tapJ{animation: backgroundChange 2s ease-in-out infinite alternate;width: 95px;aspect-ratio:1/1;position:absolute;right:20px;top:-50px;background:#606060;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index: 2;}
#joinJbox .jofunitem .tapJ p{font-size:max(2.2 * (1vw + 1vh) / 2,16px);color:#ffffff;text-align:center;line-height:117%;font-weight:500;padding: 10px;}
#joinJbox .jofunitem:first-child .footext p:after{content:url(/images/46/crown.svg);position: absolute;width: 2vw;right: 29%;top: 12px;transform: rotate(20deg);}
#joinJbox .jofunitem .footext p{font-size: max(1.3 * (1vw + 1vh) / 2,16px);margin-bottom: 20px;display: flex;align-items: flex-start;font-weight: 500;flex-direction: column;background: #fff;box-shadow: 0 0 10px rgb(0 0 0 / 10%);padding: 15px 40px;position: relative;justify-content: center;}
#joinJbox .jofunitem .footext p b{font-weight: 700;font-size: 18px;}
#joinJbox .jofunitem:nth-child(2) .footext p{background: #f1f1f1;}

@-webkit-keyframes tada2 { from { -webkit-transform: scale3d(1, 1, 1); } 10% , 20% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -3deg); } 30% , 50% , 70% , 90% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 3deg); } 40% , 60% , 80% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); } }
@keyframes tada2 { from { transform: scale3d(1, 1, 1); } 10% , 20% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -3deg); } 30% , 50% , 70% , 90% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 3deg); } 40% , 60% , 80% { transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -3deg); } to { transform: scale3d(1, 1, 1); } }




@-webkit-keyframes ani-arrow-x { 0%, 100% { -webkit-transform: translateX(0); } 50% { -webkit-transform: translateX(5px); } }
@keyframes ani-arrow-x { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }


/*solgonbox*/
#solgonbox{background: url(/images/46/solgon_bg.jpg);padding: 249px 0;background-size: cover;background-position: 50% 50%;}

/*sharebox*/
#sharebox{position: relative;}
#sharebox .shareitem{display: grid;grid-template-columns: 50% 50%;align-items: center;background: rgb(255 255 255 / 61%);}
#sharebox .shareitem .shareinfo{padding: 0 16%;}
#sharebox .shareitem .sewtitle{margin-bottom: 20px;padding-bottom: 10px;border-bottom: #cccccc 1px solid;}
#sharebox .shareitem .sewtitle span{font-size: max(1.15 * (1vw + 1vh) / 2, 15px);}
#sharebox .shareitem .sewtitle h5{font-size: max(2.8 * (1vw + 1vh) / 2, 24px);font-weight: 700;}
#sharebox .shareitem .sewtitle p{font-size: 20px;font-weight: 700;color: #658165;margin-bottom: 20px;}
#sharebox .shareitem .sewtext{margin-bottom: 90px;}
#sharebox .shareitem .sewtmd{display: flex;justify-content: flex-end;}
#sharebox .slick-prev{transform: scaleX(-1);z-index: 2;background: #e9eb00;left: 40px;width: 50px;height: 50px;border-radius: 50px;}
#sharebox .slick-prev:before{content:url(/images/46/chevron.svg);zoom: 3%;}
#sharebox .slick-next{z-index: 2;background: #e9eb00;right: 40px;width: 50px;height: 50px;border-radius: 50px;top: 54%;}
#sharebox .slick-next:before{content:url(/images/46/chevron.svg);zoom: 3%;}

.mbshowJ{
    margin: 50px auto 0;
}

@keyframes backgroundChange {
    0% {background-color: #abb4bc;}
    100% {background-color: #627c5b;}
}
@media (max-width: 1580px) {
}
@media (max-width: 1470px) {
	.serviceList { width: 100%; left: 0; margin: 25px auto 0; }
	.serviceList .item { padding: 0 20px; }
	.serviceList .title { font-size: 30px; }
	#sharebox .shareitem .shareinfo{padding: 0 17%;}
	#solgonbox{padding: 181px 0;}
	#joinJbox .joinrightbox{width: 93%;}
	
	.sideflyJJ.sebox01{width: 5vw;left: -16px;}
	.sideflyJJ.sebox02{width: 9vw;right: 5px;}
	#vantagesbox .vanJbox{width: min(1180px , 100%);margin: 0 auto;}
	#vantagesbox{padding: 0px 0 75px;}
	
}
@media (max-width: 1360px) {#joinJbox{gap: 3%;}}
@media screen and (max-width: 1280px) {
	.about-block .editor .part-01, .about-block .editor .part-02 { width: 390px; }
	.about-block .editor { gap: 3rem; }
	.flyitem img { top: -75px; }
	#joinJbox{display:flex;flex-direction:column}
	#joinJbox .joinleftbox{display:none}
	#joinJbox .joinrightbox{width:90%;padding:40px 0}
	#sharebox .shareitem{display: flex;flex-direction: column;}
	#sharebox .shareitem .shareinfo{padding: 45px 0;width: 90%;order: 2;}
	#sharebox .shareitem .shareimg{width: 100%;display: flex;flex-direction: column;align-items: center;}
}
@media (min-width: 1181px) {
	.serviceList .serviceItem:nth-child(4n+1):before { opacity: 0; }
}
@media (min-width: 769px)
{
	.mbshowJ{display: none;}
}
@media screen and (max-width: 1180px) {
    #vantagesbox .btn{bottom:auto;top: 10%;left: unset;right: 5%;display: flex;flex-direction: row;}
    .round-text{left: unset;right: 0;bottom: 0;display: none;}
	.serviceArea .titleBox .exp { padding-top: 12px; }
	.serviceList .serviceItem { width: 50%; margin: 20px 0; }
	.serviceList .title { font-size: 26px; font-weight: 500; letter-spacing: 2px; }
	
	.serviceArea .titleBox { display: flex; flex-direction: column; align-items: center; }
	.serviceArea .titleBox .titleTw { margin-top: 0px; font-size: 27px; letter-spacing: 5.5px; }
}
@media (max-width: 1180px) and (min-width:769px) {
	.serviceList .serviceItem:nth-child(odd):before { opacity: 0; }
}
@media screen and (max-width: 1024px){
    #joinJbox .jofunitem:first-child .footext p:after{right: 5%;}
    #joinJbox .jofunitem .tapJ{position:relative;top: 0;left: 0;width: 100%;aspect-ratio: unset;margin-bottom: 20px;padding: 10px 0;}
    #vantagesbox .workframe{margin:0 auto;}
	#vantagesbox .vanJbox{display: block;}
	#vantagesbox .vanJbox .vanJbox01{width: 100%;margin-bottom: 53px;}
	#vantagesbox .vanJbox03{width: 100%;}
	#vantagesbox .tantext{display: flex;align-items: flex-start;}
	#vantagesbox .vanJbox02{width: min(500px , 90%);margin: 25px auto;}
	
}
@media screen and (max-width: 980px) {
    
	#aboutBox .info .title { margin-bottom: 32px; }
	.about-block .editor { gap: 1rem; display: flex; flex-direction: column; align-items: flex-start; padding: 3rem 0; width: 90%; }
	.about-block .slogan-01 { padding: 0 0 8px; }
	.about-block .slogan-01, .about-block .description span { font-size: 24px; }
	.about-block .slogan-02 { font-size: 18px; }
	.about-block .description span { letter-spacing: 8px; }
	.about-block .description p { font-size: 14px; }
	.about-block .description { font-size: 16px; }
	.about-block .vertical-line { height: 40px; }
	.about-block .editor .part-01, .about-block .editor .part-02 { width: auto; }
	#aboutBox .abtop_title { display: flex; flex-direction: column; gap: 1rem; padding: 2rem 1rem 4rem; order: 2; }
	#aboutBox .flex_box { display: flex; flex-direction: column; justify-content: unset; order: 1; }
	#aboutBox .rightbox { width: 500px; max-width: 100%; }
	#aboutBox .leftbox { width: 100%; }
	#vantagesbox .round-text{display:none;}
	#joinJbox .joinbtmun{order: -1;margin-top: 0;display:flex;margin-bottom: 40px;}
	#joinJbox .paJmore{display:flex;justify-content:center}
	#sharebox .shareitem .sewtitle{margin-bottom: 30px;}
	p.nntopinfo{margin-top: 5px;}
}
@media (max-width: 768px) {
   
	.serviceArea .titleBox { padding-bottom: 0; }
	.serviceList .serviceItem { width: 100%; margin: 0; padding: 0 0; }
	.serviceList .serviceItem:before { width: 100%; height: 1px; }
	.serviceList .serviceItem:first-child:before { opacity: 0; }
	.serviceList .item { padding: 13px 0; }
	.paJmore a{width: min(180px,95%);}
}
@media screen and (max-width: 680px) {
    #sharebox .slick-next{top:20%;right: 10px;}
    #sharebox .slick-prev{top: 17%;left: 10px;}
    #vantagesbox .btn{top: 20.5%;gap: 5px;}
    #vantagesbox .btn a{width: 45px;line-height: 41px;}
    #vantagesbox .btn img{width:15px;}
   
    #joinJbox .jofunitem.gray .footext p b, #joinJbox .jofunitem .footext p b{font-size: 14px;}
    #joinJbox .jofunitem .footext p sapn, #joinJbox .jofunitem.gray .footext p sapn{font-size:12px;}
    #joinJbox .joinfaning{grid-template-columns: 48% 48%;gap: 0;display: grid;justify-content: space-between;}
    #joinJbox .jofunitem:first-child .footext p:after{right: -5%;width: 10vw;top: -5%;}
    #joinJbox .jofunitem .footext p{padding: 15px 10px;min-height: 111px;}
    #joinJbox .joinrightbox{display: flex;flex-direction: column;}
	#aboutBox { padding-top: 0vh; }
	.wrap {padding-top: 0;}
	.serviceArea { padding: 40px 0 60px; }
	.serviceList .title { font-size: 20px; font-weight: 400; letter-spacing: 1px; }
	#aboutBox .leftbox article { padding: 18px 20px; }
	#vantagesbox{padding:40px 0;background:url(/images/46/turnJbox_bg.jpg);background-size: 207%;background-position: 52% 73%;}
	#vantagesbox:before{background: linear-gradient(to bottom, rgb(231 231 231 / 60%), rgb(255 255 255 / 0%), #ececec);}
	
	.sideflyJJ.sebox02{bottom: 114px;width: 19vw;right: 27px;}
	#vantagesbox .vavaimg:before{height: 140px;}
	#joinJbox{background: #ffffff;padding: 20px 0;}
	#joinJbox .jofunitem .tapJ p{font-size: 17px;}
	#solgonbox{padding: 100px 0 0;background: #e9e9e9;}
}
@media screen and (max-width: 480px) {
	.serviceList .title { padding-left: 10px; }
	#joinJbox .paJmore a{width: min(160px,100%);padding: 12px 18px;}
}