@charset "utf-8";
/* 入会案内 */

.g_navi_menu .gnav05 a::after {
opacity: 1;
}
.intro_copy {
font-size: 2.2rem;
font-weight: 700;
letter-spacing: 0.2em;
margin-bottom: 30px;
}
.intro_txt {
font-size: 1.5rem;
line-height: 200%;
margin-bottom: 80px;
}

@media all and (max-width : 767px ){
.intro_copy {
font-size: 1.8rem;
letter-spacing: 0.15em;
margin-bottom: 20px;
}
.intro_txt {
font-size: 1.2rem;
line-height: 180%;
margin-bottom: 50px;
}
}


/*-------------------------------------------------
入会について
-------------------------------------------------*/

.join_box {
width: 100%;
border-top: solid 1px #ccc;
border-left: solid 1px #ccc;
letter-spacing: 0.2em;
margin-bottom: 80px;
}
.join_box th {
background-color: #242528;
padding: 20px 10px;
text-align: center;
font-size: 1.8rem;
font-weight: 500;
color: #fff;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
}
.join_box td {
background-color: #fff;
padding: 20px 10px;
text-align: center;
font-size: 1.5rem;
font-weight: 500;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
}

@media all and (max-width : 767px ){
.join_box {
letter-spacing: 0.1em;
margin-bottom: 40px;
}
.join_box th {
padding: 12px 10px;
font-size: 1.3rem;
}
.join_box td {
padding: 12px 5px 12px 5px;

font-size: 1.2rem;
line-height: 145%;
}
.join_box .subtitle {
font-size: 1.2rem;
white-space: nowrap;
}
}

/*-------------------------------------------------
当法人の主な活動
-------------------------------------------------*/

.contact_box {
position: relative;
margin: 0px auto 100px;
background-color: #fff;
color: #111;
padding: 55px 0 55px;
z-index: 5;
transition: all 0.3s;
}
.contact_box:hover {
background-color: #37454A;
color: #fff;
transition: all 0.3s;
}
.contact_title {
font-weight: 700;
font-size: 2.0rem;
letter-spacing: 0.1em;
text-align: center;
position: relative;
}
.circle {
position: absolute;
top: 0;
left: auto;
right: 60px;
bottom: 0;
width: 31px;
height: 31px;
color: #aaa;
margin: auto;
}

@media all and (max-width : 1024px ){
.circle {
position: absolute;
right: 40px;
}
}

@media all and (max-width : 767px ){
.circle {
position: absolute;
right: 20px;
width: 21px;
height: 21px;
}
}

.circle::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
border-style: solid;
border-width: 1px;
-webkit-transition: .3s;
transition: .3s;
border-color: #333;
}
.circle svg {
position: absolute;
top: 11px;
left: 50%;
-webkit-transition: .3s;
transition: .3s;
-webkit-transform-origin: left;
transform-origin: left;
fill: #333;
}

@media all and (max-width : 767px ){
.circle svg {
width: 22px;
height: 7px;
position: absolute;
top: 7px;
left: 50%;
}
}

.contact_box:hover .circle::before {
-webkit-transform: scale(1.58);
transform: scale(1.58);
background-color: #aaa;
border-color: transparent;
opacity: .7;
-webkit-transition: -webkit-transform .5s cubic-bezier(.08,.92,.35,1);
transition: -webkit-transform .5s cubic-bezier(.08,.92,.35,1);
transition: transform .5s cubic-bezier(.08,.92,.35,1);
transition: transform .5s cubic-bezier(.08,.92,.35,1),-webkit-transform .5s cubic-bezier(.08,.92,.35,1)
}
.contact_box:hover .circle svg {
fill: #aaa;
-webkit-transform: translateX(13px);
transform: translateX(13px);
-webkit-transition: -webkit-transform .5s cubic-bezier(.08,.92,.35,1);
transition: -webkit-transform .5s cubic-bezier(.08,.92,.35,1);
transition: transform .5s cubic-bezier(.08,.92,.35,1);
transition: transform .5s cubic-bezier(.08,.92,.35,1),-webkit-transform .5s cubic-bezier(.08,.92,.35,1)
}


@media all and (max-width : 1024px ){
.contact_box {
margin: 0 auto 80px;
padding: 35px 0 35px;
}
.contact_title {
font-size: 1.6rem;
}
}

@media all and (max-width : 820px ){
.contact_title {
font-size: 1.5rem;
}
}

@media all and (max-width : 767px ){
.contact_box {
padding: 15px 0 15px;
margin-bottom: 50px;
}
.contact_title {
font-size: 1.2rem;
}
}


/*-------------------------------------------------
主な会員様サービス
-------------------------------------------------*/

.business_box_wrap {
display: flex;
flex-wrap: wrap;
margin-bottom: 80px;
}
.business_box {
width: calc(33.3333333% - 60px / 3);
margin-right: 30px;
margin-bottom: 30px;
position: relative;
background: #fff;
}

@media all and (max-width : 1024px ){
.business_box {
width: calc(33.3333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 20px;
}
}

.business_box:nth-child(3n) {
margin-right: 0px;
}

@media all and (max-width : 820px ){
.business_box {
width: calc(50% - 30px / 2);
margin-right: 30px;
margin-bottom: 30px;
}
.business_box:nth-child(3n) {
margin-right: 30px;
}
.business_box:nth-child(2n) {
margin-right: 0px;
}
}

.business_imgbox {
position: relative;
}
.service_imgbox img {
width: 100%;
}
.business_txt_box {
padding: 15px 20px 20px;
}

@media all and (max-width : 820px ){
.business_txt_box {
padding: 10px 20px;
}
}

.business_title {
font-weight: 500;
font-size: 1.6rem;
letter-spacing: 0.15em;
margin-bottom: 15px;
}
.business_txt {
font-size: 1.4rem;
line-height: 180%;
}

@media all and (max-width : 820px ){
.business_title {
font-size: 1.4rem;
letter-spacing: 0.1em;
margin-right: 10px;
}
.business_txt {
font-size: 1.3rem;
line-height: 180%;
margin-bottom: 20px;
}
}

@media all and (max-width : 767px ){
.business_box_wrap {
margin-bottom: 30px;
}
.business_box {
width: 100%;
margin-right: 0px;
margin-bottom: 20px;
}
.business_box:nth-child(3n) {
margin-right: 0px;
}
.business_txt_box {
padding: 15px 10px 10px 10px;
}
.business_title {
font-size: 1.4rem;
letter-spacing: 0.1em;
margin-bottom: 10px;
}
.business_txt {
font-size: 1.2rem;
line-height: 160%;
}
}


/*-------------------------------------------------
入会方法
-------------------------------------------------*/

.admission_txt {
font-size: 1.5rem;
margin: 0 0 40px 40px;
}
#page_guidance .link_btn_box {
justify-content: flex-start;
margin-left: 40px;
margin-bottom: 40px;
}
.addressee {
font-weight: 700;
font-size: 1.5rem;
color: #555;
letter-spacing: 0.1em;
margin: 0 0 15px 30px;
}
.cresit {
margin-left: 40px;
color: #555;
}
.cresit dt {
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 10px;
}
.cresit dd {
font-size: 1.4rem;
line-height: 180%;
}
.cresit dd a {
text-decoration: underline;
color: #8E7742;
}
.cresit dd a:hover {
text-decoration: none;
}

@media all and (max-width : 767px ){
.admission_txt {
font-size: 1.2rem;
margin: 0 0 20px 20px;
}
#page_guidance .link_btn_box {
justify-content: flex-start;
margin-left: 15px;
margin-bottom: 30px;
}
#page_guidance .link_btn {
font-size: 1.2rem;
padding: 12px 125px 12px 125px;
}
.addressee {
font-weight: 700;
font-size: 1.3rem;
margin: 0 0 10px 15px;
}
.cresit {
margin-left: 20px;
margin-bottom: 10px;
}
.cresit dt {
font-size: 1.3rem;
}
.cresit dd {
font-size: 1.2rem;
line-height: 160%;
}
}