/* Setting */
section{padding:200px 0;overflow:hidden;position:relative;line-height:1.4;word-break:keep-all}
section .section_title{margin:0 auto 30px;text-align:center;}
section .section_title h3{font-size:50px;display:block;line-height:1}
section .section_title p{font-size:20px;font-weight:bold;color:#53B689;}
section .section_title b{font-size:35px;display:block;margin-bottom:20px;}
section .section_title span{font-size:18px;display:block;}
section .section_fix{width:calc(100% - 40px);margin:0 auto;overflow:hidden;max-width:1720px;}
section .section_body{position:relative;width:100%;margin:0 auto}


.ani-GradientText{
	background:linear-gradient(to right, rgb(0,0,0) 50%, rgba(217,217,217) 50%);
	background-size:200% 100%;
	background-position-x:100%;
	color:transparent;
	background-clip:text;
	-webkit-background-clip:text;
	display:inline;
}


/* Section01 */
#section01{overflow:visible}
#section01:before{content:'';position:absolute;bottom:30px;right:calc(50% - 800px);width:100px;height:100px;background:url('../img/03_service/03/section01_back02.png') no-repeat center;background-size:contain;z-index:-2;animation: float 4s ease-in-out infinite;}
#section01:after{content:'';position:absolute;top:0;left:50%;width:100%;height:0px;background:url('../img/03_service/03/section01_back.png') no-repeat center top;background-size:contain;transform:translateX(-50%);z-index:-2;animation: expandHeight 1s ease forwards;}
#section01 .section_title{text-align:right;margin:0 auto 100px;}

#section01 .section_body{overflow:visible}
#section01 .section_body:after{content:'';position:absolute;width:100px;height:100px;background:url('../img/03_service/03/section01_back01.png') no-repeat center;background-size:contain;top:50%;left:0;z-index:-2;animation: float3 4s ease-in-out infinite;}
#section01 .section_body .textbox{position:relative;text-align:center;}
#section01 .section_body .textbox b{font-size:45px;margin:0 auto 30px;}
#section01 .section_body .textbox p{font-weight:bold;font-size:35px;}
#section01 .section_body .textbox .br01{display:block}
#section01 .section_body .textbox .br02{display:none}

#section01 .img01{position:absolute;top:140px;left:calc(50% - 640px);z-index:-1;animation: float 4s ease-in-out infinite;width:100%;max-width:280px;}
#section01 .img02{position:absolute;top:400px;right:calc(50% - 640px);z-index:-1;animation: float2 4s ease-in-out infinite;width:100%;max-width:230px;}


@keyframes expandHeight {
  from {
    height: 0;
  }
  to {
    height: 600px;
  }
}

@keyframes float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-20px); }
  100% { transform: translateY(0); }
}

@keyframes float2 {
  0%   { transform: translateX(0); }
  50%  { transform: translateX(-20px); }
  100% { transform: translateX(0); }
}

@keyframes float3 {
  0%   { transform: translateX(0); }
  50%  { transform: translateX(20px); }
  100% { transform: translateX(0); }
}



/* Section02 */
#section02:before{content:'';position:absolute;width:180px;height:180px;background:url('../img/03_service/03/section02_back01.png') no-repeat center;background-size:cover;top:120px;left:calc(50% - 840px);z-index:2;animation: float 4s ease-in-out infinite;}
#section02:after{content:'';position:absolute;width:120px;height:120px;background:url('../img/03_service/03/section02_back02.png') no-repeat center;background-size:cover;bottom:150px;right:50%;z-index:2;animation: float3 4s ease-in-out infinite;}
#section02 .section_body table{width:100%;table-layout:fixed;}
#section02 .section_body table th{}
#section02 .section_body table th img{width:100%}
#section02 .section_body table td{padding-left:90px}
#section02 .section_body table td b{font-size:45px;line-height:1.2}
#section02 .section_body table td p{font-size:18px;}
#section02 .section_body table.mobile{display:none}

/* Section03 */
#section03 .section_body .textbox{width:calc(100% + 20px);margin:0 -10px 10px;overflow:hidden;}
#section03 .section_body .textbox ul{float:left;width:calc(25% - 20px);margin:10px;position:relative;}
#section03 .section_body .textbox ul li{position:relative;}
#section03 .section_body .textbox ul li .text{position:absolute;left:40px;bottom:40px;width:calc(100% - 80px);}
#section03 .section_body .textbox ul li .text b{font-size:28px;}
#section03 .section_body .textbox ul li .text p{font-size:16px;border-top:1px solid #000;margin-top:10px;padding-top:10px;display:none}
#section03 .section_body .textbox ul li img{width:100%}
#section03 .section_body .textbox ul li a{display:block;position:absolute;width:100px;text-align:center;color:#fff;font-size:12px;font-weight:bold;right:40px;top:40px;background:#53B689;line-height:28px;border-radius:16px;}
#section03 .section_body .hidden_box img{width:100%}

#section03 .section_body .m_hidden_box{display:none}
#section03 .section_body .m_hidden_box img{width:100%}





/* Section04 */
#section04 .section_title{}
#section04 .section_body ul{width:100%;overflow:hidden;margin:100px auto 0px;}
#section04 .section_body ul .box_fix{width:100%;max-width:1720px;margin:0 auto;position:relative;}
#section04 .section_body ul .box_fix:before{content:'';width:calc(100% + 120px);height:1px;position:absolute;background:#000;}
#section04 .section_body ul.top .box_fix:before{transform:translateX(calc(25% - 45px));right:50%;top:14px;}
#section04 .section_body ul.bottom .box_fix:before{transform:translateX(calc(0% + 30px));left:50%;top:15px;}

#section04 .section_body ul li{width:calc((100% / 4) - 20px);padding:0 10px;position:relative;padding-top:60px;}
#section04 .section_body ul.top li{float:left;}
#section04 .section_body ul.bottom li{float:right;}
#section04 .section_body ul li:after{content:'';width:0px;height:30px;position:absolute;background:url('../img/03_service/01/section04_arrow.png') no-repeat;top:0px;right:40px;transition:0.5s;}
#section04 .section_body ul li.active:after{width:30px;right:10px;}

#section04 .section_body ul.top li:nth-of-type(1):after{transition-delay: 0.3s;}
#section04 .section_body ul.top li:nth-of-type(2):after{transition-delay: 0.6s;}
#section04 .section_body ul.top li:nth-of-type(3):after{transition-delay: 0.9s;}

#section04 .section_body ul.bottom li:nth-of-type(3):after{transition-delay: 1.2s;}
#section04 .section_body ul.bottom li:nth-of-type(2):after{transition-delay: 1.5s;}
#section04 .section_body ul.bottom li:nth-of-type(1):after{transition-delay: 1.8s;}


#section04 .section_body ul li span{display:block;position:absolute;top:0px;left:10px;font-size:12px;color:#fff;width:25px;height:25px;text-align:center;line-height:28px;background:#53B689;border-radius:25px;font-weight:700}
#section04 .section_body ul li b{font-size:18px;display:block;margin-bottom:10px;}
#section04 .section_body ul li p{font-size:14px;width:100%;max-width:400px;}


#section04 .section_body.mobile{display:none}
#section04 .section_body.mobile ul{text-align:center;}
#section04 .section_body.mobile ul li{width:calc(50% - 20px);float:left;display:inline-block;vertical-align:top;text-align:left;margin:0 auto 40px}
#section04 .section_body.mobile ul li:before{content:'';width:100%;height:1px;position:absolute;background:#000;top:15px;left:0;}


/* Section05 */
#section05 .section_title b{text-align:left;width:100%;max-width:1720px;margin:0 auto}
#section05 .section_body .link_box{text-align:center;display:block;margin:40px auto 0;}
#section05 .section_body .link_box a{display:inline-block;font-size:14px;line-height:48px;text-align:center;border-radius:4px;transition:0.5s;border:1px solid #53B689;color:#53B689;position:relative;padding:0 20px;margin:0 2px;}
#section05 .section_body .link_box a:after{content:'';width:0;height:100%;top:0;left:0;position:absolute;background:#53B689;transition:0.5s;z-index:-1}
#section05 .section_body .link_box a:hover{color:#fff;}
#section05 .section_body .link_box a:hover:after{width:100%}
#section05 .section_body .link_box a i{margin-left:40px;}





/* Responsive */
@media all and (max-width:1720px){
	#section01 .img01{left:20px;}
	#section01 .img02{right:20px;}

	#section02:before{left:20px;}

}
@media all and (max-width:1440px){
	section .section_title h3{font-size:42px}
	section .section_title b{font-size:32px;}

	#section01 .section_body .textbox b{font-size:38px}
	#section01 .section_body .textbox p{font-size:28px}

	#section02 .section_body table td b{font-size:38px}

	#section03 .section_body .textbox ul li .text b{font-size:21px}

}



@media all and (max-width:1024px){
	section .section_title h3{font-size:36px}
	section .section_title b{font-size:26px;}

	#section01 .section_body .textbox{text-align:center;}

	#section01 .section_body .textbox .br01{display:none}
	#section01 .section_body .textbox p .br02{display:block}

	#section01 .section_body .textbox b{font-size:32px}
	#section01 .section_body .textbox p{font-size:32px}

	
	#section01:before{width:60px;right:240px}
	#section01 .img01{left:20px;max-width:210px;}
	#section01 .img02{right:20px;max-width:180px;}
	#section01 .section_body:after{top:-50%;width:60px;left:30%}

	#section02:before{width:120px;height:120px;top:180px;left:30px;}
	#section02:after{width:100px;height:100px;bottom:40%;right:30px;}


	#section02 .section_fix{max-width:760px}
	#section02 .section_body table.pc{display:none}
	#section02 .section_body table.mobile{display:table}
	#section02 .section_body table td{padding:30px 0 0 0}
	#section02 .section_body table td b{font-size:32px}

	#section02 .section_body .textbox .br01{display:none}
	#section02 .section_body .textbox .br02{display:block}

	#section03 .section_fix{max-width:760px}
	#section03 .section_body .textbox ul{width:calc(50% - 20px)}



	#section04 .section_body ul li{width:calc((100% / 3) - 20px)}
	#section04 .section_body ul.top .box_fix:before{right:0;transform:translate(0)}
	#section04 .section_body ul.bottom .box_fix:before{left:0;transform:translate(0)}

}

@media all and (max-width:840px){
	#section04 .section_body.pc{display:none}
	#section04 .section_body.mobile{display:block;}
}


@media all and (max-width:768px){
	section{padding:160px 0}
	section .section_title h3{font-size:32px}
	section .section_title b{font-size:30px;}

	#section01 .section_body .textbox b{font-size:25px}
	#section01 .section_body .textbox p{font-size:25px}

	#section01:before{width:60px;right:180px}
	#section01 .img01{max-width:160px;}
	#section01 .img02{max-width:140px;}
	#section01 .section_body:after{top:-50%;width:40px;left:20%}

	#section02:before{width:80px;height:80px;top:150px;left:30px;}
	#section02:after{width:60px;height:60px;bottom:40%;right:30px;}


	#section02 .section_body table td b{font-size:25px}
	#section02 .section_body table td p{font-size:16px}
	
	#section03 .section_body .textbox ul li .text{display:none}

	#section04 .section_body ul li{width:calc((100% / 3) - 20px)}
	#section04 .section_body ul.top .box_fix:before{right:0;transform:translate(0)}
	#section04 .section_body ul.bottom .box_fix:before{left:0;transform:translate(0)}

}

@media all and (max-width:720px){
	section .section_title b{font-size:20px}

	#section01 .section_body .textbox b{font-size:20px}
	#section01 .section_body .textbox p{font-size:20px}

	#section02 .section_body table td b{font-size:20px}

}

@media all and (max-width:640px){
	section{padding:120px 0}

	#section01 .section_body .textbox .br01{display:block}

	#section01 .section_title{width:100%;text-align:center;float:none;margin:0 auto 200px;}


	#section01 .section_body:after{top:-70%;width:40px;left:30%}

	#section01 .section_body .textbox b .br02{display:block}	
	#section01 .section_body .textbox p .br02{display:none}

	#section03 .section_fix{max-width:540px}
	#section03 .section_body .textbox ul{width:calc(100% - 20px);margin:5px 10px;}

	#section04 .section_body.mobile ul li{width:calc(100% - 40px);padding:40px 20px 0;}
	#section04 .section_body ul li span{left:20px;}
	#section04 .section_body ul li.active:after{right:20px;}

	#section05 .section_body .link_box a{padding:0 16px}
	#section05 .section_body .link_box a i{margin-left:20px}
}

@media all and (max-width:480px){
	#section03 .section_body .m_hidden_box{display:block}
	#section03 .section_body .hidden_box{display:none}

	
	#section05 .section_body .link_box a{line-height:48px;padding:0 30px;width:268px;margin:0 auto 15px;text-align:left;}
	#section05 .section_body .link_box a i{float:right;line-height:48px;}
}