/*===============================================
　画面の横幅が480pxまで▼▼▼▼▼
===============================================*/


@media (max-width:761px){
	
   
	#main{
		width: 100%;
		height: 100vh;
		background-size: cover;
		position: relative;
	}

	#main_wrap{
		width:100%;
		height:100vh;
		background: #c3d0e8 url(../img/top_sp.png) no-repeat top center;
		background-size: cover;
	}
	
	/* --- 背景の指定 ------------------------------------------- */
	#h1_box{
	  overflow   : hidden;
	}

	#h1_box .bgImg {
	  position   : absolute;
	  top        : 0;
	  left       : 0;
	  bottom     : 0;
	  right      : 0;
	  opacity    : 0;
	  animation  : bgAnime 20s infinite;   /* 2画像 × 各5s = 10s */
	}

	/* --- 段差で背景画像のアニメーションを実行 ----------------- */
	#h1_box .src1 {
	  background : url(../img/top_sp.png) no-repeat top center;   /* 背景の画像を指定 */
	  background-size: cover;
	}

.bgImg.src1 {}
	#h1_box .src2 {
	  background-image : url(../img/top2_sp.png);   /* 背景の画像を指定 */
	  animation-delay: 1s;
	  background-size: cover;
	}

    .h1_wrap{
    	position: absolute;
		top: 47.5%;
		left: 50%;
		transform:translate(-50%, -50%);
		z-index: 9999;
    }
	
	h1{
		color: #fff;
		text-align:center;
		letter-spacing:6px;
		line-height: 130%;
		font-size: 3.8rem;
		font-family: 'Marcellus', serif;
		font-weight: 400;
		filter: none;
		text-shadow: 0 0 12px rgb(1, 17, 37,0.5);
	}

	h1 span:nth-child(1){
		display: block;
		font-size: 0.8rem;
		font-family: 'Montserrat', sans-serif;
		letter-spacing: 0.06rem;
		font-weight: 400;
		margin: 8px auto -4px;
		padding: 0 0 4px;
		border-bottom: 1px #fff solid;
		width: calc(100vw*0.9);
	}

	h1 span:nth-child(2){
		display: block;
		font-size: 1.3rem;
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing:4px;
		font-weight: 400;
		margin: 15px auto;
		text-shadow: 0 0 12px rgb(1, 17, 37,0.9);
	}

	p{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:100;
	}
	




/* =======================
 section01
=======================*/

	
	#section01{
		background-color: #2c99e2;
		padding: 50px 0px 30px;
		position: relative;
	}

	#section01 img{
		width: 100%;
		/* position: absolute; */
		/* margin: 0px 0 0 0; */
		top: 0;
	}


    #section01 .wrapper{
    	margin: 0 auto;
    	padding: 0 10%;
    }

	h2{
		color:#fff;
		font-family: 'Montserrat', sans-serif;
		font-size: 3.4rem;
		line-height: 4.2rem;
		font-style: italic;
		letter-spacing: 2px;
		font-weight: 300;
		text-align: center;
	}

	h2 span{
		display: block;
		font-size: 16px;
		font-family: 'Noto Sans JP', sans-serif;
		letter-spacing:2px;
		margin: 2px auto 40px;
		padding: 0 0 26px;
		border-bottom: 1px solid #fff;
		width: 72px;
		font-style: initial;
	}
   
    h3{
    	text-align: center;
    	color: #fff;
    	font-size: 1.6rem;
    	line-height: 30px;
    	margin: -18px 0 16px;
    	font-family: 'Noto Sans JP', sans-serif;
    	font-weight:100;
    }

    .sec_txt{
		font-size:14px;
		color: #fff;
		width: 100%;
		font-weight: 100;
	}
    .sec_txt{
		margin: 25px auto 0;
		position: relative;
	}
	
/* =======================
 section02
=======================*/

    .section02 {
    	padding: 50px 0px 30px;
    	background: #fff;
    	position: relative;
    }

    .section02 .wrapper{
    	margin: 0 auto;
    	padding: 0 10%;
    }

    .section02 h2{
        color: #2c99e2;
    }

    .section02 h3{
        color: #2c99e2;
        font-family: 'Noto Sans JP', sans-serif;
        font-weight:100;
    }

    .section02 .sec_txt{
    	color: #000000;
    	margin: 32px 0 40px;
    }

    
	.section02 h2 span{
		border-bottom: 1px solid #2c99e2;
		width:200px;
		margin: 5px auto 40px;
		padding: 0 0 5px; 
	}


	.r_box{
	}


/* =======================
 section03
=======================*/

	.section03{
		background-color: #2c99e2;
		padding: 54px 0px 38px;
		position: relative;
	}


    .section03 .wrapper{
    	margin: 0 auto;
    	padding: 0 10%;
    }

    .section03 .sec_txt {
		margin: 10px auto 0;
		position: relative;
	}



/* =======================
 section04
=======================*/

    .section04 {
    	/* text-align: center; */
    }

    .section04 .wrapper{
    	margin: 51px auto 64px;
    	padding: 0 10%;
    }

    .section04 h2{
        color: #2c99e2;
    }

    .section04 h3{
        color: #2c99e2;
        margin : -18px 0 ;
    }

    .section04 h2 span{
        color: #2c99e2;
        /* margin: 0 auto; */
    }

    .section04 .sec_txt{
    	color: #000000;
    	margin: 40px auto;
    	width: 100%;
    }

	.section04 h2 span{
		border-bottom: 1px solid #2c99e2;
		font-style: initial;
	}

/* =======================
 section_r
=======================*/

	.section_r{
		background-color: #2c99e2;
		padding: 54px 0px 38px;
		position: relative;
	}


    .section_r .wrapper{
    	margin: 0 auto;
    	padding: 0 10%;
    }

    .section_r .sec_txt {
		margin: 10px auto 0;
		position: relative;
	}


/* =======================
 section05
=======================*/

    .section05 {
    	background: #ffffff;
    	text-align: center;
    	padding: 1px 0;
    }
  
    
    .section05 .wrapper{
    	margin: 60px auto 60px;
    	padding: 0 10%;
    }



    .section05 h2{
        color: #2c99e2;
    }

    .section05 h2 span{
        color: #2c99e2;
        margin: 0 auto;
        border-bottom: 1px solid #2c99e2;
        width: 50%;
        font-style: initial;
    }

    .section05 .sec_txt{
    	color: #2c99e2;
    	margin: 40px auto;
    	width: 100%;
    }

    .section04 img{
		margin: 32px 0 0;
	}


/* =======================
 section06
=======================*/
	.section06{
		background:#105d91;
		padding: 1px 0;
		/* height: 269px; */
	}

	.section06 .wrapper{
		margin: 44px auto;
		padding: 0 8%;
	}

    .section06 h4{
    	font-size: 2.4rem;
    	font-family: 'Montserrat', sans-serif;
    	font-weight: 700;
    	color: #fff;
    	/* border-bottom: 1px solid #fff; */
    	/* width: 20%; */
    	text-align: center;
    	margin: 0 auto 14px;
    }

    .section06 .r_box{
    	/* width: 540px; */
    	margin: 6px 0 0;
    	color: #fff;
    }

    .section06 .r_box h5{
    	font-size: 1.6rem;
    	font-weight: 600;
    	/* text-align: center; */
    	/* float: left; */
    }

    .inquiry{
    	margin: 0 0 21px;
    }

    .inquiry:nth-child(1){
    	padding: 0 0 38px;
    	border-bottom: 1px #fff solid;
    }
	.inquiry:nth-child(2){
    	padding: 0 0 38px;
    	border-bottom: 1px #fff solid;
    }

    .section06 .r_box p{
    	margin: -26px 0 0 5%;
    	display:block;
    	line-height: 2.1rem;
    	float: right;
    	font-size: 1.3rem;
    }


}

	@keyframes bgAnime {
	   0% { opacity: 0; }
	   5% { opacity: 1; }
	  25% { opacity: 1; }
	  30% { opacity: 0; }
	 100% { opacity: 0; }
	}