@charset "utf-8";

/* 
--------------------------------------- */
.gsp_wrapper{
  width:100%;
  max-width:initial;
  margin:auto;
  background-color:#fffcdb;
}
.gsp_content_box{
  overflow-y:visible;
  background-color:#fffcdb;
  height:initial;
  max-height:initial;
}
.gsp_content_box--fit{
  background: linear-gradient(#EFECF3, #F4F1F8);
}
.sec_content_flex{}

.sec_title{
  position:relative;
  width:100%;
  max-height:380px;
  overflow:hidden;
}
.sec_title .bg{
  width:100%;
  height:100%;
  overflow:hidden;
}
.sec_title .bg img{
  width:100%;
  height:auto;
}
.sec_title h2{
  position:absolute;
  top:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:100%;
  height:100%;
  
  color:#fff;
}

.sec_title h2 .h2-wrap{
  display:block;
  width:min(470px, 80%);
  margin:0 auto;
  padding:10px;
  text-align:center;
  
  background-color:#371e0a;
  
  &:where(.gsp_content_box--fit *){
    background: linear-gradient(.25turn, #662D91, #2E3192);
  }
}

.sec_title h2 .t1{
  /* width:470px; */
  margin:0;
  padding:10px;
  font-size:50px;
  color:#fff;
  line-height:1.0;
  text-align:center;
  background-color:#371e0a;
  
  display: block;
  
  &:where(.gsp_content_box--fit *){
    background: none;
  }
}
.sec_title h2 .t2{
  display:block;
  font-weight:500;
}
@media(max-width: 1200px){
  .sec_title .bg img{
    width:1200px;
    height:190px;
    object-fit:cover;
  }
  .sec_title h2 .t1{
    font-size:40px;
  }
  .sec_title h2 .t2{
    font-size:84px;
  }
}
@media(max-width: 980px){
  .sec_title .bg img{
    width:1000px;
    height:158px;
    object-fit:cover;
  }
  .sec_title h2 .t1{
    font-size:36px;
  }
}
@media(max-width: 768px){
  .sec_title .bg img{
    width:768px;
    height:122px;
  }
  .sec_title h2 .t1{
    width:74vw;
    font-size:28px;
  }
}

/* 
--------------------------------------- */
.sec_content_flex{}
.sec_content_wrap{
  display:block;
    justify-content:normal;
    align-items:normal;
  padding:50px 0 80px;
}
@media(max-width: 768px){
  .sec_content_wrap{
    padding:6vw 0 9vw;
  }
}

/* 
--------------------------------------- */
.box{margin-bottom:2.0em;}
.box .info{}
.box .info dt{
  margin-bottom:5px;
  padding:12px 20px;
  font-size:1.222em;
  font-weight:500;
  line-height:1.2;
  color:#fff;
  background-color:#371e0a;
}
.box .info dd{
  text-align:justify;
  text-justify:inter-ideograph;
}
.box .info > h3{
  margin-bottom:5px;
  padding:12px 20px;
  font-size:1.222em;
  font-weight:500;
  line-height:1.2;
  color:#fff;
  background-color:#371e0a;
  
  &:where(.gsp_content_box--fit *){
    background: #2E3192;
  }
}
.box .info > p{
  text-align:justify;
  text-justify:inter-ideograph;
}
.box .box_flex{
  display:flex;
  justify-content:space-between;
}
.box .box_flex .l11{width:64%;}
.box .box_flex .r11{width:32.8%;}
.box a.link_line{
  color:#231815;
  border-bottom:1px solid #231815;
  transition:color 300ms, border-color 300ms;
}
.box a.link_line:hover{
  color:#114189;
  border-bottom-color:rgba(17,65,137,1);
}
@media(max-width: 768px){
  .box .info dt{padding:12px 10px;font-size:18px;}
  .box .box_flex{
    display:block;
    justify-content:nornal;
  }
  .box .box_flex .l11{width:100%;}
  .box .box_flex .r11{
    width:70vw;
    margin:3vw auto 0;
  }
}


/* ページ内リンク
--------------------------------------- */
.sec_content_flex ul.sub_link{
  
  /* display: grid; */
  /* grid-template-columns: repeat(3, 1fr); */
  /* gap: .5em; */
  
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  /* align-items:flex-start; */
  gap:1.25em;
  
  max-width:1000px;
  margin:20px auto 0;
  font-size:1.222em;
}
.sec_content_flex ul.sub_link li{
  /* width:30%; */
  
  flex: 1 1 0;
  display: contents;
}

.sublink-tab{
  display:block;
  width:100%;
  padding:8px;
  color:#000;
  line-height:1.2;
  text-align:center;
  align-content: center;
  background-color:#fff;
  border-radius:0px;
  border:1px solid #ccc;
  transition:color 300ms, background-color 300ms;
}
.current .sublink-tab,
.sublink-tab:hover{
  color:#fff;
  background-color:#d6bc5e;
}

.sublink-tab--fit{
  color: #662D91;
  border: 1px solid #662D91;
  
  :is(&:hover, .current &){
    color: white;
    background: linear-gradient(.25turn, #662D91, #2E3192);
  }
}

@media(max-width: 768px){
  .sublink-tab{
    transition:none;
  }
  .sublink-tab:hover{
    color:#000;
    background-color:#fff;
  }
  .current .sublink-tab:hover{
    color:#fff;
    background-color:#d6bc5e;
  }
}