@import url(./tky_awa_pc.css) screen and (min-width: 769px);
@import url(./tky_awa_sm.css) screen and (max-width: 768px);

html, body{
      /* overflow-x: hidden; */

}

*{
  font-family:  "游ゴシック Medium", YuGothic, YuGothicM, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}

.font_mincho{
  font-family: "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

.font_warasabi{
  font-family: "Sawarabi Mincho", serif;
  font-weight: 400;
  font-style: normal;
}
.font_bv {
  font-family: "Baskervville", serif;
  font-weight: 400;
  font-style: normal;
}

.baskervville-regular-italic {
  font-family: "Baskervville", serif;
  font-weight: 400;
  font-style: italic;
}



:root {
    --color_white: #fff;
    --color_bg_l_blue: #f4f7ff;
    --color_d_blue: #0E3E98;
    --font_d_blue: #0E3E98;
    --font_blue: #0E3E98;
    --font_l_blue: #2C74D8;
    --color_blue: #2B74D8;
    --color_footer_blue: #e5f3ff;
    --color_l_blue: #F5F7FF;
    --color_perple: #4D69C6;
    --color_green: #365d4b;
    --color_gray: #F0F0F0;
    --color_black: #1f1f1f;
    --font_base: #1f1f1f;
    --color_brown:#727171;
    --color_ribon_blue: #C0D0EA;

    --color_oudo:#f0eadc;
    --color_font_main: #f0eadc;
    --color_kyuri: #3c523b;
    --color_tomato: #93433b;
    --color_piman: #3a655f;
    --color_nasu: #623f65;
    --color_kyuri_bg: #e3edd3;
    --color_tomato_bg: #edd5d3;
    --color_piman_bg: #d3e9e6;
    --color_nasu_bg: #f3e6f4;
    --color_rec_green: #013432;
    --color_rec_brown: #52453B;
    --color_rec_y_bg:#D4D532;
    --color_rec_g_bg:#33B995;
  }

*{
    /* line-height: 2; */
}

.font_l_blue{
  color: var(--font_l_blue)
}

  .grade_01{
    border-radius: 10px;
    background-image: linear-gradient(to bottom, #2c74d8, #0e3e98);
    color: white;
  }

  .grade_02{
    background-image: linear-gradient(to bottom, #0e3e98, #071f4c);
  }

  .grade_yoko_01{
    border-radius: 10px;
    background-image: linear-gradient(to right, #2c74d8, #0e3e98);
  }

  .grade_yoko_02{
    border-radius: 0px;
    background-image: linear-gradient(to right, #e5f3ff, #d1e2ff);
  }

.br_10{
  border-radius: 10px !important;
}

  .bg_blue{
    background: var(--color_d_blue);
    color: white;
    /* border-radius: 10px; */
  }

  .bg_l_blue{
    background: var(--color_l_blue);
    color: var(--font_base);
    border-radius: 10px;
  }


  .about_content h2{
    color: var(--font_d_blue);
  }

  .t_a_c{
    text-align: center;
    justify-content: center;
  }

  .f_w_b{
    font-weight: bold !important;
  }
  
.a_i_c{
  display: flex;
  align-items: center;
}

  .message{
    font-size:  clamp(16px,1.2vw,24px) ;
  }






  /* ボタン装飾用 */
  
.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}


.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

a.btn-flat {
  overflow: hidden;

  padding: 1.5rem 6rem;

  color: #fff;
  border-radius: 0;
  background: #000;
}

a.btn-flat span {
  position: relative;
}

a.btn-flat:before {
  position: absolute;
  top: 0;
  left: 0;

  width: 150%;
  height: 500%;

  content: "";
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
  transform: translateX(-98%) translateY(-25%) rotate(45deg);

  background: #00b7ee;
}

a.btn-flat:hover:before {
  -webkit-transform: translateX(-9%) translateY(-25%) rotate(45deg);
  transform: translateX(-9%) translateY(-25%) rotate(45deg);
}





.kado_yaji_btn a {
  background: var(--color_blue);
  /* border-radius: 3px; */
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  max-width: 1280px;
  padding: 10px 25px;
  color: white;
  transition: 0.3s ease-in-out;
  font-weight: 500;
}

.kado_yaji_btn.white a {
  background: #fff;
  color: var(--font_blue);
}

.kado_yaji_btn.btn_blue a {
  background: var(--color_d_blue);
  color: #fff;
  justify-content: start;
  padding-left: 60px;
}

.kado_yaji_btn.j_c_s a {
  justify-content: start;
  padding-left: 60px;
}


.kado_yaji_btn.btn_blue{
  justify-content: start;

}

.kado_yaji_btn a:after {
content: "";
position: absolute;
top: 50%;
bottom: 0;
right: 4rem;
font-size: 90%;
display: flex;
justify-content: center;
align-items: center;
transition: right 0.3s;
width: 6px;
height: 6px;
border-top: solid 2px currentColor;
border-right: solid 2px currentColor;
transform: translateY(-50%) rotate(45deg);
}
.kado_yaji_btn a:hover {
background: #6bb6ff;
color: #FFF;
}
.kado_yaji_btn a:hover:after {
right: 10.4rem;
}



.ribbon {
  background: var(--color_d_blue);
  box-sizing: border-box;
  color: #fff;
  /* display: inline-block; */
  font-size:  clamp(18px,3vw,30px) ;
  font-weight: bold;
  height: 70px;
  letter-spacing: 10px;
  line-height: 70px;
  padding: 0 30px;
  position: relative;
  text-align: center;
}
.ribbon.sky_blue{
  background: #2C74D8;
}
.ribbon::before, .ribbon::after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}
.ribbon::before {
  border-color: transparent transparent transparent #fff;
  border-style: solid;
  border-width: 35px 0px 35px 15px;
  left: 0;
  top: 0;
}
.ribbon::after {
  border-color: transparent #fff transparent transparent;
  border-style: solid;
  border-width: 35px 15px 35px 0px;
  right: 0;
  top: 0;
}




.migi_ribbon {
  background: var(--color_d_blue);
  box-sizing: border-box;
  color: #fff;
  /* display: inline-block; */
  /* font-size: 20px; */
  font-weight: bold;
  height: 50px;
  letter-spacing: .5px;
  line-height: 50px;
  padding: 0 30px;
  position: relative;
  text-align: center;
}
.migi_ribbon::before, .migi_ribbon::after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}
.migi_ribbon::before {
  border-color: transparent transparent transparent #fff;
  border-style: solid;
  border-width: 25px 0px 25px 15px;
  left: 0;
  top: 0;
}
.migi_ribbon::after {
  border-color: transparent #fff transparent transparent;
  border-style: solid;
  border-width: 25px 15px 25px 0px;
  right: 0;
  top: 0;
}

body .kata_ribbon {
  background: var(--color_d_blue);
  width: 40%;
  max-width: 400px;
  color: #fff;
  display: inline-block;
  font-weight: bold;
  letter-spacing: 1px;
  /* padding: 10px 20px; */
  position: relative;
  text-align: center;
}

body .kata_ribbon:hover {
  background: var(--color_blue);
}

body .kata_ribbon a{
  color: #fff;
}
/* .kata_ribbon::before {
  border-bottom: 15px solid transparent;
  border-right: 20px solid #d4766a;
  content: '';
  left: 0;
  position: absolute;
  top: 100%;
} */
.kata_ribbon::after {
  border-bottom: 15px solid transparent;
  border-left: 20px solid #062765;
  content: '';
  position: absolute;
  right: 0;
  top: 100%;
}
.kata_ribbon span {
  /* display: block; */
  font-size: 60%;
  font-weight: normal;
}

.kata_ribbon a{
  display: block;
  padding: 10px 20px;
}


.formTable .col-head{
  font-weight: bold;
}