@charset "utf-8";
/*
css/style.css
*/

/*  header
========================================*/
#header_contents {
z-index: 300;
position: absolute;
top: -80px;
left: 0;
width: 100%;
margin-top: 80px;
}
#header_contents.fixed {
position: fixed;
background-color: #fff;
top: -80px;
margin-top: 0;
transition: top 0.3s ease;
}
#header_contents.slideDown {
box-shadow: 0 5px 15px -3px rgba(0, 0, 0, 0.2);
top: 0;
}
#header_contents .inner {
position: relative;
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: space-between;
}
.header_logo {
display: inline-block;
width:244px;
margin-left: 15px;
}
.header_logo img {
height: 65px;
}
#sub_nav {
display: flex;
justify-content: flex-end;
position: relative;
min-width: 400px;
}
#header_contents .sub_nav {
display: flex;
}
#header_contents .sub_nav_btn a {
display: flex;
align-items: center;
justify-content: center;
width: 235px;
height: 80px;
font-size: 20px;
font-size: 2rem;
color: #fff;
transition: background-color 0.3s;
}
#header_contents .sub_nav_btn:nth-child(1) a:link,
#header_contents .sub_nav_btn:nth-child(1) a:visited {
background-color: var(--color1);
}
#header_contents .sub_nav_btn:nth-child(1) a:hover {
background-color: var(--color2);
}
#header_contents .sub_nav_btn:nth-child(2) a:link,
#header_contents .sub_nav_btn:nth-child(2) a:visited {
background-color: var(--color3);
}
#header_contents .sub_nav_btn:nth-child(2) a:hover {
background-color: var(--color4);
}


@media screen and (max-width: 900px) {
#header_contents .sub_nav_btn a {
width: 25vw;
}
}
@media screen and (max-width: 1200px) {
#header_contents {
background-color: #fff;
}
}



/*  header_slider
========================================*/
#header_slider_wrap {
width: 100%;
height: 940px;
display: flex;
justify-content: space-between;
padding-bottom: 80px;
}


/*slider_catch*/
#header_slider_catch {
margin: 80px -7.8125vw -80px 0;
width: 50vw;
display: flex;
align-items: center;
background-color: var(--color1);
position: relative;
z-index: 2;
}
#header_slider_catch .caption {
padding: 0 0 128px 88px;
width:100%;
overflow: hidden;
}
@media (max-width: 1280px) {
#header_slider_catch .caption {
display: inline-block;
margin: 0 auto;
padding-left: 1em;
padding-right: 1em;
}
}
#header_slider_catch .sub_catch_en {
font-size: 20px;
font-size: 2rem;
color: #fff;
margin-bottom: 1em;
opacity: 0;
}
#header_slider_catch .catch {
font-size: 60px;
font-size: 6rem;
line-height: 1.2;
margin-bottom: 0.6em;
color: #fff;
opacity: 0;
}
#header_slider_catch .sub_catch {
font-size: 35px;
font-size: 3.5rem;
line-height: 1;
display:block;
}
#header_slider_wrap .sub_catch .line1,
#header_slider_wrap .sub_catch .line2 {
display: inline-block;
margin-bottom: 3px;
}
#header_slider_wrap .sub_catch .txt_wrapper {
display: inline-block;
overflow: hidden;
width:0;
}
#header_slider_catch .sub_catch .txt {
display: inline-block;
padding: 0.4em;
color: #252525;
background-color: #fff;
white-space: nowrap;
}



#header_slider_wrap.animate0 .sub_catch_en {
animation: slideUp 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1s;
}
#header_slider_wrap.animate0 .catch {
animation: slideUp 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2s;
}
#header_slider_wrap.animate0 .sub_catch .line1 .txt_wrapper {
width:100%;
animation: slideRight3 1s cubic-bezier(.4, 0, .2, 1) both 3.5s;
}
#header_slider_wrap.animate0 .sub_catch .line2 .txt_wrapper {
width:100%;
animation: slideRight3 1s cubic-bezier(.4, 0, .2, 1) both 5.5s;
}




/*scroll*/
#scroll {
position: absolute;
bottom: 0;
left: 88px;
display: inline-block;
z-index: 3;
}
.arrow_wrapper {
position: absolute;
right: 0;
bottom: 0;
height: 128px;
}
.arrow_inner p {
font-size: 14px;
font-size: 1.4rem;
padding: 20px 0 0 5px;
color: #fff;
text-align: end;
transform: rotate(90deg);
position: absolute;
left: 0;
top: 0;
}
.arrow {
width: 2px;
height: 128px;
margin: 0 auto;
background-color: #fff;
position: relative;
overflow: hidden;
}
.arrow::before {
content: '';
width: 4px;
height: 128px;
margin: 0 auto;
background-color: var(--color1);
position: absolute;
top: 0;
left: 0;
animation: arrow 2.5s ease 0s infinite normal;
}


/*slider*/
#header_slider {
width: 57.8125%;
height: 940px;
}
.swiper-slide img {
width: 100%;
display: block;
object-fit: cover;
}
#header_slider .swiper-slide img {
height: 940px;
}
.swiper-slide video {
width: 100%;
height: 940px;
object-fit: cover;
}



.swiper-slide {
width: 100%;
height: 940px;
overflow: hidden;
position: relative;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 26px;
left: 0;
width: 96.5%;
}
.swiper-pagination {
text-align: right;
}
.swiper-pagination-bullet {
width: 12px;
height: 12px;
background: #fff;
opacity: 1;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: var(--color2);
}



/*  コンテンツ共通
========================================*/

.section {
padding-top: 230px;
}
@media screen and (max-width: 1919px) {
.section {
padding-top: 11vw;
}
}

/*sec_header（セクションのタイトル部分）*/
.sec_header {
width: 100%;
max-width: 920px;
margin: 0 auto 120px;
text-align: center;
}
.sec_header .headline {
font-size: 64px;
font-size: 6.4rem;
font-weight: 600;
margin-bottom: 30px;
color: #252525;
}
.sec_header .sub_title {
font-size: 16px;
font-size: 1.6rem;
color: var(--gry);
}

.sec_header .sub_title.lead {
margin-top: 60px;
line-height: 2.3;
}
.sec_header .icon {
width: 210px;
margin: 45px auto 0;
}

/*sec_content（セクションのコンテンツ）*/
.sec_content, .sub #wrap_box {
width: 98%;
max-width: 1000px;
margin: 0 auto;
}
.sec_content.wide {
width: 100%;
max-width: 1920px;
}
.sec_content.mid {
width: 98%;
max-width: 1134px;
}

/*タイトル類*/
.sec_content .title01, .sub #wrap_box h3 {
font-size: 28px;
font-size: 2.8rem;
line-height: 1.5;
font-weight: 600;
color: #252525;
border-left: 5px solid var(--color1);
padding: 0.3em 0.3em 0.3em 0.8em;
margin-bottom: 1.5em;
}
.c-form-policyAgree h4{
    font-weight: bold;
    font-size:125%;
}

/*本文*/
.sec_content .desc, .sub #wrap_box .module_contents, .sub #wrap_box .text, .sub #wrap_box .desc, .sub #wrap_box_full .desc {
line-height: 2.3;
color: var(--gry);
}
.sec_content .desc + .desc {
padding-top: 2em;
}

/*ボタンリンク*/
.btn_wrapper {
text-align: center;
margin: 70px auto 0;
}

.btn1 {
display: inline-block;
margin: 0 10px;
width: 420px;
padding: 1.5em 0;
color: var(--blk);
text-align: center;
text-decoration: none;
position: relative;
transition: 0.2s ease-in-out;
}

.btn1:before {
content: '';
width: 100%;
height: 1px;
background: var(--color3);
position: absolute;
top: -1px;
right: 0;
transition: 0.1s ease-in-out 0.1s;
}

.btn1:after {
content: '';
width: 1px;
height: 100%;
background: var(--color3);
position: absolute;
bottom: 0;
right: -1px;
transition: 0.1s ease-in-out 0.2s;
}

.btn1 span:before {
content: '';
width: 100%;
height: 1px;
background: var(--color3);
position: absolute;
bottom: -1px;
left: 0;
transition: 0.1s ease-in-out 0.3s;
}

.btn1 span:after {
content: '';
width: 1px;
height: 100%;
background: var(--color3);
position: absolute;
top: 0;
left: -1px;
transition: 0.1s ease-in-out;
}

.btn1:hover span:after {
height: 0;
}

.btn1:hover:before {
width: 0;
}

.btn1:hover:after {
height: 0;
}

.btn1:hover span:before {
height: 5px;
background: var(--color3);
}



/*  AUTONOMY and UNIQUE
========================================*/
/*layout_col_type1（左に写真があるブロック）*/
.content_wrapper.layout_col_type1 {
display: flex;
justify-content: space-between;
}
.content_wrapper.layout_col_type1 .col_image {
width: 960px;
height: 565px;
overflow: hidden;
position: relative;
}
.content_wrapper.layout_col_type1 .col_image img {
width: 960px;
height: 565px;
display: block;
object-fit: cover;
}

.content_wrapper.layout_col_type1 .col_image .mask{
width:100%;
height: 100%;
background-color: #fff;
position: absolute;
top:0;
left:0;
z-index: 5;
}



.content_wrapper.layout_col_type1 .col_txt {
display: inline-block;
width: 960px;
padding: 0 94px 0 80px;
box-sizing: border-box;
}
@media screen and (max-width: 1919px) {
.content_wrapper.layout_col_type1 .col_image {
width: 50vw;
height: 29.5vw;
}
.content_wrapper.layout_col_type1 .col_image img {
width: 49vw;
height: 29.5vw;
}

.content_wrapper.layout_col_type1 .col_txt {
width: 50vw;
padding: 0 4.895vw;
}
}




/*  SERVICE
========================================*/
/*layout_box_type1（SERVICE ボックス3個並び）*/
.content_wrapper.layout_box_type1 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding: 0 28px;
}
.layout_box_type1 .box_item {
width: 32%;
max-width: 575px;
position: relative;
z-index: 2;
padding-bottom: 10rem;
}
.layout_box_type1 .box_item .box_txt {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 40px 70px 40px 40px;
position: relative;
}
.layout_box_type1 .box_item .box_txt::before {
content: '';
width: 100%;
height: calc(100% + 136px);
background-color: #f0f0f0;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.layout_box_type1 .box_item .box_txt::after {
content: '';
width: 40px;
height: 100%;
background-color: var(--color3);
position: absolute;
top: 0;
right: 0;
background-image: url('/files/user/common/img/box_type1_arrow.png');
background-repeat: no-repeat;
background-position: center center;
background-size: 100% auto;
transition: background-color 0.3s;
}
.layout_box_type1 .box_item .title02 {
font-size: 55px;
font-size: 5.5rem;
color: var(--color3);
position: absolute;
top: -0.5em;
left: 0;
transition: color 0.3s;
}
.layout_box_type1 .box_item:hover .box_txt::after {
background-color: var(--color1);
}
.layout_box_type1 .box_item:hover .title02 {
color: var(--color1);
}
.layout_box_type1 .box_item .catch {
font-size: 28px;
font-size: 2.8rem;
line-height: 1.5;
font-weight: 600;
}

.layout_box_type1 .box_item .desc {
color: var(--blk);
padding-top: 1em;
}
.layout_box_type1 .box_item .box_image {
width: 406px;
height: 271px;
overflow: hidden;
margin: 0 0 0 auto;
}


@media (max-width: 1920px) {
.layout_box_type1 .box_item .box_txt {
padding: 2.083333vw 3.645833vw 2.083333vw 2.083333vw;
}
.layout_box_type1 .box_item .box_txt::before {
height: calc(100% + 7.083333vw);
}
.layout_box_type1 .box_item .box_txt::after {
width: 2.083333vw;
}
.layout_box_type1 .box_item .title02 {
font-size: 2.864583vw;
}
.layout_box_type1 .box_item .catch {
font-size: 1.3vw;
}
.layout_box_type1 .box_item .box_image {
width: 70.608696%;
height: auto;
}
} 

.layout_box_type1 .box_item .box_image img {
width: 406px;
height: 271px;
display: block;
object-fit: cover;
transition: transform 0.75s ease;
}
.layout_box_type1 .box_item:hover .box_image img {
transform: scale(1.1);
}



/*  MEMBER
========================================*/
/*layout_box_type2（MEMBER ボックス4個並び）*/
.content_wrapper.layout_box_type2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding: 0 28px;
}
.content_wrapper.layout_box_type2:before {
display: block;
content:"";
width: 385px;
order: 1;
margin: 0 10px 50px;
padding-left: 57px;
}
.content_wrapper.layout_box_type2:after {
display: block;
content:"";
width: 385px;
margin: 0 10px 50px;
padding-left: 57px;
}
.layout_box_type2 .box_item {
width: 385px;
position: relative;
margin: 0 10px 50px;
padding-left: 57px;
}
.layout_box_type2 .box_item a {
display: block;
position: relative;
}
.layout_box_type2 .box_item .box_image {
width: 100%;
height: 385px;
overflow: hidden;
}
.layout_box_type2 .box_item .box_image img {
width: 100%;
height: 385px;
display: block;
object-fit: cover;
transition: transform 0.5s ease;
}

.layout_box_type2 .box_item .box_txt {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}

.layout_box_type2 .box_item .title03 {
font-size: 49px;
font-size: 4.9rem;
color: var(--color5);
position: absolute;
top: -30px;
left: -57px;
z-index: 2;
transition: 1s;
}

.layout_box_type2 .box_item .desc {
background-color: #fff;
font-size: 20px;
font-size: 2rem;
color: var(--blk);
line-height: 1.5;
width:100%;
box-sizing: border-box;
padding: 1.5em 0.6em 0 0.6em;
height: 0;
opacity: 0;
transition: 0.5s;
}

.plate_mask {
width: 100%;
height: 100%;
overflow: hidden;
}

@media (max-width: 1920px) and (min-width: 768px) {
.content_wrapper.layout_box_type2 {
padding: 0;
width: 100%;
}
.content_wrapper.layout_box_type2:before,
.content_wrapper.layout_box_type2:after {
width: 20vw;
margin: 0 0.5vw 2.6vw;
padding-left: 2.9vw;
}
.layout_box_type2 .box_item {
width: 20vw;
position: relative;
margin: 0 0.5vw 2.6vw;
padding-left: 2.9vw;
}
.layout_box_type2 .box_item .box_image {
width: 100%;
height: 20vw;
}
.layout_box_type2 .box_item .box_image img {
width: 100%;
height: 20vw;
}
.layout_box_type2 .box_item .title03 {
font-size: 2.56vw;
top: -1.5625vw;
left: -2.9vw;
}
.layout_box_type2 .box_item .desc {
font-size: 1.04vw;
}
}
.tablet	.layout_box_type2 .box_item .desc {
width:100%;
height: auto !important;
opacity: 1 !important;
}
.tablet	.layout_box_type2 .box_item .box_txt {
bottom: -1px;
left:-1px;
width:calc(100% + 2px);
}
@media (min-width: 960px) {
.layout_box_type2 .box_item:hover .box_image img {
transform: scale(1.1);
}
.layout_box_type2 .box_item:hover .desc {
height: auto;
opacity: 1;
}
}
@media (max-width: 959px) and (min-width: 768px) {
.layout_box_type2 .box_item .desc {
height: auto;
opacity: 1;
}
}



/*  NEWS
========================================*/
.category_list {
display: flex;
justify-content: center;
flex-wrap: wrap;
margin-top: -60px;
margin-bottom: 120px;
}
.category_list li {
margin: 0 58px;
display: inline-block;
}
.category_list a {
display: inline-block;
padding: 0.8em 1.2em;
font-size: 28px;
font-size: 2.8rem;
line-height: 1;
color: var(--blk);
text-align: center;
position: relative;
transition: color 0.3s;
}
.category_list a::after {
content: '';
width: 100%;
height: 1px;
background-color: var(--blk);
position: absolute;
left: 0;
bottom: 0;
transition: background-color 0.3s;
}
@media (min-width: 960px) {
.category_list a:hover {
color: var(--color3);
}
.category_list a:hover::after {
background-color: var(--color3);
}
}
@media (max-width: 1280px) {
.category_list li {
margin: 0 5vw;
}
}

.news_list {
border-left: 5px solid var(--color1);
padding: 0 46px;
}
.news_list li {
display: flex;
width: 100%;
line-height: 1.8;
color: var(--gry);
padding: 1em 0;
}
.news_list .date {
width: 126px;
}
.news_list .category {
color: var(--color3);
display: inline-block;
text-align: center;
white-space: nowrap;
min-width: 4em;
margin-right: 50px;
}
.news_list .category span {
display: inline-block;
min-width: 4em;
position: relative;
}
.news_list .category span::after {
content: '';
width: 100%;
height: 1px;
background-color: var(--color3);
position: absolute;
left: 0;
bottom: 0;
}
.news_list .title {
display: inline-block;
width: calc(100% - 126px - 50px);
transition: color 0.3s;
}
.news_list .title a:link {
color: var(--gry);
}
.news_list .title a:hover {
color: #000;
}
.news_list + .btn_wrapper {
padding-bottom:0;
}

/*  banner_content
========================================*/
/*背景写真を固定用 （それ以外を白マスク）*/
.bg_mask {
background-color: #fff;
}

.banner_content {
display: block;
width: 100%;
background-repeat: no-repeat;
background-position: 50% 100%;
background-size: cover;
}
.banner_content .banner_content_bg {
width: 100%;
height: 700px;
background-color: rgba(20, 26, 38, 0.5);
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #fff;
}
.banner_content .catch {
font-size: 64px;
font-size: 6.4rem;
font-weight: 600;
margin-bottom: 1em;
}
.banner_content .desc {
line-height: 2.3;
}
.banner_content .btn1 {
color: #fff;
}

.banner_content .btn1:before,
.banner_content .btn1:after,
.banner_content .btn1 span:before,
.banner_content .btn1 span:after,
.banner_content .btn1:hover span:before {
background: #fff;
}



/*  BLOG
========================================*/
.banner_content + section {
padding-top: 180px;
}
/*layout_box_type3（BLOG ボックス2個並び）*/
.content_wrapper.layout_box_type3 {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.layout_box_type3 .box_item {
width: 548px;
position: relative;
margin: 0 19px 50px;
}
.layout_box_type3 .box_item .box_image {
width: 220px;
height: 220px;
overflow: hidden;
}

.layout_box_type3 .box_item .box_image img {
width: 220px;
height: 220px;
display: block;
object-fit: cover;
transition: transform 0.75s ease;
}

.layout_box_type3 .box_item .box_txt {
background-color: #fff;
width: 375px;
padding: 30px 0;
position: absolute;
bottom: -1px;
right: 0;
}
.layout_box_type3 .box_item .title04 {
margin: 0 30px 1em;
font-size: 20px;
font-size: 2rem;
line-height: 1.5;
}
.layout_box_type3 .box_item .date {
margin: 0 30px;
background-color: #f0f0f0;
padding: 10px;
transition: background-color 0.3s;
position: relative;
}
@media (min-width: 960px) {
.layout_box_type3 .box_item:hover .box_image img {
transform: scale(1.1);
}
.layout_box_type3 .box_item:hover .date {
background-color: #f8f8f8;
}
.layout_box_type3 .box_item a:link .date {
color: var(--color5);
transition: color 0.3s;
}
}
@media (min-width: 1280px) {
.content_wrapper.layout_box_type3 {
justify-content: space-between;
}
.layout_box_type3 .box_item {
margin: 0 0 50px;
}
}

/*bullet*/
.layout_box_type3 .box_item .date .icon-chevron-right {
display: block;
font-size: 14px;
font-size: 1.4rem;
color: var(--color5);
position: absolute;
top: 55%;
right: 10px;
margin-top: -9px;
transition: right 0.3s;
}

@media (min-width: 960px) {
.layout_box_type3 .box_item:hover .date .icon-chevron-right {
right: 5px;
}
}

.sec_content .layout_box_type3 + .btn_wrapper {
padding-bottom: 200px;
}

.layout_box_type3 .box_item .box_image,
.layout_box_type3 .box_item .box_txt,
.layout_box_type3 .box_item .title04,
.layout_box_type3 .box_item .date {
opacity: 1;
}

.layout_box_type3 .box_item.aos-animate .box_image {
animation: opacityAnimation 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) both 0s;
}
.layout_box_type3 .box_item.aos-animate .box_txt {
animation: opacityAnimation 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) both 0.2s;
}
.layout_box_type3 .box_item.aos-animate .title04 {
animation: opacityAnimation 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) both 0.2s;
}
.layout_box_type3 .box_item.aos-animate .date {
animation: moveRight 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) both 0.8s;
}



/*  footer
========================================*/
/*pagetop*/
#footer_contents {
position: relative;
}
#pagetop {
position: fixed;
bottom: 0;
top: auto;
right: 0;
display: none;
z-index: 10;
border: 1px solid #cdcdcd;
background: #fff;
width: 78px;
height: 78px;
transition: 0.3s;
}
#pagetop:hover {
border: 1px solid #f0f0f0;
background: #f0f0f0;
}
#pagetop .icon-chevron-right {
position: absolute;
display: block;
top: 20px;
left: 50%;
margin-left: -5px;
transform: rotate(-90deg);
transition: top 0.3s;
color: var(--color5);
}
#pagetop:hover .icon-chevron-right {
top: 15px;
}

#pagetop.abs {
position: absolute;
bottom: auto;
top: -80px;
right: 0;
display: none;
}

/*footer_banner_wrapper*/
#footer_banner_wrapper {
display: flex;
justify-content: space-between;
}
#footer_banner_wrapper .banner {
width: 50%;
}
#footer_banner_wrapper .banner a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 252px;
color: #fff;
transition: background 0.3s;
}
#footer_banner_wrapper .icon {
width: 110px;
height: 86px;
margin-right: 40px;
}
#footer_banner_wrapper a p {
font-size: 20px;
font-size: 2rem;
line-height: 1.8;
}
#footer_banner_wrapper a p span {
display: inline-block;
text-decoration: underline;
}
#footer_banner_wrapper a:hover p span {
text-decoration: none;
}

#footer_banner_wrapper .banner1 a {
background: var(--color1);
}
#footer_banner_wrapper .banner1 a:hover {
background: var(--color2);
}

#footer_banner_wrapper .banner2 a {
background: var(--color3);
}
#footer_banner_wrapper .banner2 a:hover {
background: var(--color4);
}

#footer_banner_wrapper .banner .inner {
display: flex;
align-items: center;
padding: 2em;
}

/*footer_info_wrapper*/
#footer_info_wrapper {
padding: 60px;
text-align: center;
}

#footer_info_wrapper .logo img {
width:244px;
height: auto;
margin-bottom: 40px;
}


#footer_info_wrapper .sns_list {
display: flex;
align-items: center;
justify-content: center;
}
#footer_info_wrapper .sns_list li {
margin: 0 7px;
}
#footer_info_wrapper .sns_list a {
color: var(--blk);
font-size: 18px;
font-size: 1.8rem;
}
#footer_info_wrapper .sns_list a:hover {
color: var(--color3);
}

/*footer_menu_wrapper*/
#footer_menu_wrapper {
background-color: #f0f0f0;
padding: 27px;
}

#footer_menu_wrapper .menu_list {
display: flex;
align-items: center;
justify-content: center;
}
#footer_menu_wrapper .menu_list li {
margin: 0 25px;
font-size: 95%;
}
#footer_menu_wrapper .menu_list a {
color: var(--blk);
}
#footer_menu_wrapper .menu_list a:hover {
color: var(--color3);
}

/*copyright*/
#copyright {
background-color: var(--color3);
color: #fff;
font-size: 13px;
font-size: 1.3rem;
text-align: center;
padding: 30px 0 210px 0;
}
#copyright a {
color: #fff;
}

/*  LOWER PAGE
========================================*/

/*ページタイトル*/
#pagetitle {
width: 100%;
height: 700px;
background-color: rgba(17, 23, 40, 0.5);
position: relative;
}
#pagetitle .inner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
color: #fff;
}
#pagetitle .pagetitle {
font-size: 64px;
font-size: 6.4rem;
font-weight: 600;
margin-bottom: 0.5em;
opacity: 0;
position: relative;
}
#pagetitle .sub_title {
font-size: 20px;
font-size: 2rem;
opacity: 0;
position: relative;
}
#pagetitle .bg_pagetitle {
width: 100%;
height: 700px;
overflow: hidden;
position: relative;
z-index: -1;
}
#pagetitle .bg_pagetitle img {
width: 100%;
height: 700px;
display: block;
object-fit: cover;
transform: scale(1.2);
}

#pagetitle.animate .bg_pagetitle img {
animation: zoom_in 1.4s cubic-bezier(0.075, 0.82, 0.165, 1) both 0s;
}
#pagetitle .pagetitle.animate2,
#pagetitle .sub_title.animate2 {
animation: slideUp 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) both 0s;
}



/*一番最初のタイトル以外は、上を空ける*/
.lower_page .sec_header:not(:first-child) {
padding-top: 226px;
}
.sub #wrap_box {
padding-top: 100px;
}

/*下層のタイトル*/
.lower_title {
font-size: 40px;
font-size: 4rem;
font-weight: 600;
color: #252525;
}
.sub #wrap_box h2 {
font-size: 40px;
font-size: 4rem;
font-weight: 600;
text-align: center;
margin-bottom: 120px;
line-height:125%;
color: #252525;
}

/*左寄せ画像*/
.flt_left {
float: left;
margin: 0 40px 40px 0;
}

/*右寄せ画像*/
.flt_right {
float: right;
margin: 0 0 40px 40px;
}

.clearfix::after {
content: '';
display: block;
clear: both;
}

.float_wrapper + .float_wrapper {
margin-top: 4em;
}

.float_wrapper .desc {
line-height: 2;
}

/*テーブル*/
.table01 {
width: 100%;
}
.table01 th {
background-color: #f0f0f0;
font-size: 20px;
font-size: 2rem;
padding: 20px;
width: 320px;
border-bottom: 2px solid #fff;
}
.table01 td {
background-color: #fff;
font-size: 20px;
font-size: 2rem;
padding: 20px;
border-bottom: 2px solid #fff;
}

table.table_def, table.des {
width: 100%;
}
table.table_def th, table.des th {
background-color: #f0f0f0!important;
font-size: 20px;
font-size: 2rem;
padding: 20px;
line-height: 1.8;
width: 320px;
border: 0!important;
border-bottom: 2px solid #fff!important;
}
table.table_def td, table.des td {
background-color: #fff!important;
font-size: 20px;
font-size: 2rem;
line-height: 1.8;
padding: 20px;
border: 0!important;
border-bottom: 2px solid #fff!important;
}
#page_topics_list10 table.des th {
width:auto;
}

.lower_page section, .sub #wrap_box, .sub #wrap_box_full {
padding-bottom: 230px;
}

.anchor{
margin-top: -12.5vw;
padding-top:12.5vw;
}

/*************************
カテゴリー表示
**************************/
.list-group_block{
    width:90%;
    margin: 0 auto;
}
.list-group{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: -60px;
    margin-bottom: 120px;
}
.list-group li {
margin: 0 20px;
display: inline-block;
}
.list-group a {
display: inline-block;
padding: 0.5em;
font-size: 28px;
font-size: 2.8rem;
line-height: 1;
color: var(--blk);
text-align: center;
position: relative;
transition: color 0.3s;
}
.list-group a::after {
content: '';
width: 100%;
height: 1px;
background-color: var(--blk);
position: absolute;
left: 0;
bottom: 0;
transition: background-color 0.3s;
}
@media (min-width: 960px) {
.list-group a:hover,
.list-group a.checked {
color: var(--color3);
}
.list-group a:hover::after,
.list-group a.checked::after {
background-color: var(--color3);
}
}
@media (max-width: 1280px) {
.list-group li {
margin: 0 1vw;
}
}