@charset "UTF-8";
/*================================================
 *  カスタマイズ
 ================================================*/

/*================================================
 *  一般・共通設定
 ================================================*/
 html, body { height: 100%; }

body {
	font-size: 100%;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-weight: 500;
	-webkit-text-size-adjust: 100%;
	line-height: 1.5;
}

@media screen and (max-width:767px) {
body {
	font-size: 87.5%;
	line-height: 1.4;
}

}

#main {height:100%;}
#main img{width:100%;}

.mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: 300;
}



.zazoo_credit{
  color: #1b3a5d;
  font-weight: bold;
  font-size: 1.5rem;
}
@media (max-width: 600px) {
  .zazoo_credit{
    color: #1b3a5d;
    font-weight: bold;
    font-size: 0.8rem;
  }
}
@media (max-width: 320px) {
  .zazoo_credit{
    color: #1b3a5d;
    font-weight: bold;
    font-size: 0.5rem;
  }
}

/*================================================
 *  nav brand中央寄せ問題
 ================================================*/
/*=
@media (min-width: 768px) {
.navbar-brand.abs
    {
        position: absolute;
        width: 100%;
        left: 0;
        text-align: center;
    }
}*/

.ads_link{
	z-index:10000;
	position: fixed;
	left: calc( 50% - 130px ) ;
	top:20px;
	margin:0 auto;
}

a.link_ef {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
a.link_ef::after {
	position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #cccccc;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
a.link_ef:hover::after {
  transform: scale(1, 1);
}

.navbar{background-color: white;}

.navbar-toggler {
    z-index: 2;
		margin-left: 90% !important;
}

.navbar-brand-center {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    text-align:center;
    margin: auto;
}

.anchor {
    display: block;
    padding-top: 150px;
    margin-top: -150px;
}

@media (min-width: 768px) {
    .navbar-brand-center {
        margin-left: 0 !important;
    }
}

button:focus {
	outline:0;
}

.border-top--extetend{
	border-top: 15px solid #003366!important;
}


li {
  color: white;
}

.navbar-dark .navbar-toggler {
  color: rgba(0, 0, 0, 0.5);
  border: none;
  padding: 0px;
  width: 30px;
  height: 30px;
  box-sizing: border-box;
  position: relative;
}
.navbar-dark .navbar-toggler-icon {
  background-image:none; /* この行で背景画像を無効化 */
  background-color: black;
  width: 30px;
  height: 2px;
  display: block;
  position: absolute;
  transition: ease .5s;
}

/* 3本のバーそれぞれの座標を設定 */
.navbar-toggler-icon:nth-of-type(1) {top:7px;}
.navbar-toggler-icon:nth-of-type(2) {top:14px;}
.navbar-toggler-icon:nth-of-type(3) {top:21px;}

/* メニューが開いている時の　3本のバーそれぞれの座標および角度を設定 */
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(1) {
top:13px;
transform: rotate(45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(2) {
opacity: 0;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(3) {
top:13px;
transform: rotate(-45deg);
}
.fluid-box{
	width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
		background-color: #ddd;

}
.fluid-box-inner{
	margin: 0 auto;
	background-color: #ddd;
	width:100%;
}




h1{
background: #002c72;
display: inline-block;
font-size: 1.5rem;
color:white;
padding:0.7rem 1rem 1.2rem 1rem;
}

h2 {
	display: inline-block;
  position: relative;
  padding: 1rem 1rem calc(1rem + 0px);
  background: #002c72;
	color:white;
	font-size: 1.2rem;
	line-height: 1.5;
}

h2:before {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 100%;
  height: 100%;
  content: '';
  border: 4px solid #002c72;
}

.h2--extend{
 font-size:1.3rem;
}
h3 {
  position: relative;
  padding: 0.2rem 0.5rem;
  border-bottom: 4px solid #b6b6b6;
	display: inline-block;
	font-size: 1.1rem;
}

h3:before {
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 96px;
  height: 4px;
  content: '';
  background: #002c72;
}

h4{
	font-size:1.2rem;
}
p {
		font-size:1.1rem;
}

.p--extend {
    text-indent : -1em;
    padding-left : 1em;
}

.pp_text li{
	font-size:1.1rem;
	padding: 0.5rem;
}

.container-fluid--extend {
margin-right: auto;
margin-left: auto;
max-width: 1360px;
}

.ads_caption{
	font-size:1.1rem;
	line-height: 1.3;
}
.ads_card{
	background-color:#002c72;color:white; font-size:1.3rem;
}

@media screen and (max-width:767px) {
h1{
	font-size: 1.2rem;
	display: block;
}

h2{
	font-size: 1rem;
}
.h2--extend{
 font-size:1.1rem;
}

h3{
	font-size: 1rem;
	display: block;
}
h4{
	font-size: 1rem;
}

h5{
	font-size: 1rem;
}

p{
	font-size: 1rem;
}


.ads_caption{font-size: 0.9rem;}
.ads_card{
font-size:1rem;
}

.pp_text li {
    font-size: 1rem;
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
		padding-left: 0;
}


}

.ads_table{
	margin-bottom:4rem;
	width:85%;
}


@media (max-width: 768px) {

.ads_table {
	margin-bottom:2rem;
	width:90%;
}
.ads_table th, .ads_table td{
		display: block;
		width: 100%;
	font-size: 0.9rem;
	}
	table.ads_table th {
		background: white;
		padding: 10px;
	}
	table.ads_table tr {
	  background: #f6f6f6;
	}
	table.ads_table td {
	  padding: 10px;
	  vertical-align: top;
	}

}


table, th, td {
  border-collapse: collapse;
	border-bottom: 1px solid #b6b6b6;
  line-height: 1.5;
	font-size: 1.2rem;
}

table.ads_table th {
	padding: 10px;
}

table.ads_table td {
  padding: 10px;
  vertical-align: top;
}

table.ads_table tr:nth-child(even) {
  background: #f6f6f6;
}



.mx-10 {
	 margin-left: 1rem!important;
	 margin-right: 1rem!important;
}

.mx-20 {
	 margin-left: 1.5rem!important;
	 margin-right: 1.5rem!important;
}

@media (min-width: 768px){
.mx-10 {
	 margin-left: 5rem!important;
	 margin-right: 5rem!important;
}

.mx-20 {
	 margin-left: 6.5rem!important;
	 margin-right: 6.5rem!important;
}
}



.footer{
	background-color: white;
	color:black;
	text-align: center;
	padding: 2rem;
}
