@charset "UTF-8";
/* ******************************
* 基本設定
****************************** */
html{
  scroll-behavior: smooth;
}
html::-webkit-scrollbar {
      display: none;
      -webkit-appearance: none;
}
body{
  color:#16214e;
  font-size: 1rem;
  font-family: 'New Tegomin', serif;
  /*font-family: 'IBM Plex Sans',"Hannari";,sans-serif;"Sawarabi Mincho",*/
}

p,ul,ol,dl,div,figure{
  margin-bottom: 1rem;
}
ul{
  list-style: none;
}
img,iframe{
  max-width: 100%;
}
figure,iframe{
  text-align: center;
}
a {
  color:#659f31;
  text-decoration: none;
}
a:visited {
  color: ;
}

a:hover{
  color:;
}

/* レイアウト */
.main_grid{
  display: grid;
  grid-template-columns: 20vw 62.5vw 17.5vw;
  grid-template-rows: repeat(5,auto);
  grid-row-gap: 3rem;
}
header{
  grid-column:3;
  grid-row:1/6;
  padding-left: 2vw;
  padding-right: 2vw;
  min-height:100vh;
}
footer{
  grid-column:2;
  grid-row:5;
}
aside{
  grid-column:2;
  grid-row:4;
  padding-left: 2vw;
  padding-right: 2vw;
  max-width: 100%;
  overflow: hidden;
  text-align:center;
}

  /* トップページ */
.sec_main_vis{
  grid-column:2;
  grid-row:1;
  padding-top:2rem;
}
.sec_main_vis img{
  border:solid 4px #444444;
}
.sec_introduction{
  grid-column:2;
  grid-row:2;
  padding-bottom: 1rem;
  font-size: 1.25rem;
}
.sec_webcast{
  grid-column:2;
  grid-row:3;
}
.sec_information{
  grid-column:1;
  grid-row:1/5;
  min-height:100vh;
  padding-left: 2vw;
  padding-right: 2vw;
}
.sec_mailform{
  grid-column:2;
  grid-row:2/4;
  height:100vh;
  margin-top: 1rem;
}
.sec_mount{
  background-color:#f8f7e5;
  border:solid 4px #444444;
  background-image: url(../img/asanoha.png);
  background-repeat:repeat;
}

.grid_lo{display: grid;}
.col2{grid-template-columns: 1fr 1fr;}
.grid_dl{grid-template-columns: auto 1fr; grid-column-gap: 1rem;}
.grid_dl dt{grid-column:1/2;}
.grid_dl dd{grid-column:2/3;}

/* コンテンツ */
.fas{font-size: x-large;}
.article_title{
  text-align: center;
  align-items: flex-end;
  color:#745399;
  font-size: 1.5rem;
  font-weight: bolder;
  padding:0.25rem;
  margin-bottom: 1.5rem;
  border-bottom: solid 1px #745399;
}
.article_title:before{
    content:'　';
    background-image:url(../img/sippou_2.png);
    background-size: contain;
    vertical-align: middle;
    display: inline-block;
    margin-right:.25rem;
    margin-top: 0.3rem;
}
.article_title:after{
    content:'　';
    background-image:url(../img/sippou_2.png);
    background-size: contain;
    vertical-align: middle;
    display: inline-block;
    margin-left:.25rem;
    margin-top: 0.3rem;
}
.sub_title{
  font-size: 1.25rem;
  font-weight: bold;
  color:#745399;
  margin-bottom: 1rem;
  border-bottom: solid 1px #745399;
}
.overflowed{overflow:scroll;}

.link_btn{
text-align:center;
}
.link_btn a{
  display: block;
  background-color:#b07bb3 ;
  color:#ffffff;
  border-radius: 3px;
  padding: 0.5rem;
  margin-bottom: 0.5rem;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  transition: color 0.4s ease 0.1s;
}
.link_btn a:hover{
  color:#b07bb3;
  background:none;
  border:solid 1px #b07bb3;
}
.attention{
  font-size: 90%;
}
.attention::before{
  content:'※';
  display:inline-block;
}
.y_takada{padding-left: 1rem;padding-right: 1rem;}
.s_matsuda{padding-left: 1rem;padding-right: 1rem;}
.mail_form_inline{
  display: flex;
  justify-content:center;
}

@media screen and (max-width: 480px){
  .main_grid{
    grid-template-columns: 100vw;
    grid-template-rows: repeat(7,auto);
    grid-row-gap:0;
  }
  header{
    grid-column:1;
    grid-row:1;
    height:60px;
    width: 100vw;
    background-color: #fdeff2;
    min-height:auto;
    position: fixed;
    top:0;
    z-index: 100;
  }
  .sec_main_vis{
    grid-column:1;
    grid-row:2;
    padding:0;
    margin-top: 60px;
  }
  .sec_introduction{
    grid-column:1;
    grid-row:3;
    margin: 1rem 4vw auto 4vw;
  }
  .sec_webcast{
    grid-column:1;
    grid-row:5;
    margin-top: 1rem;
    margin-left: 4vw;
    margin-right: 4vw;
  }
  aside{
    grid-column:1;
    grid-row:6;
    margin: 2.5rem 1rem 2.5rem 1rem;
    padding: 0;
  }
  .sec_information{
    grid-column:1;
    grid-row:4;
    min-height:initial;
    padding-left: 4vw;
    padding-right: 4vw;
    margin-top: 2rem;
  }
  .sec_mailform{
    grid-column:1;
    grid-row:3;
    padding-left: 4vw;
    padding-right: 4vw;
    height: auto;
    margin-top: 60px;
  }
  footer{
    grid-column:1;
    grid-row:7;
  }
}

/* ******************************
* ヘッダー
****************************** */
.head_mouont{
  height:100vh;
  position: sticky;
  top:0;
  padding-top:2rem;
  padding-bottom:1rem;
}
#nav_input,.nav_triger{
  display:none;
}
.menu_list{
  font-size: 1.25rem;
  -ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
  text-orientation:upright;
  margin-bottom: 0;
}
.menu_list li{
  padding:0.5rem 0.1rem 0.5rem 0.1rem;
  background-color: #659f31;
}
.menu_list li:hover{
  transform:scale(1.2,1.2);
  transition:0.25s all;
}
.menu_list a{
  color:rgba(255,255,255,1);
  display: block;
}
.menu_list a:before{
  content:'　';
  background-image:url(../img/matsu_w.png);
  background-size: contain;
  vertical-align: middle;
  display: inline-block;
  margin-bottom:.25rem;
}
.menu_list_top{
  display: none;
}
.mount_triger{
  width: 100vw;
  height: 100vh;
  display: none;
  position: fixed;
  top:60px;left:0;
}
.menu_mount{
  display: grid;
  align-content: space-evenly;
  height: 100%;
}
.add_link{
  grid-row-gap:1rem;
}
@media screen and (max-width: 480px){
  .program_logo{
    max-width: 50px;
    position: absolute;
    top:0;bottom:0;left: 0;right:0;
    margin:6px auto;
  }
  .head_mouont{
    padding: 0;
    position: relative;
    height: auto;
  }
  .nav_triger{
    display: block;
    position: fixed;
    top:18px;
    left:0.5rem;
    color:#745399;
  }
  .menu_mount{
    margin: 0;
    padding: 0rem 3vw 0 3vw;
    width: 0;
    height:100vh;
    opacity: 0;
    overflow: hidden;
    position: fixed;
    top:60px;
    left:0;
    transition: 0.5s;
    transform: translateX(-100%);
    background:linear-gradient(to top,#745399,#fdeff2)
  }
  .menu_list_top{
    display: block;
  }
  #nav_input:checked ~ .menu_mount{background-color: #fff;width:66vw;opacity: 1;}
  #nav_input:checked ~ .menu_mount{transform: translateX(0);}
  #nav_input:checked ~ .mount_triger{display: block;background-color: rgba(0,0,0,.2)}

}
/* ******************************
* メイン
****************************** */
.mainvisu_grid{
  grid-template-columns: 1fr auto;
}
.lead_text{
  margin:2rem;
  /*font-size:1rem;*/
  text-align: center;
}
.first_letter{
  font-size: 3rem;
  font-weight: bold;
  color:#745399;
  margin-right: 0.1rem;
}
.subtext_s{
  font-size: 66%;
  margin-left: 0.25rem;
  /*opacity: 0.5;*/
}
.program_detail{
  /*font-size:1rem;*/
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
}
.program_detail dt{
  color:#d87309;
}
.program_corner_list{
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.program_corner_list dt{
  color:#d87309;
  font-weight: bold;
}
.program_corner_list dd{
  margin-bottom: 1rem;
}
.prof_grid{
  grid-template-columns:1fr 1fr;
}
.profile_name{
  font-size: 1.5rem;
  text-align: center;
  color:#d87309;
}
.profile{
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
}
.profile dt{
  color:#d87309;
}
.mount_information{
  position: sticky;
  top:0;
  transform: translateY(calc(50vh - 50%));
}
.hol_scroll{
  /*display: flex;
  gap: 2rem;*/
  padding:1rem;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  margin-left: 5vw;
  margin-right: 5vw;
}
.hol_scroll li{
  display: inline-block;
  margin-right: 1rem;
}
.webcast_day{
  color:#659f31;
  margin-bottom: 0.25rem;
}

.news_title{
  background-color:#d87309;
  text-align: center;
  vertical-align: middle;
  position: relative;
  border-bottom: solid 4px #444444;
}
.news_title_text{
  color:#16214e;
  font-weight:bold;
  text-shadow    :
     1px  1px 1px #ffffff,
    -1px  1px 1px #ffffff,
     1px -1px 1px #ffffff,
    -1px -1px 1px #ffffff,
     1px  0px 1px #ffffff,
     0px  1px 1px #ffffff,
    -1px  0px 1px #ffffff,
     0px -1px 1px #ffffff;
}
.news_title_text:before{
  content:'　';
  background-image:url(../img/matsu_b.png);
  background-size: contain;
  vertical-align: middle;
  margin-right:.25rem;
}
.news_list{margin-bottom:5rem;}
.update_topics{padding: 1rem;}
.update_topics dt{
    color:#745399;
    font-weight: bold;
}
.update_topics dd{
    margin-bottom: 0.5rem;
}
.twitter_box{border:solid 4px #444444;}
/* タブ切り替え */
.tab_wrap input[type="radio"]{
  display:none;
}
.tab_area{
 text-align: center;
 display: grid;
 grid-template-columns: repeat(auto-fit,12rem);
 justify-content: center;
}
.tab_area label{
  color:#659f31;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 0.25rem;
}
.tab_area label:hover{
  cursor: pointer;
  transition: scale(1.25,1.25)
}
.panel_area{
  margin-top: 1rem;
}
.tab_panel{
  display:none;
  padding-left: 1rem;
  padding-right: 1rem;
}

#tab1:checked ~ .tab_area .tab1_label{background:#659f31; color:#fff; border-radius: 3px;}
#tab1:checked ~ .panel_area #panel1{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}
#tab2:checked ~ .tab_area .tab2_label{background:#659f31; color:#fff; border-radius: 3px;}
#tab2:checked ~ .panel_area #panel2{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}
#tab3:checked ~ .tab_area .tab3_label{background:#659f31; color:#fff; border-radius: 3px;}
#tab3:checked ~ .panel_area #panel3{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}
#tab4:checked ~ .tab_area .tab4_label{background:#659f31; color:#fff; border-radius: 3px;}
#tab4:checked ~ .panel_area #panel4{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}
.fadeout {
  animation : fadeOut 1.5s;
  animation-fill-mode: both;
}
@keyframes tabAnim{
  0%{opacity:0;}
  100%{opacity:1;}
}
@keyframes fadeOut {
  100% {
    opacity: 1;
  }
  0% {
    opacity: 0;
  }
}
/* タブ切り替え */

/* ******************************
* メールフォーム
****************************** */

.form_area{
  display:grid;
  grid-template-columns: auto 1fr ;
  grid-column-gap: 1rem;
  grid-row-gap:0.5rem;
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

.form_area dt{
  grid-column:1;
  color:#fff;
  background-color: #745399;
  padding: 0.25rem;
  border-radius: 5px;
}

.form_area dd{
  grid-column:2;
  padding: 0.25rem;
  background-color: #ffffff;
  border:solid 1px #745399;
  border-radius: 5px;
}
.form_area select{
  width: 100%;
  border: none;
}
.form_area input.add_text{
  height: 1.2rem;
  width: 66%;
  border: none;
}
.form_area textarea{
  font-size:16px;
  width: 99%;
  height: 20rem;
  border: none;
  resize: vertical;
}
.submit_box{
  text-align: center;
  margin-top: 1rem;
}
.submit_btn{
  color:#fff;
  font-weight: bold;
  padding: 0.25rem;
  background-color:#745399;
  border-radius: 3px;
}
._width_5rem{
  width: 5rem;
}
._width_auto{
  width: fit-content;
}
.submit_btn:hover{
  transform:scale(.9,.9);
  transition:0.25s all;
}
.red{
  color:#d87309;
  margin-left: 0.5rem;
  font-weight: bold;
}
@media screen and (max-width: 480px){
  .lead_text,.tab_wrap{margin-left:1rem;margin-right:1rem;}
  .mount_information{
    position: static;
    top:initial;
    transform: initial;
  }
  .prof_grid{grid-template-columns: 1fr;}
  .news_list{margin-bottom: 2rem;}
  .twitter_box{}
  .form_area{grid-template-columns:1fr ;}
  .form_area dd{grid-column:1;}
  .form_area input.add_text{width: 75%;}
  .form_area textarea{height: 10rem;}
}
/* ******************************
* フッター
****************************** */
.copyright{text-align: center;color:#cccccc;}

/* ******************************
* バックグラウンド
****************************** */
.bg_seigaiha{
  width:100vw;
  height:300px;
  margin: 0;
  position: fixed;
  bottom:0;
  z-index: -10;
  opacity: .3;
  background-image: url(../img/seikaiha.png);
  background-repeat: repeat-x;
}
.bg_kansesuimon_1{
  width:300px;height:200px;
  margin: 0;
  background-image: url(../img/kansesuimon.png);
  position: fixed;
  top:3vh;left:1vw;
  z-index: -9;
  opacity: .3;
}
.bg_kansesuimon_2{
  width:300px;height:200px;
  margin: 0;
  background-image: url(../img/kansesuimon.png);
  position: fixed;
  top:33vh;right:0;
  z-index: -9;
  opacity: .3;
}
.bg_color{
  width:100vw;height:100vh;
  margin: 0;
  position: fixed;
  top:0;left:0;
  z-index: -15;
  background:linear-gradient(to top,#745399,#fdeff2)
}
@media screen and (max-width: 480px){
  .bg_seigaiha{height:200px;background-image: url(../img/seikaiha_s.png);}
  .bg_kansesuimon_1,.bg_kansesuimon_2{
    height:200px;
    width: 141px;
    background-image: url(../img/kansesuimon_s.png);
  }
  .bg_kansesuimon_1{top:15vh;}
  .bg_kansesuimon_2{top:40vh;}
}
