@charset "utf-8";
/*
css/style_sp.css
*/

/*  header
========================================*/
#header_contents {
z-index: 300;
position: fixed;
top: 0;
left: 0;
width: 100%;
}

#header_contents .inner {
width: 100%;
height: 12.5vw;
display: flex;
align-items: center;
justify-content: space-between;
transition: background 0.3s ease, box-shadow 0.3s ease;
}

#header_contents.fixed .inner {
background: rgba(255, 255, 255, 1);
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.header_logo {
display: inline-block;
margin-left: 2.34375vw;
width: 19.5vw;
}
#header_contents .sub_nav {
display: flex;
justify-content: space-around;
align-items: center;
width: 40.625vw;
}
#header_contents .sub_nav_btn {
width: 8.4375vw;
height: 8.4375vw;
}
#header_contents .sub_nav_btn a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
overflow: hidden;
text-indent: -1000px;
}

#header_contents .sub_nav li.tel {
background: url(/files/user/common/img/ico_tel.png?v=1616740490) no-repeat center center / contain;
}
#header_contents .sub_nav li.mail {
background: url(/files/user/common/img/ico_env.png?v=1616740490) no-repeat center center / contain;
}

/*  header_slider
========================================*/
#header_slider_wrap {
width: 100%;
display: flex;
flex-direction: column-reverse;
justify-content: space-between;
}

/*slider_catch*/
#header_slider_catch {
width: 100%;
min-height: 75vw;
display: flex;
/*align-items: center;
justify-content: center;*/
background-color: var(--color1);
position: relative;
}
#header_slider_catch .caption {
padding: 5vw 0 5vw 10vw;
width:100%;
overflow: hidden;
}
#header_slider_catch .sub_catch_en {
font-size: 3.125vw;
color: #fff;
margin-bottom: 0.7em;
opacity: 0;
}
#header_slider_catch .catch {
font-size: 9.375vw;
line-height: 1.2;
margin-bottom: 0.3em;
color: #fff;
-moz-font-feature-settings: 'palt';
-webkit-font-feature-settings: 'palt';
font-feature-settings: 'palt';
opacity: 0;
}
#header_slider_catch .sub_catch {
font-size: 5.46875vw;
line-height: 1;
display: block;
}
#header_slider_wrap .sub_catch .line1,
#header_slider_wrap .sub_catch .line2 {
display: inline-block;
margin-bottom: 0.78125vw;
}
#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.3em;
color: #252525;
background-color: #fff;
white-space: nowrap;
}


#header_slider_wrap .sub_catch {
width:100%;
overflow-x: hidden;
overflow-y: visible;
}



#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 ease both 3.5s;
}
#header_slider_wrap.animate0 .sub_catch .line2 .txt_wrapper {
width:100%;
animation: slideRight3 1s ease both 5s;
}




/*scroll*/
#scroll {
display: none;
}

/*slider*/
#header_slider {
width: 100%;
height: 75vw;
}
.swiper-slide img {
width: 100%;
display: block;
object-fit: cover;
}
#header_slider .swiper-slide img {
height: 75vw;
}
.swiper-slide video {
width: 100%;
height: 75.1vw;
object-fit: cover;
}


.swiper-pagination-bullet {
background: #fff;
opacity: 1;
}

.swiper-pagination-bullet-active {
opacity: 1;
background: var(--color2);
}



/*  コンテンツ共通
========================================*/

.section {
padding-top: 5em;
}

/*sec_header（セクションのタイトル部分）*/
.sec_header {
width: 100%;
margin-bottom: 4em;
text-align: center;
}
.sec_header .headline {
font-size: 10vw;
font-weight: 600;
margin-bottom: 30px;
color: #252525;
}
.sec_header .sub_title {
margin-bottom: 3em;
font-size: 3vw;
color: var(--gry);
}

.sec_header .sub_title.lead {
width: 90%;
margin: 3em auto;
font-size: 3.75vw;
line-height: 2;
text-align: left;
}
.sec_header .icon {
width: 32.8125vw;
margin: 0 auto;
}

/*sec_content（セクションのコンテンツ）*/
.sec_content, .sub #wrap_box {
width: 95%;
margin: 0 auto;
}

/*タイトル類*/
.sec_content .title01, .sub #wrap_box h3 {
font-size: 5.25vw;
line-height: 1.5;
font-weight: 700;
color: #252525;
border-left: 0.78125vw 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 {
font-size: 3.75vw;
line-height: 1.8;
color: var(--gry);
}
.sec_content .desc + .desc {
padding-top: 2em;
}

/*ボタンリンク*/
.btn_wrapper {
text-align: center;
margin-top: 2em;
}
.btn1 {
display: inline-flex;
justify-content: center;
align-items: center;
width: 78.75%;
height: 11.25vw;
text-decoration: none;
outline: none;
}

.btn1 {
background-color: #fff;
border: 2px solid var(--color3);
color: var(--blk);
}



/*  AUTONOMY and UNIQUE
========================================*/
/*layout_col_type1（左に写真があるブロック）*/
.content_wrapper.layout_col_type1 {
display: flex;
flex-direction: column-reverse;
justify-content: space-between;
}
.content_wrapper.layout_col_type1 .col_image {
width: 100%;
height: auto;
margin-bottom: 2em;
order: 1;
overflow: hidden;
position: relative;
}
.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;
}

/*  SERVICE
========================================*/
/*layout_box_type1（SERVICE ボックス3個並び）*/
.content_wrapper.layout_box_type1 {
display: flex;
justify-content: space-between;
flex-direction: column;
}
.layout_box_type1 .box_item {
position: relative;
z-index: 2;
width: 100%;
}

.layout_box_type1 .box_item + .box_item {
margin-top: 4em;
}

.layout_box_type1 .box_item .box_txt {
display: flex;
flex-direction: column;
justify-content: center;
box-sizing: border-box;
position: relative;
padding: 8vw 10vw 7.5vw 5.5vw;
background: #f0f0f0;
}

.layout_box_type1 .box_item .box_txt::after {
content: '';
width: 6.25vw;
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;
}
.layout_box_type1 .box_item .title02 {
font-size: 8.25vw;
font-weight: 700;
color: var(--color3);
position: absolute;
top: -4vw;
left: 0;
z-index: +1;
}

.layout_box_type1 .box_item .catch {
font-size: 4.85vw;
line-height: 1.5;
font-weight: 700;
}
.layout_box_type1 .box_item .desc {
color: var(--blk);
padding-top: 1em;
}
.layout_box_type1 .box_item .box_image {
width: 100%;
height: 50vw;
}
.layout_box_type1 .box_item .box_image img {
width: 100%;
height: 50vw;
display: block;
object-fit: cover;
}

/*  MEMBER
========================================*/
/*layout_box_type2（MEMBER ボックス4個並び）*/
.content_wrapper.layout_box_type2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
/*flex-direction: column;*/
}
.layout_box_type2 .box_item {
width: 40%;
position: relative;
margin: 0 auto 1em;
}
.layout_box_type2 .box_item a {
display: block;
position: relative;
}
.layout_box_type2 .box_item .box_image {
width: 100%;
height: 40vw;
overflow: hidden;
}
.layout_box_type2 .box_item .box_image img {
width: 100%;
height: 40vw;
display: block;
object-fit: cover;
}

.layout_box_type2 .box_item .box_txt {
position: relative;
}

.layout_box_type2 .box_item .title03 {
font-size: 6vw;
font-weight: 700;
color: var(--color5);
position: absolute;
top: -0.6em;
left: -0.7em;
}
.layout_box_type2 .box_item .desc {
font-size: 3vw;
color: var(--blk);
line-height: 1.5;
padding: 1.3em 0.75em 1em 0.75em;
}

/*  NEWS
========================================*/
.category_list {
display: flex;
justify-content: center;
margin-bottom: 1em;
}
.category_list li {
display: inline-block;
margin: 0 0.75em 2em;
}
.category_list a {
display: inline-block;
padding: 0.8em;
font-size: 4.375vw;
line-height: 1;
color: var(--blk);
text-align: center;
position: relative;
}
.category_list a::after {
content: '';
width: 100%;
height: 1px;
background-color: var(--blk);
position: absolute;
left: 0;
bottom: 0;
}

.news_list {
border-left: 5px solid var(--color1);
padding: 0 1em 0 1.5em;
margin-bottom: 3em;
}
.news_list li {
display: flex;
flex-wrap: wrap;
width: 100%;
font-size: 3.75vw;
line-height: 1.8;
color: var(--gry);
padding: 1em 0;
}
.news_list .date {
width: 6em;
}
.news_list .category {
color: var(--color3);
display: inline-block;
white-space: nowrap;
min-width: 4em;
}
.news_list .category span {
display: inline-block;
min-width: 4em;
position: relative;
}
.news_list .title {
display: inline-block;
width: 100%;
margin-top: 0.5em;
}
.news_list .title a:link {
color: var(--gry);
}
.news_list + .btn_wrapper {
padding-bottom: 4em;
}

/*  banner_content
========================================*/
/*背景写真を固定するための白マスク*/
.bg_mask {
background-color: #fff;
}

.banner_content {
display: block;
width: 100%;
background-size: cover;
background-position: 50% 100%;
background-repeat: no-repeat;
}

.banner_content .banner_content_bg {
box-sizing: border-box;
width: 100%;
height: 100vh;
padding: 5%;
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: 9.375vw;
font-weight: 700;
margin-bottom: 1.5em;
}
.banner_content .desc {
font-size: 3.75vw;
line-height: 2;
}
.banner_content .btn1 {
border: 2px solid #fff;
background-color: transparent;
color: #fff;
margin-top: 2em;
}


/*  BLOG
========================================*/
/*layout_box_type3（BLOG ボックス2個並び）*/
.content_wrapper.layout_box_type3 {
display: flex;
justify-content: space-between;
flex-direction: column;
}
.layout_box_type3 .box_item {
width: 100%;
position: relative;
margin-bottom: 2.5em;
}
.layout_box_type3 .box_item a {
display: flex;
width: 100%;
height: 100%;
}
.layout_box_type3 .box_item .box_image {
width: 36.231884vw;
height: 36.231884vw;
flex: 36.231884vw 0 0;
}
.layout_box_type3 .box_item .box_image img {
width: 36.231884vw;
height: 36.231884vw;
display: block;
object-fit: cover;
}

.layout_box_type3 .box_item .box_txt {
box-sizing: border-box;
background-color: #f3f3f3;
height: 36.231884vw;
padding: 1em 0;
flex-grow: 1;
z-index: 999;
}
.layout_box_type3 .box_item .title04 {
margin: 0 1em 0.75em -1.5em;
font-size: 3.75vw;
line-height: 1.5;
padding: 0.75em;
background-color: #fff;
}
.layout_box_type3 .box_item .date {
font-size: 3.75vw;
margin: 0 1em 0 -1.5em;
background-color: #fff;
padding: 0.75em;
position: relative;
}

/*bullet*/
.layout_box_type3 .box_item .date .icon-chevron-right {
float: right;
font-size: 3.75vw;
color: var(--color5);
line-height: 0.75;
margin-right: 2.415459vw;
}

/*  footer
========================================*/
/*pagetop*/
#footer_contents {
position: relative;
margin-top: 8em;
}
#pagetop {
position: fixed;
bottom: 0;
right: 0;
display: none;
z-index: 10;
border: 1px solid #cdcdcd;
background: #fff;
width: 12.1875vw;
height: 12.1875vw;
}

#pagetop .icon-chevron-right {
position: absolute;
display: block;
top: 10%;
left: 50%;
transform: rotate(-90deg);
transform-origin: 35% 65%;
color: var(--color5);
}

#pagetop.abs {
position: absolute;
bottom: auto;
top: -12.5vw;
right: 0;
display: none;
}

/*footer_banner_wrapper*/
#footer_banner_wrapper {
display: flex;
align-items: center;
flex-direction: column;
}
#footer_banner_wrapper .banner {
width: 100%;
}
#footer_banner_wrapper .banner a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: #fff;
}
#footer_banner_wrapper .icon {
flex: 0 0 18%;
}
#footer_banner_wrapper a p {
flex: 0 0 70%;
display: block;
font-size: 3.25vw;
line-height: 1.8;
}
#footer_banner_wrapper a p span {
display: inline-block;
text-decoration: underline;
}

#footer_banner_wrapper .banner1 {
background: var(--color1);
}

#footer_banner_wrapper .banner2 {
background: var(--color3);
}

#footer_banner_wrapper .banner .inner {
display: flex;
align-items: center;
justify-content: space-around;
padding: 1em 0;
}

/*footer_info_wrapper*/
#footer_info_wrapper {
padding: 14.492754vw;
text-align: center;
}

#footer_info_wrapper .logo {
width: 75%;
margin: 0 auto 3.5vh;
}

#footer_info_wrapper .site_desc {
margin-bottom: 2.5em;
}

#footer_info_wrapper .sns_list {
display: flex;
align-items: center;
justify-content: center;
}
#footer_info_wrapper .sns_list li {
margin: 0 0.5em;
}
#footer_info_wrapper .sns_list a {
color: var(--blk);
font-size: 5.6vw;
}
#footer_info_wrapper .sns_list a:hover {
color: var(--color2);
}

/*footer_menu_wrapper*/
#footer_menu_wrapper {
background-color: #f0f0f0;
padding: 1em;
}

#footer_menu_wrapper .menu_list {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
#footer_menu_wrapper .menu_list li {
margin: 0.75em;
}
#footer_menu_wrapper .menu_list a {
color: var(--blk);
font-size: 3.25vw;
}

/*copyright*/
#copyright {
background-color: var(--color3);
color: #fff;
font-size: 2.5vw;
text-align: center;
padding: 2em 1em;
}
#copyright a {
color: #fff;
}

/*  LOWER PAGE
========================================*/

/*ページタイトル*/
#pagetitle {
width: 100%;
height: 70vh;
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: 10vw;
font-weight: 600;
margin-bottom: 0.5em;
opacity: 0;
position: relative;
}
#pagetitle .sub_title {
font-size: 3.75vw;
opacity: 0;
position: relative;
}
#pagetitle .bg_pagetitle {
width: 100%;
height: 70vh;
overflow: hidden;
position: relative;
z-index: -1;
}
#pagetitle .bg_pagetitle img {
width: 100%;
height: 70vh;
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) 0s forwards;
}

#pagetitle .pagetitle.animate2,
#pagetitle .sub_title.animate2 {
animation: slideUp 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s forwards;
}



/*一番最初のタイトル以外は、上を空ける*/
.lower_page .sec_header:not(:first-child) {
padding-top: 5em;
}
.sub #wrap_box {
padding-top: 2em;
}

.float_wrapper {
display: flex;
flex-direction: column;
}
.float_wrapper .inlineBox {
padding-top: 2em;
}

/*下層のタイトル*/
.lower_title {
font-size: 6.25vw;
font-weight: 700;
color: #252525;
}
.sub #wrap_box h2 {
font-size: 6.25vw;
font-weight: 700;
text-align: center;
color: #252525;
margin-bottom: 4em;
line-height: 125%;
}

/*右寄せ画像*/
.flt_right {
margin: 2em 0 0;
}

.clearfix::after {
content: '';
display: block;
clear: both;
}

.float_wrapper .desc {
line-height: 2;
}

/*テーブル*/
.table01 {
width: 100%;
}
.table01 th {
background-color: #f0f0f0;
font-size: 3.25vw;
padding: 1em;
border-bottom: 2px solid #fff;
}
.table01 td {
background-color: #fff;
font-size: 3.25vw;
padding: 1em;
border-bottom: 2px solid #fff;
}

table.table_def {
width: 100%;
}
table.table_def th, table.des th {
background-color: #f0f0f0!important;
font-size: 3.25vw;
line-height: 1.8;
padding: 1em;
border: 0!important;
border-bottom: 2px solid #fff!important;
}
table.table_def td, table.des td {
background-color: #fff!important;
font-size: 3.25vw;
line-height: 1.8;
padding: 1em;
border: 0!important;
border-bottom: 2px solid #fff!important;
}

.anchor{
margin-top: -22vw;
padding-top:22vw;
}

/*************************
カテゴリー表示
**************************/
.list-group_block{
    width:90%;
    margin: 0 auto;
}
.list-group {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: -60px;
    margin-bottom: 60px;
}
.list-group li {
display: inline-block;
margin: 0 0.75em 2em;
}
.list-group a {
display: inline-block;
padding: 0.5em;
font-size: 4.375vw;
line-height: 1;
color: var(--blk);
text-align: center;
position: relative;
}
.list-group a::after {
content: '';
width: 100%;
height: 1px;
background-color: var(--blk);
position: absolute;
left: 0;
bottom: 0;
}
.list-group a.checked {
color: var(--color3);
}
.list-group a.checked::after {
background-color: var(--color3);
}