@charset "UTF-8";
html, body{width: 100%; height: 100%; margin: 0; padding: 0;}
*{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
html{ font-size:3vw;}
body{ background: #fff; font-family: 'Noto Sans CJK JP','NotoSansCJKjp','Noto Sans Japanese', 'Noto Sans JP', sans-serif; color:#333; -webkit-text-size-adjust: 100%; /*スマホで文字を拡大縮小させない*/ }

@media screen and (min-width:768px), print {
	html, body{min-width:1280px; margin: 0; padding: 0; width: 100%; height: 100%;}
	html{ font-size:62.5%;}
	body{ font-size:1.6rem; font-size:16px;}
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, author, time {display:block;}
i {font-style: italic !important;}
figure{margin:0;}
/*reset*/
html,body,dl,dt,dd,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; line-height: 1;}
ul,ol{ margin: 0; padding: 0; list-style:none; }
small{ font-size:100%; }
a{ color:#333; text-decoration:none; }
a:hover{ color:#878787; text-decoration:underline; }
a:visited{ color:#878787; text-decoration:none; }
img{ vertical-align:bottom; border:none; }
p {line-height: 1.6;}


.content{ background: #fff;}

@media screen and (min-width:768px), print {
	a img:hover{opacity: 0.6; filter: alpha(opacity=60); -moz-opacity: 0.6;}

}

.invisible { transition: opacity 0.5s ease; opacity: 0.0;}
.visible { transition: opacity 0.5s ease; opacity: 1.0;}
.pc{display: none !important;}
.sp{display: block;}
@media screen and (min-width:768px), print {
	.pc{display: block !important;}
	.sp{display: none !important;}
}

.mb1{margin-bottom: 1em !important;}
.mb2{margin-bottom: 2em !important;}

.clear:after { content: ""; clear: both; display: block;}
.fwB{font-weight:700;}


#wrapper{width: 100%;padding:  0; overflow: hidden;}
#wrapper:after { content: ""; clear: both; display: block;}
@media screen and (min-width:768px), print {
	#wrapper{width: 100%;　padding: 0;}
}


header{width: 100%; padding: 3% 2% 2%; z-index: 5000; position: fixed !important; top: 0; left: 0; background:rgba(255, 255, 255, 0.6) }
header:after { content: ""; clear: both; display: block;}
header > div{ width: 100%; float: left;}
header > div h1{width: 50%; float: left;}
header > div h1 img{width: 100%; height: auto;}
header > div .contact a{ padding: .5em 1em; color: #fff; background: #004aa0; float: right; text-decoration: none;}
@media screen and (min-width:768px), print {
	header{width: 100%; height: 80px; padding: 0; }
	header > div{width: 1000px !important; height: 80px; margin: 0 auto !important; padding: 14px 0 0; float: none;}
	header > div h1{width: 259px;}
	header > div h1 img{width: 100%; height: auto;}
	header > div .contact a:hover{opacity: 0.6; filter: alpha(opacity=60); -moz-opacity: 0.6;}
}


#top > div { margin: 5% 0 0;}
#top > div img{width: 100%; height: auto;}
section{ width: 100%; padding: 0 5%;}
@media screen and (min-width:768px), print {
	#top > div { width: 1000px; margin: 150px auto 0;}
	section{ width: 1000px; margin: 0 auto; padding: 0; z-index: -1;}
}

.btn { margin: 0 0 12%; text-align: center;}
.btn a{ padding: 1.5em 3em; margin: 0 auto; font-size: 4.5vw; border-radius: 90px; display: inline-block; text-decoration: none; color: #EB7C00; font-weight: 700; background: #FFF; border: 3px solid #EB7C00;}
.btn a:hover{ background:#EB7C00; color: #fff; -webkit-transition: 0.1s ease-in-out; -moz-transition: 0.1s ease-in-out; -o-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;}
@media screen and (min-width:768px), print {
	.btn { margin: 0 0 80px; }
	.btn a{ font-size: 3rem;}
}

.btn02 li { width: 100%; margin: 0 0 3%; text-align: center;}
.btn02 li a{ width: 70%; padding: 1em; margin: 0 auto; font-size: 3.5vw; border-radius: 10px; display: block; text-decoration: none; color: #47ad52; font-weight: 700; background: #FFF; border: 3px solid #47ad52; }
.btn02 a:hover{ background:#47ad52; color: #fff; -webkit-transition: 0.1s ease-in-out; -moz-transition: 0.1s ease-in-out; -o-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;}
@media screen and (min-width:768px), print {
	.btn02{ width: 640px; margin: 0 auto; }
	.btn02:after { content: ""; clear: both; display: block;}
	.btn02 li { width: 300px; float: left; }
	.btn02 li a{ width: 100% !important; font-size: 2rem;}
	.btn02 li:first-of-type{ margin: 0 40px 0 0; }
}

#tokutyo{ padding: 120px 0; background: #efefef;}
#tokutyo .lead{ margin: 0 0 60px; text-align: center; font-weight: 700;}
#tokutyo h2{ margin: 0 0 40px; text-align: center;}
#tokutyo h3{ margin: 0 0 .4em; color: #004aa0; font-weight: 700; line-height: 1.3; font-size: 4vw;}
#tokutyo h3 span{ margin: 0 0 .2em; padding: .2em .8em .3em; background:#004aa0;  color: #fff; font-weight: 700; display: inline-block; line-height: 1; font-size: 2vw;}
.num01 h3, .num04 h3, .num05 h3{ padding: 0 0 0 2.3em;}
.num02 h3, .num03 h3{ height: 2.3em; padding: .5em 0 0 2.3em;}
.num01 h3{background: url("no01.jpg") no-repeat; background-size: contain;}
.num02 h3{background: url("no02.jpg") no-repeat; background-size: contain; }
.num03 h3{background: url("no03.jpg") no-repeat; background-size: contain; }
.num04 h3{background: url("no04.jpg") no-repeat; background-size: contain;}
.num05 h3{background: url("no05.jpg") no-repeat; background-size: contain;}
@media screen and (min-width:768px), print {
	#tokutyo .lead{ width: 620px; margin: 0 auto 60px; font-size: 1.6rem;}
	#tokutyo h3{ margin: 0 0 20px; font-size: 1.8rem;}
	#tokutyo h3 span{font-size: 1.2rem;}
	#tokutyo p{ font-size: 1.3rem;}
}



.tokutyo01{margin: 0;}
.tokutyo01:after { content: ""; clear: both; display: block;}
.tokutyo02:after { content: ""; clear: both; display: block;}
.tokutyo01 > div, .tokutyo02 > div{ width: 100%; margin: 0 0 1em; padding: 1.5em; float: left; background: #fff; }
@media screen and (min-width:768px), print {
	.tokutyo01 > div, .tokutyo02 > div{ margin: 0 20px 20px 0; padding: 20px; }
	.tokutyo01 > div:last-of-type, .tokutyo02 > div:last-of-type{ margin: 0 0 20px;  }
	.tokutyo01 > div { width: 320px; height: 210px;}
	.tokutyo02 > div { width: 490px; height: 190px;}
}


#point{padding: 5em 0 2em;}
#point:after { content: ""; clear: both; display: block;}
#point section{ padding: 0 5% 4em; }
#point section:after { content: ""; clear: both; display: block;}
#point .midashi{ margin: 0 0 .5em; font-size: 5.5vw; font-weight: 700; color: #004aa0; line-height: 1.1;}
@media screen and (min-width:768px), print {
	#point{padding: 0 0 130px;}
	#point .midashi{ margin: 0 0 1em; font-size: 3.0rem; }
	#point section{ padding: 130px 0 0; }
}


.point_img { margin: 0 0 20px;}
.point_img img{ width: 100%; height: auto;}
@media screen and (min-width:768px), print {
	.point_img { width: 500px;}	
	.point_img01 .point_img{ float: left; margin: 0 45px 0 0; padding: 0; }
	.point_img02 .point_img{ float: right; margin: 0 0 40px 45px;}
}

.jirei > div{margin: 0 0 2em; padding: 1.5em; background:#c1eaff; border-radius: 3px;}
.jirei .label{ margin: 0 0 .3em; padding: .6em; font-weight: 700; background:#004aa0 ; color: #fff; line-height: 1; display: inline-block;}
@media screen and (min-width:768px), print {
	.jirei > div{ width: 485px; height: 310px; margin: 0 !important; float: left;}	
	.jirei > div:first-of-type{margin: 0 30px 0 0 !important;}
}

#comparison{padding: 5em 0 6em; background:#004aa0; color: #fff; }
#comparison:after { content: ""; clear: both; display: block;}
#comparison .midashi{ margin: 0 0 1.2em; padding: 0.5em 1em; background:#fff; color: #004aa0; border-radius: 90px; font-size: 3.6vw; text-align: center; line-height: 1;}
#comparison table{ border-collapse: collapse;}
#comparison table th, #comparison table td{ border: 1px solid #000; font-size: 2.5vw;}
#comparison table th.th01_01, #comparison table th.th01_02{ padding: 1em; white-space: nowrap; }
#comparison table th.th01_01{background:#aaa; color: #000; }
#comparison table th.th01_02{background:#11C0FF ; color: #000; }
#comparison table th.th02{ width: 8em; padding: .5em; background: #eee; color: #000;  }
#comparison table td{ padding: .8em; background: #fff; color: #000; }
@media screen and (min-width:768px), print {
	#comparison{padding: 130px 0 160px;}
	#comparison .midashi{ margin: 0 0 1em; padding: 0.6em 1em; font-size: 2.4rem;}
	#comparison table th, #comparison table td{ font-size: 1.6rem; line-height: 1.5;}
	#comparison table th.th02{ width: auto; padding: 1em;} 
	#comparison table td{ padding: 2em;}	
	
}


#iso {padding: 5em 0 6em}
#iso section > div { padding: 2em; border: 1px solid #004aa0;}
#iso h2{ margin: 0 0 1em; text-align: center; font-weight: 700; font-size: 5vw; color: #004aa0;}
#iso h3{margin: 0 0 1em;}
#iso #iso_img{ text-align:center; margin: 0 0 2em}


@media screen and (min-width:768px), print {
	#iso{ padding: 100px 0 100px;}
	#iso section > div {width: 850px; margin: 0 auto; padding: 50px;}
	#iso h2{ margin: 0 0 50px; font-size: 3rem; }
	#iso #iso_img{ float: right;}
	#iso #iso_txt{ width: 470px; margin: 0;}
	
}


footer{width: 100%; padding: 10% 5% 7%; background: #fff; border-top: 1px solid #004aa0;}
footer:after{ content: ""; clear: both; display: block;}
footer > div:after { content: ""; clear: both; display: block;}
address{ margin: 40px 0 0; font-style: normal; color: #000; font-size: 1.3rem; line-height: 1.4;}
address:after{ content: ""; clear: both; display: block;}



@media screen and (min-width:768px), print {
	footer{width: 100%; padding: 60px 0 30px;}
	footer > div{width: 1000px; margin: 0 auto;}
	address{width: 1000px; margin: 0 auto; padding: 20px 0 0; text-align: right;}
}


.t_txt01, .t_txt02{font-weight: 700; line-height: 1;}
.t_txt01{ margin: 0 0 20px; color: #004aa0; font-size: 7vw;}
.t_txt02{ margin: 0 0 5px;  font-size: 4vw;}
@media screen and (min-width:768px), print {
	.t_txt01{ margin: 0 0 20px; font-size: 3rem;}
	.t_txt02{ margin: 0 0 8px; font-size: 1.5rem;}
}

@media screen and (min-width:768px), print {
	.tanaka{width: 400px; float: left;}
}


#pagetop{ display: none}
@media screen and (min-width:768px), print {
	#pagetop{display: block;}	
	#pagetop a { width: 60px; height: 60px; position: fixed; bottom: 30px; right: 30px; z-index: 5000 !important; display: block;}	
}