@charset "UTF-8";
/*=======================================
共通
=========================================*/
:root {
    --font-base-xl: clamp(2.1rem, 1.9865rem + 0.3027vw, 2.4rem);
    --font-base-lg: clamp(1.6rem, 1.5243rem + 0.2018vw, 1.8rem);
    --font-base-md: clamp(1.3rem, 1.1865rem + 0.3027vw, 1.6rem);
    --font-base-sm: clamp(1.2rem, 1.1243rem + 0.2018vw, 1.4rem);
    --font-base-xs: clamp(1.1rem, 1.0243rem + 0.2018vw, 1.3rem);
    --font-base-input: 16px;
h1: clamp(2.7rem, 2.5865rem + 0.3027vw, 3rem);
h2: clamp(2.4rem, 2.2865rem + 0.3027vw, 2.7rem);
h3: clamp(2.1rem, 1.9865rem + 0.3027vw, 2.4rem);
h4: clamp(1.8rem, 1.6865rem + 0.3027vw, 2.1rem);
h5: clamp(1.6rem, 1.5243rem + 0.2018vw, 1.8rem);
	h6: 16px;}
h1 ,h2 ,h3 ,h4 ,h5 ,h6 {font-weight: bold;
    line-height: 1.75;}
#graduate h5{font-size:16px ;}

#adoption {
  line-height: 1.8;
font-size:16px ;
  }


.button-list .button {
			text-align: center;
			display: inline-block;
			padding: 16px;
			font-size: 16px;
			line-height: 1.4;
			font-weight: bold;
			box-sizing: border-box;
			min-width: 280px;
			margin: 8px;
		}

		@media only screen and (max-width: 640px) {
			.button-list .button {
				width: 90%;
			}
		}

		.button-list .button:hover {
			color: #fff;
			opacity: .9;
		}

		.button-list .button-01.button {
			background-color: #65b5eb;
			border-color: #65b5eb;
			color: #fff;
			text-decoration: none;
		}

		.button-arrow-right,
		.button-arrow-left {
			position: relative;
			padding: 1rem 2rem;
		}

		.button-arrow-right:after,
		.button-arrow-left:after {
			position: absolute;
			top: 0;
			bottom: 0;
			margin: auto;
			display: block;
			height: 15px;
			width: 15px;
			line-height: 1;
			transition-duration: .5s;
		}

		.button-arrow-right:after {
			font-family: "Font Awesome 5 Free";
			content: '\f105';
			right: 10px;
		}

		.button-arrow-right:hover:after {
			right: 7px;
		}

		.button-arrow-left:after {
			font-family: "Font Awesome 5 Free";
			content: '\f104';
			left: 10px;
		}

		.button-arrow-left:hover:after {
			left: 7px;
		}

.block_recruit_charge {
    padding: 60px 0;
    background: #cee4ed;
}

.block_recruit_charge .title_underbar {
	letter-spacing: 2px!important;
	font-size: 32px!important;
}
@media only screen and (max-width: 768px) {
.block_recruit_charge .title_underbar {
	font-size: 20px!important;
	}
	}

.btn_pink {
  width: 100%;
  max-width: 500px;
  border: 2px solid #3399cc;
  border-radius: 50px;
  color: #3399cc;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  padding: 15px;
  position: relative;
  box-sizing: border-box;
  background: #fff; }
  @media only screen and (max-width: 768px) {
    .btn_pink {
      font-size: 15px; } }
  .btn_pink:after {
    width: 10px;
    height: 10px;
    content: "";
    top: 0;
    bottom: 0;
    right: 20px;
    position: absolute;
    margin: auto;
    border: 2px solid #3399cc;
    border-width: 2px 2px 0 0;
    transform: rotate(45deg); }
  .btn_pink:hover {
    background: #3399cc;
    color: #fff;
    opacity: 0.8; }
    .btn_pink:hover:after {
      border-color: #fff; }

.btn_list {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center; }

.btn_list a {
    text-decoration: none;
}

#graduate {
  line-height: 1.8;
  }
.sec-title{text-align:center!important;margin-bottom:40px;}
.page-recruit_charge .block_pagetop .area_message {
  background: rgba(255, 255, 255, 0.5);
  padding: 20px 20px 20px 0;
  margin: 0 0 20px 0;
  }

.block_pagetop .message-title {
    font-size: 20px!important;
    font-weight: bold;
    margin: 0 0 20px 0;
}

.title_underbar{font-size:32px!important;letter-spacing:5px;position:relative;}
.title_underbar:after{content:"";display:block;width:140px;height:2px;margin:10px auto 0;background:-webkit-linear-gradient(left, #2bb1f2 50%, #dbdbdb 50%);background:-o-linear-gradient(left, #2bb1f2 50%, #dbdbdb 50%);background:linear-gradient(to right, #2bb1f2 50%, #dbdbdb 50%);}

.adoption_pagetop::before, .adoption_pagetop .sp-pagetop-box::before{
  background: url(../img/adoption/adoption-main_23_b.jpg?3) no-repeat center!important;
  background-size: cover!important; }

.block_pagetop::before, .block_pagetop .sp-pagetop-box::before{
  background: url(../img/graduate/main.jpg) no-repeat center;
  /* background-size: cover!important; */
  background-size: contain !important;
 }
 .block_pagetop::before {
  right: 55px !important;
 }
.block_pagetop::before{content:"";background-size:auto 100%;width:50%;position:absolute;right:0;top:0;height:100%;}
.block_pagetop{background:#dbf2ff;position:relative;}
.block_pagetop::after{content:"";width:0;height:0;position:absolute;right:0;bottom:0;border-style:solid;border-width:0 0 100px 300px;border-color:transparent transparent #dcfbf2 transparent!important;}
.block_pagetop .c-wrap{position:relative;}
.block_pagetop .white-base{position:relative;padding:50px 0;z-index:1;width:480px;}
.block_pagetop .white-base .base-under{content:"";width:150%;height:100%;background:#fff;position:absolute;left:-20%;top:0;transform:skewX(-12deg);overflow:hidden;z-index:-1;overflow:hidden;}
.block_pagetop .white-base .base-under::after{content:"";position:absolute;width:0;height:0;border-style:solid;border-width:50px 150px 0 0;border-color:#dcfbf2 transparent transparent transparent;}
.block_pagetop .pagetop-title{font-size:33px;color:#000;margin:0 0 20px 0;}
.block_pagetop .pagetop-sub-title{font-size:20px;font-weight:bold;margin:0 0 20px 0;}
.block_pagetop .pagetop-waku p{font-size:16px;}



@media only screen and (max-width: 768px){
	
.title_underbar{font-size:20px!important;letter-spacing:2px;}
	
.sec-title{margin:0 auto 25px;}

.adoption_pagetop .pagetop-title{ margin: 0 0 0 27px!important;line-height: 1.8!important; font-size:clamp(20px, 3.515625vw, 27px);width:58%!important;padding:3rem 2rem;box-sizing:border-box;position:relative;z-index:10;text-align: left!important;}
.adoption_pagetop::before, .adoption_pagetop .sp-pagetop-box::before{content:"";background-size:cover;width:55%!important;position:absolute;right:0;top:0;height:100%;}

.block_pagetop  .message-title{font-size:clamp(18px, 3.125vw, 24px)!important;text-align:center;}
.block_pagetop{background:#fff;}
.block_pagetop .c-wrap{width:100%!important; margin: 0!important;padding: 0!important;}
.block_pagetop .sp-pagetop-box{min-height:200px;margin:0 0 20px 0;display:flex;align-items:center;}
.block_pagetop .pagetop-title{font-size:clamp(20px, 3.515625vw, 27px);width:58%;margin-bottom:0;padding:3rem 2rem;box-sizing:border-box;position:relative;z-index:10;text-align: left;}
.block_pagetop .sp-base-under{transform:skewX(-10deg);background:#fff;width:50%!important;height:100%;position:absolute;left:10px;top:0;z-index:1;}
.block_pagetop .sp-base-under::after{content:"";position:absolute;width:0;height:0;border-style:solid;border-width:30px 100px 0 0;border-color:#dcfbf2 transparent transparent transparent;}
.block_pagetop .sp-pagetop-box{position:relative;}
.block_pagetop::before, .block_pagetop .sp-pagetop-box::before{content:"";background-size:cover;width:55%;position:absolute;right:0;top:0;height:100%;}
.block_pagetop .sp-pagetop-box::after{content:"";width:0;height:0;position:absolute;right:0;bottom:0;border-style:solid;border-width:0 0 25px 80px;border-color:transparent transparent #dcfbf2 transparent;}
.block_pagetop .white-base{padding:0;width:100%;}
.block_pagetop .white-base .base-under{display:none;}
.block_pagetop .white-base .base-under::after{display:none;}
.block_pagetop .pagetop-sub-title{font-size:clamp(18px, 3.125vw, 24px);text-align:center;}
.block_pagetop .pagetop-waku{width:94%;margin:auto;}
	
}




.c23-btn1 {
  margin-top: 60px;
  text-align: center;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.c23-btn1.is-left {
  justify-content: flex-start;
}
.c23-btn1 a {
  display: block;
  color: #fff;
  border-radius: 100px;
  text-align: center;
  background: #3cd3ba;
  background: -moz-linear-gradient(left, #3cd3ba 0%, #3cbae1 100%);
  background: -webkit-linear-gradient(left, #3cd3ba 0%, #3cbae1 100%);
  background: linear-gradient(to right, #3cd3ba 0%, #3cbae1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3cd3ba', endColorstr='#3cbae1',GradientType=1 );
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 160%;
  padding: 22px 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 540px;
  max-width: 100%;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.05em;
}
.c23-btn1 a.small {
  font-size: 18px;
  font-size: 1.8rem;
  padding: 15px 10px;
  width: 400px;
}
.c23-btn1 a.small2 {
  font-size: 18px;
  font-size: 1.8rem;
  padding: 8px 10px;
  width: 300px;
}
.c23-btn1 a.purple {
  background: #7794d7;
  background: -moz-linear-gradient(left, #7794d7 0%, #7e67c0 100%);
  background: -webkit-linear-gradient(left, #7794d7 0%, #7e67c0 100%);
  background: linear-gradient(to right, #7794d7 0%, #7e67c0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7794d7', endColorstr='#7e67c0',GradientType=1 );
}
.c23-btn1 a.green {
  background: #49C795;
  background: -moz-linear-gradient(left, #49C795 0%, #ABD850 100%);
  background: -webkit-linear-gradient(left, #49C795 0%, #ABD850 100%);
  background: linear-gradient(to right, #49C795 0%, #ABD850 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49C795', endColorstr='#ABD850',GradientType=1 );
}
.c23-btn1 a.orange {
  background: #FCCD4B;
  background: -moz-linear-gradient(left, #FCCD4B 0%, #FCCD4B 100%);
  background: -webkit-linear-gradient(left, #FCCD4B 0%, #FCCD4B 100%);
  background: linear-gradient(to right, #FCCD4B 0%, #FCCD4B 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCCD4B', endColorstr='#FCCD4B',GradientType=1 );
}
.c23-btn1 a.blue {
  background: #3BBBEE;
}
.c23-btn1 span {
  display: inline-block;
  background: url(../img/top/arrow_1.png) no-repeat right center;
  padding-right: 30px;
}

.c23-title1 {
  margin-bottom: 25px;
  background: #00A4EA;
  /*border-bottom: 2px solid #444;*/
  padding: 5px 10px;
  color: #fff;
}
.c23-title1.graduation {
  background: -moz-linear-gradient(left, #00A4EA 0%, #3bc5dd 100%);
  background: -webkit-linear-gradient(left, #00A4EA 0%, #3bc5dd 100%);
  background: linear-gradient(to right, #00A4EA 0%, #3bc5dd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00A4EA', endColorstr='#3bc5dd',GradientType=1 );
}
.c23-title1.pink {
  background-color: #EF8994;
  border-bottom-color: #B04A55;
}
.c23-title1.orange {
  background-color: #F8A93C;
  border-bottom-color: #985905;
}
.c23-title1.orange2 {
  background-color: #F5B160;
  border-bottom-color: #B67221;
}
.c23-title1.blue2 {
  background-color: #34A0D1;
  border-bottom-color: #006192;
}
.c23-title1.green {
  background-color: #8FC770;
  border-bottom-color: #508831;
}
.c23-title1 .h {
  font-size: 25px;
  font-size: 2.5rem;
  line-height: 160%;
  text-align: center;
}
.c23-title1 p {
  margin-top: 8px;
}

.c23-title2 {
  border-bottom: 2px solid #00A4EA;
  text-align: center;
  padding-bottom: 15px;
  margin-bottom: 20px;
}
.c23-title2 .h {
  color: #00A4EA;
  font-weight: bold;
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 160%;
}
.c23-title2.pink {
  border-bottom-color: #E2415E;
}
.c23-title2.pink .h {
  color: #E2415E;
}

.c23-table1 table {
  width: 100%;
  font-size: 15px;
  font-size: 1.5rem;
}
.c23-table1 th,
.c23-table1 td {
  vertical-align: middle;
  text-align: left;
  border: 1px solid #ccc;
  padding: 8px 12px;
}
.c23-table1 th {
  text-align: center;
  font-weight: normal;
  background: #eee;
}

/* ----------------------------- スマホ（～767px） */
@media screen and (max-width: 767px) {
  .c23-btn1 {
    margin-top: 30px;
  }
  .c23-btn1 a {
    font-size: 14px;
    font-size: 1.4rem;
    padding-top: 14px;
    padding-bottom: 14px;
    width: calc(100% - 30px);
    margin-left: 15px;
    margin-right: 15px;
  }
  .c23-btn1 span {
    background-size: 5px auto;
    padding-right: 15px;
    display: block;
  }

  .c23-title1 {
    margin-bottom: 15px;
  }
  .c23-title1 .h {
    font-size: 18px;
    font-size: 1.8rem;
    text-align: center;
  }

  .c23-title2 {
    padding-bottom: 12px;
    margin-bottom: 15px;
  }
  .c23-title2 .h {
    font-size: 20px;
    font-size: 2rem;
  }

  .c23-table1-sp table,
  .c23-table1-sp thead,
  .c23-table1-sp tbody,
  .c23-table1-sp tr,
  .c23-table1-sp th,
  .c23-table1-sp td {
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .c23-table1-sp th,
  .c23-table1-sp td {
    position: relative;
    margin-top: -1px;
  }
}