@charset "utf-8";
/* CSS Document */

html { scroll-behavior: smooth;}

body{
	margin: 0;
	background: linear-gradient(90deg, rgba(9,54,108,1) 0%, rgba(1,65,129,1) 35%, rgba(0,113,194,1) 100%); 
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	width: 100%;
	
}
a:hover{
	opacity: 0.8;
	transition: 1.0s ;
	color: #FDEC00!important;
}
.footer{
	text-align: center;
	font-size: 0.7rem;
}
@media screen and (max-width:376px){
	.eria_right{
		height: 96vh!important;
	}
}
@media screen and (max-width:550px){
	body{
		width: 100%;
	
	}
	img{
		width: 100%;
	}
	.silet img{
		 width: calc(100% / 2 - 3.1%);
		 border: #DC0003 solid 1px;
		border-radius: 5px;
	}
	.eria_right{
		       width: calc(100% / 2 - 6.1%);
    display: inline-flex;
    margin-right: 0.5px;
    margin-left: 0.5px;
    align-items: stretch;
    margin-bottom: 20px;
    background: white;
    padding: 2.5%;
		border-radius: 5px;
		height: 80vh;
		height: 80vh;
	
	}
	.eria_right a{
		width:100%;
		text-decoration: none;
	}
	.title{
		height: 48px;
		font-weight: 800;
		color: #414141;
	}
	.keward{
		    display: -webkit-box;
		    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
		overflow: hidden;
	}
	.keward strong{
		font-size: 0.7rem;
	}
	.heder_line{
		width: 100%;
		height: 50px;
		z-index: 500!important;
		position: fixed;
	top:0px;
		background: linear-gradient(90deg, rgba(0,113,194,1) 0%, rgba(1,65,129,1) 35%, rgba(9,54,108,1) 100%);
	}
	.logo img{
		width: 35%;
		padding-top: 10px;
		padding-left: 2%;
		float: left;
	}
	.menu{
		width: 63%;
		float: right;
	}
	.menu li{
		display: inline-block;
		border: #FFFFFF 1px solid;
		width: 59px;
		font-size: 0.8rem;
		text-align: center;
		float: right;
    margin-right: 2%;
		height: 20px;
	}
	.menu a{
		text-decoration: none;
		color: #FFFFFF;
	}
	.main_img img{
		width: 100%;
	}
	h1{
		font-size: 1em;
		text-align: center;
		color: #FFFFFF;
	
	}
	h1 span{
		font-size: 1.1rem;
		color: #FFFD00;
		line-height: 40px;
		
	}
	.tinretu{
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		color: aliceblue;
	}
	.feeld_slect{
		margin-top: 50px;
		 display: flex;
	}
	.feeld_slect div{
			background: linear-gradient(90deg, rgba(1,1,1,0.6867121848739496) 0%, rgba(0,0,0,0.9164040616246498) 35%, rgba(31,40,47,0.8911939775910365) 100%);
		 width : calc(100% / 3 ) ;
		padding: 5px;
		
		text-align: center;
		border-radius: 5px;
		    margin: 10px;
		
		
	}
		.eria_right span{
		text-decoration: none;
		background: linear-gradient(90deg, rgba(1,1,1,0.6867121848739496) 0%, rgba(0,0,0,0.9164040616246498) 35%, rgba(31,40,47,0.8911939775910365) 100%);
		color: aliceblue;
		border-radius: 5px;
		padding: 2%;
			width: 100%;
			font-size: 0.3rem;
			text-align: center!important;
			margin-left: auto;
			margin-right: auto;
	}
	
	.feeld_slect a{
		text-decoration: none;
		color: aliceblue;
	}
	h2{
		text-align: center;
		color: white;
		margin-top: 65px;
		}
	.mein_content{
		width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
	
	h2{
		margin-top: 30px;
		padding-top: 3px;
	}
	.main_img{
	    background: url(img/main_pc.jpg) no-repeat center center/ cover;
      background-repeat  : no-repeat, no-repeat;
      width              : 100%;
      height             : 45vh;
	    margin-top: 50px;
}
	.kyusuti{
			margin-top: 5vh!important;
        text-align: center;
   color: aliceblue;
		font-size: 1.5rem;
		font-weight: 800;
	}
}

@media screen and (min-width:551px) and ( max-width:3000px) {
	.pcnone{
		display: none;
	}
	.pc_none{
		display: none;
	}
	.kanren{
		background: linear-gradient(90deg, rgba(1,1,1,0.6867121848739496) 0%, rgba(0,0,0,0.9164040616246498) 35%, rgba(31,40,47,0.8911939775910365) 100%);
    text-align: center;
    color: aliceblue;
		border-radius: 5px;
	}
	
	.silet img{
		    width: 90px!important;
    padding-left: 8px;
    border: #DC0003 solid 1px;
	}
	.inline{
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.keward{
		height: 150px;
	}
	.title{
		
	}
	.eria_right{
		       width: calc(100% / 3 - 25px);
    display: inline-flex;
    margin-right: 0.5px;
    margin-left: 0.5px;
    align-items: stretch;
    height: 800px;
    margin-bottom: 20px;
    background: white;
    padding: 10px;
	}
	.eria_right span{
		text-decoration: none;
		background: #002384;
		color: aliceblue;
		border-radius: 5px;
		padding: 2%;
	}
	.eria_right a{
		text-decoration: none;
	}
	.eria_right div{
		width: 101%;
		margin-left: auto;
		margin-right: auto;
		margin: 0px;
	}
	
	.eria_right p{
				margin-left: auto;
		margin-right: auto;
	}
	.eria_right img{
				margin-left: auto;
		margin-right: auto;
		width: 100%;
		border-radius: 10px;
	}
	
	body{
		width: 100%;
	

	}
	img{
		width: 200px;
	}
	.kyusuti{
		
        text-align: center;
    padding-top: 10vw;
    padding-bottom: 6vw;
    font-size: 2.5rem;
    font-weight: 800;
		
	}
.main_img{
	    background: url(img/main_pc.jpg) no-repeat center center/ cover;
      background-repeat  : no-repeat, no-repeat;
      width              : 100%;
      height             : 65vh;
    margin-top: 50px;
	
}
.feeld_slect{
	width: 768px;
	margin-left: auto;
    margin-right: auto;
	
}
.feeld_slect div{
	display: inline-block;
	border:  #00014Dolid 1px;
	width:216px;
	text-align: center;
	padding: 5px;
	margin: 13px;
	background: #FFFFFF;border-radius: 5px;
	font-size: 1.5rem;
	font-weight: 800;
	height: 80px;	
background: rgb(1,1,1);
background: linear-gradient(90deg, rgba(1,1,1,0.6867121848739496) 0%, rgba(0,0,0,0.9164040616246498) 35%, rgba(31,40,47,0.8911939775910365) 100%);
	color: white;
	
}
.heder_line{
	width: 100%;
	height: 50px;
	background: linear-gradient(90deg, rgba(0,113,194,1) 0%, rgba(1,65,129,1) 35%, rgba(9,54,108,1) 100%);
	position: fixed;
	top:0px;
	z-index: 500!important;
}
.logo img{
	width: 180px;
	padding: 10 0 10 20;
	margin-left: 10px;	
	float: left;
	padding-top: 5px;
	
}
.menu ul{
	color: white;
	font-size: 15px;
	float: right;
	margin-right: 20px;
}
.menu ul li{
	display: inline-block;
	margin-right: 20px;
}
.menu a{
	text-decoration: none;
	color: aliceblue;
}
h1{
	text-align: center;
	font-size: 1.2rem;
height:60px;
  line-height:60px;
	letter-spacing: 6px;
	color: #FFFFFF;
	
}
h1 span{
	font-size: 2.4rem;
	color: #E50003;
	position: relative;
	top:2px;
}
.sutaf{
	font-size: 30px;
	color: #EDFC00;
	position: relative;
	
}
.tinretu{
	text-align: center;
	color: white;
	font-size: 18px;
	height: 100px;
	
}
	.feeld_slect a{
		text-decoration: none;
		color: aliceblue;
		transition: 1.0s ;
	}

	h2{
		width: 100%;
		text-align: center;
		height: 41px;
    padding-top: 9px;
		    padding-bottom: 5vw;
		font-size: 2.5rem;
		clear: both;
	}
	.mein_content{
		padding: 3%;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
		
		margin-top: 50px;
		border-radius: 10px;
		background: #E7E7E7;
		
	}
	
	
}