@charset "UTF-8";
/* CSS Document */
body{
min-width:1200px;
}

.contents{
max-width:1600px;
min-width:1200px;
margin-left:auto;
margin-right:auto;
margin-top:-4px;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "YuGothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
text-align:left;
}

.contents p,
.contents h2,
.contents h3,
.contents h4{
margin:0px;
}
.contents ul,
.contents li{
margin:0px;
padding:0px;
list-style:none;
}
.contents a img{
border:none;
}
.footerBox{
margin-top:0px;
}

#pageTop{
padding:0px 10px 10px;
background-color:#00a3d9;
position:fixed;
bottom:40px;
right:0px;
cursor:pointer;
color:#FFF;
font-weight:bold;
line-height:1.2em;
text-align:center;
z-index:300;
}
#pageTop i{
display:block;
font-size:24px;
line-height:1.2em;
}
#pageTop span{
font-family: 'Open Sans', sans-serif;
font-size:14px;
}

/* main */
.main{
max-width:1600px;
height:750px;
margin:0 auto;
text-align:center;
background-size: cover;
position:relative;
overflow:hidden;
}
.ie .main{
width:1200px;
}
.mainBox{
background-image:url(/common/new_images/navi_bg01.png);
background-repeat:repeat-x;
position:absolute;
top:0;
width:100%;
z-index:10;
}
.footstepBox{
max-width:1000px;
margin-left:auto;
margin-right:auto;
}
.main .img{
width:100%;
position:absolute;
bottom:0;
}
.main .img img{
width:100%;
height:auto;
}
.main .txt{
width:100%;
min-width:1200px;
position:absolute;
top:0;
}
.main .txtBox{
margin-top:146px;
margin-left:auto;
margin-right:auto;
width:399px;
background:url(../images/alpha_bg02.png) repeat 0 0;
}

/* 共通 */
.layout{
}
.ttlBox{
text-align:center;
}
.ttlBox h3{
font-size:20px;
line-height:1.2em;
margin-bottom:20px;
}
.ttlBox h3 strong{
display:block;
font-family: 'Open Sans', sans-serif;
font-size:56px;
line-height:1.2em;
}
.ttlBox p{
font-size:17px;
line-height:1.4em;
}

.ttl{
padding:20px 0 10px 0;
font-size:32px;
line-height:120%;
color:#12325B;
text-align:center;
font-weight:bold;
}
.lead{
font-size:22px;
line-height:120%;
text-align:center;
font-weight:bold;
}

#catch{
margin:0 auto;
padding:100px 0;
max-width:1600px;
background:url(../images/catch_bg01.jpg) no-repeat 50% 50%;
background-size:cover;
position:relative;
}
#catch dl{
margin:0 auto;
width:760px;
}
#catch dl:after{
content:"";
display:block;
clear:both;
}
#catch dt{
margin:0;
width:220px;
display: table-cell;
vertical-align:middle;
}
#catch dd{
margin:0;
padding:0 0 0 45px;
width:495px;
display: table-cell;
font-size:40px;
line-height:140%;
color:#12325B;
vertical-align:middle;
}

#feat{
margin:0 auto;
padding:30px 0 60px 0;
max-width:1600px;
background:#F8F7F4;
}
#feat .feat01,
#feat .feat02,
#feat .feat03,
#feat .feat04{
margin:0 auto;
padding:30px 0 0 0;
width:920px;
}
#feat .feat01:after,
#feat .feat02:after,
#feat .feat03:after,
#feat .feat04:after{
content:"";
display:block;
clear:both;
}
#feat .feat01 .img{
margin:0;
width:480px;
float:left;
}
#feat .feat01 dl{
margin:0;
width:410px;
float:right;
}

#feat .feat02 .img,
#feat .feat03 .img,
#feat .feat04 .img{
margin:0;
width:360px;
float:left;
}
#feat .feat02 dl,
#feat .feat03 dl,
#feat .feat04 dl{
margin:0;
width:530px;
float:right;
}
#feat dt{
font-size:28px;
line-height:140%;
color:#2CA5E3;
font-weight:bold;
}
#feat dt span.num{
display:table-cell;
width:3.0em;
height:3.0em;
text-align:center;
border:solid 1px #2CA5E3;
vertical-align:middle;
font-family: 'Roboto', sans-serif;
}
#feat dt span.txt{
padding:0 0 0 20px;
display:table-cell;
height:3.0em;
vertical-align:middle;
}
#feat dd{
margin:30px 0 0 0;
padding:0;
font-size:16px;
line-height:160%;
}

#point{
margin:0 auto;
padding:30px 140px 60px 140px;
max-width:1600px;
background:url(../images/point_bg01.jpg) no-repeat 50% 50%;
background-size:cover;
}
#point .inner{
width:920px;
margin:0 auto;
}
#point .ttl{
font-size:40px;
line-height:140%;
text-align:left;
}
#point .list{
margin:30px 0 0 0;
padding:7px 0 0 0;
width:660px;
background:url(../images/alpha_bg01.png) no-repeat 0 0;
border-radius:10px;
}
#point ul{
padding:0 0 7px 0;
background:url(../images/alpha_bg03.png) no-repeat 0 100%;
}
#point li{
padding:0 35px 20px 35px;
background:url(../images/alpha_bg02.png) repeat 0 0;
}
#point dl{
margin:0;
padding:20px 0 0 125px;
min-height:106px;
}
#point .point01 dl{
background:url(../images/point_icon01.png) no-repeat 0 50%;
}
#point .point02 dl{
background:url(../images/point_icon02.png) no-repeat 0 50%;
}
#point .point03 dl{
background:url(../images/point_icon03.png) no-repeat 0 50%;
}
#point .point04 dl{
background:url(../images/point_icon04.png) no-repeat 0 50%;
}
#point dt{
margin:0;
padding:0 0 10px 0;
font-size:20px;
line-height:140%;
color:#2CA5E3;
font-weight:bold;
}
#point dd{
margin:5px 0 0 0;
padding:0 0 0 12px;
font-size:15px;
line-height:160%;
background:url(../images/point_mark01.png) no-repeat 0 0.5em;
}

#case{
margin:0 auto;
max-width:1600px;
background:#82826F;
padding:30px 0 60px 0;
color:#fff;
}
#case .ttl{
color:#fff;
}
#case .list{
margin:0 auto;
width:880px;
padding:30px 0 0 0;
}
#case .list:after{
content:"";
display:block;
clear:both;
}
#case .list li{
margin:0;
padding:10px;
float:left;
font-size:1px;
line:height:100%;
}
#case .list li img{
vertical-align:bottom;
}
#case .btn{
margin:0 auto;
padding:20px 0 0 0;
width:34.0em;
font-size:20px;
}
#case .btn:after{
content:"";
display:block;
clear:both;
}
#case .btn li{
margin:0;
padding:10px 0 0 0;
float:left;
color:#fff;
width:17.0em;
}
#case .btn li a{
margin:0 10px;
padding:20px 0;
display:block;
color:#fff;
text-align:center;
}
#case .btn li.btn01 a{
background:#444;
text-decoration:none;
}
#case .btn li.btn02 a{
background:#38A1E9;
text-decoration:none;
}

#plan{
margin:0 auto;
padding:30px 0 30px 0;
max-width:1600px;
background:#F8F7F4;
}
#plan ul{
margin:0 auto;
padding:30px 0 0 0;
width:1000px;
}
#plan ul:after{
content:"";
display:block;
clear:both;
}
#plan li{
margin:0;
padding:0 0 30px 0;
float:left;
color:#666;
}
#plan li.plan01,
#plan li.plan03{
width:470px;
}
#plan li.plan02,
#plan li.plan04{
width:530px;
}
#plan dt{
margin:20px 0 5px 0;
padding:0;
font-weight:bold;
font-size:140%;
}
#plan dd{
margin:0;
padding:0;
}

#step{
margin:0 auto;
padding:30px 0 60px 0;
max-width:1600px;
text-align:center;
}
#step .img{
padding:30px 0 0 0;
}

#pageInfo{
border-top:solid 4px #162E5E;
margin:0 auto;
padding:30px 0 60px 0;
max-width:1600px;
}
#pageInfo ul{
margin:0 auto;
width:960px;
list-style:none;
}
#pageInfo ul:after{
content:"";
display:block;
clear:both;
}
#pageInfo ul li{
margin:20px 0 0 0;
padding:0 10px;
float:left;
}
#pageInfo ul li.info01{
width:940px;
}
#pageInfo ul li.info01 .inner{
width:910px;
height:195px;
padding:25px 0 0 30px;
background:#12325b url(../images/info01_bg.jpg) no-repeat 100% 50%;
background-size:100% auto;
position:relative;
}

#pageInfo ul li.info01 .inner .copy{
padding:0;
text-align:left;
font-size:20px;
line-height:140%;
color:#fff;
}
#pageInfo ul li.info01 .inner .img{
display:none;
}
#pageInfo ul li.info01 .inner .link a{
margin:35px 0 0 0;
font-size:15px;
padding:15px 0;
width:18.5em;
display:inline-block;
background:#38A1E9;
text-decoration:none;
text-align:center;
color:#fff;
}


#pageInfo ul li.info02{
width:620px;
height:300px;
}
#pageInfo ul li.info02 .inner{
width:590px;
height:300px;
padding:0 0 0 30px;
background:url(../images/info02.jpg) no-repeat 50% 0;
}

#pageInfo ul li.info02 .inner strong{
padding:60px 0 0 0;
display:block;
font-family: 'Roboto', sans-serif;
font-size:60px;
color:#000;
line-height:1em;
text-align:left;
}
#pageInfo ul li.info02 .inner .copy{
padding:0;
text-align:left;
font-size:20px;
line-height:140%;
}
#pageInfo ul li.info02 .inner .link a{
margin:20px 0 0 0;
font-size:15px;
padding:15px 0;
width:13.0em;
display:inline-block;
background:#38A1E9;
text-decoration:none;
text-align:center;
color:#fff;
}
#pageInfo ul li.info03{
width:300px;
}
#pageInfo ul li.info03 .inner{
width:294px;
height:294px;
border:solid 3px #172F5F;
text-align:center;
background:#EEE;
}
#pageInfo ul li.info03 .inner .copy{
padding:35px 0 0 180px;
height:101px;
background:#fff url(../images/info03.jpg) no-repeat 0 0;
text-align:left;
font-size:17px;
line-height:120%;
}
#pageInfo ul li.info03 .inner strong{
padding:25px 0 0 0;
display:block;
font-family: 'Roboto', sans-serif;
font-size:36px;
color:#000;
line-height:1em;
}
#pageInfo ul li.info03 .inner .time{
margin:5px 0 0 0;
}
#pageInfo ul li.info03 .inner .link a{
margin:15px auto 0 auto;
font-size:15px;
padding:15px 0;
width:16.0em;
display:inline-block;
background:#38A1E9;
text-decoration:none;
color:#fff;
}

#compare .inner{
width:1000px;
margin-left:auto;
margin-right:auto;
padding-top:35px;
padding-bottom:45px;
}
#compare .inner h4{
text-align:center;
font-size:24px;
line-height:1.2em;
margin-bottom:35px;
}
#compare .inner table{
width:100%;
border-top:solid 1px #0F315C;
border-right:solid 1px #0F315C;
text-align:center;
}
#compare .inner table th{
background-color:#0F315C;
border-left:solid 1px #FFF;
font-weight:normal;
vertical-align:middle;
font-size:14px;
color:#FFF;
line-height:1.2em;
padding:7px 0px 6px;
}
#compare .inner table th:first-child{
border-left:solid 1px #0F315C;
}
#compare .inner table td{
border-left:solid 1px #AAA;
border-bottom:solid 1px #AAA;
vertical-align:middle;
font-size:14px;
line-height:1.2em;
color:#333;
padding:7px 0px 6px;
}
#compare .inner table td.ms{
color:#0F315C;
}
#compare .inner table tr.even td{
background-color:#EEE;
}

@media screen and (max-width: 740px) {
body{
min-width:320px;
}
.contents{
width:100%;
min-width:320px;
}

/* main */
.footstepBox{
width:auto;
margin-left:15px;
margin-right:15px;
margin-bottom:50px;
}

/* 共通 */
.layout{
min-width:0;
}
.ttlBox h3{
font-size:14px;
margin-bottom:10px;
}
.ttlBox h3 strong{
font-size:32px;
}
.ttlBox p{
font-size:13px;
}

#compare{
margin-left:15px;
margin-right:15px;
}
#compare .inner{
width:auto;
padding-top:30px;
padding-bottom:30px;
}
#compare .inner h4{
font-size:20px;
margin-bottom:15px;
}
#compare .inner table th,
#compare .inner table td{
font-size:12px;
padding-left:2px;
padding-right:2px;
}

#pageTop{
bottom:0px;
}
#pageTop i{
font-size:20px;
line-height:1em;
}
#pageTop span{
font-size:10px;
}
#pageTop span br{
display:none;
}

.ttl{
font-size:17px;
}
.lead{
font-size:14px;
}
.main {
padding-bottom:50px;
background-size:100% auto;
background-position:0 0;
width:100%;
height:auto;
}
.main .img{
position:static;
}
.main .txt{
width:100%;
min-width:inherit;
position:static;
}
.main .txtBox{
margin-top:50px;
width:300px;
background:url(../images/alpha_bg02.png) repeat 0 0;
}
.main .txtBox img{
width:100%;
height:auto;
}


#catch{
padding:50px 0;
}
#catch dl{
width:100%;
text-align:center;
}
#catch dt{
margin:0 auto;
display:block;
width:36%;
max-width:220px;
}
#catch dt img{
width:100%;
height:auto;
}
#catch dd{
padding:10px 0 0 0;
display:block;
width:100%;
font-size:20px;
}
#feat{
width:100%;
padding:0 0 30px 0;
}
#feat .feat01,
#feat .feat02,
#feat .feat03,
#feat .feat04{
width:auto;
padding:0 10px;
}
#feat .feat01 .img,
#feat .feat02 .img,
#feat .feat03 .img,
#feat .feat04 .img{
margin:10px 0 0 0;
width:100%;
float:none;
}
#feat .feat01 .img img,
#feat .feat02 .img img,
#feat .feat03 .img img,
#feat .feat04 .img img{
width:100%;
height:auto;
}
#feat .feat01 dl,
#feat .feat02 dl,
#feat .feat03 dl,
#feat .feat04 dl{
margin:10px 0 0 0;
width:100%;
float:none;
}
#feat dt{
font-size:15px;
}
#feat dt span.txt{
padding:0 0 0 10px;
}
#feat dd{
margin:10px 0 0 0;
}

#point{
padding:0;
background:none;
}
#point .inner{
width:100%;
margin:0 auto;
}
#point .ttl{
font-size:17px;
padding:60px 10px;
background:url(../images/point_bg01.jpg) repeat 0 30%;
background-size: cover;
}
#point .list{
margin:0 auto;
width:100%;
padding:0;
}
#point .list ul{
background:none;
}
#point .list li{
margin:10px 0 0 0;
}

#case .list{
width:100%;
text-align:center;
}
#case .list li{
width:32%;
padding:0;
float:none;

display:inline-block;
}
#case .list li img{
margin:10px 0 0 0;
width:97%;
height:auto;
}
#case .btn{
font-size:15px;
}

#plan ul{
width:auto;
padding:0 10px;
}
#plan li.plan01,
#plan li.plan02,
#plan li.plan03,
#plan li.plan04{
width:100%;
}
#plan li.plan01 .img,
#plan li.plan02 .img,
#plan li.plan03 .img,
#plan li.plan04 .img{
	text-align:center;
}
#plan li.plan01 img,
#plan li.plan02 img,
#plan li.plan03 img,
#plan li.plan04 img{
max-width:100%;
height:auto;
}

#step{
width:auto;
padding-left:10px;
padding-right:10px;
}
#step img{
width:100%;
height:auto;
}

#pageInfo ul{
margin:10px 0 0 0;
width:auto;
padding:0 10px;
}
#pageInfo ul li{
margin:0;
padding:0;
}
#pageInfo ul li.info01{
width:100%;
}
#pageInfo ul li.info01 .inner{
width:auto;
background-size:85% auto;
}
#pageInfo ul li.info02{
display:table-cell;
float:none;
padding-right:10px;
max-width:365px;
min-width:300px;
vertical-align:top;
width:100%;
}
#pageInfo ul li.info02 .inner{
	width:auto;
}
#pageInfo ul li.info03{
display:table-cell;
float:none;
max-width:365px;
min-width:300px;
vertical-align:top;
width:100%;
}
#pageInfo ul li.info03 .inner{
width:auto;
}

}

@media screen and (max-width: 640px) {
#case .btn{
width:100%;
font-size:15px;
}
#case .btn li{
margin:0 auto;
padding:10px 0 0 0;
float:none;
}
#case .btn li a{
padding:10px 0;
}
#pageInfo ul li{
margin:10px 0 0 0;
padding:0;
float:none;
}
#pageInfo ul li.info01 .inner{
padding:20px 20px;
width:auto;
height:auto;
text-align:center;
background:#12325b;
}
#pageInfo ul li.info01 .inner .copy{
font-size:17px;
text-align:center;
}
#pageInfo ul li.info01 .inner .img{
padding:20px 0 0 0;
width:auto;
position:static;
display:block;
}
#pageInfo ul li.info01 .inner .img img{
width:100%;
height:auto;
}
#pageInfo ul li.info01 .inner .link a{
margin:20px auto 0 auto;
width:16.0em;
}
#pageInfo ul li.info02{
display:block;
padding-right:0;
width:100%;
max-width:100%;
}
#pageInfo ul li.info02 .inner{
text-align:center;
padding:0;
background:#eee;
}
#pageInfo ul li.info02 .inner strong{
padding:50px 0 0 20px;
background:#98D0F2 url(../images/info02.jpg) no-repeat 100% 0;
background-size:auto 100%;
height:95px;
font-size:40px;
}
#pageInfo ul li.info02 .inner .copy{
margin:20px 0 0 0;
text-align:center;
}
#pageInfo ul li.info02 .inner .link a{
margin:10px auto 0 auto;
width:16.0em;
}
#pageInfo ul li.info03{
display:block;
width:100%;
max-width:100%;
}
#pageInfo ul li.info03 .inner strong{
font-size:30px;
}

}

@media screen and (max-width: 540px) {
#compare .inner table th,
#compare .inner table td{
font-size:10px;
}

#point .list li{
padding:0;
background:none;
}
#point .point01 dl,
#point .point02 dl,
#point .point03 dl,
#point .point04 dl{
background:none;
padding:0 10px;
}
#point .point01 dt{
padding:10px 0 10px 70px;
background:url(../images/point_icon01.png) no-repeat 0 50%;
background-size:60px auto;
height:60px;
vertical-align:middle;
display:table-cell;
font-size:15px;
}
#point .point02 dt{
padding:10px 0 10px 70px;
background:url(../images/point_icon02.png) no-repeat 0 50%;
background-size:60px auto;
height:60px;
vertical-align:middle;
display:table-cell;
font-size:15px;
}
#point .point03 dt{
padding:10px 0 10px 70px;
background:url(../images/point_icon03.png) no-repeat 0 50%;
background-size:60px auto;
height:60px;
vertical-align:middle;
display:table-cell;
font-size:15px;
}
#point .point04 dt{
padding:10px 0 10px 70px;
background:url(../images/point_icon04.png) no-repeat 0 50%;
background-size:60px auto;
height:60px;
vertical-align:middle;
display:table-cell;
font-size:15px;
}

#case .list li{
width:100%;
padding:0;
}

}


#pageInfo ul li.info04{
width:640px;
}
#pageInfo ul li.info04 .inner img{
width:100%;
}
#pageInfo ul li.info05{
width:280px;
}
#pageInfo ul li.info05 .inner{
width:254px;
height:302px;
padding:0 10px;
border:solid 3px #172F5F;
text-align:center;
}
#pageInfo ul li.info05 .inner .tel .copy{
padding:10px 0 0 0;
font-weight:bold;
font-size:16px;
color:#005c97;
}
#pageInfo ul li.info05 .inner .line .copy{
margin:20px 0 0 0;
padding:20px 0 0 0;
border-top:solid 1px #ccc;
font-weight:bold;
font-size:14px;
}
#pageInfo ul li.info05 .inner strong{
padding:10px 0 0 0;
display:block;
font-family: 'Roboto', sans-serif;
font-size:30px;
color:#000;
line-height:1em;
}
#pageInfo ul li.info05 .inner .time{
padding:10px 0 0 0;
}
#pageInfo ul li.info05 .inner .line .txt{
padding:10px 0 0 0;
}
#pageInfo ul li.info05 .inner .tel .link a{
margin:10px auto 0 auto;
font-size:16px;
padding:10px 0;
width:100%;
display:inline-block;
background:#005c97;
text-decoration:none;
color:#fff;
font-weight:bold;
border-radius:5px;
}
#pageInfo ul li.info05 .inner .line .link a{
margin:10px auto 0 auto;
font-size:16px;
padding:8px 0;
width:100%;
display:inline-block;
background:#00c900;
text-decoration:none;
color:#fff;
font-weight:bold;
border-radius:5px;
}

@media screen and (max-width: 740px) {
#pageInfo ul li.info04{
width:100%;
}
#pageInfo ul li.info05{
margin:10px 0 0 0;
display:block;
width:100%;
max-width:100%;
}
#pageInfo ul li.info05 .inner{
width:auto;
}
#pageInfo ul li.info05 .inner strong{
font-size:30px;
}

}

.catalog-bnr {
  max-width: 940px;
  margin: auto;
}
.catalog-bnr a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	background: #00afdd;
	padding: 24px;
	color: #fff;
	font-weight: bold;
	transition: .3s cubic-bezier(.4, .4, 0, 1);
}
.catalog-bnr a .left h2 {
	margin-bottom: 12px;
	font-size: 24px;
	line-height: 1.2;
}
.catalog-bnr a .left p {
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
}
.catalog-bnr a .left p.note {
	font-size: 12px;
	font-weight: normal;
}
.catalog-bnr a .left .catalog_btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: fit-content;
	padding: 12px 24px;
	margin: 12px 0 4px;
	background: #003459;
	border-radius: 4px;
	font-size: 16px;
	line-height: 1.2;
}
.catalog-bnr a .left .catalog_btn span {
	position: relative;
	width: 7px;
	height: 7px;
	transition: .3s cubic-bezier(.4, .4, 0, 1);
}
.catalog-bnr a .left .catalog_btn span::after {
	content: '';
	position: absolute;
	width: 7px;
	height: 7px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	rotate: 45deg;
}
.catalog-bnr a .right img {
	width: 400px;
}
.catalog-bnr a:hover {
	filter: brightness(.8);
	text-decoration: none;
}
.catalog-bnr a:hover .left .catalog_btn span {
	translate: 3px 0;
}
@media screen and (max-width: 960px) {
	.catalog-bnr a {
		flex-direction: column;
		gap: 16px;
		padding: 24px;
	}
}
@media screen and (max-width: 767px) {
	#plan .catalog-bnr {
		padding: 0 10px;
	}
	.catalog-bnr a {
		padding: 16px;
	}
	.catalog-bnr a .left h2 {
		font-size: 18px;
	}
	.catalog-bnr a .left p {
		font-size: 14px;
		line-height: 1.3;
	}
	.catalog-bnr a .left .catalog_btn {
		justify-content: space-between;
		width: 100%;
		padding: 12px 16px;
	}
	.catalog-bnr a .right img {
		width: 100%;
	}
}