@charset "utf-8";
/* ----------------------------- 共通 ------------------------------- */
.titel_box{text-align: center;}
.titel_box h3{font-size: 65px; color: #0f65b2;font-family: 'Noto-Sans-JP-Bold'; padding: 0 0 25px; display: inline-block; font-style: italic;}
.titel_box p{line-height: 242%; font-size: 17px;}
.titel_box .text_2{line-height: 182%;font-feature-settings: "palt";}

/* ----------------------------- #fv ------------------------------- */

#fv{background: url(../images/fv.jpg) no-repeat center top; background-size: cover; padding: 100px 0 110px; margin: 98px 0 127px; position: relative;}
#fv .fv_img{max-width: 1412px; margin: 0 auto; width: 100%; height: auto;padding: 0 50px 0 0; text-align: right;}
#fv .fv_img img.PC{width: 100%; height: auto; max-width: 1216px; display: inline-block;}

#fv .fv_img img{width: 100%; height: auto; }

#fv p.big_tt{width: 1200px; margin: 0 auto; border-radius: 1000px; background: linear-gradient(to left, #fde730,#fdf130) ; text-align: center; font-size: 51px; font-family: 'Noto-Sans-JP-Bold'; color: #000; line-height: 155%; padding: 40px 0;font-style: italic;position: absolute; left: 50%; transform: translateX(-50%);}
#fv p.big_tt span{color: #000;font-style: italic;font-family: 'Noto-Sans-JP-Bold'; background-image: linear-gradient(to right, #fff,#fff) ; background-repeat: no-repeat; background-size: 100% 30%; background-position: bottom;}

/* ----------------------------- #consultation ------------------------------- */
#consultation{padding: 60px 0 131px; position: relative;}
#consultation .titel_box h3{background: url(../images/icn_2.png) no-repeat center left ,url(../images/icn_1.png) no-repeat center right; background-size: 48px,48px; padding: 0 58px 10px; font-size: 55px; line-height: 196%;}

#consultation .flex_box{display: flex; flex-wrap: wrap;justify-content: center;}
#consultation .flex_box .img{width: auto; text-align: center;margin-top: 47px;}
#consultation .flex_box .img:not(:nth-child(4),:last-child){margin-right: 57px;}
#consultation .flex_box .img p{line-height: 185%; font-size: 19px; font-feature-settings: "palt"; padding: 16px 0 0;}

#consultation h4{font-size: 55px; color: #0f65b2; text-align: center; line-height: 176%;font-family: 'Noto-Sans-JP-Bold'; padding: 91px 0 0;font-style: italic;}
#consultation h4 span{ background: linear-gradient(transparent 85%, #fde730 85%); padding: 0 0 3px; font-family: 'Noto-Sans-JP-Bold'; display: inline-block;font-style: italic;}
#consultation img.icn_3{position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); bottom: -60px;}

/* ----------------------------- #strengths ------------------------------- */
#strengths{background: url(../images/bg_1.jpg) no-repeat center center; background-size: cover; padding: 138px 0 166px;}
#strengths .titel_box h3{color: #fff;}
#strengths .titel_box p{color: #fff;}
#strengths .bg_white{background: #fff; border-radius: 50px; padding: 81px 57px 0; margin: 62px 0 0;}
#strengths .bg_white .flex_box{ display: flex; flex-wrap: wrap;}
#strengths .bg_white .flex_box .img{width: 330px; height: auto; padding-bottom: 79px;}
#strengths .bg_white .flex_box .img:not(:nth-child(3n)){margin-right: 48px;}
#strengths .bg_white .flex_box .img h4{padding: 20px 0 0;font-size: 24px; line-height: 146%;font-family: 'Noto-Sans-JP-Medium'; text-align: center;}
#strengths .bg_white .flex_box .img p{line-height: 175%; padding: 21px 0 0;}

/* ----------------------------- #purchase ------------------------------- */
#purchase{background: url(../images/bg_2.jpg) center center;background-size: 26px; padding: 146px 0 107px;}
#purchase .titel_box h3 {padding: 0 0 38px;}
#purchase .bg_box{ background:  url(../images/bg_3_2.png) repeat-y center center;background-size: 1200px; position: relative;padding: 196px 90px 91px; width: 100%;}
#purchase .bg_box .titel_box{padding: 0 91px; position: absolute; transform: translateX(-50%); left: 50%;top: -6.7%; width: 100%;}

#purchase .bg_box .flex_box{display: flex; justify-content: space-between; }
#purchase .bg_box .flex_box .img{text-align: center;}
#purchase .bg_box .flex_box .img:not(:last-child){margin-right: 42px;}
#purchase .bg_box .flex_box .img img{display: inline-block;}
#purchase .bg_box .flex_box .img p{font-size: 24px;font-family: 'Noto-Sans-JP-Medium'; line-height: 146%; padding-top: 20px;font-feature-settings: "palt";}


/* ----------------------------- #stance ------------------------------- */
#stance{padding: 175px 0 150px;}
#stance .titel_box h3{ padding: 0 0 27px;}
#stance .titel_box h3 span{font-family: 'Noto-Sans-JP-Bold'; background: linear-gradient(transparent 70%, #fde730 70%); padding: 0px 0 14px; display: inline-block; font-style: italic;}
#stance ul{padding: 66px 0 0;}
#stance ul li{display: flex; }
#stance ul li:not(:last-child){padding: 0 0 74px;}
#stance ul li.left{ flex-direction: row-reverse;}
#stance ul li .text{width: 50%;}

#stance ul li .text .box{width: 507px; margin: 59px auto 13px 87px;}
#stance ul li.left .text .box{ margin: 36px 87px 13px auto;}

#stance ul li .text .box h4{font-size: 44px; color: #0751a6; display: flex; align-items: center;font-family: 'Noto-Sans-JP-Medium'; }
#stance ul li .text .box h4 img{display: inline-block;margin: 0 27px 0 0;}

#stance ul li .box p{line-height: 213%; padding: 30px 0 0;}

#stance ul li .img{position: relative; width: 50%; padding: 0 0 45px;}
#stance ul li .img:before{content: ""; display: block; position: absolute;width: calc(100% - 55px); height: 400px; background: linear-gradient(90deg, #074aa0, #23a1e2); bottom: 0px; left: 0px;}
#stance ul li.left .img:before{right: 0px; left: auto;}

#stance ul li .img img{display: block; margin:0 0 0 auto; position: relative;z-index: 1;}
#stance ul li.left .img img{ margin:0 auto 0 0;}


/* ----------------------------- #achievements ------------------------------- */
#achievements{background: #f6faff; padding: 150px 0 111px;}
#achievements .titel_box h3{ padding: 0 0 36px;}

#achievements .flex_box{display: flex; flex-wrap: wrap; padding: 60px 0 0;}
#achievements .flex_box .box{width: 585px; background: #fff; border-radius: 25px; box-shadow: 9px 9px 15px 0 rgba(0,0,0,0.2); margin-bottom: 30px; padding: 38px 34px 36px;}

#achievements .flex_box .box:not(:nth-child(2n)){margin-right: 30px;}
#achievements .flex_box .box .flex{display: flex;align-items: center;}
#achievements .flex_box .box .flex p.price{background: linear-gradient(90deg,#074aa0,#23a1e2); color: #fff; padding: 14px; margin-right: 18px;}
#achievements .flex_box .box .flex p.cost{font-size: 24px; margin-right: 34px;font-family: 'Noto-Sans-JP-Medium';}
#achievements .flex_box .box .flex p.cost span{font-size: 41px;font-family: "Helvetica Neue" , Helvetica , sans-serif; font-weight: 400;}

#achievements .flex_box .box .img_box{width: 100%; height: auto; padding: 30px 0 0;}
#achievements .flex_box .box .img_box img{width: 100%; height: auto;}
#achievements .flex_box .box .flex p.place{font-size: 14px; line-height: 150%;}
#achievements .flex_box .box .flex_img{display: flex; align-items: center; margin: 30px 0 0;}
#achievements .flex_box .box .flex_img p{background: #fffdd8; border-radius: 10px; border-radius: 25px; font-size: 24px; font-family: 'Noto-Sans-JP-Medium'; line-height: 155%; padding: 18px 33px 18px 23px; position: relative; width: 367px; }
#achievements .flex_box .box .flex_img p:before{content: ""; display: block; background: url(../images/icn_5.png) no-repeat center center; background-size: 28px; width: 28px;height: 28px; position: absolute; right: -28px;}
#achievements .flex_box .box .flex_img img{margin-left: 12px;}
#achievements .flex_box .box p.tt_box{line-height: 183%; font-size: 17px; padding: 16px 0 0;}


/* ----------------------------- #flow ------------------------------- */
#flow{padding: 151px 0 0; position: relative;}
#flow .titel_box h3{ padding: 0 0 36px;}
#flow .flex_box{display: flex; justify-content: space-between;align-items: flex-start; padding: 60px 0 0;}
#flow .flex_box .box{width: 227px; height: auto; background: #fff; border-radius: 25px; box-shadow: 9px 9px 15px 0 rgba(0,0,0,0.2); position: relative; text-align: center;}
#flow .flex_box .box:not(:last-child):before{display: block; content: ""; background: url(../images/icn_11.png) no-repeat center center; background-size: 41px; width: 41px; height: 41px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); right: -30px; z-index: 1;}
#flow .flex_box .box .internal{padding: 21px 0 24px; text-align: center;}
#flow .flex_box .box .internal h4{color: #1366b3; font-size: 20px;font-family: "Helvetica Neue" , Helvetica , sans-serif; font-weight: 400;}
#flow .flex_box .box .internal p{font-size: 24px; font-family: 'Noto-Sans-JP-Bold';color: #1366b3;}
#flow .flex_box .box .internal img{display: inline-block;}


#flow .flex_box .box:nth-child(1) .internal img{padding: 29px 0 38px;}
#flow .flex_box .box:nth-child(2) .internal img{padding: 20px 0 25px;}
#flow .flex_box .box:nth-child(3) .internal img{padding: 20px 0 25px;}
#flow .flex_box .box:nth-child(4) .internal img{padding: 19px 0 36px;}
#flow .flex_box .box:nth-child(5) .internal img{padding: 25px 0 30px;}

#flow .comment_box{background: linear-gradient(transparent 90%, #f6faff 90%);}
#flow .comment_box .comment{ display: flex; align-items: flex-end; justify-content: center; margin: 0 auto; width: 1100px; padding: 66px 0 0;}
#flow .comment_box .comment img{padding: 0 26px 0 0;}
#flow .comment_box .comment .text_box{border: 2px solid #003597; border-radius: 25px; padding: 36px 50px 38px; width: 850px;box-shadow: 9px 9px 15px 0 rgba(0,0,0,0.2); background: #fff;}
#flow .comment_box .comment .text_box h4{font-family: 'Noto-Sans-JP-Bold'; font-size: 24px; line-height: 160%;}
#flow .comment_box .comment .text_box p{line-height: 200%; padding: 23px 0 0;}


/* ----------------------------- #question ------------------------------- */
#question{background: #f6faff; padding: 102px 0 150px;}
#question .titel_box h3{ padding: 0 0 36px;}
#question ul{width: 883px; height: auto; margin: 0 auto; padding: 38px 0 0 ;}
#question ul li{background: #ffffff; border-radius: 25px;box-shadow: 9px 9px 15px 0 rgba(0,0,0,0.2); }
#question ul li:not(:last-child){margin: 0 0 20px;}
#question ul li p.qtn_btn{padding: 30px;  position: relative;display: flex; align-items: center;}
#question ul li p.qtn_btn span.text{font-size: 18px;font-family: 'Noto-Sans-JP-Medium';}
#question ul li p.qtn_btn span.qtu{display: inline-block;color: #fff; background: linear-gradient(#1565b7,#074aa0); font-size: 18px;font-family: hiragino-kaku-gothic-pron, sans-serif; font-weight: 600; font-style: normal; width: 40px; height: 40px; padding: 12px 0; text-align: center; border-radius: 100%; margin: 0 10px 0 0;}
#question ul li p.qtn_btn:after{content: ""; display: block; width: 10px; height: 10px; border-bottom: 2px solid #003597;border-left: 2px solid #003597; transform: rotateZ(-45deg); transition: 0.5s;margin: 0 0 0 auto;}
#question ul li p.clos{padding: 20px 30px 32px; font-size: 14px; font-family: 'Noto-Sans-JP-Light'; line-height: 160%; }

#question ul li p.qtn_btn.close{border-bottom: 1px solid #b3b3b3;}
#question ul li p.qtn_btn.close:after{ transform: rotateZ(135deg);}

/* ----------------------------- .cta_2 ------------------------------- */
.cta_2 {padding: 0 0 118px;}
.cta_2 .flex{background: #d1ecfd; display: flex; align-items: center;}
.cta_2 .flex .img{width: 50%;}
.cta_2 .flex .img img{width: 100%; height: auto;}
.cta_2 .flex .box{ width: 50%;padding: 50px 50px 0px 93px;}
.cta_2 .flex .box h3{font-size: 38px; font-family: 'Noto-Sans-JP-Bold'; line-height: 150%;}
.cta_2 .flex .box p{font-size: 18px; font-feature-settings: "palt"; line-height: 245%; padding: 44px 0 0;}

.cta_2 .flex .box .internal{width: 505px;}
/* ----------------------------- mobile ------------------------------- */
@media only screen and (max-width: 768px) {
		
	/* ----------------------------- 共通 ------------------------------- */
	.titel_box h3{font-size: 32px; padding: 0 0 12px; line-height: 150%; }
	.titel_box p{font-size: 14px;}
	
	/* ----------------------------- #fv ------------------------------- */
	
	#fv{background: url(../images/fv_sp.jpg) no-repeat center top; background-size: 100%; padding: 9% 0 0px;margin: 50px 0 0;}
	#fv .fv_img { max-width: 95%; margin: 0 auto; padding: 0px;}
	#fv .fv_img .img_2{width: 80%;margin: 0 auto;}
	#fv p.big_tt{ width: 90%; font-size: 20px; padding: 14px 0 20px;margin: 20px auto 0;position: relative; left: auto; transform: none;}
	#fv .fv_img img.PC{display: none;}
	
	/* ----------------------------- #consultation ------------------------------- */
	#consultation{padding: 60px 0 22%;}
	#consultation .titel_box h3{background: url(../images/icn_2.png) no-repeat center left ,url(../images/icn_1.png) no-repeat center right; background-size: 15%,15%;padding: 0px 35px 10px;font-size: 27px;line-height: 150%; }
	
	#consultation .flex_box{ justify-content: space-between;}
	#consultation .flex_box .img{margin-top: 25px; width: 48%; height: auto;}
	#consultation .flex_box .img:not(:nth-child(4),:last-child){margin-right: 0px;}
	#consultation .flex_box .img:not(:nth-child(2n)){margin-right: 4%;}
	#consultation .flex_box .img:nth-child(2){margin-top: 47px;}
	#consultation .flex_box .img:first-child{margin-top: 47px;}
	#consultation .flex_box .img img{width: 100%; height: auto;}
	#consultation .flex_box .img p{font-size: 14px; padding: 10px 0 0;}
	
	#consultation h4{font-size: 28px; padding: 30px 0 0;}
	#consultation h4 span{ padding: 0 0 3px;}
	#consultation img.icn_3{ bottom: -60px; width: 100%; height: auto; max-width: 262px;}
	
	/* ----------------------------- #strengths ------------------------------- */
	#strengths{background: url(../images/bg_1.jpg) no-repeat center center; background-size: cover; padding: 69px 0;}

	#strengths .bg_white{ padding: 40px 28px 0; margin: 32px 0 0; border-radius: 25px;}
	#strengths .bg_white .flex_box .img{width: 100%; padding-bottom: 39px;}
	#strengths .bg_white .flex_box .img img{width: 100%; height: auto;}
	#strengths .bg_white .flex_box .img:not(:nth-child(3n)){margin-right: 0px;}
	#strengths .bg_white .flex_box .img h4{padding: 10px 0 0;font-size: 18px; }
	#strengths .bg_white .flex_box .img p{ padding: 11px 0 0; font-size: 13px;}
	
	/* ----------------------------- #purchase ------------------------------- */
	#purchase{background: url(../images/bg_2.jpg) center center;background-size: 13px; padding:100px 0;}
	#purchase .titel_box h3 {padding: 0 0 19px;}
	
	#purchase .bg_box{ background:  url(../images/bg_sp_3_2.png) repeat-y center center; background-size:100%;padding: 190px 16px 40px; }
	#purchase .img_bg{width: 100%; height: auto; }


	#purchase .bg_box .titel_box{padding:0px;top: -6.6%;}
	#purchase .bg_box .flex_box { flex-wrap: wrap;}
	#purchase .bg_box .flex_box .img{width: 47%; height: auto;}
	#purchase .bg_box .flex_box .img:not(:last-child){margin-right: 0px; margin-bottom: 28px;}
	#purchase .bg_box .flex_box .img img{width: 100%; height: auto;}
	#purchase .bg_box .flex_box .img p{font-size: 15px; padding-top: 15px;}
	
	
	/* ----------------------------- #stance ------------------------------- */
	#stance{padding: 60px 0;}
	#stance .titel_box h3{ padding: 0 0 18px;}
	#stance .titel_box h3 span{ padding: 0px 0 5px;}
	#stance ul{padding: 33px 0 0;}
	#stance ul li { display: flex; justify-content: center; align-items: center; flex-direction: column;}
	#stance ul li.left {display: flex; justify-content: center; align-items: center; flex-direction: column;}
	#stance ul li:not(:last-child){padding: 0 0 37px;}
	#stance ul li .text{width: 100%;}
	
	#stance ul li .text .box{width: 90%; margin: 0 auto;}
	#stance ul li.left .text .box{ margin:  auto;}
	#stance ul li .text .box h4{font-size: 24px;}
	#stance ul li .text .box h4 img{ margin: 0 14px 0 0; width: 60px;}
	
	#stance ul li .box p{padding: 15px 0 0; font-size: 13px;}
	
	#stance ul li .img{width: auto; padding:0 0 30px 30px; margin: 0 0 20px;}
	#stance ul li .img:before{width: calc(100% - 55px); height: 90%; bottom: 0px; left: 0px;}
	#stance ul li.left .img{ padding:0 30px 30px 0;}
	#stance ul li.left .img:before{right: 0px; left: auto;}
	
	#stance ul li.left .img img{ margin:0 auto 0 0;}
	
	
	/* ----------------------------- #achievements ------------------------------- */
	#achievements{padding: 60px 0;}
	#achievements .titel_box h3{ padding: 0 0 18px;}
	
	#achievements .flex_box{padding: 30px 0 0;}
	#achievements .flex_box .box{width: 100%; margin-bottom: 22px; padding: 20px;box-shadow: 7px 7px 10px 0 rgba(0,0,0,0.2);}
	
	#achievements .flex_box .box:not(:nth-child(2n)){margin-right: 0px;}
	#achievements .flex_box .box .flex {display: flex; align-items: center;flex-wrap: wrap;}
	#achievements .flex_box .box .flex p.price{ padding: 11px; margin-right: 12px; font-size: 14px;}
	#achievements .flex_box .box .flex p.cost{font-size: 18px; margin-right: auto;}
	#achievements .flex_box .box .flex p.cost span{font-size: 28px;}
	
	#achievements .flex_box .box .img_box{width: 100%; height: auto; padding: 15px 0 0;}
	#achievements .flex_box .box .flex p.place{font-size: 12px; padding: 10px 0 0; width: 100%; line-height: 180%;}
	#achievements .flex_box .box .flex_img{margin: 15px 0 0;}
	#achievements .flex_box .box .flex_img p{ font-size: 14px; padding: 9px 16px 9px 11px; width: calc(100% - 60px);; border-radius: 15px;}
	#achievements .flex_box .box .flex_img p:before{background: url(../images/icn_5.png) no-repeat center center; background-size: 16px; width: 16px;height: 16px; right: -16px;}
	#achievements .flex_box .box .flex_img img{margin-left: 12px; width: 60px; height: auto;}
	#achievements .flex_box .box p.tt_box{font-size: 14px; padding: 12px 0 0;}
	
	
	/* ----------------------------- #flow ------------------------------- */
	#flow{padding: 50px 0 0; }
	#flow .titel_box h3{ padding: 0 0 18px;}
	#flow .flex_box{padding: 30px 0 0; flex-wrap: wrap; justify-content: flex-start; flex-direction: row;}
	#flow .flex_box .box{ width: 30%; position: relative; border-radius: 15px; margin-bottom: 13px;box-shadow: 6px 6px 9px 0 rgba(0,0,0,0.2);}
	#flow .flex_box .box:not(:last-child){}
	#flow .flex_box .box:not(:last-child,:nth-child(3n)){margin-right: 13px;}
	#flow .flex_box .box:not(:last-child):before{background: url(../images/icn_11.png) no-repeat center center; background-size: 100%; width: 28px; height: 28px; right: -20%; transform: translateY(-50%); -webkit-transform: translateY(-50%); top: 50%;}
	#flow .flex_box .box:nth-child(3n):before{ right: -15%; }
	#flow .flex_box .box .internal{padding: 13px 0 14px;}
	#flow .flex_box .box .internal h4{font-size: 12px;}
	#flow .flex_box .box .internal p{font-size: 13px; }
	
	
	#flow .flex_box .box .internal img{width: 50%; height: auto; }
	#flow .flex_box .box:nth-child(1) .internal img{padding: 11px 0 12px; width: 45%;}
	#flow .flex_box .box:nth-child(2) .internal img{padding: 10px 0 11px; width: 42%;}
	#flow .flex_box .box:nth-child(3) .internal img{padding: 12px 0 9px; width: 37%}
	#flow .flex_box .box:nth-child(4) .internal img{padding: 14px 0 10px; width: 38%; }
	#flow .flex_box .box:nth-child(5) .internal img{padding: 11px 0; width: 46%;}
	
	#flow .comment_box .comment{width: 90%; flex-direction: column; padding: 51px 0 0;}
	#flow .comment_box .comment img{padding: 0 0 13px; width: 50%; margin: 0 auto;}
	#flow .comment_box .comment .text_box{padding: 23px 25px; width: auto;box-shadow: 6px 6px 9px 0 rgba(0,0,0,0.2);}
	#flow .comment_box .comment .text_box h4{ font-size: 18px; line-height: 160%;}
	#flow .comment_box .comment .text_box p{padding: 15px 0 0; font-size: 13px;}
	
	
	/* ----------------------------- #question ------------------------------- */
	#question{padding:54px 0 75px;}
	#question .titel_box h3{ padding: 0 0 18px;}
	#question ul{width: 100%; height: auto; margin: 0 auto; padding: 22px 0 0 ;}
	#question ul li{ border-radius: 15px;box-shadow: 6px 6px 9px 0 rgba(0,0,0,0.2);}
	#question ul li:not(:last-child){margin: 0 0 15px;}
	#question ul li p.qtn_btn{padding: 15px;}
	#question ul li p.qtn_btn span.text{font-size: 14px;display: inline-block; width: 80%;line-height: 160%;}
	#question ul li p.qtn_btn span.qtu{font-size: 14px;width: 25px; height: 25px; padding: 6px 0; margin: 0 10px 0 0;}
	#question ul li p.qtn_btn:after{width: 8px; height: 8px; border-bottom: 1px solid #003597; border-left: 1px solid #003597;}
	{padding: 10px 15px 15px; font-size: 11px; }
		
	/* ----------------------------- .cta_2 ------------------------------- */
	.cta_2 {padding:0 0 59px;}
	.cta_2 .flex{flex-direction: column}
	.cta_2 .flex .img{width: 100%;} 
	.cta_2 .flex .box{ width: 90%;padding: 50px 0 45px; margin: 0 auto;}
	.cta_2 .flex .box h3{font-size: 26px;}
	.cta_2 .flex .box p{font-size: 14px; padding: 22px 0 0;}
	
	.cta_2 .flex .box .internal{ width: 100%;}
}
