.sb_wrap, .sb_wrap *{ box-sizing:border-box; }
.sb_wrap{ max-width:100%; padding:0 !important; overflow:hidden; }
.sb_con{ width:100%; margin:0 auto; }
.btnArea{ display:none; }


#sb01{ padding:150px 20px; }
#sb01 > .sb_con{ max-width:1300px; }

.sb01_tt{ max-width:900px; width:100%; margin:0 auto 100px; text-align:center; word-break:keep-all; }
.sb01_tt > h2{ font-family:'wmp'; font-size:60px; font-weight:500; color:#333; margin-bottom:20px; }
.sb01_tt > h2 > span{ color:#54a7c1; }
.sb01_tt > p{ font-size:18px; font-weight:300; color:#333; line-height:1.7em; }

.sb01_ptwrap{ margin:0 -20px; display:flex; flex-flow:row wrap; }
.sb01_pt{ width:25%; padding:0 20px; }
.sb01_ic{ max-width:200px; width:100%; margin:0 auto 20px; border-radius:100%; padding:4px; overflow:hidden; }
.sb01_ic{
	background:-webkit-linear-gradient(top, #15639e 0%, #1eaee3 100%);
	background:-moz-linear-gradient(top, #15639e 0%, #1eaee3 100%);
	background:linear-gradient(to bottom, #15639e 0%, #1eaee3 100%);
}
.sb01_ic > div{ width:100%; padding-top:100%; background-color:#fff; border-radius:100%; background-position:center; background-size:65%; background-repeat:no-repeat; }
.sb01_ic > div.ic01{ background-image:url(./img/01-01.svg); }
.sb01_ic > div.ic02{ background-image:url(./img/01-02.svg); }
.sb01_ic > div.ic03{ background-image:url(./img/01-03.svg); }
.sb01_ic > div.ic04{ background-image:url(./img/01-04.svg); }

.sb01_txt{ text-align:center; word-break:keep-all; }
.sb01_txt > h3{ font-family:'wmp'; font-size:36px; font-weight:700; color:#333; line-height:1em; margin-bottom:10px; }
.sb01_txt > p{ font-size:16px; font-weight:300; color:#666; }

@media(max-width:991px){
	.sb01_pt{ width:50%; padding:0 20px; }
	.sb01_pt:nth-child(-n + 2){ padding:0 20px 50px; }
}
@media(max-width:850px){
	#sb01{ padding:100px 20px; }
}
@media(max-width:750px){
	.sb01_tt{ margin:0 auto 60px; }
	.sb01_tt > h2{ font-size:50px; }
	.sb01_tt > p{ font-size:16px; }
}
@media(max-width:750px){
	.sb01_tt > h2{ font-size:10vw; }
}
@media(max-width:500px){
	.sb01_pt{ width:100%; padding:0 20px 50px; }
	.sb01_pt:last-child{ padding:0 20px; }
}



#sb02{ padding:0 20px 150px; }

.sb02_ptwrap{ position:relative; z-index:1; display:flex; flex-flow:row wrap; border-radius:10px; overflow:hidden; }

.sb02_ct{ position:absolute; z-index:10; top:50%; left:50%; width:100px; border-radius:100%; padding:4px; transform:translate(-50%, -50%); box-shadow:4px 4px 8px 0 rgba(0,0,0,.25); }
.sb02_ct{
	background:-webkit-linear-gradient(top, #15639e 0%, #1eaee3 100%);
	background:-moz-linear-gradient(top, #15639e 0%, #1eaee3 100%);
	background:linear-gradient(to bottom, #15639e 0%, #1eaee3 100%);
}
.sb02_ct > div{ width:100%; padding-top:100%; border-radius:100%; background-color:#fff; background-image:url(./img/02-01.svg); background-position:center; background-size:70%; background-repeat:no-repeat; }

.sb02_pt{ width:50%; display:flex; }
.sb02_box{ position:relative; z-index:1; width:100%; padding-top:max(65%, 370px); overflow:hidden; }
.sb02_box.box01{ background-color:#59a6c2; box-shadow:inset 0 -20px 15px -15px rgba(0,0,0,.25); }
.sb02_box.box02{ background-color:#418da9; box-shadow:inset 20px 0 15px -15px rgba(0,0,0,.25); }
.sb02_box.box03{ background-color:#23638d; box-shadow:inset -20px 0 15px -15px rgba(0,0,0,.25); }
.sb02_box.box04{ background-color:#15639e; box-shadow:inset 0 20px 15px -15px rgba(0,0,0,.25); }

.sb02_box:after{ content:''; position:absolute; z-index:1; }
.sb02_box.box01:after{ bottom:-1px; left:50%; width:40px; height:20px; background-color:#23638d; border-radius:40px 40px 0 0; margin-left:-20px; box-shadow: }
.sb02_box.box02:after{ top:50%; left:-1px; width:20px; height:40px; background-color:#59a6c2; border-radius:0 40px 40px 0; margin-top:-20px; }
.sb02_box.box03:after{ top:50%; right:-1px; width:20px; height:40px; background-color:#15639e; border-radius:40px 0 0 40px; margin-top:-20px; }
.sb02_box.box04:after{ top:-1px; left:50%; width:40px; height:20px; background-color:#418da9; border-radius:0 0 40px 40px; margin-left:-20px; }

.sb02_txt{ position:absolute; z-index:1; top:0; bottom:0; left:0; right:0; word-break:keep-all; padding:40px; display:flex; flex-direction:column; }
.sb02_box.box01 > .sb02_txt{ text-align:left; }
.sb02_box.box02 > .sb02_txt{ text-align:right; }
.sb02_box.box03 > .sb02_txt{ justify-content:flex-end; text-align:left; }
.sb02_box.box04 > .sb02_txt{ justify-content:flex-end; text-align:right; }

.sb02_txt > h3{ font-family:'wmp'; font-size:80px; color:#fff; line-height:1em; margin-bottom:10px; }
.sb02_txt > h4{ font-family:'wmp'; font-size:40px; font-weight:700; color:#fff; line-height:1em; margin-bottom:10px; }
.sb02_txt > p{ font-size:18px; font-weight:300; color:#fff; }

@media(max-width:800px){
	.sb02_ct{ display:none; }
	.sb02_pt{ width:100%; }
	.sb02_box{ padding:0; }
	.sb02_txt{ position:relative; z-index:1; }
	.sb02_box.box01{ box-shadow:none; }
	.sb02_box.box02, .sb02_box.box03, .sb02_box.box04{ box-shadow:inset 0 20px 15px -15px rgba(0,0,0,.25); }
	.sb02_box:after{ content:none; }
}
@media(max-width:600px){
	#sb02{ padding:0 15px 150px; }
	.sb02_txt{ padding:40px 15px; }
	.sb02_txt > h3{ font-size:60px; }
	.sb02_txt > h4{ font-size:30px; }
	.sb02_txt > p{ font-size:15px; }
}

#sb03{ padding:0 20px 150px; }

.sb03_ptwrap{ display:flex; flex-flow:row wrap; background-color:#f9f9f9; box-shadow:4px 4px 8px 0 rgba(0,0,0,.2); border-radius:10px; overflow:hidden; }
.sb03_pt{ display:flex; }
.sb03_pt.lf{ width:55%; align-items:center; }
.sb03_pt.rt{ width:45%; }

.sb03_txt{ padding:60px 30px; word-break:keep-all; }
.sb03_txt > h3{ max-width:400px; width:100%; font-family:'wmp'; font-size:45px; color:#333; line-height:1.2em; margin-bottom:15px; }
.sb03_txt > h3 > span{ color:#54a7c1; }
.sb03_txt > p{ font-size:18px; font-weight:300; color:#333; line-height:1.5em; margin-bottom:30px; }
.sb03_txt > a{ position:relative; z-index:1; display:inline-block; padding:15px 0 15px 45px; font-size:20px; font-weight:400; color:#333; line-height:0; }
.sb03_txt > a:before{ content:"\f067"; position:absolute; z-index:1; top:0;	left:0; padding:15px 8px; display:block; font-family:'Line Awesome Free'; font-weight:900; font-size:14px; color:#fff; line-height:0; background-color:#333; border-radius:100%; }
.sb03_txt > a:hover:before{ background-color:#34a0ff; color:#fff; }

#sb03_sli{ width:100%; }
.sb03_sli{ height:auto; display:flex; }
.sb03_sli{
	background:-webkit-linear-gradient(135deg, #f9f9f9 0%, #ddd 100%);
	background:-moz-linear-gradient(135deg, #f9f9f9 0%, #ddd 100%);
	background:linear-gradient(135deg, #f9f9f9 0%, #ddd 100%);
}
.sb03_sli > div{ width:100%; padding-top:max(105%, 450px); background-position:center; background-size:cover; background-repeat:no-repeat; }

.sb03_sli > div.sli01{ background-image:url(./img/03-01.png); }
.sb03_sli > div.sli02{ background-image:url(./img/03-02.png); }
.sb03_sli > div.sli03{ background-image:url(./img/03-03.png); }
.sb03_sli > div.sli04{ background-image:url(./img/03-04.png); }
.sb03_sli > div.sli05{ background-image:url(./img/03-05.png); }

@media(max-width:900px){
	.sb03_txt > h3{ font-size:35px; }
	.sb03_txt > p{ font-size:16px; }
}
@media(max-width:800px){
	.sb03_pt.lf{ width:100%; }
	.sb03_pt.rt{ width:100%; order:-1; }
	.sb03_sli > div{ padding-top:max(85%, 300px); }
}
@media(max-width:600px){
	#sb03{ padding:0 15px 150px; }

	.sb03_txt{ padding:40px 15px; }
	.sb03_txt > h3{ font-size:30px; }
	.sb03_txt > p{ font-size:15px; }
	.sb03_txt > a{ font-size:16px; }
}