
/*===============================================
　SP iPhone6以上（画面の横幅が761pxまで）
===============================================*/

@media (max-width:761px){
	
	



    
	/* ============================================================
 	main vi 
	==============================================================*/
    
    
    #main_ttl_wrap{
		width: 100%;
		height: 170px;
		position: relative;
		overflow: hidden;
		background-size: cover;
	}

	

	#main_ttl_wrap .txt_wrap{
		position: absolute;
		top: 58%;
		width: 100%;
	}
	
	#main_ttl_wrap .txt_wrap h1:after{
		content:"";
		display:block;
		position:absolute;
		bottom: -33px;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color:#fc8418;
		width: 92px;
		height: 7px;
	}
	
	#main_ttl_wrap .txt_wrap h1{
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 600;
		font-size: 3.4rem;
		color: #000;
		text-align: center;
		letter-spacing: 0.4rem;
		line-height: 120%;
	}

	#main_ttl_wrap span{
		display: block;
		font-family: 'Alata', sans-serif;
		font-weight:200;
		font-size: 2.4rem;
		color: #fff;
		text-align: center;
	}
	
	#main_ttl_wrap .txt_wrap span{
		display:block;
		font-weight: 500;
		font-size: 2.0rem;
		font-family: 'Noto Serif JP', sans-serif;
		color: #000;
		background:none;
		text-align: center;
		letter-spacing: 0.2rem;
		padding:0;
		margin: 18px 0 -12px;
	}
	#main_wrap .txt_wrap p{
		font-family: 'Noto Serif JP', serif;
		font-weight: 400;
		font-size: 1.3rem;
		color: #fff;
		letter-spacing: 0.1rem;
		/* white-space: nowrap; */
		line-height: 160%;
	}

	
    
    
    /* ============================================================
 	common
	==============================================================*/
    
    h2.ttl{
		font-family: 'Noto Serif JP', serif;
		font-weight: 200;
		line-height: 140%;
		font-size: 2.2rem;
		letter-spacing: 0.1rem;
		padding: 5px 0 10px;
	}
	span.eng_txt{
		display:block;
		font-family: 'EB Garamond', serif;
		font-weight: 140;
		font-size: 1.3rem;
		letter-spacing: 0.4rem;
		opacity:0.5;
		text-indent: 3px;
	}
	
	p.body_txt{
		font-family: 'Noto Serif JP', serif;
		font-weight:200;
		font-size: 1.3rem;
		letter-spacing: 0.1rem;
		line-height: 200%;
		padding: 0 0 40px;
	}
    
    
    /* ============================================================
 	section 00
	==============================================================*/


	#sec00{
		width: 100%;
		position:relative;
		padding: 0 0 20px;
	}

	#sec00 .flex{
		padding: 70px 8vw 30px;
		display:flex;
	}

	#sec00 .flex li{
		width:50%;
		position:relative;
		padding: 10px 0 20px;
		text-align:center;
		border-right:1px solid #b3b3b3;
	}

	#sec00 .flex li:first-child{
		border-left:1px solid #b3b3b3;
	}

	#sec00 .flex li:before{
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border-right: solid 1px #adadad;
		border-bottom: solid 1px #adadad;
		position: absolute;
		bottom: 3px;
		left: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
	}

	#sec00 .flex li a{
		display:block;
	}

	#sec00 .flex li:hover p{
		opacity:0.3;
		transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	}


	#sec00 .flex li p{
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        text-align:center;
        font-size:1.8rem;
    }
	
	
	/* ============================================================
 	section 01
	==============================================================*/

	#sec01{
		width: 100%;
		position:relative;
		padding: 53px 0 40px;
		background-color: #c8e6eb;
	}

	#sec01 .background-blue {
		position: relative;
		top: -55px;
		height: 576px;
		width: 44%;
		z-index: 2;
		background: rgba(0,190,255,0.75);
	}
    
    #sec01 h2{
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 500;
		font-size: 3.0rem;
		padding: 0 0 10px;
	}

	#sec01 .white_box{
		background-color:#fff;
		padding: 20px 5%;
	}

	#sec01 .white_box ul li{
		padding: 24px 0 32px;
		border-bottom:1px solid #ccc;
	}

	#sec01 .white_box ul li:last-child{
		border:none;
	}

	#sec01 .white_box ul li h3{
		position: relative;
		font-family: 'Noto Serif JP', sans-serif;
		margin: 0 0 16px 54px;
		font-weight: 500;
		font-size: 2.4rem;
	}

	#sec01 .white_box ul li h3:before{
		content: "";
		position: absolute;
		top: 19px;
		left: -54px;
		background: #fc8418;
		width: 32px;
		height: 7px;
	}

	#sec01 ul li p{
		font-size: 1.4rem;
		font-family: 'Noto Sans JP', sans-serif;
		line-height: 193%;
	}
	
	#sec01 ul li p span{
		display:block;
		font-size:1.5rem;
		font-weight:500;
		margin: 6px 0 0;
	}


	/* ============================================================
 	section 01
	==============================================================*/

	#sec02{
		width: 100%;
		position:relative;
		padding: 53px 0 40px;
		background-color: #c8e6eb;
	}

	#sec02 .background-blue {
		position: relative;
		top: -55px;
		height: 576px;
		width: 44%;
		z-index: 2;
		background: rgba(0,190,255,0.75);
	}
    
    #sec02 h2{
		font-family: 'Noto Serif JP', sans-serif;
		font-weight: 500;
		font-size: 3.0rem;
		padding: 0 0 10px;
	}

	#sec02 .white_box{
		background-color:#fff;
		padding: 20px 5%;
	}

	#sec02 .white_box ul li{
		padding: 24px 0 32px;
		border-bottom:1px solid #ccc;
	}

	#sec02 .white_box ul li:last-child{
		border:none;
	}

	#sec02 .white_box ul li h3{
		position: relative;
		font-family: 'Noto Serif JP', sans-serif;
		margin: 0 0 16px 54px;
		font-weight: 500;
		font-size: 2.4rem;
	}

	#sec02 .white_box ul li h3:before{
		content: "";
		position: absolute;
		top: 19px;
		left: -54px;
		background: #fc8418;
		width: 32px;
		height: 7px;
	}

	#sec02 ul li p{
		font-size: 1.4rem;
		font-family: 'Noto Sans JP', sans-serif;
		line-height: 193%;
	}
	
	#sec02 ul li p span{
		display:block;
		font-size:1.5rem;
		font-weight:500;
		margin: 6px 0 0;
	}

     /* ========　e_btn_list ==========*/

     #sec_e{
    	background:#c8e6eb;
    	padding: 0 0 120px;
    }
		
	ul.e_btn_list {
		width: 100%;
		margin: 0 auto;
    }
     
    ul.e_btn_list a{
         display: block;
         position: relative;
         transition: all 0.5s ease 0s;
     }
     
    ul.e_btn_list a p{
    	transition: all 0.5s ease 0s;
    }
     
    ul.e_btn_list a .img_box{
         width: 100%;
         line-height: 0;
     }     
     
     ul.e_btn_list a .img_box img{
         width: 100%;
         line-height: 0;
         transition: all 0.5s ease 0s;
     }
     
     ul.e_btn_list a .icon_box{
     	position: absolute;
     	bottom: 20%;
     	right: 10%;
     }
     
     ul.e_btn_list a .icon_box img{
     	width: 30px;
     }

    ul.e_btn_list a h3{
         font-family: 'Noto Serif JP', sans-serif;
         font-weight: 400;
         font-size: 2.8rem;
         line-height: 130%;
         color: #ffffff;
         position: absolute;
         top: 28%;
         left: 10%;
         width: 80%;
         /* transform: translate(-50%, 0); */
         transition: all 0.5s ease 0s;
    }
    
    ul.e_btn_list a p{
         font-family: 'Noto Sans JP', sans-serif;
         font-weight: 400;
         font-size: 1.6rem;
         line-height: 140%;
         position: absolute;
         bottom: 19%;
         left: 10%;
         color: #fff;
     } 

	

	
}



/*===============================================
　SP iPhone5サイズ対応　画面の横幅が350pxまで▼▼▼▼▼
===============================================*/

@media (max-width:349px) {
	
}

/*===============================================
　SP iPhone Plus サイズ対応　画面の横幅が415pxまで▼▼▼▼▼
===============================================*/

@media (min-width: 413px) and (max-width: 761px) {
	
}

