@charset "UTF-8";

/* CSS Document */


/* 色 */

.oft-u-bg-blue {
  background-color: #55BFE0;
}

.oft-u-bg-blue-2 {
  background-color: #ACE5DB;
}

.oft-u-bg-blue-3 {
  background-color: #DDF2ED;
}

.oft-u-bg-blue-4 {
  background-color: #BEE4ED;
}

.oft-u-bg-blue-5 {
  background-color: #DEF3FA;
}

.oft-u-bg-bblue {
  background-color: #1787CC;
}

.oft-u-bg-glay {
  background-color: #4D4D4D;
}

.oft-u-bg-indigo {
  background-color: #096ABA;
}


/* フォントサイズ */

.oft-l-container, .oft-l-container-fluid {
  font-size: 1.8rem;
  line-height: 1.7;
}

.oft-l-container p, .oft-l-container-fluid p {
	color: #000;
}

.oft-l-container h2, .oft-l-container-fluid h2 {
	color: #000;
  font-size: 35pt;
  background-color: hsla(0, 0%, 100%, 0.00);
  line-height: 1.5;
  margin-left: 0px;
  padding-left: 0px;
}

.oft-l-container h2 small, .oft-l-container-fluid h2 small {
  font-size: 60%;
}

.oft-l-container h3, .oft-l-container-fluid h3 {
	color: #000;
  font-size: 30pt;
  line-height: 1.5;
  border-left: 15px solid #29ABE2;
  padding-left: 20px;
}

.oft-l-container h4, .oft-l-container-fluid h4 {
  font-size: 20pt;
  line-height: 1.7;
}

.oft-l-container h3.oft-u-title, .oft-l-container-fluid h3.oft-u-title {
	color: #000;
  font-size: 25pt;
  border-left: 10px solid #29ABE2;
  background-color: #E7F4F7;
  padding-left: 20px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.oft-l-text-white {
  color: #FFFFFF;
}

.oft-l-text-link {
  color: #1a0dab;
  text-decoration: underline;
}

@media print, screen and (max-width:600px) {
  .oft-l-container, .oft-l-container-fluid {
    font-size: 1.2rem;
    line-height: 1.7;
  }
  .oft-l-container h2, .oft-l-container-fluid h2 {
    font-size: 20pt;
    background-color: hsla(0, 0%, 100%, 0.00);
    line-height: 1.5;
  }
  .oft-l-container h4, .oft-l-container-fluid h4 {
    font-size: 18pt;
    line-height: 1.7;
  }
  .oft-l-container h3.oft-u-title, .oft-l-container-fluid h3.oft-u-title {
    font-size: 16pt;
  }
  .oft-l-container h3, .oft-l-container-fluid h3 {
    font-size: 18pt;
    line-height: 1.5;
  }
  .oft-l-container h5, .oft-l-container-fluid h5 {
    font-size: 14pt;
    line-height: 1.7;
  }
}


/*  イメージホバー  */

a img.oft-u-img-fluid {
  position: relative;
  top: 0;
}

a img.oft-u-img-fluid:hover {
  opacity: 0.7;
  top: -10px;
  transition: 0.7s;
}


/* ナビゲーション */

.oft-c-nav-1, .oft-c-nav-2 {
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  margin-bottom: 1em;
  font-size: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.oft-c-nav-2 {
  width: 100% !important;
  position: relative;
}

.oft-c-nav-1 li, .oft-c-nav-2 li {
  display: inline-block;
  border-right: 1px solid #1787CC;
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 1.4rem;
  line-height: 2.3;
  text-align: center;
}

.oft-c-nav-1 li {
  width: 18%;
  padding-top: 5px;
  padding-bottom: 5px;
}

.oft-c-nav-2 li {
  width: 16.52%;
}

.oft-c-nav-2 li.oft-c-color-indigo,.oft-c-nav-2 li.oft-c-color-green {
  position:relative;
  text-decoration:none;
  text-align:center;
  color:#fff;
  z-index:0;
}

.oft-c-nav-2 li.oft-c-color-indigo:before {
	 content:"";
	position:absolute;
	width:100%;
  height:100%;
  z-index:-1;
	top:0;
	 left:0;
  transition:0.5s;
	background: linear-gradient(-90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(0deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(180deg, #096ABA 0px, #096ABA 10px,#00498F 0%,#00498F 0%);
}

.oft-c-nav-2 li.oft-c-color-green:before {
	 content:"";
	position:absolute;
	width:100%;
  height:100%;
  z-index:-1;
	top:0;
	 left:0;
  transition:0.5s;
	background: linear-gradient(-90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(0deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(180deg, #096ABA 0px, #096ABA 10px,#8CC63F 0%,#8CC63F 0%);
}

.oft-c-nav-2 li.oft-c-color-indigo:after,.oft-c-nav-2 li.oft-c-color-green:after {
	content:"";
	position:absolute;
	width:100%;
  height:100%;
  z-index:-2;
		top:0;
	 left:0;
  transition:0.5s;
	transition : 1s;
	background: linear-gradient(-90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(90deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(0deg, #096ABA 0px, #096ABA 10px,rgba(255,255,255,0.00) 0%,rgba(255,255,255,0.00) 0%),
	linear-gradient(180deg, #096ABA 0px, #096ABA 10px,#1687CC 0%,#1687CC 0%);
}

.oft-c-nav-2 li.oft-c-color-indigo:hover:before,.oft-c-nav-2 li.oft-c-color-green:hover:before {
  opacity:0;
}

.oft-c-nav-1 li:first-child, .oft-c-nav-2 li:first-child {
  border-left: 1px solid #1787CC;
}

@media print, screen and (max-width:959px) {
  .oft-c-nav-1 li, .oft-c-nav-2 li {
    font-size: 1rem;
  }
  .oft-c-nav-1 li:first-child, .oft-c-nav-2 li:first-child, .oft-c-nav-2 li:nth-child(4) {
    border-left: 1px solid #1787CC;
  }
  .oft-c-nav-1 li {
    width: 33%;
  }
  .oft-c-nav-2 li {
    width: 33%;
  }
}

.oft-c-nav-1 li a, .oft-c-nav-1 li a:active, .oft-c-nav-2 li a, .oft-c-nav-2 li a:active {
  color: #FFFFFF !important;
  text-decoration: none !important;
  font-weight: bold;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 5px;
  padding-right: 5px;
}

.oft-c-nav-1 li:hover, .oft-c-nav-2 li:hover {
  background-color: #6D6D6D;
  transition: 0.7s;
}

.oft-c-nav-2>li {
  display: inline-block;
  position: relative;
}

.oft-c-nav-2>li>ul {
  display: none;
}

.oft-c-nav-2>li:hover ul {
  display: block;
  position: absolute;
  padding: 0;
  margin: 0;
  top: 4.4em;
  left: 0;
  list-style-type: none;
  z-index: 10;
  background-color: #8CC63F;
}

.oft-l-menu-1 {
  line-height: 1.5!important;
}

.oft-c-nav-2>li:hover ul li {
    width: 100%;
    background-color: #00498F;
    border-bottom: 1px solid #1687CC;
}

.oft-c-nav-2>li:hover ul li:hover {
	transition : 1s;
  width: 100%;
  background-color: #1687CC;
}

@media print, screen and (max-width:600px) {
  .oft-c-nav-2>li:hover ul {
    top: 6em;
  }
}


/* フッターナビゲーション */

.oft-c-footbox {
  padding-top: 30px;
  padding-right: 30px;
  padding-bottom: 10px;
  padding-left: 30px;
}

.oft-c-footbox label {
  color: #000000;
  font-size: 2rem;
  padding-bottom: 10px;
  font-weight: bold;
}

.oft-c-foot-bg-1 {
  background-color: #5986B2;
}

.oft-c-foot-bg-2 {
  background-color: #5D93BA;
}

.oft-c-foot {
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  line-height: 2;
  margin-top: 10px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
}

.oft-c-foot li {
  color: #000;
  list-style-type: none;
  padding-left: 0px;
}
.oft-c-foot li a {
    color: #000!important;
    text-decoration: none!important;
}

.oft-c-foot li a:hover {
	opacity: 0.8;
}

.oft-c-foot li::before {
  content: "■";
  color: #5CD0E0;
}

.oft-c-toggle {
  display: none;
}

@media print, screen and (max-width:600px) {
  .oft-c-footbox label, .oft-c-foot {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.3s;
  }
  .oft-c-footbox label {
    font-size: 1.5rem;
    border: 1px solid #000000;
    padding: 1em;
    display: block;
    font-weight: bold;
    border-radius: 10px;
  }
  .oft-c-footbox label::after, .oft-c-footbox label::before {
    content: "　";
    position: absolute;
    right: 1.25em;
    top: 1.3em;
    width: 2px;
    height: 0.75em;
    background-color: #fff;
    transition: all 0.3s;
  }
  .oft-c-footbox label::after {
    width: 10px;
    background-image: url(../images/oft-top-btn-aft-1.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 15px;
  }
  .oft-c-footbox label::after {
    transform: rotate(90deg);
  }
  .oft-c-foot {
    max-height: 0;
    overflow: hidden;
  }
  .oft-c-toggle:checked+label+.oft-c-foot {
    max-height: 500px;
    transition: all 1.5s;
  }
  .oft-c-toggle:checked+label::before {
    transform: rotate(90deg);
  }
}

.oft-c-color-bglblue {
  background-color: #EFF7F9;
}

a.oft-u-btn1 {
  border: 1px solid #C1C1C1;
  text-align: left;
  width: 100%;
  display: block;
  border-radius: 10px;
  line-height: 4;
  font-size: 2.3rem;
  padding-top: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 60px;
  position: relative;
  margin-bottom: 20px;
}

a.oft-u-btn1 img {
  position: absolute;
  vertical-align: middle;
  width: 50px;
  padding-right: 20px;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
}

a.oft-u-btn1:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-image: url(../images/oft-top-btn-aft-1.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
}

a.oft-u-btn1:hover {
  background-color: hsla(198, 61%, 54%, 1.00);
  color: #FFFFFF;
  transition: 0.7s;
  right: 0px;
}

a.oft-u-btn1:hover:after {
  right: 15px;
  transition: 0.7s;
}

a.oft-u-btn2 {
  text-align: left;
  width: 350px;
  display: block;
  border-radius: 10px;
  line-height: 4;
  font-size: 2rem;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 60px;
  position: relative;
  margin-bottom: 0px;
  text-decoration: none!important;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 600px) {
  a.oft-u-btn2 {
    width: 100%;
    font-size: 1.6rem;
  }
}

a.oft-u-btn2 img {
  position: absolute;
  vertical-align: middle;
  width: 50px;
  padding-right: 20px;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
}

a.oft-u-btn2:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-image: url(../images/oft-top-btn-aft-1.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
}

a.oft-u-btn2:hover {
  background-color: hsla(198, 61%, 54%, 1.00);
  transition: 0.7s;
  right: 0px;
}

a.oft-u-btn2:hover:after {
  right: 15px;
  transition: 0.7s;
}

a.oft-u-btn3 {
  text-align: center;
  border-radius: 10px;
  position: relative;
  margin-bottom: 20px;
  text-decoration: none!important;
  width: 100%;
  margin-top: 20px;
}

a.oft-u-btn3 img {
  width: 30px;
  margin-right: 5px;
}

a.oft-u-btn4 {
  border: 1px solid #C1C1C1;
  text-align: center;
  width: 100%;
  display: block;
  border-radius: 10px;
  line-height: 4;
  font-size: 2.3rem;
  padding-top: 20px;
  padding-bottom: 50px;
  position: relative;
  margin-bottom: 20px;
  line-height: 1.5;
  height: 200px;
}

a.oft-u-btn4 img {
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

a.oft-u-btn4:after {
  content: "　";
  position: absolute;
  bottom: 10px;
  background-image: url(../images/oft-top-btn-aft-1.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: rotateZ(90deg);
  right: 0;
  left: 0;
}

a.oft-u-btn4:hover {
  background-color: hsla(198, 61%, 54%, 1.00);
  color: #FFFFFF;
  transition: 0.7s;
  right: 0px;
}

a.oft-u-btn4:hover:after {
  bottom: 0px;
  transition: 0.7s;
}



a.oft-u-btn6 {
    margin: -15px 15px 40px 15px;;
    width: 100%;
    padding: 10px 10px 10px 40px;
    text-decoration: none!important;
    line-height: 2.3;
    border-radius: 8px;
    display: block;
    position: relative;
    font-size: 2rem;
    text-align: center;
}
a.oft-u-btn6 img {
  position: absolute;
  vertical-align: middle;
  width: 50px;
  padding-right: 20px;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
}
a.oft-u-btn6:after {
    content: "　";
    position: absolute;
    right: 25px;
    background-image: url(../images/oft-top-btn-aft-1.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 8px auto;
}
a.oft-u-btn6:hover {
  background-color: hsla(198, 61%, 54%, 1.00);
  transition: 0.7s;
  right: 0px;
}
a.oft-u-btn6:hover:after {
  right: 15px;
  transition: 0.7s;
}



@media screen and (max-width: 600px) {}

a.oft-u-btn-op1 {
  line-height: 1.5;
  width: 500px;
  font-size: 140%;
  font-weight: bold;
}

a.oft-u-btn-op1:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-100%);
}

a.oft-u-btn-op1 img {
  position: absolute;
  height: 100px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  right: -300px;
}

@media screen and (max-width: 600px) {
  a.oft-u-btn-op1 {
    width: 100%;
  }
  a.oft-u-btn-op1 img {
    height: 80px;
  }
}

a.oft-u-btn-op2 {
  line-height: 1.5;
  width: 100%;
  font-size: 140%;
  font-weight: bold;
}

a.oft-u-btn-op2:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-50%);
}

a.oft-u-btn-op2 img {
  position: absolute;
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  left: 20px;
}

@media screen and (max-width: 600px) {
  a.oft-u-btn-op2 img {
    height: 30px;
  }
}

a.oft-u-btn-op3 {
  line-height: 1.5;
  width: 100%;
  font-size: 140%;
  min-height: 115px;
  padding-top: 15px;
  font-weight: bold;
}

a.oft-u-btn-op3:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-40%);
}

a.oft-u-btn-op3 img {
  position: absolute;
  height: 100px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  right: -300px;
}

@media screen and (max-width: 600px) {
  a.oft-u-btn-op3 {
    line-height: 2;
    width: 100%;
    font-size: 140%;
    min-height: 115px;
    padding-top: 15px;
  }
  a.oft-u-btn-op3, a.oft-u-btn-op2 {
    font-size: 165%;
  }
  a.oft-u-btn-op3 img {
    position: absolute;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: auto;
    right: -60%;
  }
  a.oft-u-btn-op3 img {
    height: 70px;
  }
}

a.oft-u-btn-op4 {
  line-height: 1.2;
  width: 100%;
  font-size: 140%;
}

a.oft-u-btn-op4:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-100%);
}

a.oft-u-btn-op4 img {
  position: absolute;
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  left: 20px;
}

a.oft-u-btn-op5 {
  line-height: 1.2;
  width: 100%;
  font-size: 140%;
  padding-top: 34px;
  padding-bottom: 34px;
}

a.oft-u-btn-op5:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-50%);
}

a.oft-u-btn-op5 img {
  position: absolute;
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  left: 20px;
}

a.oft-u-btn-op6 {
  line-height: 1.2;
  width: 100%;
  font-size: 140%;
  padding-top: 25px;
  padding-bottom: 25px;
}

a.oft-u-btn-op6:after {
  content: "　";
  position: absolute;
  right: 25px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px auto;
  transform: translateY(-0%);
}

a.oft-u-btn-op6 img {
  position: absolute;
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: auto;
  left: 20px;
}

.oft-u-btncolor-yellow {
  background-color: #FFE000!important;
  color: #000000!important;
}

.oft-u-btncolor-green {
  background-color: #8CC63F!important;
  color: #FFF!important;
}

.oft-u-btncolor-indigo {
  background-color: #00498F!important;
  color: #FFF!important;
}

a.oft-u-btncolor-green:after, a.oft-u-btncolor-indigo:after {
  background-image: url(../images/oft-top-btn-aft-2.png);
}

.oft-u-btncolor-yellow:hover, .oft-u-btncolor-green:hover, .oft-u-btncolor-indigo:hover {
  opacity: 0.8;
}


/* テーブル */

.oft-c-table-1 {
  width: 100%;
  max-width: 100%;
}

.oft-c-table-1 th, .oft-c-table-1 td {
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-weight: bold;
  vertical-align: middle;
}

.oft-c-table-1 td {
  min-width: 200px;
  background-color: hsla(0, 0%, 100%, 1.00);
  padding-top: 20px;
  padding-right: 15px;
  padding-bottom: 20px;
  padding-left: 15px;
}

.oft-c-table-1 td.oft-u-buttonbox {
  width: 400px;
}

.oft-c-table-1 td.oft-u-buttonbox a.oft-u-btn2 {
  text-decoration: none;
}

.oft-c-table-1 h3 {
  font-size: 2.2rem;
  text-align: center;
}

.oft-c-table-1 h5 {
  font-size: 1.8rem;
  color: #0071BC;
}

.oft-c-table-1 th {
  background-color: #1787CC;
  color: #FFFFFF;
  min-width: 260px;
}

@media screen and (max-width: 600px) {
  .oft-c-table-1 h3 {
    font-size: 1.8rem;
    text-align: center;
  }
  .oft-c-table-1 {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
  }
  .oft-c-table-1 tr {
    width: 100%;
    display: block;
    float: left;
    font-size: 1.6rem;
  }
  .oft-c-table-1 tr td, .oft-c-table-1 tr th {
    display: block;
    width: 100%;
  }
  .oft-c-table-1 th, .oft-c-table-line {
    border-bottom: 0px solid #FFFFFF;
  }
  .oft-c-table-1 td.oft-u-buttonbox {
    width: 100%;
  }
}

.oft-c-table-2 {
  width: 100%;
  max-width: 100%;
}

.oft-c-table-2 th, .oft-c-table-2 td {
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-weight: bold;
  vertical-align: middle;
  border: 1px solid #ADADAD;
}

.oft-u-color-bgwhite {
  background-color: #FFF;
}

.oft-u-color-bgblue {
  background-color: #F2F8F9;
}

.oft-u-color-bggreen {
  background-color: #F6F7F0;
}

.oft-u-color-bgyellow {
  background-color: #F9F4E1;
}

.oft-u-color-lineblue {
  border: 5px solid #29ABE2;
}

.oft-u-color-linegreen {
  border: 5px solid #8CC63F;
}

.oft-u-color-lineyellow {
  border: 5px solid #F9F4E1;
}

.oft-l-sm-none {
  display: none;
}

	  .oft-l-pc-none {
    display: inherit;
  }

@media screen and (max-width: 600px) {
  .oft-l-sm-none {
    display: inherit;
  }
	  .oft-l-pc-none {
    display: none;
  }
}

.l-main {
    overflow-x: visible!important;
    overflow-y: visible!important;
}

.oft-l-sticky-1 {
    position: fixed;
  top: 0;
  z-index: 2;
  width: 100%;
  }