@charset "utf-8";

/*デバイス出し分け*/
@media screen and (max-width : 767px) {
.sp{display: block;}
.pc{display: none;}
}
@media screen and (min-width : 768px) {
.sp{display: none;}
.pc{display: block;}
}

/*SPのみ電話*/
@media screen and (min-width: 768px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

/*All*/

* {
	margin: 0;
	padding: 0;
	color: #333;
	line-height: 1.5;
	box-sizing: border-box;
	word-break: break-all;
	list-style-type: none;
	font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo", "ＭＳ Ｐゴシック",sans-serif;
}
a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
img{
	width: 100%;
}
.innerOver{overflow: hidden;}
.innerFlexW{display: flex;flex-wrap: wrap;}
.innerFlexN{display: flex;flex-wrap: nowrap;}
.mincho{font-family: "Sawarabi Mincho";}

/*SP----------------------------------------------------------*/
header{
	width: 100%;
	padding: .5rem .5rem .1rem .5rem;
}
header a img{
	width: 50%;
}

/*prize*/
.cv .prize,
.cv .prize2{
	padding: 1rem .5rem 0;
}
.cv .prize li,
.cv .prize2 li{
	padding: 0 .5rem;
	border-right: 1px solid #ccc;
}
.cv .prize li:first-child,
.cv .prize2 li:first-child{
	padding-left: 0;
}
.cv .prize li:last-child,
.cv .prize2 li:last-child{
	padding-right: 0;
	border-right: none;
}

/*btn*/
.cv .btn{
	padding: .5rem 1rem 0;
}
.cv .btn li{
	margin-right: .5rem;
}
.cv .btn li:last-child{
	margin-right: 0;
}

/*term*/
.cv .term{
	margin-top: .5rem;
	padding: 1rem;
	background-color: #dddddd;
	align-items: flex-start;
}
.cv .term .term01{
	width: 100%;
}
.cv .term .term02,
.cv .term .term03{
	width: 48%;
	margin-top: .5rem;
}
.cv .term .term02{
	margin-right: .5rem;
}

/*staging*/
.staging{
	padding: 3.5rem 2rem;
	background-image: url("image/staging.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.staging p{
	padding: 1rem 1.5rem;
	color: #01033c;
	font-weight: bolder;
	font-size: .8rem;
	background:rgba(255,255,255,0.8);
	font-family: 'Noto Sans JP', sans-serif;
}

/*frame*/
.frame{
	padding: 3rem 1.5rem;
	background-image: url("image/frame.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.frame h2{
	width: 80%;
}
.frame .read{
	margin-top: .5rem;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: .9rem;
}
/*frame > box*/
.frame .box li{
	margin-top: 2rem;
	padding: 2rem .8rem 1.5rem;
	box-shadow:3px 3px 5px 2px rgb(0 0 0 / 50%);
	background-color: #fff;
}
.frame .box li h3{
	width: 60%;
	margin: -3rem auto 0;
}
.frame .box li p{
	font-size: .8rem;
	font-weight: 700;
}

/*graph*/
.graph{
	background-color: #01033c;
}
.graph .inner{
	margin: 0 1.5rem;
	padding-top: 2rem;
	background-color: #fff;
}
.graph .inner h2{
	color: #01033c;
	text-align: center;
	font-size: .8rem;
	font-family: 'Noto Sans JP', sans-serif;
}
.graph .inner h2 span{
	color: #01033c;
	font-size: 1rem;
	font-family: 'Noto Sans JP', sans-serif;
}
.graph .inner img{
	width: 90%;
	margin: 1.5rem 1rem;
}

/*relief*/
.relief{
	padding-bottom: 2rem;
	background-color: #01033c;
}
.relief .inner{
	margin: 0 1.5rem;
	background-color: #fff;
}
.relief .inner h2{
	color: #01033c;
	text-align: center;
	font-size: .8rem;
	font-family: 'Noto Sans JP', sans-serif;
}
.relief .inner h2 span{
	color: #01033c;
	font-size: 1rem;
	font-family: 'Noto Sans JP', sans-serif;
}

/*relief　＞　さらに*/
.relief .read{
	width: 45vw;
	margin: auto;
	font-family: 'Noto Sans JP', sans-serif;
	flex-wrap: nowrap;
	justify-content: center;
	font-size: 1rem;
	display: flex;
}
.relief .read span{
	font-family: 'Noto Sans JP', sans-serif;
	background: linear-gradient(45deg, transparent, transparent 49%, black 49%, black 60%, transparent 51%, transparent);
	display: block;
}
.relief .read span:last-child{
	font-family: 'Noto Sans JP', sans-serif;
	background: linear-gradient(45deg, transparent, transparent 49%, black 49%, black 60%, transparent 51%, transparent);
	transform: scale(-1, 1);
	display: block;
}

.relief .sun,
.relief .water,
.relief .air{
	margin: 1.5rem 1rem;
	padding: 0 1rem;
	border: 2px solid #527585;
	position: relative;
}
.relief .sun .pr,
.relief .water .pr,
.relief .air .pr{
	position: absolute;
	top: -10px;
	left: 0;
	width: 4rem;
	border: none;
}
.relief .sun li,
.relief .water li,
.relief .air li{
	border-bottom: 1px solid #ccc;
	padding-bottom: 1rem;
}
.relief .sun li:last-child,
.relief .water li:last-child,
.relief .air li:last-child{
	border-bottom: none;
	padding-bottom: 1rem;
}
.relief li h3{
	margin-top: 2rem;
	color: #527585;
	text-align: center;
	font-size: 1.1rem;
	font-family: "Sawarabi Mincho";
}
.relief li img{
	margin-top: .5rem;
}
.relief li p{
	margin-top: .5rem;
	font-size: .8rem;
	text-align: justify;
}

/*plan*/
.plan {
	padding: 2rem 1rem;
}
.plan h2{
	width: 40%;
}
.plan .read{
	margin-top: .5rem;
	font-family:"Sawarabi Mincho", serif;
	font-weight: bold;
	font-size: 1rem;
}
.plan .read span{
	font-size: 1.3rem;
	font-family:"Sawarabi Mincho", serif;
}

/*カルーセル*/
.swiper-container {
	max-width: 100%;
	margin-top: 2rem;
}
.swiper-container .swiper-wrapper .swiper-slide h3,
.swiper-container .swiper-wrapper .swiper-slide h3 span{
	font-family:"Sawarabi Mincho", serif;
}
.swiper-container .swiper-wrapper .swiper-slide h3{
	color: #01033c;
	line-height: 2;
	font-size: 1.1rem;
}
.swiper-container .swiper-wrapper .swiper-slide h3 span{
	margin-right: .5rem;
	padding: .5rem 1rem;
	color: #fff;
	background-color: #01033c;
}
.swiper-container .swiper-wrapper .swiper-slide img{
	margin-top: 1rem;
}
.swiper-container .swiper-wrapper .swiper-slide p{
	font-size: .7rem;
}

/*system*/
.system{
	padding: 2rem 0;
	background-color: #d4effa;
}
.system .title h2{
	width: 40%;
	margin: auto;
}
.system .title .read{
	font-family:"Sawarabi Mincho", serif;
	font-weight: bold;
	text-align: center;
}
.system .title .read span{
	font-family:"Sawarabi Mincho", serif;
	color: #005eb2;
}
.system ul{
	margin-top: 2rem;	
}
.system ul li h3{
	margin-top: 2rem;
	padding: .5rem .2rem .5rem;
	background-image: url("image/systemH3Bg.png");
	background-repeat: no-repeat;
	background-size: contain;
	font-size: .9rem;
	font-family:"Sawarabi Mincho", serif;
	letter-spacing: -1px;
}
.system ul li h3 span{
	font-family:"Sawarabi Mincho", serif;
	color: #005eb2;
}
.system ul li img{
	margin-top: .5rem;
}
.system ul li .right{
	margin: .5rem;
}
.system ul li .right h4{
	color: #0060b7;
	font-weight: bold;
}
.system ul li .right p{
	margin-top: .5rem;
	font-weight: bold;
	font-size: .8rem;
}
.system ul li p.small{
	font-size: .7rem;
	padding: .5rem;
}

/*warranty*/
.warranty{
	text-align: center;
	padding: .5rem 1rem;
}
.warranty .logo{
	width: 80%;
	margin: 5% auto;
}
.warranty p{
	margin-bottom: 5%;
	font-size: 100%;
	line-height: 1.5;
	font-family: "Sawarabi Mincho";
}
.warranty .waku{
	margin: .5rem 1.5rem;
	padding: .3rem ;
	border: 2px solid #000;
	font-size: 170%;
	letter-spacing: 2px;
	font-family: "Sawarabi Mincho";
}

/*gaiyo*/
.gaiyo{
	padding: 1rem .5rem .5rem;
	background-color: #eeeeee;
}
.gaiyo h2{
	font-weight: bold;
	font-size: 1.2rem;
}
.gaiyo p,
.gaiyo p a{
	margin-top: .5rem;
	font-size: .8rem;
	text-align: justify;
}

/*fixedBtn*/
.fixedBtn{
	display: block;
	position: fixed;
	left: 0;
	bottom: -.4rem;
	background-color: #01033c;
	background-color: #fff;
	z-index: 1;
}
.fixedBtn ul{
	display: flex;
	flex-wrap: nowrap;
}
.fixedBtn ul li{
/*	height: 2.8rem;*/
	width : 33.3333% ;
	width : -webkit-calc(100% / 3) ;
	width : calc(100% / 3) ;
}

/*footer*/
footer{
	padding: .5rem .5rem 3.5rem;
	font-size: .6rem;
	text-align: center;
}






/*TB----------------------------------------------------------*/
@media screen and (min-width : 768px) {
.left{float: left;}
.right{float: right;}

header{
	padding: .8rem .8rem .3rem;
}
header a img{
	width: 30%;
}
.cv .prize,
.cv .prize2{
	padding: 1.5rem 1rem 0;
}
.cv .btn{
	padding: 1.5rem 2rem .5rem;
}
.cv .btn li{
	margin-right: 1rem;
}
.cv .term{
	padding: 1rem 0 .5rem;
}
.cv .term .term02{
	margin-right: 1rem;
}
.prize2{display: none;}
.staging{
	padding: 7rem 2rem;
}
.staging p{
	width: 62%;
	font-size: 1.5rem;
}
.frame{
	padding: 4rem 2rem 6rem;
}
.frame h2{
	width: 30%;
}
.frame .read{
	font-size: 1.5rem;
}
.frame .box{
	display: flex;
	flex-wrap: wrap;
}
.frame .box li{
	width: 47%;
	margin: 3rem 2rem 0 0;
}
.frame .box li:nth-child(even){
	width: 47%;
	margin: 3rem 0 0;
}
.graph .inner{
	margin: 0 5rem;
}
.graph .inner h2{
	font-size: 1.5rem;
}
.graph .inner h2 span{
	font-size: 2rem;
}
.relief{
	padding-bottom: 0;
}
.relief .inner{
	margin: 0 5rem;
	padding: 3rem 0;
}
.relief .inner h2{
	font-size: 1.5rem;
}
.relief .inner h2 span{
	font-size: 2rem;
}
.relief .read{
	font-size: 2rem;
}
.plan h2{
	width: 30%;
}
.plan .read{
	font-size: 1.5rem;
}
.plan .read span{
	font-size: 2rem;
}
.swiper-container{
	display: none;
}
.system .title{
	display: flex;
	flex-wrap: nowrap;
}
.system .title h2{
	width: 15%;
	margin-left: auto;
	margin-right: 0;
}
.system .title .read{
	width: 77%;
	padding: 2rem 0;
	font-size: 1.4rem;
}
.system ul li h3{
	padding: 1rem 1rem 1.5rem;
	font-size: 1.7rem;
}
.system ul li .innerOver .left{
	width: 40%;
}
.system ul li .innerOver .right{
	width: 56%;
}
.system ul li .innerOver .right img{
	width: 80%;
	margin: 1rem auto;
	display: block;
}
.warranty .left{
	width: 50%;
	margin-top: 2rem;
}
.warranty .right{
	width: 50%;
}
.fixedBtn{
	display: none!important;
}
footer{
	padding: .5rem .5rem .5rem;
	font-size: 1rem;
}

}



/*PC----------------------------------------------------------*/
@media screen and (min-width : 1080px) {
header{
	width: 1080px;
	padding: 1% 0;
	margin: auto;
}
header img{
	width: 25%;
	margin: 0;
}
.mv{
	background-color: #01033c;
}
.mv h1{
	max-width: 1080px;
	margin: auto;
}
.cv{
	background-color: #01033c;
}
.cv ol{
	max-width: 1080px;
	margin: auto;
	background-color: #fff;
}
.cv .btn{
	padding: 0 2rem 0;
	background-color: #01033c;
}
.cv .btn ul{
	max-width: 1080px;
	margin: 0rem auto;
	padding: 2rem 7rem 2rem 7rem;
	background-color: #fff;
}
.cv .btn li{
	width: 45%;
	margin: auto;
}
.cv .btn li:last-child{
	margin-right: auto;
}
.cv .term{
	margin-top: 0;
	padding: 1rem 0rem 0;
}
.cv .term .term01{
	width: 40%;
	margin-right: 1rem;
}
.cv .term .term02{
	width: 30%;
	margin-right: 1rem;
}
.cv .term .term03{
	width: 30%;
	margin-right: 0;
}
.cv .term .pc{
	max-width: 1080px;
	margin: auto;
}
.staging{
	padding: 10rem 2rem;
}
.staging .inner{
	max-width: 1080px;
	margin: auto;
}
.staging p{
	font-size: 2rem;
	width: 600px;
	padding: 2.5rem;
}
.frame{
	padding: 6rem 0 9rem;
}
.frame h2{
	width: 1080px;
	margin: auto;
}
.frame h2 img{
	width: 30%;
}
.frame .read{
	width: 1080px;
	margin: auto;
}
.frame .box{
	max-width: 1080px;
	margin: auto;
}
.frame .box li{
	width: 45%;
	margin: 3rem 5rem 0 0;
}
.graph .inner{
	max-width: 1080px;
	margin: auto;
	padding-top: 5rem;
}
.graph .inner h2{
	font-size: 2rem;
}
.graph .inner h2 span{
	font-size: 2.8rem;
}
.relief .inner{
	max-width: 1080px;
	margin: auto;
}
.relief .inner h2{
	font-size: 2rem;
}
.relief .inner h2 span{
	font-size: 2.8rem;
}
.relief .sun{
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
}
.relief .sun li.box{
	width : -webkit-calc(100% / 3) ;
	width : calc(100% / 3) ;
	margin: 1rem 1rem;
	border: none;
}
.relief .water{
	width: 54%;
	display: flex;
	flex-wrap: nowrap;
}
.relief .water li.box{
	width : -webkit-calc(100% / 2) ;
	width : calc(100% / 2) ;
	margin: 1rem 1rem;
	border: none;
}
.relief .water li.box h3{
	height: 3.5rem;
}
.relief .air{
	width: 40%;
}
.plan h2{
	width: 1080px;
	margin: auto;
}
.plan h2 img{
	width: 25%;
}
.plan .read{
	width: 1080px;
	margin: auto;
	font-size: 1.8rem;
}
.plan .read span{
	font-size: 2.3rem;
}
.plan img.pc{
	max-width: 1080px;
	margin: auto;
}
.system{
	padding:0 0 0;
	background-color: #01033c;
}
.system .inner{
	max-width: 1080px;
	margin: auto;
	padding-top: 5rem;
	padding-bottom: 3rem;
	background-color: #d4effa;
}
.system .title .read{
	font-size: 1.8rem;
}
.system ul li h3{
	padding: .8rem 1rem .5rem;
}
.system ul li .innerOver .left{
	width: 43%;
	margin: 1.7rem 2rem 2rem 2rem;
}
.system ul li .innerOver .right{
	width: 48%;
	margin: 2rem 2rem 2rem 0;
}
.system ul li p.small{
	padding: 0 2rem 2rem;
}
.warranty{
	max-width: 1080px;
	margin: auto;
	padding: 3rem 1rem;
}
.warranty .waku{
	margin: .5rem 5rem;
}
.warranty p.read{
	font-size: 1.8rem;
}
.gaiyo h2,
.gaiyo p{
	max-width: 1080px;
	margin: auto;
}
.gaiyo h2{
	font-size: 1.5rem;
}
.gaiyo p{
	line-height: 1.8;
}
footer{
	font-size: .8rem;
}
.fixedBtn{
	display: none!important;
}




}




