/* CSS Document */

@charset "utf-8";

.txtright{text-align: right;
    display: block;}

.table-buttons{display: flex; flex-wrap: wrap;gap:1%; margin-bottom: 1.5%;}
.table-buttons button{border: 4px solid #2684cc;border-radius: 0;box-sizing: border-box; padding: 10px 20px;background: #fff; color: #2684cc; font-size: 20px; font-weight: bold;cursor: pointer;    width: 19.13%;}
.table-buttons button.active{background: #2684cc;color: #fff;}

.table-scroll{
  width:100%;
  overflow-x:auto;
}

.Purchases-table-wrap{
    margin-bottom: 80px;}

.Purchases-none{margin-bottom: 80px;}

/* テーブル */
.contract-table{
  width:100%;
  min-width:600px;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:15px;
}

/* ヘッダー */
.contract-table th{
  background:#2684cc;
  color:#fff;
  text-align:left;
  padding:12px 16px;
  border-right:4px solid #fff;
  font-weight:700;
}

/* セル */
.contract-table td{
  padding:14px 16px;
  border-right:4px solid #fff;
  font-weight:600;
}

/* 行色 */
.contract-table tbody tr:nth-child(odd){
  background:#e5f6ff;
}

.contract-table tbody tr:nth-child(even){
  background:#fff;
}

/* 列幅 */
.col-date{
  width:120px;
}

.col-name{
  width:auto;
}

.col-number{
  width:220px;
}

img{width: 100%; height: auto; vertical-align: bottom;}

.news-list {
    max-width: 900px;
        border-collapse: separate;
        border-spacing: 0 20px;
        margin: 0 auto;
    padding: 0 20px;
    border-top: 2px solid #2297d2;
    border-bottom: 2px solid #2297d2;
    background: #fff;
      }
      .news-list-row a {
          border-top: 1px solid #a0b1c1;
      }
.news-list-row a:first-child{border-top:unset;}

.news-list-row a{display: flex; align-items: center;padding: 20px 10px;transition: background .2s; text-decoration: none;}
.news-list-row a:hover{background: #e2e2e2;}

      .news-date {
        flex: none;
        color: #189edb;
        font-size: 15px;
        min-width: 110px;
        padding-right: 15px;
        line-height: 150%;
        font-weight: 500;
      }
      .news-body {
        color: #666;
        font-size: 17px;
          line-height: 160%;
        line-height: 1.5;
        word-break: break-all;
      }
      .news-more-btn-wrap {
        text-align: center;
        margin-bottom: 65px;
      }
      .news-more-btn {
        margin: 20px 0 0 0;
        display: inline-block;
        padding: 13px 40px;
        background: #fff;
        border: 2px solid #2297d2;
        color: #2297d2;
        font-size: 15px;
        font-weight: bold;
        cursor: pointer;
        transition: background 0.15s;
        box-sizing: border-box;
        position: relative;
          text-decoration: none;
      }
      .news-more-btn:after {
        content:'';
        position: absolute;
        border: solid #2297d2;
        border-width: 0 2px 2px 0;
        padding: 4px;
          top: 41%;
        transform: rotate(-45deg);
        vertical-align: middle;
        right: 10px;
      }

.generalBtn-twoC{display: flex;gap:3%;flex-wrap: wrap;}

.generalBtn-twoB{width: 48.5%;}
.generalBtn-twoB a{
    margin: 0 auto;
    font-family: sans-serif !important;
    font-weight: bold;
    display: block;
    position: relative;
    text-align: center;
    background: #fff;
    color: #1a4899;
    border: 2px #1a4899 solid;
    font-size:clamp(13px, 2vw, 17px);
    padding: 2.4rem 1.5rem;
    text-decoration: none;
    transition: background .2s;
    box-sizing: border-box;}
.generalBtn-twoB a::before,
.generalBtn-twoB a::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.generalBtn-twoB a::after{
width: 14px;
    height: 14px;
    right: 1.8rem;
	border-top: 2px solid #1a4899;
	border-right: 2px solid #1a4899;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.generalBtn-twoB a:hover{
        background: #1a4899; color: #fff;
      }

.generalBtn-twoB a:hover::after {
        border-top: 2px solid #fff;
	border-right: 2px solid #fff;
      }

.generalBtn-twoB button{
    cursor: pointer;
    width: 90%;
    max-width: 330px;
    margin: 0 auto;
    font-family: sans-serif !important;
    font-weight: bold;
    display: block;
    position: relative;
    text-align: center;
    background: #fff;
    color: #1a4899;
    border: 2px #1a4899 solid;
    font-size: clamp(16px, 2vw, 18px);
    padding: 2.4rem 1.5rem;
    text-decoration: none;
    transition: background .2s;
    box-sizing: border-box;}
.generalBtn-twoB button::before,
.generalBtn-twoB button::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.generalBtn-twoB button::after{
width: 14px;
    height: 14px;
    right: 1.8rem;
	border-top: 2px solid #1a4899;
	border-right: 2px solid #1a4899;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.generalBtn-twoB button:hover{
        background: #1a4899; color: #fff;
      }

.generalBtn-twoB button:hover::after {
        border-top: 2px solid #fff;
	border-right: 2px solid #fff;
      }

.studying-cont-btn{display: flex; justify-content:flex-start; align-items: center; flex-wrap: wrap;gap:3%; margin-bottom: 45px;}
.studying-cont-btn a{position: relative;width: 31.3%;box-sizing: border-box;display: block; border: 4px solid #2297d2;}
.studying-cont-btn a::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.studying-cont-btn a::after{
width: 14px;
    height: 14px;
    right: 1.8rem;
	border-top: 2px solid #2297d2;
	border-right: 2px solid #2297d2;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.studying-cont-btn a:hover{opacity: 0.8;}

#sugoroku-area{margin: 0 auto 80px auto;}

.sugoroku-area-h4{    position: relative;
    z-index: 1;
    /* border: 4px solid #2297d2; */
    box-sizing: border-box;
    width: 30%;
    max-width: 200px;
    margin: 0 auto;
    padding: 0.8%;
    background: #fff;}

.pull-area{border: 4px solid #2297d2; box-sizing: border-box; padding:22px 30px 10px 30px;}
.pull-area .txt01{font-size: 18px; text-align: center; margin-bottom: 9px;}

.register-arrow-cont{text-align: right;}
.register-arrow {
          font-family: "corporate-logo-ver2", sans-serif !important;
          position: relative;
        align-items: center;
        justify-content: center;
        background: #fff;
        color: #1a4899;
        font-size: 18px;
        padding:0 4rem 0 4rem;
        text-decoration: none;
        transition: background .2s;
        display: inline-block;
        margin: 10px auto 0 auto;
        text-align: center;
      }
      .header-register-btn1:hover {
        opacity: 0.8;
      }

.register-arrow::before,
.register-arrow::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
        
.register-arrow::before{
	box-sizing: border-box;
	width: 21px;
	height: 21px;
	border: 2px solid #1a4899;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.register-arrow::after{
	width: 6px;
	height: 6px;
    right: 1.8rem;
	border-top: 1px solid #1a4899;
	border-right: 1px solid #1a4899;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}


.menber-contents{padding: 1rem 0 8rem 0;}

.menbers-btns-wrap{width: 100%; padding: 34px 0px;}

.menbers-btns1{width: 94%;
    max-width: 1000px;display: flex; gap:2%; justify-content: flex-start;flex-wrap: wrap; margin: 30px auto 20px auto;position: relative; z-index: 1;}
.menbers-btns1 li{margin-bottom: 2%; width: 32%;display: flex;}

.menbers-btn {
    flex-grow: 1;
    font-size: 17px;
    font-weight: bold;
     display: flex;
    align-items: center;
    text-align: left;
  border: 1px solid #2297d2;
  position: relative;
  background: #2684cc;
  color: #fff;
  overflow: hidden;
  padding:2rem 3rem 2rem 2rem;
  transition: all .3s;
    box-sizing: border-box;
    text-decoration: none;
}

.menbers-btn:hover{opacity: 0.8;}

.menbers-btn::before,
.menbers-btn::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.menbers-btn::before {
  width: 7px;
  height: 7px;
  right: 1.5rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
  transition: all .3s;
}


.generalBtn-E{margin-top: 30px;}
.generalBtn-E a{
   width: 90%;
    max-width: 300px;
    margin: 0 auto;
    font-family: sans-serif !important;
    font-weight: bold;
    display: block;
    position: relative;
    text-align: center;
    background: #fff;
    color:#2E2E2E;
    border: 2px #2297d2 solid;
    font-size: clamp(14px, 2vw, 16px);
    padding: 2.4rem 1.5rem;
    text-decoration: none;
    transition: background .2s;
    box-sizing: border-box;
cursor: pointer;}
.generalBtn-E a::before,
.generalBtn-E a::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.generalBtn-E a::after{
width: 14px;
    height: 14px;
    right: 1.8rem;
	border-top: 2px solid #2297d2;
	border-right: 2px solid #2297d2;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.generalBtn-E a:hover{
        background: #2297d2; color: #fff;
      }

.generalBtn-E a:hover::after {
        border-top: 2px solid #fff;
	border-right: 2px solid #fff;
      }

.generalBtn-E button{
    cursor: pointer;
    width: 90%;
    max-width: 330px;
    margin: 0 auto;
    font-family: sans-serif !important;
    font-weight: bold;
    display: block;
    position: relative;
    text-align: center;
    background: #fff;
    color: #1a4899;
    border: 2px #1a4899 solid;
    font-size: clamp(16px, 2vw, 18px);
    padding: 2.4rem 1.5rem;
    text-decoration: none;
    transition: background .2s;
    box-sizing: border-box;}
.generalBtn-E button::before,
.generalBtn-E button::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.generalBtn-E button::after{
width: 14px;
    height: 14px;
    right: 1.8rem;
	border-top: 2px solid #1a4899;
	border-right: 2px solid #1a4899;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.generalBtn-E button:hover{
        background: #1a4899; color: #fff;
      }

.generalBtn-E button:hover::after {
        border-top: 2px solid #fff;
	border-right: 2px solid #fff;
      }

.news-h2{color: #2297d2; border-top: 3px #2297d2 solid; border-bottom: 3px #2297d2 solid; padding: 15px 5px;font-size: 28px; margin-bottom: 45px;}
.news-about-cont p{font-size: 18px; line-height: 160%;}
.news-about-date{text-align: right; font-size: 15px;}


.Registration-list {
    background: #fff;
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 2px;
    margin-bottom: 30px;
}
.Registration-list li {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 0;
    border-bottom: 3px solid #e9e9e9;
    font-size: 18px;
}
.Registration-list .label {
    width: 54%;
    flex-shrink: 0;
    margin-right: 3%;
    font-weight: 500;
}
.Registration-list .value {
    width: 43%;    display: flex;
    justify-content: end;
}

.Registration-list-btns{display: flex;gap:3%; width: 85%;}
.Registration-list-btns li{width: 48.5%;border-bottom:unset;flex-grow: 1;display: block;padding: 0;}
.Registration-list-btns li a{display: block; padding: 20px 20px 20px 20px; color: #fff; background: #000;text-align: center; text-decoration: none; font-size: 15px;position: relative;}

.Registration-list-btns li a:hover{opacity: 0.9;}

.Registration-list-btns li a.blue{background: #1a4899;}
.Registration-list-btns li a.blue::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.Registration-list-btns li a.blue::after{
width: 9px;
    height: 9px;
    right: 1rem;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.Registration-list-btns li a.red{background: #b12536;}
.Registration-list-btns li a.red::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1rem;
	margin: auto;
	content: "";
	width: 19px;
	height: 23px;
	background: url("../image/common/update.png") no-repeat center center;
	background-size: contain;
}

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin: 20px 0;
  padding: 0;
}

.pagination li {
  list-style: none;
}

.pagination a {
  display: block;
  min-width: 36px;
  padding: 8px 12px;
  text-align: center;
  text-decoration: none;
  color: #189edb;
  border: 1px solid #189edb;
  font-size: 14px;
  transition: all 0.2s ease;
}

/* ホバー */
.pagination a:hover {
  background: #189edb;
  color: #fff;
}

/* 現在ページ */
.pagination .active a {
  background: #189edb;
  color: #fff;
  font-weight: bold;
}

/* 無効（prevなど） */
.pagination .disabled a { 
  color: #ccc;
  border-color: #ccc;
  pointer-events: none;
}

/* 前へ・次へだけ少し広め */
.pagination .prev a,
.pagination .next a {
  padding: 8px 16px;
}

@media screen and (max-width:970px){
    .Registration-list-btns li a{padding: 20px 30px 20px 20px;}
    .Registration-list .label {width: 50%;}
.Registration-list .value {width: 47%;}
}

@media screen and (max-width:768px){
    .Purchases-scllor{font-size: 13px; text-align: right;}
    
    .pagination a {
    min-width: 12px;
    padding: 8px 11px;
    font-size: 12px;
}
    
    .pagination .prev a, .pagination .next a {
    padding: 8px 8px;
}
    
    .Registration-list li{flex-wrap: wrap;}
    .Registration-list .label {
        width: 100%;
        margin-bottom: 10px;margin-right: 0;
    }
    .Registration-list .value {
        width: 90%;
        margin: 0 auto;
    }
    .Registration-list-btns {
    width: 100%;
}
    
    .news-h2{font-size: 23px; }
    .news-about-cont p{font-size: 16px; line-height: 160%;}
.news-about-date{text-align: right; font-size: 12px;}
    
    .generalBtn-E a {
    width: 70%;
    font-size: clamp(13px, 2vw, 16px);
    padding: 1.7rem 1.5rem;
}
    
    .generalBtn-E a::after {
    width: 9px;
    height: 9px;
}
    
    .menbers-btn {font-size: 15px;}
    .menbers-btns1{gap:0;}
    .menbers-btns1 li {margin-bottom: 3%;width: 100%;}
    
    .table-buttons{gap:2%; margin-bottom: 2%;}
    .table-buttons button {
        margin-bottom: 2%;
    font-size: 17px;
    width: 32%;}
    
    .generalBtn-twoB a::after {
    width: 9px;
    height: 9px;
}
    
    .register-arrow {font-size: 16px;}
    
    .news-more-btn {font-size: 13px;}
    .studying-cont-btn a::after {
    width: 9px;
    height: 9px;
        right: 1.1rem;}
    .pull-area .txt01 {
    font-size: 14px;
}
    
    .studying-cont-btn a{width: 48.5%; margin-bottom: 3%;padding:3% 1%;border: 2px solid #2297d2;}
    
    .pull-area {
    border: 2px solid #2297d2;
}
    
    .news-date {
    font-size: 13px;
    min-width: 85px;
}
    
    .news-body {
    font-size: 16px;
}
    
	}