@charset "UTF-8";
/* CSS Document */
body{font-family: 'Noto Sans JP', sans-serif;}

.main{
	font-size:16px;
	line-height:1.5;
	color:#000000;	
}

ul{
	margin:0;
	padding:0;
}

ul,ul li{
	list-style:none;
}

a:hover{
  opacity: 0.8;
  filter: alpha(opacity=80);
  -moz-opacity: 0.8;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

.headerArea{
	position: relative;
	width: 1115px;
	margin:0 auto;
}

.headerArea h1{
	width:25%;
	margin:20px auto;
}

.headerArea .hmNewslist{
	position: absolute;
	right: 0;
	top: 10px;
	font-size: 14px;
    color: #777777;
	line-height: 1;
}

.headerArea .hmNewslist a{
	text-decoration: none;
	color: #777777;
	position: relative;
  	display: inline-block;
  	padding-right: 15px;
}

.headerArea .hmNewslist a:hover{
	text-decoration: underline;
}

.headerArea .hmNewslist a::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #ff8300;
  border-right: solid 2px #ff8300;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -1px;
}

.mainMv{
	background-color: #e1f0ff;
	/*background-color: #cad8e5;*/
}

.mainWrap{
	/*background-image:url(../images/main_bg.svg);*/
	background-size: 1115px;
	background-position:bottom;
	background-repeat:no-repeat;
	padding-top:2em;
	padding-bottom:2em;
	/*border-top: #002e5d 5px solid;*/
}

.mainWrap .mainFukidashi{
	width:600px;
	margin:0 auto;
}

.mainWrap h2{
	width:760px;
	margin:15px auto 0;
}

.mainWrap p.lead{
	width:600px;
	margin:25px auto 0;
}

.btnArea{
	background-color: #002e5d;
/*background-image: repeating-linear-gradient(-45deg, transparent, transparent 4px, rgba(240, 240, 240, 1) 4px, rgba(240, 240, 240, 1) 6px );*/
	padding-bottom: 2em;
}

.mainBtn{
	width:1000px;
	margin:0 auto 0;	
}

.mainBtn ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap; 
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding-top: 0.8em;
}

.mainBtn ul li{
	width:48%;
	margin:1.2em 0 0;
}

.mainBtn ul li a{
 	display:block;
	border:#ff8300 2px solid;
	border-radius:15px;
	/*background-color:#fffeb2;*/
	background-color:#f4f4f4;
	padding:1em;
	text-decoration:none;
	color:#000000;
}

.mainBtn ul li img{
	width:100%;	
}

.mainBtn ul li div.table{
	display: flex;
    /* justify-content: center; */
    align-items: center;
}

.mainBtn ul li p.icon{
	width:20%;	
}

.mainBtn ul li h3.btnTxt{
	margin-left:0.5em;
	font-size:20px;	
	font-weight:700;
	width:60%;
	text-align:center;
}

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
}

.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}

.modal__content{
	position: relative;
    background: #fff;
    left: 50%;
    padding: 40px;
    /*position: absolute;*/
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
}

.closeBtn{
  width: 50px;
  height: 50px;
  position: absolute;
  right: 0;
  top: 0;
  background: #666666;
  display: block;
  text-decoration: none;
line-height: 1;
}

.closeBtn::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f00d';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

.modalTtl{	
	font-size: 24px;
	font-weight: 700;	
}

.sTtl{
	background: #ff8300;
	color: #ffffff;
	display: inline-block;
	padding: 0.2em 2em;
	margin-top: 1.2em;
	font-size: 18px;
}

.mTxt{
	margin-top: 0.5em;
}

.sTxt{
	font-size:14px;
	color: #666666;
}

.modal__content ul{
	margin-top: 1em;
}

.modal__content ul li {
	padding: 0.5em 18px;
	line-height: 1.5;
  	color: #505050;
  	border-bottom: dotted 1px #666666;
  	text-indent: -16px;	
}

.modal__content ul li::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    background: #002e5d;
    border-radius: 50%;
}

.modal__content ul li:first-child{
	padding: 0 18px 0.5em;
}

.modal__content ul li:last-child{
	margin-bottom: 1em;
}

.linkBtn{
	display: block;
	background: #002e5d;
	color: #ffffff;
	padding: 0.8em 0;
	border-radius: 50px;
	text-decoration: none;
	width:30%;
	margin: 1em auto 0;
	text-align: center;
	box-shadow:2px 4px 9px -6px #3d3d3d;
}

/*.newsArea{
  	background-color   : #ffffff;
 	background-image   : radial-gradient(#ffdbb5 19%, transparent 22%),
                       radial-gradient(#ffdbb5 19%, transparent 22%);
  	background-position: 0 0, 9px 9px;
  	background-size    : 18px 18px;
	padding-bottom: 3em;
}*/

.newsArea{
  	background-color: rgba(250, 250, 250, 1);
	background-image: repeating-linear-gradient(-45deg, transparent, transparent 4px, rgba(244, 244, 244, 1) 4px, rgba(244, 244, 244, 1) 6px );
	padding-bottom: 3em;
}

.newsArea #news2,.newsArea #news3,.newsArea #news4,.newsArea #news5{
	margin-top: 3em;
}

.newsArea .widthBg{
	width:1115px;
	margin:0 auto;
	background: #ffffff;
	padding-bottom: 2em;
}

.newsArea ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap; 
}

.newsArea ul li{
	width:32%;
	display: flex;
	margin-left: 1%;
	margin-top: 1.5em;
}

.newsArea ul li a{
 	display:block;
	border:#cccccc 1px solid;
	border-radius:5px;
	background-color:#fff;
	padding:1em;
	text-decoration:none;
	color:#000000;
}

.newsArea h3{
	font-size:30px;
	color:#002e5d;
	text-align:center;
	padding-top:30px;
}

.newsArea .imgBox img{
	width: 100%;
}

.newsWrap{
	width:1000px;
	margin:30px auto;
}

.newsWrap .newsTtl{
	font-size:20px;
	font-weight: 700;
	border-left:#002e5d 10px solid;
	border-bottom:#000000 1px solid;
	padding-left: 1em;
	line-height: 2;
}

.newsArea h4{
	margin-top:0.2em;
	color:#333333;	
}

.newsArea span.release{
	display: block;
	font-size: 14px;
	color: #777777;
	margin-top:0.2em;
}

.copyright{
	text-align: center;
	color: #666666;
	font-size: 14px;
	margin-top: 2em;
}

#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #ff8300;
}

#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
	line-height: 1;
}

#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

/*560px未満*/
@media screen and (max-width: 559px) {
	img{width: 100%;}
	
	.headerArea{
		width: 100%;
	}
	
	.headerArea h1{
		width:50%;
		margin:0.4em auto;
	}
	
	.headerArea .hmNewslist{
		position:static;
		text-align: center;
		background: #F7F7F7;
		padding: 0.8em 0;
	}

	.headerArea .hmNewslist a{
		text-decoration: underline;
	}
	
	.mainWrap{
		/*background-size: 100%;*/
		padding-top:1.5em;
		padding-bottom:1.5em;
	}

	.mainWrap .mainFukidashi{
		width:90%;
	}

	.mainWrap h2{
		width:84%;
		margin:0.5em auto 0;
	}

	.mainWrap p.lead{
		width:80%;
		margin:1em auto 0;
	}
	
	.btnArea{
		padding-bottom: 1em;
	}

	.mainBtn{
		width:90%;	
	}
	
	.mainBtn ul{
		padding-top: 0.5em;	
		width: 100%;
	}

	.mainBtn ul li{
		margin-top:0.5em;
		display: flex;
		align-items: stretch;
	}
	.mainBtn ul li a{
		width: 100%;
      	display: flex;
      	justify-content: center;
      	align-items: center;		
	}
	
	.mainBtn ul li div.table{
		display:block;
		width: 100%;
	}

	.mainBtn ul li p.icon{
		width:36%;
		margin: 0 auto;
	}

	.mainBtn ul li h3.btnTxt{
		margin-left:0;
		width:100%;
	}
	
	.modal{
    	height: 90vh;
		overflow-y: scroll;
	}

	.modal__bg{
    	height: 100vh;
	}
	
	.modal__content{
    	padding: 1em;
    	width: 90%;
	}
	
	.sTtl {
    	margin-top: 0.5em;
	}
	
	.modal__content ul {
    	margin-top: 0.5em;
	}
	
	.modal__content ul li {
    	padding: 0.5em 0 0.5em 18px;
	}
	
	.modal__content ul li:first-child {
    	padding: 0 0 0.5em 18px;
	}
	.modal__content ul li{
		line-height: 1.2;		
	}

	.linkBtn{
		width:70%;
	}
	
	.newsArea{
		width:98%;
		margin: 0 auto;
	}

	.newsArea .widthBg{
		width:100%;		
	}
	
	.newsWrap{
		width:100%;
	}

	.newsArea ul li{
		width:48%;
		display: flex;
		margin-left: 1%;
		margin-top: 1.5em;
	}
	
	.newsArea ul li:nth-child(even){
		margin-left: 2%;		
	}
}

/*960px未満*/
@media screen and (max-width: 959px) and (min-width: 560px) {
	img{width: 100%;}
	
	.headerArea{
		width: 100%;
	}
	
	.headerArea h1{
		width:40%;
		margin:0.4em auto;
	}
	
	.headerArea .hmNewslist{
		position:static;
		text-align: center;
		background: #F7F7F7;
		padding: 0.8em 0;
	}

	.headerArea .hmNewslist a{
		text-decoration: underline;
	}
	
	/*.mainWrap{
		background-size: 100%;
		padding-top:2em;
		padding-bottom:2em;
	}*/

	.mainWrap .mainFukidashi{
		width:80%;
	}

	.mainWrap h2{
		width:84%;
		margin:0.5em auto 0;
	}

	.mainWrap p.lead{
		width:80%;
		margin:1em auto 0;
	}
	
	.btnArea{
		padding-bottom: 1em;
	}

	.mainBtn{
		width:90%;	
	}
	
	.mainBtn ul{
		padding-top: 0.5em;	
		width: 100%;
	}

	.mainBtn ul li{
		margin-top:0.5em;
		display: flex;
		align-items: stretch;
	}
	.mainBtn ul li a{
		width: 100%;
      	display: flex;
      	justify-content: center;
      	align-items: center;		
	}
	
	.mainBtn ul li div.table{
		display:block;
		width: 100%;
	}

	.mainBtn ul li p.icon{
		width:35%;
		margin: 0 auto;
	}

	.mainBtn ul li h3.btnTxt{
		margin-left:0;
		width:100%;
	}
	
	.modal__content{
    	padding: 1em;
    	width: 90%;
	}
	
	.sTtl {
    	margin-top: 0.5em;
	}
	
	.modal__content ul {
    	margin-top: 0.5em;
	}
	
	.modal__content ul li {
    	padding: 0.5em 0 0.5em 18px;
	}
	
	.modal__content ul li:first-child {
    	padding: 0 0 0.5em 18px;
	}
	.modal__content ul li{
		line-height: 1.2;		
	}

	.linkBtn{
		width:70%;
	}
	
	.newsArea{
		width:98%;
		margin: 0 auto;
	}

	.newsArea .widthBg{
		width:100%;
	}
	
	.newsWrap{
		width:100%;
	}

	.newsArea ul li{
		width:48%;
		display: flex;
		margin-left: 1%;
		margin-top: 1.5em;
	}
	
	.newsArea ul li:nth-child(even){
		margin-left: 2%;		
	}
}