@charset "utf-8";
/*----------------------------------共通--------------------------------------*/
h2{font-size: 16px; line-height: 160%; font-family: poppins, sans-serif; font-weight: 600; font-style: normal; }
h2.big_title{font-size: 35px;}
.contact_box{max-width: 1344px; margin: 0 auto; padding: 0 60px;}
.contact_box .bg_white{border-radius: 100px; padding: 106px 0 125px; }
.contact_box .bg_white .box{width: 900px; margin: 0 auto;}
.btn{padding: 46px 0 0; display: flex; justify-content: center; align-items: flex-start;}
.back_btn{padding: 18px 0; width: 442px; color: #000;background: #fff; display: block; border-radius: 100px; text-align: center; border: 1px solid #2d56a5; line-height: 180%; font-size: 18px; }
.back_btn.back{margin: 0 2% 0 0;}
 form .btn button{position: relative; border-radius: 100px; padding: 20px 0 16px; width: 442px; text-align: center; display: block;background: linear-gradient(90deg, #009bed 0%, #001b8b 0%, #001b8b 15%,#09b794 60% );color: #fff; transition: all 0.5s ease-out; background-position: 10% 50%; background-size: 200% auto; font-size: 18px; line-height: 180%;}
 form .btn button span{border-radius: 100px; background: #fff; width: 26px; height: 26px; position: absolute;top: 50%;transform: translateY(-50%);-webkit-transform:translateY(-50%); right:11px;}
 form .btn button span:after{content: ""; border-bottom: 2px solid  #31b8a2; border-right: 2px solid #31b8a2; display: block; width: 8px ;height: 8px; top: 50%;left: 47%;transform: translate(-50%,-50%) rotate(-45deg);-webkit-transform: translate(-50%,-50%) rotate(-45deg);right: 0px; position: absolute;}
 form .btn.thumb-hover button{ transition: all 0.5s ease-out; background-position: 60% 30%;}
p.caution{ padding: 30px 0 0; line-height: 180%;}

/*----------------------------------#contact--------------------------------------*/
#contact h2 span{font-size: 48px; background: linear-gradient(to right,  #2852A7 60%, #299C9D 90%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block;letter-spacing: 0.05em; line-height: 140%;font-family: 'Noto-Sans-JP-Medium';}
#contact .contact_box .bg_white .box{width: 900px; margin: 0 auto;}
#contact .contact_box .bg_white .box .top_box{border-bottom: 1px solid #dcdcdc; padding: 0 0 68px;}
#contact .contact_box .bg_white .box .top_box p{padding: 70px 0 0; line-height: 170%;}
#contact .contact_box .bg_white .box form{padding: 62px 0 0;}
#contact .contact_box .bg_white .box form table{width: 100%; height: auto;}
#contact .contact_box .bg_white .box form table tr{width: 100%;height: auto;}
#contact .contact_box .bg_white .box form table tr th{width: 231px; vertical-align: top;}
#contact .contact_box .bg_white .box form table tr label{font-size: 18px; display: flex; padding: 23px 0 0;}
#contact .contact_box .bg_white .box form table tr label span{ color: #e60012; font-size: 11px;}
#contact .contact_box .bg_white .box form table tr td input{border: 1px solid #dcdcdc; width: 100%; padding: 17px 29px;  border-radius: 5px;}
#contact .contact_box .bg_white .box form table tr td textarea{border: 1px solid #dcdcdc; width: 100%;padding: 17px 29px;border-radius: 5px;   resize: none;  resize: horizontal; height: 200px;}
#contact .contact_box .bg_white .box form table tr:not(:first-child) th,
#contact .contact_box .bg_white .box form table tr:not(:first-child) td{padding: 38px 0 0; }
#contact .contact_box .bg_white .box form .link{text-align: center; padding: 49px 0 0;}
#contact .contact_box .bg_white .box form .link a{border-bottom: 1px solid #3b4ece; color: #3b4ece; } 

/*----------------------------------#error--------------------------------------*/
#error p{padding: 30px 0 0; text-align: center;}
#error h2{text-align: center;}
#error p span{display: block; width: 100%; text-align: center;}
#error p span:not(:first-child){padding: 30px 0 0; text-align: center;}


/*----------------------------------#confirm--------------------------------------*/
#confirm p{padding: 30px 0 0; text-align: center;}
#confirm h2{text-align: center;}

#confirm form{padding: 50px 0 0;}
#confirm form table{width: 100%;height: auto;}
#confirm form table tr th,
#confirm form table tr td{font-size: 16px; text-align: left; border-bottom: 1px solid #dcdcdc;padding: 25px 20px; }
#confirm form table tr:first-child th,
#confirm form table tr:first-child td{border-top: 1px solid #dcdcdc}
#confirm form table tr th{width: 30%;}
#confirm form table tr td{width: 70%;}

/*----------------------------------#thanks--------------------------------------*/
#thanks{margin: 0 0 200px;}
#thanks p{padding: 30px 0 0; text-align: center;}
#thanks h2{text-align: center;}
#thanks small{font-size: 16px; line-height: 170%; display: block; padding: 30px 0 0; text-align: center;}
#thanks small span{display: block;line-height: 170%;font-size: 16px;}
#thanks .btn .back_btn{transition: 0.5s;}
#thanks .btn.thumb-hover .back_btn{transition: 0.5s; background: #2d56a5; color: #fff;}
@media only screen and (max-width: 768px) {
	/*----------------------------------共通--------------------------------------*/
	h2{font-size: 13px;  }
	h2.big_title{font-size: 25px;}
	h2 img{padding: 0 0 16px; width: 150px;height: auto;}
	.contact_box{ padding: 0 15px;}
	.contact_box .bg_white{ padding: 40px 20px; border-radius: 30px; }
	.contact_box .bg_white .box{width: auto; margin: 0 auto;}
	.btn{padding: 23px 0 0; flex-direction: column;}
	.back_btn{padding: 9px 0; width: 100%; color: #000;background: #fff; display: block; border-radius: 100px; text-align: center; border: 1px solid #2d56a5; line-height: 180%; font-size: 14px; }
	.back_btn.back{ margin: 0 0 20px;}
	 form .btn button{ padding: 10px 0 8px; width: 100%; background: linear-gradient(90deg, #009bed 0%, #001b8b 0%, #001b8b 15%,#09b794 60% ); auto; font-size:14px; }
	 form .btn button span{ width: 20px; height: 20px; right: 6px;}
	 form .btn button span:after{ width: 6px ;height: 6px; }
	 form .btn.thumb-hover button{  background-position: 60% 30%;}
	p.caution{ padding: 30px 0 0; font-size: 14px; }
	
	/*----------------------------------#contact--------------------------------------*/
	#contact h2 span{font-size: 31px;}
	#contact .contact_box .bg_white .box{width: auto; margin: 0 auto;}
	#contact .contact_box .bg_white .box .top_box{padding: 0 0 34px;}
	#contact .contact_box .bg_white .box .top_box p{padding: 33px 0 0; font-size: 14px;}
	#contact .contact_box .bg_white .box form{padding: 15px 0 0;}
	#contact .contact_box .bg_white .box form table tr th{width: 231px; }
	#contact .contact_box .bg_white .box form table tr label{font-size: 14px;  padding: 0px;}
	#contact .contact_box .bg_white .box form table tr td input{width: 100%; padding: 11px 15px;}
	#contact .contact_box .bg_white .box form table tr td textarea{padding: 11px 15px; height: auto;}
	#contact .contact_box .bg_white .box form table tr th,
	#contact .contact_box .bg_white .box form table tr td{width: 100%; display: block; padding: 19px 0 0; }
	#contact .contact_box .bg_white .box form table tr:not(:first-child) th,
	#contact .contact_box .bg_white .box form table tr:not(:first-child) td{padding: 19px 0 0; }
	#contact .contact_box .bg_white .box form .link{font-size: 14px; padding: 25px 0 0;     line-height: 180%;}
	
	/*----------------------------------#error--------------------------------------*/
	#error p{padding: 15px 0px 0px 0px;}
	#error p span:not(:first-child){padding: 15px 0 0;font-size: 14px;}
	
	/*----------------------------------#confirm--------------------------------------*/
	#confirm form{padding: 25px 0 0;}
	#confirm form table tr th,
	#confirm form table tr td{font-size: 14px; padding: 12px 10px; display: block; line-height: 160%;}
	#confirm form table tr th{width: 100%;border-bottom: none !important;}
	#confirm form table tr td{width: 100%; border-top: none !important;}
	
	/*----------------------------------#thanks--------------------------------------*/
	#thanks{margin: 0 0 100px;}

	#thanks small{font-size: 12px; padding: 15px 0 0; }
	#thanks small span{font-size: 12px; text-indent: -1em; padding-left: 1em; }
}