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


ul li{
	list-style: none;
}

footer ul{
	display: flex;
}

footer .footer_top_right ul{
	display: flex;
	justify-content: space-between;
	padding: 0;
	margin: 1rem 5%;
    width: 90%;
}


/* ページ全体の高さを確保 */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* メインコンテンツが残りの高さを埋める */
main {
  flex: 1;
  position: relative; /* absolute要素の基準にする */
}

/* フッターは通常のレイアウトで表示 */
footer {
  position: relative; /* または static */
  z-index: 1;
  clear: both;
}



img{
	width:100%;
}

.footer_faq{
	text-align: center;
	margin: 3rem auto 4rem auto;
}

.footer_faq a{
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
	height:3em;
    max-width: 20rem;
    padding: 1rem 2rem;
    color: #FFF;
	transition: 0.5s ease;
    background: rgb(0,160,226);
    background: linear-gradient(180deg, rgba(0,160,226,1) 0%, rgba(0,110,139,1) 100%);
	box-shadow: 0.3rem 0.3rem #1A4F66;
}
.footer_faq a:hover { 
	border:none;
	box-shadow: none;
	opacity: 0.7;
}

.footer_top{
	margin:3rem 0;
    width: 100%;
}

.footer_top_left div{
	padding:0.75rem 0;
}

.footer_top_left div:first-of-type{
	font-size: 1.5rem;
}

.footer_top_left div:nth-of-type(2){
	font-size: 1.25rem;
}

.footer_top_right{
	text-align: center;
}

.footer_top_right ul li{
	font-size: 1.1rem;
	font-weight:bold;
	padding-bottom:1.25rem;
}

.footer_top_right div{
    width: 90%;
    margin: 0 auto;
	font-size: 1rem;
}

.footer_top_right img{
	width:100%;
}
	
footer .footer_bottom{
	background-color: #333333;
	color:#FFFFFF;
	text-align: center;
	width:100%;
}

footer .footer_bottom div:first-of-type{
	padding-top: 1em;
}

footer .footer_bottom div:last-of-type{
	padding-bottom:  1em;
}

.line-break{
	display: none;
}

.footer_btn {
    font-size: 1.5rem;
    text-align: center;
    margin: 3rem auto 4rem auto;
}

.footer_btn a:hover {
	color: #FFFFFF!important;
	text-decoration: underline!important;
}

.footer_top_left_middle{
	display: none;
}

.footer_top_left_last{
	display: none;
}

.footer_bottom a{
	color: #FFFFFF;
}



/* PC用コード */

@media(min-width:769px){

	/* PCメニュー */

	.footer_top{
		display: flex;
		justify-content: center;
        margin: 2rem 0 1rem 0;
	}
	
	.footer_top_left{
		width: 51%;
	}
	
	.footer_top_right{
		width:25rem;
	}
	
	footer {
	  z-index: 100;
	  clear: both;
	}
	
	.wrapper{
		position: relative;
	}
	
	.footer_top_left_middle{
		display: none;
	}	

}



/* タブレット用コード */

@media(min-width:768px) and (max-width:899px){

    .footer_top_left {
        width: 40%;
        padding-left: 5%;
    }
	
    .footer_top_right {
        width: 50%;
        padding-right: 5%;
    }	
	
	.line-break {
		display: block;
	}
	

	
	
}



/* スマホ　*/


@media(min-width:554px) and (max-width:768px){
	
	.footer_top_left {
		width: 100%;
        text-align: center;
        padding: 0;
	}


	.footer_top_right{
		width: 60%!important;
		margin:0 20%!important;
	}
	


}




/* アクセシビリティ　*/

@media(max-width:554px){
	
	.footer_top_left {
			width: 100%;
		    text-align: center;
	}


	.line-break{
		display:inline-block;
	}	
	
	.footer_top_right {
        width: 90% !important;
        margin: 0 5% !important;
	}

	.footer_top_right ul {
		justify-content: space-between;
		padding: 0;
		margin: 1rem 0;
		width: 90%;
		z-index: 100;
	}
	
	.footer_faq a {
		max-width: 100%;
	}
	
	

/*	.footer_top_right ul li:nth-last-of-type(2){	
		margin-left:10%;	
	}*/
}


@media(max-width:20rem){
	
	.line-break{
		display:inline-block;
	}	
	
	.footer_top_right {
        width: 90% !important;
        margin: 0 5%!important;
	}
	
	.footer_faq a {
		max-width: 100%;
		width: 100%;
	}


}

@media(min-width:400px) and (max-width:460px){

	.footer_top_right{
		width: 80%!important;
		margin:0 10%!important;
	}

	.footer_top_right ul li{
		font-size: 1rem;
	}

	
}

@media(min-width:800px) and (max-width:900px){

	.footer_top_left div:first-of-type {
		font-size: 1.6rem;
	}	

}


@media(min-width:901px) and (max-width:1299px){

	.footer_top_left div:first-of-type {
		font-size: 1.75rem;
	}	
}


@media(min-width:1100px){
	
	 .footer_top {
		 width: 100%;
    }
	
	.footer_top_left_first_1200	{
		font-size: 1.75rem;
		margin-left: 8%;
		width:26%;		
	}
		
	.footer_top_left_first_1200	.line-break{
		display: block;
	}	
	
    .footer_top_left {
		width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
	}

	.footer_top_left_middle{
		width:25%;
        display: block;
        font-size: 1.2rem;
		margin-left: -1%;
	}	
	
	.footer_top_left_first{
		display: none;		
	}

	.footer_top_right {
		display: none;
	}	
	
	.footer_top_left_last {
		width:34%;
		display: block;
		font-size: 1.1rem;
		font-weight: bold;
	}
	
	.footer_top_left_last ul {
		justify-content: space-between;
		padding: 0;
		z-index: 100;
		width: 90%;
        margin: 0 8.5%;
	}

	.footer_top_left_last div{
		width:90%;
		margin: 0 8%;
		text-align: center;
	}

	.footer_top_left_last div img{
		width: 100%;
	}
	
	
}

@media(min-width:1300px){

	.footer_top_left div:first-of-type{
		font-size: 2rem;
		margin-left: 8%;
		margin-right: 2%;
	}
	
	.footer_top_left_middle{
        font-size: 1.25rem;
	}	

	.footer_top_left_last {
		font-size: 1.3rem;
		margin-left: -2%;
	}
	
	
}

@media(min-width:1500px){

	.footer_top_left div:first-of-type{
		font-size: 2rem;
	}
	
	.footer_top_left_middle{
        font-size: 1.5rem;
	}	

	.footer_top_left_last {
		font-size: 1.25rem;
	}
	
	
}


@media(min-width:1100px) and (max-width:1299px){

	
	.footer_top_left_middle {
        width: 21%;
        margin-left: 2%;
    }
	
	.line-break {
		display: block;
	}	
	
	
}


@media(min-width:1100px) and (max-width:1200px){

	
	.line-break{
		display: block;
	}
	
}




main {
  flex: 1;
}

footer {
  position: relative; /* または static */
  width: 100%;
  background-color: #EFEFEF;
  border-top: solid 1px #0071BE;
}