@charset "UTF-8";
p a {
  color: #448eb7 !important;
}
p a:hover {
  color: #448eb7 !important;
}
p a:visited {
  color: #448eb7 !important;
}
h3 a {
  color: #448eb7 !important;
}
h3 a:hover {
  color: #448eb7 !important;
}
h3 a:visited {
  color: #448eb7 !important;
}

.sub-head-bak-blue {
  background-color: #448eb7;
}
.sub-head-bak-green {
  background-color: #92d6c1;
}
.sub-head-bak-red {
  background-color: #fb9da6;
}
@media screen and (min-width: 640px) {
  .top-bak {
    height: 100%;
    width: auto;
    position: absolute;
    z-index: 10;
    right: 0;
  }
  .top-box {
    display: block;
    height: auto;
    width: 400px;
    position: absolute;
    z-index: 10;
    right: 5%;
    top: 15%;
  }
  .top-logo {
    height: auto;
    width: 200px;
    z-index: 10;
    margin: auto;
  }
  .top-read {
    padding-top: 30px;
    height: auto;
    width: 400px;
    font-size: 30px;
    line-height: 2.5;
    font-weight: bold;
  }
}
@media screen and (max-width: 640px) {
  .top-bak {
    height: 100%;
    width: 65%;
    position: absolute;
    z-index: 10;
    right: 0;
    overflow: hidden;
  }
  .top-box {
    display: block;
    height: auto;
    width: 220px;
    position: absolute;
    z-index: 10;
    right: 0%;
    bottom: 20%;
  }
  .top-logo {
    height: auto;
    width: 130px;
    z-index: 10;
    margin: auto;
  }
  .top-read {
    padding-top: 30px;
    height: auto;
    width: 220px;
    font-size: 14px;
    line-height: 2;
    font-weight: bold;
  }
}
.sp-slide {
  z-index: 3;
}
.sp-slide .sp-image {
  z-index: 3;
}
.sp-slide .sp-image img{
  width: 100%;
    height: auto;
    
}
.moji {
  position: absolute;
  bottom: 0%;
  left: 3%;
  width: 30%;
  height: auto;
  z-index: 10;
}
@media screen and (min-width: 640px) {
  .sub-content {
    padding-top: 140px;
  }
  .toppage-pad {
    padding-top: 140px;
  }
}
@media(max-width: 640px) {
  .sub-content {
    padding-top: 50px;
  }
  .toppage-pad {
    padding-top: 40px;
  }
  .brsm {
    display: block;
  }
  .sp-img {
    width: 100%;
    height: auto;
    margin: auto;
    text-align: center;
  }
}
footer {}
footer a {}
.nav_foot li a {
  color: #e7e7e7 !important;
}
footer a:hover {}
footer .ft-list h5 {
  color: #e7e7e7;
}
.footlogo {
  color: #e7e7e7;
}
.blue-bold {
  font-weight: bold;
  color: #004178;
}
.green-bold {
  font-weight: bold;
  color: #1f8d32;
}
.green-border {
  padding-bottom: 8px;
  border-bottom: #002655 1px solid !important;
}
.green-txt {
  color: #1f8d32;
}
.black-txt {
  color: #111 !important;
}
.bk-orange {
  background: #f29600 !important;
}
.bk-gray {
  background: #f9f9f9 !important;
}
.bk-green {
  background: #0dac67 !important;
}
.bk-blue {
  background: #448eb7 !important;
}
.bk-pink {
  background: #d3589b !important;
}
.headTitle11 {
  color: #333;
}
.headTitle11 span {
  color: #000;
}
.headTitle span, .headTitle2 span, .headTitle22 span, .midasi-sen,.headTitle11 span{
    padding-bottom: 20px;
  border-bottom: #448eb7 3px solid !important;
    max-width: 100px;
}
.sen2 {
  display: block;
  width: 500px !important;
  height: 1px !important;
  background-color: #002655;
}
h2, .sub-h3, .sub-h4 {}
.midasi-sen span {
  color: #000;
}
.contact-section .headTitle {
  color: #fff !important;
}
.contact-link a {
  color: #FFFFFF !important;
}
.contact-link a:hover {
  color: #FFFFFF !important;
}
.contact-link a:visited {
  color: #FFFFFF !important;
}

.sp-slide .pr_list {
  width: 80%;
  margin: auto;
  text-align: center;
}
.sp-slide .pr_list .img img {
  width: 100%;
  height: auto;
  margin: auto;
  text-align: center;
}
.contact-section .tel {
  color: #ff909a !important;
}
.contact-section p {
  color: #ff909a !important;
}
.contact-section .fax {
  color: #fff !important;
}
.contact-section .tel a:link {
  color: #ff909a !important;
}
.contact-section .fax a:link {
  color: #fff !important;
}
.title-column2 .headTitle {
  font-family: 'Ramabhadra', sans-serif;
}
.box-waku5 {
  padding: 50px 0 0 0;
  width: 100%;
  height: auto;
  margin: 50px auto;
  position: relative;
  display: block;
  text-align: left;
}
.bg-entry-box {
  background-image: url(../../images/entry.jpg);
  background-size: cover;
}
/* リンクaタグ処理------------------------------------------------------*/
.box-waku11 a, .box-waku3 a, .box-waku4 a, .box-waku8 a, .box-waku6 a, .box-waku7 a, .black-botan a, .button-anime a, .anime-button7 a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* ページトップへ　画像サイズ------------------------------------------------------*/
#pageTop {
  position: fixed;
  bottom: 55px;
  right: 20px;
  width: 50px;
  z-index: 100;
}
#pageTop img {
  width: 100%;
  height: auto;
}
@media(max-width: 640px) {
  #pageTop {
    position: fixed;
    bottom: 50px;
    right: 5px;
    width: 30px;
    z-index: 100;
  }
}
/* フットバナー------------------------------------------------------*/
.footbana {
  line-height: 50px;
  z-index: 50;
  bottom: 0;
  position: fixed;
  width: 100%;
  height: 40px;
}
.footbana .bana01 {
  padding-top: 10px;
  width: 50%;
  height: 100%;
  float: left;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
}
.footbana .bana01 img {
  width: 30px;
  height: auto;
  padding-right: 10px;
}
.footbana .bana02 {
  padding-top: 10px;
  width: 50%;
  height: 100%;
  float: left;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
  border-left: #FFFFFF 1px solid;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
.footbana .bana02 img {
  width: 15px;
  height: auto;
  padding-right: 10px;
}
/*ボタン１------------------------------------------*/
.a_link, .a_link::before, .a_link::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.a_link {
  position: relative;
  z-index: 2;
  color: #333;
  border-bottom: #f8f3f1 0px solid;
}
.a_link:hover {
  color: #847a46;
  margin-left: 5px;
  border-bottom: #847a46 1px solid;
}
.button::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button {
  display: inline-block;
  max-width: 600px;
  width: 90%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  line-height: 60px;
  outline: none;
  font-size: 22px;
  background-color: #FFFFFF;
}
.button::before, .button::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button, .button::before, .button::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button:hover span {
  transition: 0.3s ease-in-out;
  opacity: 0;
}
.button {
  position: relative;
  z-index: 2;
  overflow: hidden;
  border: #ccc 1px solid;
  color: #002655;
}
.button:hover {
  color: #002655;
  padding-left: 20px;
  border: #002655 1px solid;
}
.button:hover span {
  display: block;
  width: 8px;
  height: 14px;
  background-image: url(../../images/yaji.jpg);
  background-repeat: no-repeat;
  top: 23px;
  left: 1%;
  margin-left: 4%;
  position: absolute;
  opacity: 1;
  transition: 0.3s ease-in-out;
}
.button span {
  display: block;
  width: 8px;
  height: 14px;
  background-image: url(../../images/yaji.jpg);
  background-repeat: no-repeat;
  top: 23px;
  left: 1%;
  margin-left: 0%;
  position: absolute;
  opacity: 0;
  transition: 0.3s ease-in-out;
}
.button::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button:hover::after {
  background: #fff;
  opacity: 0.4;
}
.button2::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button2 {
  display: inline-block;
  max-width: 400px;
  width: 90%;
  height: 70px;
  text-align: center;
  text-decoration: none;
  line-height: 70px;
  outline: none;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  font-size: 20px;
  color: #fff;
  background-color: #448eb7;
}
.button2::before, .button2::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button2, .button2::before, .button2::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button2:hover span {
  transition: 0.3s ease-in-out;
  opacity: 0;
}
.button2 {
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.button2:hover {
  color: #fff;
}
.button2::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button2:hover::after {
  background: #fff;
  opacity: 0.4;
}


.button33::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button33 {
    margin-top: 10px;
  display: inline-block;
  width: 100%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  line-height: 60px;
  outline: none;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  font-size: 20px;
  color: #fff;
  background-color: #448eb7;
}
.button33::before, .button33::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button33, .button33::before, .button33::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button33:hover span {
  transition: 0.3s ease-in-out;
  opacity: 0;
}
.button33 {
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.button33:hover {
  color: #fff;
}
.button33::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button33:hover::after {
  background: #fff;
  opacity: 0.4;
}
.button33-midori{
  background: #39ad36;
}
.button33-or{
  background: #f39e4c;
}

.txt-right {
  width: 80%;
  margin: auto;
  text-align: right !important;
}
.left {
  float: left;
}
.right {
  float: right;
}
.txt_R {
  text-align: right;
}
.txt_L {
  text-align: left;
}
.txt_C {
  text-align: center !important;
}
.mb5 {
  margin-bottom: 5px;
}
.mb10 {
  margin-bottom: 10px;
}
.mb15 {
  margin-bottom: 15px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb25 {
  margin-bottom: 25px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb35 {
  margin-bottom: 35px;
}
.mb40 {
  margin-bottom: 40px;
}
.mb45 {
  margin-bottom: 45px;
}
.mb50 {
  margin-bottom: 50px;
}
.mb55 {
  margin-bottom: 55px;
}
.mb60 {
  margin-bottom: 60px;
}
.mb65 {
  margin-bottom: 65px;
}
.mb70 {
  margin-bottom: 70px;
}
.mt10 {
  margin-top: 10px;
}
.mt20 {
  margin-top: 20px;
}
.mt30 {
  margin-top: 30px;
}
.mt-30 {
  margin-top: -30px;
}
.mt40 {
  margin-top: 40px;
}
.mt50 {
  margin-top: 50px;
}
.mt60 {
  margin-top: 60px;
}
.mt70 {
  margin-top: 70px;
}
.mt80 {
  margin-top: 80px;
}
.mt90 {
  margin-top: 90px;
}
.mt100 {
  margin-top: 100px;
}
.mr10 {
  margin-right: 10px;
}
.mr20 {
  margin-right: 20px;
}
.mr30 {
  margin-right: 30px;
}
.mr40 {
  margin-right: 40px;
}
.mr50 {
  margin-right: 50px;
}
.mr60 {
  margin-right: 60px;
}
.mr70 {
  margin-right: 70px;
}
.mr80 {
  margin-right: 80px;
}
.mr90 {
  margin-right: 90px;
}
.mr100 {
  margin-right: 100px;
}
.ml10 {
  margin-left: 10px;
}
.ml20 {
  margin-left: 20px;
}
.ml30 {
  margin-left: 30px;
}
.ml40 {
  margin-left: 40px;
}
.ml50 {
  margin-left: 50px;
}
.ml60 {
  margin-left: 60px;
}
.ml70 {
  margin-left: 70px;
}
.ml80 {
  margin-left: 80px;
}
.ml90 {
  margin-left: 90px;
}
.ml100 {
  margin-left: 100px;
}
.ma10 {
  margin: 10px;
}
.ma20 {
  margin: 20px;
}
.ma30 {
  margin: 30px;
}
.ma40 {
  margin: 40px;
}
.pb5 {
  padding-bottom: 5px;
}
.pb10 {
  padding-bottom: 10px;
}
.pb15 {
  padding-bottom: 15px;
}
.pb20 {
  padding-bottom: 20px;
}
.pb25 {
  padding-bottom: 25px;
}
.pb30 {
  padding-bottom: 30px;
}
.pb35 {
  padding-bottom: 35px;
}
.pb40 {
  padding-bottom: 40px;
}
.pb45 {
  padding-bottom: 45px;
}
.pb50 {
  padding-bottom: 50px;
}
.pb60 {
  padding-bottom: 60px;
}
.pt10 {
  padding-top: 10px;
}
.pt20 {
  padding-top: 20px;
}
.pt30 {
  padding-top: 30px;
}
.pt40 {
  padding-top: 40px;
}
.pt50 {
  padding-top: 50px;
}
@media screen and (max-width: 1024px) {
  .pt50 {
    padding-top: 30px;
  }
}
.pt60 {
  padding-top: 60px;
}
.pt70 {
  padding-top: 70px;
}
.pt80 {
  padding-top: 80px;
}
.pt90 {
  padding-top: 90px;
}
.pt100 {
  padding-top: 100px;
}
.pr10 {
  padding-right: 10px;
}
.pr15 {
  padding-right: 15px;
}
.pr20 {
  padding-right: 20px;
}
.pr30 {
  padding-right: 30px;
}
.pr40 {
  padding-right: 40px;
}
.pr50 {
  padding-right: 50px;
}
.pr60 {
  padding-right: 60px;
}
.pr70 {
  padding-right: 70px;
}
.pr80 {
  padding-right: 80px;
}
.pr90 {
  padding-right: 90px;
}
.pr100 {
  padding-right: 100px;
}
.pl10 {
  padding-left: 10px;
}
.pl20 {
  padding-left: 20px;
}
.pl30 {
  padding-left: 30px;
}
.pl40 {
  padding-left: 40px;
}
.pl50 {
  padding-left: 50px;
}
.pl60 {
  padding-left: 60px;
}
.pl70 {
  padding-left: 70px;
}
.pl80 {
  padding-left: 80px;
}
.pl90 {
  padding-left: 90px;
}
.pl100 {
  padding-left: 100px;
}
.p5 {
  padding: 5px;
}
.p10 {
  padding: 10px;
}
.p15 {
  padding: 15px;
}
.p20 {
  padding: 20px;
}
.p25 {
  padding: 25px;
}
.p30 {
  padding: 30px;
}
.p35 {
  padding: 35px;
}
.p40 {
  padding: 40px;
}
.p45 {
  padding: 45px;
}
.p50 {
  padding: 50px;
}
.pt-20 {
  padding-top: -20px;
}
.pt0 {
  padding-top: 0px !important;
}
.pad10{
    padding: 10px;
}
.sno-pt20 {
  padding-top: 20px;
}
@media screen and (max-width: 640px) {
  .sno-pt20 {
    padding-top: 0px;
  }
  .spt20 {
    padding-top: 20px;
  }
  .spt-20 {
    margin-top: -30px !important;
  }
}
.layer {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
  -webkit-transition: .3s;
  transition: .3s;
}
.layer:hover {
  background: rgba(0, 0, 0, .2);
}
.layer .linkarea {
  position: absolute;
  top: 30px;
  left: 104px;
  width: 100%;
  height: 100%;
}
.bg-img-box:hover .bg-img-box-bgImg {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
.bg-img-box:hover {
  background-color: rgba(0, 0, 0, .3);
}
.bg-img-box-bgImg {
  transition-timing-function: cubic-bezier(.25, .46, .45, .94);
  transition-duration: 2s;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
.bg-img-box-header {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 650px;
  width: 100%;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  /* background-image: url(../../images/repeat0.jpg);
	background-repeat:repeat;*/
  padding: 5% 0 5% 0;
  color: #fff;
  transition-duration: 20s;
}
.bg-img-box-header a {
  display: block;
  width: 100%;
}
.bg-img-box-header {
  transition: 0.4s ease-in-out;
  opacity: 0.9;
}
.bg-img-box-header:hover {
  /*background-image: url(../../images/repeat0.jpg);
	background-repeat:repeat;*/
  transition: 0.4s ease-in-out;
  opacity: 0.7;
}
/*
.bg-img-box-header a:link{
	color:#000;}
.bg-img-box-header a:hover{
	color:#000;}


.bg-img-box-header a {
	letter-spacing: .2rem;
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.bg-img-box-header a::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #fff;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
}
.bg-img-box-header a:hover::after {
  transform: scale(1, 1);
}
*/
.bg-img-box {
  width: 100%;
  height: 100%;
  z-index: 1;
  position: relative;
  overflow: hidden;
}
.bg-img-box-bgImg {
  width: 100%;
  height: 100%;
  z-index: 1;
  position: relative;
  overflow: hidden;
}
/*背景画像*/
.bk001 {
  /*background-image: url(../../images/repeat2.jpg);*/
  background-color: #000;
  color: #fff;
  background-repeat: repeat;
}
.bk002 {
  /*background-image: url(../../images/repeat2.jpg);*/
  background-color: #000;
  color: #fff;
  background-repeat: repeat;
}
.bk003 {
  background-image: url(../../images/repeat3.jpg);
  background-repeat: repeat;
}
.bk004 {
  background-image: url(../../images/repeat4.jpg);
  background-repeat: repeat;
}
.bk005 {
  background-image: url(../../images/repeat5.jpg);
  background-repeat: repeat;
}
.bk006 {
  background-image: url(../../images/repeat6.jpg);
  background-repeat: repeat;
}
.bk010 {
  background-image: url(../../images/haikei1.jpg);
  background-size: cover;
}
.bk-flow {
  background-size: cover;
}
.bk-main {
  background-image: url(../../images/bk-main.jpg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: contain;
  width: 100%;
}
.bk-main2 {
  background-color: #e8ecf3;
}
/*リンク画像*/
.link:hover {
  background-color: #fff;
  transition: 0.6s ease-in-out;
  opacity: 0.5;
}
.link {
  transition: 0.6s ease-in-out;
  opacity: 1;
}
.link-gazo:hover {
  -webkit-transform: scale(1.3);
  -ms-transform: scale(1.3);
  transform: scale(1.3);
}
.link-gazo :hover {
  background: rgba(255, 255, 255, .3);
  -webkit-transition: .3s;
  transition: .3s;
}
.link-gazo {
  transition-timing-function: cubic-bezier(.25, .46, .45, .94);
  transition-duration: 10s;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
/*共通*********************************/
.img-w100 img {
  width: 100%;
  height: auto;
}
@media screen and (min-width: 640px) {
  .box-left {
    text-align: left;
  }
}
.bold {
  font-weight: bold;
}
.txt-read-box {
  margin: auto;
  width: 90%;
  text-align: left;
  line-height: 2;
}
.txt-read-box2 {
  margin: auto;
  width: 100%;
  text-align: left;
  line-height: 2;
}
.txt-read {
  margin: auto;
  text-align: left;
  line-height: 2;
}
@media screen and (min-width: 640px) and (max-width: 1024px) {
  .txt-box {
    width: 90%;
    margin: auto;
    line-height: 2;
  }
  .tab-no {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .txt-box {
    width: 90%;
    margin: auto;
    text-align: left;
    line-height: 2;
  }
  .sp-br-no {
    display: none;
  }
  .txt-read-spbox {
    margin: auto;
    width: 90%;
    text-align: left;
    line-height: 2;
  }
}
.footpad {
  margin: 150px 0 0 0;
}
@media screen and (min-width: 640px) and (max-width: 1024px) {
  .footpad {
    margin: 100px 0 0 0;
  }
}
@media screen and (max-width: 640px) {
  .footpad {
    margin: 70px 0 0 0;
  }
}
.cont90 {
  margin: -120px auto auto auto;
  max-width: 1600px;
  width: 95%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
}
.cont90-2 {
  margin: 60px auto auto auto;
  max-width: 1600px;
  width: 95%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
}
.cont1400 {
  max-width: 1600px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
  margin: auto;
}
.cont1200 {
  max-width: 1200px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
  margin: auto;
}
.cont1000 {
  max-width: 1000px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
}
@media screen and (max-width: 1024px) {
  .cont90 {
    margin: -60px auto auto auto;
    max-width: 1600px;
    width: 95%;
    height: 100%;
    display: block;
    position: relative;
    clear: both;
  }
  .cont1000 {
    max-width: 1000px;
    width: 90%;
    height: 100%;
    display: block;
    position: relative;
    clear: both;
  }
}
.cont1000 .full-img {
  max-width: 1000px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
}
.cont1000 .full-img img {
  width: 100%;
  height: auto;
}
.cont800 {
  max-width: 800px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  clear: both;
}
.title-column .sen {
  margin: auto;
  display: block;
  width: 100%;
  border-top: #ccc 1px solid;
  padding-bottom: 0px;
}
.cont1200 .sen, .cont1200-2 .sen {
  margin: auto;
  display: block;
  width: 100%;
  border-top: #ccc 1px solid;
  padding-bottom: 0px;
}
.ilust-img {
  margin: auto;
  display: block;
  width: 75%;
  max-width: 500px;
}
.ilust-img img {
  width: 100%;
  height: auto;
}
.qa .sub-h4 {
  margin: auto;
  display: block;
  width: 100%;
  border-bottom: #ccc 2px solid;
  padding-bottom: 0px;
  position: relative;
}
.qa .sub-h4:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 2px #000000;
  bottom: -2px;
  width: 30%;
}
.hyo dt, .hyo dd {
  overflow: hidden;
  white-space: nowrap;
  float: left;
}
.hyo {
  width: 100%;
  text-align: left;
}
.shohin-list-2 p {
  line-height: 2;
}
@media screen and (min-width: 640px) {
  .mt100-spno {
    margin-top: 100px;
    clear: both;
  }
  .pt100-spno {
    margin-top: 100px;
    clear: both;
  }
  .pt50-spno {
    margin-top: 50px;
    clear: both;
  }
  .shohin-list-2 img {
    width: 50%;
    height: auto;
  }
}
@media screen and (max-width: 640px) {
  .pt100-spno {
    margin-top: 50px;
    clear: both;
  }
  .pt50-spno {
    margin-top: 0px;
    clear: both;
  }
  .shohin-list-2 img {
    width: 60%;
    height: auto;
  }
}
@media screen and (min-width: 640px) {
  .store .sp {
    display: none;
  }
}
/*フォーム******************************************/
.form dt, .form dd {
  overflow: hidden;
  white-space: nowrap;
  float: left;
  font-size: 16px;
}
.form {
  width: 100%;
  text-align: left;
}
.form input[type="text"] {
  border: 0;
  padding: 15px 20px;
  width: 300px;
  height: 40px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #ccc;
  display: block;
  font-size: 16px;
}
.form dt span {
  border: 1px #6A0305 solid;
  padding: 5px;
  color: #6A0305;
  position: absolute;
  right: 10%;
  top: 45px;
  font-size: 12px;
}
.form select {
  border: 0;
  padding: 15px 20px;
  width: 300px;
  height: 60px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #ccc;
  display: block;
  font-size: 16px;
  color: #666;
}
.form textarea {
  border: 0;
  padding: 15px 20px;
  width: 90%;
  height: 200px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #ccc;
  display: block;
  font-size: 16px;
}
@media screen and (max-width: 640px) {
  .form input[type="text"] {
    border: 0;
    padding: 15px 20px;
    width: 100%;
    height: 40px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #ccc;
    box-shadow: 0 0 0 0;
    display: block;
  }
  .form dt span {
    border: 1px #6A0305 solid;
    padding: 5px;
    color: #6A0305;
    position: absolute;
    right: 10%;
    top: 45px;
    font-size: 12px;
  }
}
.chkbox {
  text-align: center;
  margin: 60px auto 0 auto;
}
.chkbox a {
  border-bottom: 1px solid #ccc;
}
.chkbox label {
  padding-left: 38px;
  line-height: 24px;
  display: inline-block;
  cursor: pointer;
  position: relative;
}
.chkbox label:before {
  border: 1px solid #ccc;
  content: '';
  width: 24px;
  height: 24px;
  display: inline-block;
  position: absolute;
  left: 0;
  background-color: #fff;
  border-radius: 2px;
}
.chkbox input[type=checkbox] {
  display: none;
}
.chkbox input[type=checkbox]:checked + label:before {
  content: '\2713';
  font-size: 24px;
  color: #fff;
  background-color: #d4c391;
}
/*エラー***************************/
span.error input, span.error textarea, span.error select, span.error label {
  background: #FFCCCC !important;
}
* html span.error label {
  background: none;
}
* + html span.error label {
  background: none;
}
span p.error {
  position: absolute;
  padding: 0;
  margin: 5px 0 0 20px;
  color: red;
  font-size: 11px;
  padding-bottom: 5px;
}
.pt25 {
  padding-top: 25px;
}
@media screen and (max-width: 640px) {
  .pt25 {
    padding-top: 0px;
    font-weight: bold;
  }
}
.white_shadow {
  text-shadow: #FFFFFF 1px 1px 2px, #FFFFFF 1px 1px 2px, #FFFFFF 1px 1px 2px, #FFFFFF 1px 1px 2px !important;
}
.ninki-op {
  text-align: center;
  margin: 0 auto;
  max-width: 730px;
  width: 100%;
  margin-bottom: 30px;
}
.ninki-op img {
  height: auto;
  width: 100%;
}
/*フォーム******************************************/
.bk-glay {
  background-color: #f9f9f9;
  width: 94%;
  padding: 3%;
  margin: auto;
}
.bk-glay img {
  width: 100%;
  height: auto;
}
.inv03 {
  animation-name: anime1;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime1 {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.anime1 {
  opacity: 0;
}
.anime1-mv {
  animation-name: anime1;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime1 {
  0% {
    opacity: 0;
    transform: translatex(30px);
  }
  100% {
    opacity: 1;
    transform: translatex(0);
  }
}
.anime2 {
  opacity: 0;
}
.anime2-mv {
  animation-name: anime2;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime2 {
  0% {
    opacity: 0;
    transform: translatey(30px);
  }
  100% {
    opacity: 1;
    transform: translatey(0);
  }
}
.anime22 {
  opacity: 0;
}
.anime22-mv {
  animation-name: anime22;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime22 {
  0% {
    opacity: 0;
    transform: translatey(30px);
    transform: scale(1.2, 1.2);
  }
  100% {
    opacity: 1;
    transform: translatey(0);
    transform: scale(1, 1);
  }
}
.anime3 {
  opacity: 0;
}
.anime3-mv {
  animation-name: anime3;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime3 {
  0% {
    opacity: 0;
    transform: translatey(-30px);
  }
  100% {
    opacity: 1;
    transform: translatey(0);
  }
}
.anime33 {
  opacity: 0;
}
.anime33-mv {
  animation-name: anime33;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime33 {
  0% {
    opacity: 0;
    transform: translatey(-30px);
    transform: scale(1.2, 1.2);
  }
  100% {
    opacity: 1;
    transform: translatey(0);
    transform: scale(1, 1);
  }
}
.anime4 {
  opacity: 0;
}
.anime4-mv {
  animation-name: anime4;
  animation-duration: 1s;
  animation-timing-function: ease;
  opacity: 1;
}
@keyframes anime4 {
  0% {
    opacity: 0;
    transform: translatex(-30px);
  }
  100% {
    opacity: 1;
    transform: translatex(0);
  }
}
.zimg {
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: animation 15s linear infinite 0s;
  -moz-animation: animation 15s linear infinite 0s;
  -o-animation: animation 15s linear infinite 0s;
  -ms-animation: animation 15s linear infinite 0s;
  animation: animation 15s linear infinite 0s;
}
@keyframes animation {
  0% {
    opacity: 0;
    transform: scale(1);
    animation-timing-function: ease-in;
  }
  10% {
    opacity: 1;
    animation-timing-function: ease-out;
  }
  28% {
    opacity: 1;
  }
  33.33333333333% {
    opacity: 0;
    transform: scale(1.12);
  }
  100% {
    opacity: 0
  }
}
.zimg2 {
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: animation2 15s linear infinite 5s;
  -moz-animation: animation2 15s linear infinite 5s;
  -o-animation: animation2 15s linear infinite 5s;
  -ms-animation: animation2 15s linear infinite 5s;
  animation: animation2 15s linear infinite 5s;
}
@keyframes animation2 {
  0% {
    transform: scale(1.03);
    opacity: 1;
    animation-timing-function: ease-in;
  }
  10% {
    opacity: 1;
    animation-timing-function: ease-out;
  }
  28% {
    opacity: 1;
  }
  33.33333333333% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0
  }
}
.zimg3 {
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: animation3 15s linear infinite 10s;
  -moz-animation: animation3 15s linear infinite 10s;
  -o-animation: animation3 15s linear infinite 10s;
  -ms-animation: animation3 15s linear infinite 10s;
  animation: animation3 15s linear infinite 10s;
}
@keyframes animation3 {
  0% {
    transform: scale(1);
    opacity: 1;
    animation-timing-function: ease-in;
  }
  10% {
    opacity: 1;
    animation-timing-function: ease-out;
  }
  28% {
    opacity: 1;
  }
  33.33333333333% {
    opacity: 0;
    transform: scale(1.1);
  }
  100% {
    opacity: 0
  }
}
.zimg4 {
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: animation4 15s linear infinite 15s;
  -moz-animation: animation4 15s linear infinite 15s;
  -o-animation: animation4 15s linear infinite 15s;
  -ms-animation: animation4 15s linear infinite 15s;
  animation: animation4 15s linear infinite 15s;
}
@keyframes animation4 {
  0% {
    transform: scale(1.1);
    opacity: 1;
    animation-timing-function: ease-in;
  }
  10% {
    opacity: 1;
    animation-timing-function: ease-out;
  }
  28% {
    opacity: 1;
  }
  33.33333333333% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0
  }
}
/*フッターコンテンツ*********************************/
.foot-box {
  width: 100%;
  height: auto;
}
.footer-inner {
  width: 100%;
  margin: 0 auto;
  height: 100%;
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #01347f;
  color: #fff;
}
.footer-inner a {
  color: #fff;
}
.footer-inner .logo {
  text-align: center;
  font-size: 30px;
  padding: 20px 0;
}
.footer-inner .copy {
  font-size: 10px;
  text-align: center;
  padding: 20px 0;
}
/*グローバルメニューfoot------------------------------------------*/
#menu_foot {
  display: block;
  max-width: 680px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
#menu_foot li {
  display: block;
  float: left;
  margin: 0;
}
@media only screen and (min-width: 1024px) {
  #menu_foot li a {
    display: block;
    padding: 0 10px 0 10px;
    text-align: center;
    text-decoration: none;
    border-right: 1px solid #fff;
    line-height: 100%;
  }
  #menu_foot .top {
    padding: 0;
  }
  #menu_foot .end a {
    border-right: 0 !important;
  }
}
@media only screen and (max-width: 1024px) {
  #menu_foot {
    max-width: 100%;
    border-top: 1px solid #ccc;
  }
  #menu_foot li a:hover {}
  #menu_foot li {
    box-sizing: border-box;
    width: 25%;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    margin: 0;
  }
  #menu_foot .end {
    width: 50%;
  }
  #menu_foot li a p {
    display: block;
  }
  #menu_foot li img {
    display: none;
  }
  #menu_foot li a {
    display: block;
    padding: 12px 0 10px;
    text-align: center;
  }
}
@media only screen and (max-width: 640px) {
  #menu_foot {
    max-width: 100%;
    border-top: 1px solid #ccc;
  }
  #menu_foot {
    max-width: 100%;
  }
  #menu_foot li {
    width: 50%;
    float: left;
    margin: 0;
  }
  #menu_foot .end {
    width: 100%;
  }
  #menu_foot li a p {
    display: block;
  }
  #menu_foot li a {
    display: block;
    padding: 12px 0 10px;
    text-align: center;
  }
}
.abana-wh {
  color: #333 !important;
  background-color: rgba(255, 255, 255, 1);
}
.sub-head3 ul li:before {
  position: absolute;
  content: '';
  top: 0.5em;
  left: 0.2em;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #143265;
}
.table-scroll {
  overflow: auto;
  white-space: nowrap;
}
/*アニメーションボタン*/
.buttonBox {
  position: relative;
  margin: 10px 0 0 0;
  width: 300px;
  border-bottom: #004178 2px solid;
}
.buttonBox2 {
  position: relative;
  margin: 0 0 0 0;
  width: 100%;
}
.buttonBox3 {
  position: relative;
  margin: 10px 0 0 0;
  width: 250px;
  border-bottom: #004178 2px solid;
}
.buttonBox4 {
  position: relative;
  margin: 10px 0 0 0;
}
button {
  width: 100%;
  height: 60px;
  position: relative;
  background: #fff;
  text-transform: uppercase;
  color: #004178;
  font-weight: bold;
  letter-spacing: 1px;
  border: none;
  font-size: 18px;
  outline: none;
  text-align: left;
  padding-left: 10px;
  cursor: pointer;
}
.border {
  position: absolute;
  background: none;
  transition: all .4s ease-in-out;
}
.anime-button > .border:nth-of-type(1) {
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-top: 1px solid #004178;
}
.anime-button > .border:nth-of-type(2) {
  top: 0;
  right: 0;
  width: 10px;
  height: 0;
  border-right: 1px solid #004178;
}
.anime-button > .border:nth-of-type(3) {
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-bottom: 1px solid #004178;
}
.anime-button > .border:nth-of-type(4) {
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-left: 1px solid #004178;
}
.anime-button:hover .border:nth-of-type(1) {
  width: 100%;
}
.anime-button:hover .border:nth-of-type(2) {
  height: 60px;
}
.anime-button:hover .border:nth-of-type(3) {
  width: 100%;
}
.anime-button:hover .border:nth-of-type(4) {
  height: 60px;
}
.button-anime {
  transition: all .4s ease-in-out;
}
.anime-button > .button-anime {
  padding-left: 10px;
}
.anime-button:hover .button-anime {
  padding-left: 30px;
}
.button-anime2 {
  transition: all .4s ease-in-out;
}
.anime-button > .button-anime2 {
  padding-left: 30px;
}
.anime-button:hover .button-anime2 {
  padding-left: 40px;
}
.sankaku {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 25px;
  margin-left: 260px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #004178;
  opacity: 0.2;
}
.anime-button:hover .sankaku {
  margin-left: 250px;
  opacity: 1;
}
.sankaku2 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 25px;
  right: 30px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #004178;
  opacity: 0.2;
}
.anime-button:hover .sankaku2 {
  right: 20px;
  opacity: 1;
}
/*フッターボタン*/
.anime-button3 > .border:nth-of-type(1) {
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-top: 1px solid #004178;
}
.anime-button3 > .border:nth-of-type(2) {
  top: 0;
  right: 0;
  width: 10px;
  height: 0;
  border-right: 1px solid #004178;
}
.anime-button3 > .border:nth-of-type(3) {
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-bottom: 1px solid #004178;
}
.anime-button3 > .border:nth-of-type(4) {
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-left: 1px solid #004178;
}
.anime-button3:hover .border:nth-of-type(1) {
  width: 100%;
}
.anime-button3:hover .border:nth-of-type(2) {
  height: 60px;
}
.anime-button3:hover .border:nth-of-type(3) {
  width: 100%;
}
.anime-button3:hover .border:nth-of-type(4) {
  height: 60px;
}
.button-anime {
  transition: all .4s ease-in-out;
}
.anime-button3 > .button-anime {
  padding-left: 10px;
  background: #004178;
  color: #fff;
  border: 2px #fff solid;
}
.anime-button3:hover .button-anime {
  padding-left: 30px;
  background: #fff;
  color: #004178;
}
.sankaku3 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 24px;
  margin-left: 200px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #fff;
  opacity: 1;
}
.anime-button3:hover .sankaku3 {
  margin-left: 200px;
  border-color: transparent transparent transparent #004178;
  opacity: 1;
}
.anime-button4 > .button-anime {
  /*background: #fff;*/
  /*width: 140px;*/
  height: 26px;
  border: #ccc 1px solid;
  font-size: 12px;
  font-weight: bold;
  padding-top: 8px;
  text-align: center;
  background: rgba(255, 255, 255, 0);
  color: #fff;
}
.anime-button4:hover .button-anime {
  /*width: 140px;*/
  height: 26px;
  border: #ccc 1px solid;
  font-sicolor: #ff502f;
  ze: 12px;
  font-weight: bold;
  padding-top: 8px;
  text-align: center;
  background: #efefef;
  color: #ff502f;
}
.sankaku4 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 13px;
  margin-left: 130px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 5px;
  border-color: transparent transparent transparent #ccc;
  opacity: 1;
}
.anime-button4:hover .sankaku4 {
  margin-left: 130px;
  border-color: transparent transparent transparent #ff502f;
  opacity: 1;
}
.sankaku6 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 30px;
  margin-left: 190px;
  left: 3px;
  width: 6px;
  height: 6px;
  border: 1px solid;
  border-color: #002655 #002655 transparent transparent;
  transform: rotate(45deg);
  opacity: 1;
}
.anime-button4:hover .sankaku6 {
  margin-left: 210px;
  border-color: #fff #fff transparent transparent;
  opacity: 1;
}
.sankaku7 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 30px;
  margin-right: 30px;
  right: 3px;
  width: 6px;
  height: 6px;
  border: 1px solid;
  border-color: #002655 #002655 transparent transparent;
  transform: rotate(45deg);
  opacity: 1;
}
.anime-button4:hover .sankaku7 {
  margin-right: 10px;
  border-color: #fff #fff transparent transparent;
  opacity: 1;
}
.sankaku8 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 20px;
  margin-right: 30px;
  right: 3px;
  width: 6px;
  height: 6px;
  border: 1px solid;
  border-color: #002655 #002655 transparent transparent;
  transform: rotate(45deg);
  opacity: 1;
}
.anime-button4:hover .sankaku8 {
  margin-right: 10px;
  border-color: #fff #fff transparent transparent;
  opacity: 1;
}
.anime-button5 > .button-anime {
  border: 1px #ff502f solid;
}
.anime-button5:hover .button-anime {
  background: #fff;
  color: #ff502f !important;
  border: 1px #ff502f solid;
}
.anime-button5:hover .button-anime a {
  color: #ff502f !important;
}
/*黒ボタン:::::::::::::::::::::::::::::::::::::::*/
.anime-button6 {
  width: 100%;
}
.anime-button6 .button-anime {
  background: #002655;
  border: 1px #002655 solid;
}
.anime-button6:hover .button-anime {
  background: #fff;
  color: #ff502f !important;
  border: 1px #ff502f solid;
}
.anime-button6 .button-anime a {
  color: #fff !important;
}
.anime-button6:hover .button-anime a {
  color: #ff502f !important;
}
.black-botan {
  position: relative;
  margin: auto !important;
  transition: .3s;
  width: 200px;
  text-align: center;
  padding: 20px 20px;
  color: #fff;
  font-weight: bold;
  background: #000;
  border: 1px #000 solid;
}
.is-animation .black-botan {
  transition: .3s;
}
/*黒ボタン:::::::::::::::::::::::::::::::::::::::*/
/*エントリーボタン:::::::::::::::::::::::::::::::::::::::*/
/*エントリーボタン:::::::::::::::::::::::::::::::::::::::*/
.anime-button7 {
  margin: auto;
  text-align: center;
  width: 100%;
  display: block;
  position: relative;
  padding-top: 140px;
  letter-spacing: 7px;
}
.anime-button7 > .button-anime {
  margin: 0px auto 0 auto;
  max-width: 600px;
  width: 90%;
  height: 160px;
  border: #fff 2px solid;
  font-size: 40px;
  font-weight: bold;
  line-height: 160px;
  text-align: center;
  color: #fff;
  position: relative;
}
.anime-button7:hover .button-anime {
  max-width: 600px;
  width: 90%;
  height: 160px;
  border: #ff502f 2px solid;
  font-size: 40px;
  font-weight: bold;
  line-height: 160px;
  text-align: center;
  background: #fff;
  color: #ff502f;
}
.sankaku5 {
  transition: all .4s ease-in-out;
  position: absolute;
  top: 41%;
  left: 50%;
  margin-left: 90px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 0 15px 15px;
  border-color: transparent transparent transparent #fff;
  opacity: 1;
}
.anime-button7:hover .sankaku5 {
  margin-left: 110px;
  border-color: transparent transparent transparent #ff502f;
  opacity: 1;
}
@media screen and (max-width: 640px) {
  .anime-button7 {
    padding-top: 70px;
  }
  .anime-button7 > .button-anime {
    height: 120px;
    font-size: 30px;
    line-height: 120px;
  }
  .anime-button7:hover .button-anime {
    height: 150px;
    font-size: 30px;
    font-weight: bold;
    line-height: 150px;
  }
}
.anime-button8 {
  margin: auto;
  text-align: center;
  width: 100%;
  display: block;
  position: relative;
  letter-spacing: 7px;
}
.anime-button8 > .button-anime {
  margin: 0px auto 0 auto;
  max-width: 600px;
  width: 90%;
  height: 110px;
  border: #ff502f 5px solid;
  font-size: 30px;
  font-weight: bold;
  line-height: 110px;
  text-align: center;
  color: #ff502f;
  position: relative;
  background-color: #fff;
}
.anime-button8:hover .button-anime {
  max-width: 600px;
  width: 90%;
  height: 110px;
  border: #ff502f 5px solid;
  font-size: 30px;
  font-weight: bold;
  line-height: 110px;
  text-align: center;
  background: #ff502f;
  color: #fff;
}
@media screen and (max-width: 640px) {
  .anime-button8 > .button-anime {
    height: 80px;
    font-size: 28px;
    line-height: 80px;
  }
  .anime-button8:hover .button-anime {
    height: 80px;
    font-size: 28px;
    line-height: 80px;
  }
}
/*エントリーボタン:::::::::::::::::::::::::::::::::::::::*/
.box-waku3 {
  padding: 30px 0;
  width: 95%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #ccc solid 1px;
  text-align: center;
  transition: .3s;
}
.box-waku3:hover {
  background: #ff502f;
  color: #fff !important;
  border: 1px #ff502f solid;
  transition: .3s;
}
.is-animation .box-waku3 {
  transition: .3s;
}
.box-waku4 {
  padding: 30px 0;
  width: 95%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #ccc solid 1px;
  text-align: center;
  transition: .3s;
}
.box-waku4:hover {
  background: #1f8d32;
  color: #fff !important;
  border: 1px #1f8d32 solid;
  transition: .3s;
}
.is-animation .box-waku4 {
  transition: .3s;
}
.box-waku8 {
  padding: 20px 40px;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #002655 solid 1px;
  text-align: center;
  transition: .3s;
  color: #002655 !important;
  width: 200px;
  font-weight: bold;
}
.box-waku8:hover {
  background: #002655;
  color: #fff !important;
  border: 1px #002655 solid;
  transition: .3s;
}
.is-animation .box-waku8 {
  transition: .3s;
}
.box-waku6 {
  padding: 20px;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #002655 solid 1px;
  text-align: left;
  transition: .3s;
  color: #002655 !important;
  width: 90%;
  max-width: 560px;
  font-weight: bold;
}
.box-waku6:hover {
  background: #002655;
  color: #fff !important;
  border: 1px #002655 solid;
  transition: .3s;
}
.is-animation .box-waku6 {
  transition: .3s;
}
.box-waku7 {
  padding: 10px 20px;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border-bottom: #002655 solid 1px;
  text-align: left;
  transition: .3s;
  width: 90%;
  max-width: 560px;
}
.box-waku7:hover {
  background: #002655;
  color: #fff !important;
  border-bottom: #002655 solid 1px;
  transition: .3s;
}
.is-animation .box-waku7 {
  transition: .3s;
}
.box-waku9 {
  padding: 20px 0px 20px 0%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  text-align: center;
  color: #002655 !important;
  border-bottom: 1px solid #002655;
  width: 100%;
  transition: .3s;
}
.box-waku9:hover {
  background: #002655;
  color: #fff !important;
  cursor: pointer;
  transition: .3s;
}
.is-animation .box-waku9 {
  transition: .3s;
}
.box-waku10 {
  padding: 20px 0px 20px 0%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  text-align: center;
  color: #002655 !important;
  border-top: 1px solid #002655;
  width: 100%;
  transition: .3s;
}
.box-waku10:hover {
  background: #002655;
  color: #fff !important;
  cursor: pointer;
  transition: .3s;
}
.is-animation .box-waku10 {
  transition: .3s;
}
.box-waku11 {
  padding: 30px 0;
  width: 100%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #ccc solid 1px;
  text-align: center;
  transition: .3s;
}
.box-waku11:hover {
  background: #ff502f;
  color: #fff !important;
  border: 1px #ff502f solid;
  transition: .3s;
}
.is-animation .box-waku111 {
  transition: .3s;
}
/*:::::::::::::::::::::::::::::::::::::::*/
.kakko03 {
  margin-top: 30px;
  position: relative;
  max-width: 500px;
  width: 90%;
  padding: 0px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
}
.kakko03::before, .kakko03::after {
  position: absolute;
  top: 0;
  content: '';
  width: 20px;
  height: 100%;
  border-top: 3px solid #004178;
  border-bottom: 3px solid #004178;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.kakko03::before {
  left: 0;
  border-left: 3px solid #004178;
}
.kakko03::after {
  right: 0;
  border-right: 3px solid #004178;
}
.marker {
  background: linear-gradient(transparent 60%, #27d5fd 0%);
  display: inline-block;
  padding: 0 20px 0 20px;
}
.marker2 {
  background: linear-gradient(transparent 85%, #27d5fd 0%);
  display: inline-block;
  padding: 0 20px 0 20px;
}
.mg-midashi {
  margin: 40px auto;
}
@media screen and (max-width: 640px) {
  .mg-midashi {
    margin: 30px auto;
  }
}
.hyo dt {
  border-bottom: 2px solid #004178 !important;
}
.h3-border {
  padding: 20px 0 !important;
  color: #000;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.circle {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  border: 1px solid #ff502f;
  background-color: #ff502f;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
}
.circle span {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 90px;
  text-align: center;
  color: #fff;
}
.circle2 {
  position: relative;
  display: inline-block;
  float: left;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #ff502f;
  background-color: #ff502f;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  margin-right: 20px;
}
.circle2 span {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 50px;
  text-align: center;
  color: #fff;
}
.circle3 {
  position: relative;
  display: inline-block;
  float: left;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #1f8d32;
  background-color: #1f8d32;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  margin-right: 20px;
}
.circle3 span {
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 50px;
  text-align: center;
  color: #fff;
}
.pt0 {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/*table:::::::::::::::::::::::::::::::::::::::::::::*/
table {
  width: 100%;
}
th {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  padding: 30px;
  text-align: left;
  width: 20%;
}
td {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  padding: 30px;
  text-align: left;
}
.eigyo table {
  width: 100%;
}
.eigyo th {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-right: solid 1px #ccc;
  padding: 15px;
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  background-color: #E6E6E6;
  top: 60px;
  /* tbody内のセルより手前に表示する */
  z-index: 1;
}
@media screen and (max-width: 640px) {
  .eigyo {
    width: 100%;
    max-width: 100%;
    overflow: scroll;
  }
  .eigyo table {
    width: 100%;
    max-width: 90%;
  }
  .eigyo th {
    top: 0px;
  }
}
.eigyo td {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  border-left: solid 1px #ccc;
  padding: 15px;
  text-align: left;
}
/*table:::::::::::::::::::::::::::::::::::::::::::::*/
.img2 {
  width: 100%;
}
.img2 img {
  width: 50%;
  float: left;
  height: auto;
}
/*CXR-top-2col:::::::::::::::::::::::::::::::::::::::::::::*/
.list2-left {
  width: 47%;
  padding: 1.5% 1.5% 30px 1.5%;
  float: left;
  text-align: left;
}
.list2-left img {
  width: 100%;
  height: auto;
}
.list2-left .box {
  width: 90%;
  padding: 1.5% 1.5% 30px 1.5%;
  margin: auto;
  text-align: left;
}
.list2-left .box .subTitle {
  font-size: 16px;
}
@media screen and (min-width: 1500px) {
  .list2-left .box {
    width: 70%;
    padding: 1.5% 1.5% 30px 1.5%;
    margin: auto;
    text-align: left;
  }
  .list2-left .box .subTitle {
    font-size: 20px;
  }
}
.list2-right {
  width: 47%;
  padding: 1.5% 1.5% 30px 1.5%;
  float: right;
  text-align: left;
}
.list2-right img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 1024px) {
  .list2-left .box {
    width: 97%;
    padding: 1.5% 1.5% 30px 1.5%;
    margin: auto;
    text-align: left;
  }
  .list2-left .box .subTitle {
    font-size: 14px;
  }
  .list2-left .box .head-title-box {
    width: 100%;
    max-width: 100%;
  }
  .list2-left .box .title {
    font-size: 24px;
    text-align: left;
    line-height: 1.3;
  }
  .list2-left .box p {
    font-size: 14px;
  }
  .list2-left, .list2-right {
    width: 90%;
    padding: 0 5% 20px 5%;
    float: none;
    text-align: left;
    margin: auto;
  }
  .list2-left img {
    width: 100%;
    height: auto;
  }
  .list2-right img {
    width: 100%;
    height: auto;
  }
}
/*CXR-top-2col:::::::::::::::::::::::::::::::::::::::::::::*/
.midasi-top {
  background-image: url("../../images/midasi.jpg");
  background-size: cover;
  color: #fff;
  height: 2em;
  text-align: left;
  padding: 1.3em 0 1em 1.5em;
  position: relative;
  width: calc(100% - 1.5em);
}
.midasi-pink {
  background-color: #fb9da6;
}
.midasi-green {
  background-color: #92d6c1;
}

.midasi-or {
  background-color: #f29618;
}
.green-sen {
  color: #92d6c1 !important;
  border-bottom: 2px solid #92d6c1;
}
.blue-sen {
  color: #448eb7 !important;
  border-bottom: 2px solid #448eb7;
}
.midasi-waku {
    box-sizing: content-box;
  padding: 15px 0 15px 40px;
  position: relative;
  width: calc(100% - 40px);
  color: #fff;
}
.midasi-waku::after {
  position: absolute;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
  content: '';
  width: 7px;
  height: 1.5em;
  background-color: #fcf9d4;
}
.midasi-waku .sen {
  position: absolute;
  top: 1.3em;
  left: 0;
  content: '';
  width: 40px;
  height: -webkit-calc(100% - 2.7em);
  height: calc(100% - 2.7em);
  background-color: #002655;
}

.midasi-blue {
    box-sizing: content-box;
  padding: 12px 0 15px 50px;
  position: relative;
  width: calc(100% - 40px);
  color: #448eb7;
  border-bottom: 2px solid #448eb7;
}
.midasi-blue::after {
  position: absolute;
    top: 24px;
    left: 10px;
    display: block;
    width: 0.8em;
    height: 0.8em;
    background: #5ea6c3;
    content: "";
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}





.bk-haikei {
  background-image: url("../../images/bk.jpg");
  background-size: cover;
  color: #fff !important;
}
.bk-logo {
  background-image: url("../../images/bk2.png");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: top left;
}
.txt-mainbox-read {
  padding: 50px;
}
.list4 img {
  opacity: 1;
  transition: 0.3s;
}
.list4 span {
  display: block;
  background: #001e3a;
}
.list4 img:hover {
  opacity: 0.4;
  transition: 0.3s;
}
.ft-3box {
  width: 33.333%;
  background: #fff;
  float: left;
  height: 100px;
  margin: 100px 0 100px 0;
  padding: 100px 0;
  display: block;
  transition: .3s;
  cursor: pointer;
}
.ft-3box h3 {
  padding: 10px 0 0px 0;
  font-size: 24px;
  letter-spacing: 0;
}
.ft-3box-border {
  border-right: 1px solid #f2f2f2;
  border-left: 1px solid #f2f2f2;
  box-sizing: border-box;
  height: 300px;
}
.ft-3box:hover {
  background: #002655;
  color: #fff !important;
  transition: .3s;
}
.ft-3box:hover .img-off {
  display: none;
  transition: .3s;
}
.ft-3box .img-on {
  display: none;
  transition: .3s;
}
.ft-3box:hover .img-on {
  display: block;
  transition: .3s;
  margin: auto;
}
@media screen and (max-width: 640px) {
  .ft-3box:first-child {
    border-top: 1px solid #f2f2f2;
  }
  .ft-3box {
    width: 100%;
    background: #fff;
    float: left;
    height: 100px;
    margin: 0;
    padding: 100px 0;
    display: block;
    transition: .3s;
  }
  .ft-3box-border {
    border-top: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
    box-sizing: border-box;
    height: 300px;
  }
}
.ft-comp {
  color: #fff;
  padding: 170px 0 80px 0;
}
.ft-comp .list4:first-child {
  width: 27%;
}
.ft-comp .list4:first-child img {
  width: 80%;
  height: auto;
}
.ft-comp .list4:nth-child(2) {
  width: 17%;
}
.ft-comp .list4:nth-child(3) {
  width: 22%;
}
.ft-comp .list4:nth-child(4) {
  width: 22%;
}
@media screen and (max-width: 640px) {
  .ft-comp {
    color: #fff;
    padding: 70px 0 50px 0;
  }
  .ft-comp .list4 {
    width: 77% !important;
    padding: 15px 10%;
  }
  .ft-comp .list4 img {
    width: 60% !important;
    height: auto;
  }
}
.header:hover #gnav > ul > li:hover > a > span {
  position: relative;
  display: inline-block;
  text-decoration: none;
  transition: .3s;
}
.header:hover #gnav > ul > li:hover > a > span::after {
  position: absolute;
  bottom: -8px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #448eb7;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.header:hover #gnav > ul > li:hover > a > span:hover::after {
  bottom: -4px;
  opacity: 1;
  transition: .3s;
  visibility: visible;
}
.menu_inner .sub img {
  opacity: 0.6;
  transition: 0.3s;
  margin: 0;
  padding: 0;
}
.menu_inner .sub {
  background: #002655;
  margin: 0;
  padding: 0;
}
.menu_inner .sub {
  position: relative;
}
.menu_inner .sub:hover img {
  opacity: 1;
  transition: 0.3s;
}
.menu_inner .sub p {
  width: 100%;
  position: absolute;
  text-align: left;
  top: 50%; /*親要素を起点に上から50%*/
  left: 44%; /*親要素を起点に左から50%*/
  transform: translateY(-50%); /*要素の大きさの半分ずつを戻す*/
  -webkit-transform: translateY(-50%);
}
.menu-title {
  display: block;
  float: left;
  padding-right: 40px;
  margin-right: 20px;
}
.menu-sm {
  float: left;
}
.menu-sm {
  float: left;
}
.sm {}
.waku {
  /*border: 1px solid #ccc;*/
  box-sizing: border-box;
  padding-bottom: 20px !important;
  text-align: center !important;
  margin: 1.5% !important;
}
/*a2column　オムニ*/
@media screen and (min-width: 1025px) {
  .omuni {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 50%;
    height: 500px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni .title-2col {
    position: absolute;
    width: 44%;
    height: auto;
    top: 70px;
    left: 5%;
  }
  .omuni .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .gazo-2col {
    position: absolute;
    width: 50%;
    height: auto;
    bottom: 0;
    right: 0;
  }
  .omuni .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .txt {
    position: absolute;
    height: auto;
    top: 230px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
  .omuni .viewmore {
    position: absolute;
    height: auto;
    top: 310px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
  .omuni2 {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 50%;
    height: 500px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni2 .title-2col {
    position: absolute;
    width: 30%;
    height: auto;
    top: 40px;
    left: 11%;
  }
  .omuni2 .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .gazo-2col {
    position: absolute;
    width: 40%;
    height: auto;
    bottom: 0;
    right: 3%;
  }
  .omuni2 .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .txt {
    position: absolute;
    height: auto;
    top: 240px;
    width: 44%;
    left: 4%;
    color: #fff;
    font-size: 130%;
  }
  .omuni2 .viewmore {
    position: absolute;
    height: auto;
    top: 310px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
}
@media screen and (min-width: 640px) and (max-width: 1024px) {
  .omuni {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 100%;
    height: 430px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni .title-2col {
    position: absolute;
    width: 44%;
    height: auto;
    top: 70px;
    left: 5%;
  }
  .omuni .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .gazo-2col {
    position: absolute;
    width: 50%;
    height: auto;
    bottom: 0;
    right: 0;
  }
  .omuni .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .txt {
    position: absolute;
    height: auto;
    top: 230px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
  .omuni .viewmore {
    position: absolute;
    height: auto;
    top: 310px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
  .omuni2 {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 100%;
    height: 430px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni2 .title-2col {
    position: absolute;
    width: 30%;
    height: auto;
    top: 40px;
    left: 11%;
  }
  .omuni2 .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .gazo-2col {
    position: absolute;
    width: 40%;
    height: auto;
    bottom: 0;
    right: 3%;
  }
  .omuni2 .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .txt {
    position: absolute;
    height: auto;
    top: 240px;
    width: 44%;
    left: 4%;
    color: #fff;
    font-size: 130%;
  }
  .omuni2 .viewmore {
    position: absolute;
    height: auto;
    top: 310px;
    width: 44%;
    left: 4%;
    color: #fff;
  }
}
@media screen and (max-width: 640px) {
  .omuni {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 100%;
    height: 300px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni .title-2col {
    position: absolute;
    width: 60%;
    height: auto;
    top: 30px;
    left: 1%;
  }
  .omuni .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .gazo-2col {
    position: absolute;
    width: 50%;
    height: auto;
    top: 40px;
    right: 0;
  }
  .omuni .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni .txt {
    position: absolute;
    height: auto;
    top: 130px;
    width: 98%;
    left: 2%;
    color: #fff;
    text-align: left;
  }
  .omuni .viewmore {
    position: absolute;
    height: auto;
    width: 40%;
    left: 2%;
    bottom: 40px;
    color: #fff;
  }
  .omuni2 {
    background: url("../../images/2colbk.jpg");
    background-size: cover;
    width: 100%;
    height: 300px;
    display: block;
    position: relative;
    float: left;
  }
  .omuni2 .title-2col {
    position: absolute;
    width: 40%;
    height: auto;
    top: 20px;
    left: 11%;
  }
  .omuni2 .title-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .gazo-2col {
    position: absolute;
    width: 40%;
    height: auto;
    bottom: 0;
    right: 3%;
  }
  .omuni2 .gazo-2col img {
    width: 100%;
    height: auto;
  }
  .omuni2 .txt {
    position: absolute;
    height: auto;
    top: 165px;
    width: 60%;
    left: 2%;
    color: #fff;
    font-size: 130%;
  }
  .omuni2 .viewmore {
    position: absolute;
    height: auto;
    width: 40%;
    left: 2%;
    bottom: 20px;
    color: #fff;
  }
}
.footlogo {
  max-width: 300px;
  height: auto;
  padding: 50px 0 100px 0;
  margin: auto;
}
@media screen and (max-width: 640px) {
  .footlogo {
    padding: 50px 0 50px 0;
  }
}
/*table:::::::::::::::::::::::::::::::::::::::::::::*/
.product-table-box {
  margin-top: 30px;
  padding-bottom: 20px;
}
.product-table-box table {
  width: 100%;
}
.product-table-box .box2 {
  width: 50%;
  float: left;
}
.product-table-box th {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  padding: 10px 20px;
  text-align: left;
  width: 30%;
  background-color: #eceaee;
}
.product-table-box td {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  padding: 10px 20px;
  text-align: left;
  width: 70%;
}
@media screen and (max-width: 640px) {
  .product-table-box .box2 {
    width: 100%;
  }
  .product-table-box .box2 table:nth-child(1) td {
    border-top: solid 0px #ccc;
  }
  .product-table-box .box2 table:nth-child(1) th {
    border-top: solid 0px #ccc;
  }
}
.product-table-box2 {
  margin-top: 30px;
  padding-bottom: 20px;
  overflow: auto;
  white-space: nowrap;
  max-width: 100%;
}
.product-table-box2 table {
  border-collapse: collapse;
  width: 100%;
}
.product-table-box2 th, .product-table-box2 td {
  text-align: center;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd;
}
.product-table-box2 th:last-child, .product-table-box2 td:last-child {
  border-right: 0px solid #ddd;
}
.product-table-box2 th {
  background-color: #eceaee;
}
.SubHeaderLogo {
  max-width: 600px;
  width: 100%;
  height: 400px;
  display: block;
  position: relative;
  padding: 0;
  margin: -350px auto 0 auto;
  z-index: 3;
}
.SubHeaderLogo img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 640px) {
  .SubHeaderLogo {
    max-width: 260px;
    width: 100%;
    height: 200px;
    display: block;
    position: relative;
    padding: 0;
    margin: -150px auto 0 auto;
    z-index: 3;
  }
}
.fileBox {
  border: 1px solid #002655;
  box-sizing: border-box;
  transition: 0.3s;
}
.fileBox a {
  display: block;
}
.fileBox:hover {
  opacity: 0.4;
  transition: 0.3s;
}
.topslide {
  padding: 50px auto;
  height: auto;
  display: block;
  background: linear-gradient(180deg, #f0f0f0 0%, #f0f0f0 50%, #448eb7 50%, #448eb7 100%);
}
@media screen and (max-width: 640px) {
  .topslide {
    margin-top: 0px;
    height: auto;
    display: block;
      border: 0px ;
  }
}
/*astepia:::::::::::::::::::::::::::::::::::::::::::*/
.button-2col::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button-2col {
  display: block;
  margin: 50px auto !important;
  position: relative;
  z-index: 2;
  overflow: hidden;
  width: 100%;
  max-width: 500px;
  height: 80px;
  text-align: center;
  text-decoration: none;
  line-height: 70px;
  outline: none;
  border-radius: 40px;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  font-size: 20px;
  color: #fff;
  background-color: #f29600;
  border: 3px solid #f29600;
}
.button-2col p{
  display: block;
    width: 100%;
    height: 100%;
}
.button-2col a {
  display: block;
    width: 100%;
    height: 100%;
  font-size: 20px;
      line-height: 70px;
  color: #fff;
}
.button-2col a:link{
  color: #fff !important;
}
.button-2col a:visited {
  color: #448eb7 !important;
}
@media screen and (max-width: 640px) {
    .button-2col {
  font-size: 16px;
}
    .button-2col a {
  font-size: 16px;
}
}
.button-2col::before, .button-2col::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button-2col, .button-2col::before, .button-2col::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button-2col:hover span {
  transition: 0.3s ease-in-out;
  opacity: 0;
}
.button-2col:hover {
  color: #fff;
}
.button-2col::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.button-2col:hover::after {
  background: #fff;
  opacity: 0.4;
}
.button-2col img {
  height: 45px !important;
  width: auto !important;
  margin: -7px 8px 0 0;
  vertical-align: middle
}
.contact-read {
  font-size: 18px;
  font-weight: bold;
}
.bana3-col {
  padding: 50px 0;
}
.full-gazo-section {
  display: block;
  position: relative;
  width: 100%;
  background-image: url(../../images/baktest.jpg);
  background-size: cover;
  height: 400px;
}
.osirase-copy {
  display: block;
  margin-left: 20px;
  padding: 10px 0 0 20px;
}

.top-copy {
  position: absolute;
  z-index: 10;
  top: 55%;
  width: 500px;
  margin-left: -250px;
}
.top-copy img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 1024px) {
  .contact-read {
    font-size: 16px;
    font-weight: bold;
  }
  header .logo {
    margin-left: 20px;
    padding: 15px 5px;
  }
}
@media screen and (max-width: 640px) {
  .contact-read {
    font-size: 14px;
    font-weight: bold;
  }
  .full-gazo-section {
    height: 200px;
  }
  .osirase-copy {
    display: block;
    margin-left: 20px;
    padding: 5px 0 0 20px;
  }
  .top-copy {
    position: absolute;
    z-index: 10;
    top: 37%;
    width: 350px;
    margin: 0;
    margin-left: -175px;
  }
}
.box-button a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.box-button p {
  font-size: 16px;
}
.box-button {
  padding: 20px 0;
  max-width: 300px;
  width: 90%;
  height: auto;
  margin: auto;
  background-color: #ff909a;
  position: relative;
  display: block;
  border: #ff909a solid 3px;
  text-align: center;
  transition: .3s;
  color: #fff;
    border-radius:40px;
    
    font-weight: bold;
}
.box-button:hover {
  background: #fff;
  color: #ff909a !important;
    font-weight: bold;
  border: #ff909a solid 3px;
  transition: .3s;
}
.is-animation .box-button {
  transition: .3s;
}
.float {
  float: left;
}
.main-menu {
  z-index: 100;
  margin-top: -60px;
  display: block;
  position: relative;
  width: 800px;
  height: 120px;
  border-radius: 120px;
  background-color: #fff;
  box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .1);
}
.main-menu li {
  width: 25%;
  height: auto;
  float: left;
  margin: 20px 0;
  border-right: 1px solid #ccc;
  box-sizing: border-box;
}
.main-menu li:last-child {
  border-right: 0px solid #ccc;
}
.main-menu li span {
  display: block;
}
.main-menu li img {
  width: 55px;
  height: auto;
  clear: both;
}
.main-menu li:hover span {
  transition: 0.3s ease-in-out;
  color: #ff909a;
}
@media screen and (max-width: 640px) {
  .main-menu {
    z-index: 100;
    position: fixed;
    bottom: 10px;
    margin-top: 0px;
    display: block;
    width: 96%;
    margin-left: 2%;
    height: 80px;
    border-radius: 80px;
    background-color: #fff;
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .1);
  }
  .main-menu li {
    width: 25%;
    height: auto;
    float: left;
    margin: 10px 0;
    border-right: 1px solid #ccc;
    box-sizing: border-box;
  }
  .main-menu li:last-child {
    border-right: 0px solid #ccc;
  }
  .main-menu li span {
    display: block;
  }
  .main-menu li img {
    width: 36px;
    height: auto;
    clear: both;
  }
  .main-menu li:hover span {
    transition: 0.3s ease-in-out;
    color: #ff909a;
  }
}
.sub-head-Title {
  z-index: 50;
  position: absolute;
  color: #fff !important;
  font-size: 36px;
  padding-top: 50px;
  text-align: center !important;

  width: 100%;
  margin: auto;
}
.sub-head-Title h2 {
  font-weight: bold !important;
  color: #fff !important;
}
@media screen and (max-width: 1024px) {
  .sub-head-Title {
    font-size: 36px;
    padding-top: 50px;
  }
}
@media screen and (max-width: 640px) {
  .sub-head-Title {
    font-size: 24px;
    padding-top: 60px;
  }
}
.red {
  color: #ff0000 !important;
}
.or {
  color: #fb9da6 !important;
}
.blue {
  color: #448eb7 !important;
}
.green {
  color: #92d6c1 !important;
}
.box-red {
  margin: 20px 0;
  border: 4px solid #ff0000;
  width: calc(100% - 50px);
  height: auto;
  padding: 20px 25px;
}
.box-red2 {
  width: auto;
  margin: 20px 0;
  border: 4px solid #ff0000;
  height: auto;
  padding: 10px;
}
.box-waku-gray {
box-sizing: content-box;
  margin: 20px 0;
  border: 4px solid #ccc;
  width: calc(100% - 50px);
  height: auto;
  padding: 20px 25px;
  border-radius: 10px;
}
.box-gray {
    box-sizing: content-box;
  margin: 20px 0;
  background: #eee;
  width: calc(100% - 50px);
  height: auto;
  padding: 20px 25px;
}
.mail img {
  height: 30px !important;
  width: auto !important;
  margin: -7px 8px 0 0;
  vertical-align: middle
}
.mail a {
  color: #fff;
}
.f-logo {
  display: block;
  padding: 0;
  margin: 0;
  width: 200px;
}
.f-logo img,.f-logo-sp img {
  height: auto;
  width: 100%;
}
.f-logo-sp {
  display:none;
}
.f-youtube, .f-sns {
  display: block !important;
  float: left;
  padding: 10px !important;
  margin: 0;
  width: 50px !important;
}
.f-youtube img, .f-sns img {
  height: auto !important;
  width: 100% !important;
}
@media screen and (max-width: 640px) {
  .f-logo {
      display: none;
  }
  .f-logo-sp {
      display: block;
    padding: 0;
    margin: auto;
    width: 70%;
  }
  .f-snsbox {
    display: block;
    width: 120px;
    padding: 10px;
    margin: auto;
  }
}
/*qa:::::::::::::::::::::::::::::::::::*/
.qa-line {
  border-bottom: 2px dotted #448eb7;
  padding: 0 0 15px 0;
  margin: 30px auto 20px auto;
  position: relative;
}
.qa-line .q {
  color: #fff;
  margin-right: 1.5rem;
  font-weight: bold;
  font-size: 30px;
text-align: center;
  background-color: #448eb7;  
    line-height: 1;
    padding:3px 12px 12px 12px;
    border-radius: 5px;
      float: left;
      display: block;
}
@media screen and (max-width: 1024px) {
  .qa-line .q {
    font-size: 24px;
      display: block;
      float: left;
  }
}
.list1 img, .list2 img, .list3 img,.cont1000 img,.cont1200 img {
  border-radius: 0px;
}
.aisatu img {
  border-radius: 0px;
}
.point-maru {
    box-sizing: content-box;
  position: relative;
  z-index: 3;
  margin: -45px auto 20px auto;
  display: block;
  width: 90px;
  height: 60px;
  border-radius: 90px;
  background-color: #ff909a;
  color: #fff;
  text-align: center;
  padding-top: 30px;
  font-size: 16px;
  font-weight: bold;
}
.point-maru span {
  display: block;
  font-size: 30px;
  line-height: 1;
}
.list4-img {
  position: relative;
  margin: 0;
  padding: 0;
  float: left;
  width: 25%;
}
@media screen and (max-width: 640px) {
  .list4-img {
    width: 50%;
  }
}
.list4-img img {
  width: 100%;
  height: auto;
}
.list5-img {
  position: relative;
  margin: 0;
  padding: 0;
  float: left;
  width: 18%;
  margin-left: 2.5%;
}
.list5-img:first-child {
  margin-left: 0%;
}
.list5-img img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 1024px) {
  .list5-img {
    width: 46%;
    margin: 2%;
  }
  .list5-img:first-child {
    margin-left: 2%;
  }
}
.small {
  font-size: 0.8rem;
}
.kasen-red {
  border-bottom: solid 1px red;
}
.shohin-midasi {
  font-size: 20px;
  line-height: 1;
}
@media screen and (max-width: 640px) {
  .shohin-midasi {
    font-size: 18px;
    line-height: 1;
  }
}
/*サブメニュー::::*/
.sub-menu-bk {
  background-color: #f4f4f4;
}
.sub-menu {
  display: block;
  margin: auto;
  padding: 10px 0;
  position: relative;
}
.sub-menu ul {
  list-style: none;
  padding: 0;
  position: relative;
}
.sub-menu ul .li4 {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 25%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #fb9da6;
  line-height: 3;
  box-sizing: border-box;
}


.sub-menu ul .li4 a {
  position: relative;
}
.sub-menu ul .li4 a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #fb9da6;
  content: "";
}
.sub-menu ul .li4:last-child {
  border-right: 2px dotted #fb9da6;
}
.sub-menu ul .li3 {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 33.3333%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #92d6c1;
  line-height: 3;
  box-sizing: border-box;
}
.sub-menu ul .li3 a {
  position: relative;
}
.sub-menu ul .li3 a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #92d6c1;
  content: "";
}
.sub-menu ul .li3:last-child {
  border-right: 2px dotted #92d6c1;
}
.sub-menu ul .li2 {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 50%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #fb9da6;
  line-height: 3;
  box-sizing: border-box;
}
.sub-menu ul .li2 a {
  position: relative;
}
.sub-menu ul .li2 a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #fb9da6;
  content: "";
}
.sub-menu ul .li2:last-child {
  border-right: 2px dotted #fb9da6;
}

.sub-menu ul .li3-pink {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 33.3333%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #fb9da6;
  line-height: 3;
  box-sizing: border-box;
}.sub-menu ul .li3-pink {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 33.3333%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #fb9da6;
  line-height: 3;
  box-sizing: border-box;
}
.sub-menu ul .li3-pink a {
  position: relative;
}
.sub-menu ul .li3-pink a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #fb9da6;
  content: "";
}
.sub-menu ul .li3-pink:last-child {
  border-right: 2px dotted #fb9da6;
}
.sub-menu ul .li3-pink2 {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 33.3333%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #ff909a;
  line-height: 3;
  box-sizing: border-box;
}.sub-menu ul .li3-pink2 {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 33.3333%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #ff909a;
  line-height: 3;
  box-sizing: border-box;
}
.sub-menu ul .li3-pink2 a {
  position: relative;
}
.sub-menu ul .li3-pink2 a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #ff909a;
  content: "";
}
.sub-menu ul .li3-pink2:last-child {
  border-right: 2px dotted #ff909a;
}
.sub-menu ul .li2-green {
  list-style: none;
  padding: 0;
  position: relative;
  float: left;
  width: 50%;
  text-align: center;
  font-weight: bold;
  border-left: 2px dotted #92d6c1;
  line-height: 3;
  box-sizing: border-box;
}
.sub-menu ul .li2-green a {
  position: relative;
}
.sub-menu ul .li2-green a:after {
  position: absolute;
  top: 52%;
  left: -20px;
  transform: translateY(-50%);
  width: 0px;
  height: 0px;
  border: 0.4em solid transparent;
  border-left: 0.7em solid #92d6c1;
  content: "";
}
.sub-menu ul .li2-green:last-child {
  border-right: 2px dotted #92d6c1;
}

@media screen and (max-width: 640px) {
  .sub-menu {
    padding: 0;
  }
.sub-menu ul .li4 {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    line-height: 3;
  }
  .sub-menu ul .li4:last-child {
    border-right: 0px dotted #fb9da6;
  }
  .sub-menu ul .li3 {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    line-height: 3;
  }
  .sub-menu ul .li3:last-child {
    border-right: 0px dotted #fb9da6;
  }
  .sub-menu ul .li2 {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    border-right: 0px;
    line-height: 3;
  }
  .sub-menu ul .li2:last-child {
    border-right: 0px dotted #fb9da6;
  }
    
  .sub-menu ul .li3-pink {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    line-height: 3;
  }
  .sub-menu ul .li3-pink:last-child {
    border-right: 0px dotted #fb9da6;
  }
  .sub-menu ul .li3-pink2 {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    line-height: 3;
  }
  .sub-menu ul .li3-pink2:last-child {
    border-right: 0px dotted #fb9da6;
  }
  .sub-menu ul .li2-green {
    list-style: none;
    padding: 0;
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-left: 0px dotted #fb9da6;
    border-bottom: 1px dotted #ccc;
    border-right: 0px;
    line-height: 3;
  }
  .sub-menu ul .li2-green:last-child {
    border-right: 0px dotted #fb9da6;
  }
}
.midashi-box {
  padding: 50px 0;
}
.midashi-box img {
  max-width: 220px;
  height: auto;
  margin-top: 20px;
}
@media screen and (max-width: 640px) {
  .midashi-box {
    padding: 30px 0;
  }
  .midashi-box img {
    max-width: 120px;
    height: auto;
    margin-top: 20px;
  }
}
.sofi-box {
  z-index: 3;
  margin: -100px auto 0 auto;
  width: 80%;
  position: relative;
  border-radius: 10px;
  color: #fff;
  text-align: center;
}
.sofi-box p {
  font-size: 20px!important;
  font-weight: bold!important;
}
.sofi-box h2 {
  font-size: 30px!important;
  font-weight: bold!important;
}
.sofi-box2 {
  margin: -20px auto 0 auto;
  width: 100%;
  position: relative;
  border-radius: 0px 0px 10px 10px;
  color: #fff;
  text-align: center;
  padding-top: 30px;
}
.sofi-box2 h3 {
  font-size: 31px!important;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .sofi-box p {
    font-size: 1rem;
  }
  .sofi-box h2 {
    font-size: 1.5rem;
  }
  .sofi-box2 h3 {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 640px) {
.sofi-box {
  margin: -50px auto 0 auto;
}
  .sofi-box p {
    font-size: 14px;
  }
  .sofi-box h2 {
     font-size: 20px!important;
  }
  .sofi-box2 h3 {
     font-size: 20px!important;
  }
}
.sofi-box img {
  width: 40% !important;
  height: auto;
  margin-top: 20px;
}

.ast-button a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.ast-button p {
  font-size: 18px;
  font-weight: bold;
}
.ast-button {
  padding: 18px 0;
  max-width: 240px;
  width: 90%;
  height: auto;
  margin: auto;
  background-color: #fb9da6;
  position: relative;
  display: block;
  border: #fff solid 3px;
  text-align: center;
  transition: .3s;
  color: #fff;
  border-radius: 40px;
}
.ast-button:hover {
  background: #fff;
  color: #fb9da6 !important;
  border: #fb9da6 solid 3px;
  transition: .3s;
}


.sofi-button a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sofi-button p {
  font-size: 18px;
  font-weight: bold;
}
.sofi-button {
  padding: 10px 0;
  max-width: 200px;
  width: 90%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #92d6c1 solid 3px;
  text-align: center;
  transition: .3s;
  color: #92d6c1;
  border-radius: 40px;
}
.sofi-button:hover {
  background: #92d6c1;
  color: #fff !important;
  border: #fff solid 3px;
  transition: .3s;
}
.pia-button a {
	display: block;
	position: absolute;
	top: 1px;
	left: 0;
	width: 100%;
	height: 100%;
}
.pia-button p {
  font-size: 18px;
  font-weight: bold;
}
.pia-button {
  padding: 10px 0;
  max-width: 240px;
  width: 90%;
  height: auto;
  margin: auto;
  background-color: #fff;
  position: relative;
  display: block;
  border: #fb9da6 solid 3px;
  text-align: center;
  transition: .3s;
  color: #fb9da6;
  border-radius: 40px;
}
.pia-button:hover {
  background: #fb9da6;
  color: #fff !important;
  border: #fff solid 3px;
  transition: .3s;
}
.astepia-button a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.astepia-button p {
  font-size: 18px;
  font-weight: bold;
}
.astepia-button {
  padding: 10px 0;
  max-width: 200px;
  width: 90%;
  height: auto;
  margin: 0;
  background-color: #ff909a;
  position: relative;
  display: block;
  border: #ff909a solid 3px;
  text-align: center;
  transition: .3s;
  color: #fff;
  border-radius: 40px;
}
@media screen and (max-width: 640px) {
.astepia-button {
  margin: auto;
}
}
.astepia-button:hover {
  background: #fff;
  color: #ff909a !important;
  border: #ff909a solid 3px;
  transition: .3s;
}
.is-animation .sofi-button, .ast-button, .is-animation .pia-button, .is-animation .astepia-button  {
  transition: .3s;
}
.whatsastepia .ninjin {
  position: absolute;
  width: auto;
  height: 200px;
  left: 0;
    top: 30px;
}

.whatsastepia .blocko {
  position: absolute;
  width: auto;
  height: 200px;
  right: 0;
}
@media screen and (min-width: 640px) and (max-width: 1024px) {
  .whatsastepia .ninjin {
    position: absolute;
    width: auto;
    height: 130px;
    left: 0;
    top: 60px;
    left: 20px;
  }
  .whatsastepia .blocko {
    position: absolute;
    width: auto;
    height: 150px;
    right: 0;
    top: 30px;
  }
}
@media screen and (max-width: 640px) {
  .whatsastepia {
    height: 300px;
  }
  .whatsastepia .ninjin {
    height: 140px;
    top: 180px;
    left: 20px;
  }
  .whatsastepia .blocko {
    height: 200px;
    top: 100px;
      display: none;
  }
}
  .list26 img{
    width: 100%;
	  height: auto;
  }


.teach-img{
    width: 80%;
    max-width: 300px;
    height: auto;
}

.fl-bana-pc img{
    position: fixed;
    bottom: 120px;
    right: 0;
    width: 70px;
    height: auto;
    z-index: 1000;
}
.fl-bana-sp img{
    display: none;
}
@media screen and (max-width: 640px) {
.fl-bana-pc img{
    display: none;
}
.fl-bana-sp img{
    display: block;
    position: fixed;
    bottom: 0;
    right: 0;
    width:100%;
    height: auto;
    z-index: 1000;
}
  }

.insta{
    display: block;
    margin:auto;
    width: 80%;
    max-width: 380px;
    height: auto;
}
.insta img{
    padding: 50px 0;
    width: 100%;
    height: auto;
}
@media screen and (max-width: 640px) {
    
 .insta{
    display: block;
    margin:auto;
    width: 90%;
    height: auto;
}
.insta img{
    padding: 30px 0;
    width: 100%;
    height: auto;
}   
}
@media screen and (max-width: 640px) {
.top-txt{
    padding: 15px;
    text-align: left;
    line-height: 1.6;
    }
.top-txt br{
    display: none;
    }
}


.balloon1 {
    display: flex;
  position: relative;
  margin: 1.5em 0;
  padding: 10px 40px;
  min-width: 120px;
  max-width: 100%;
  color: #448eb7;
  font-size: 1.6rem;
  border: 4px solid #448eb7;
  border-radius: 8px;
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #448eb7;
}

.jigyo {
  display: flex;
  align-items: center;/* 縦位置の調整 */
  width: 100%;
}

.jigyo:before,.jigyo:after{
  content: '';
  flex-grow: 1;/* 余白を分け与える */
  height: 3px;
  background: #448eb7;
}
.jigyo:before{
  margin-right:30px;
}.jigyo:after{
  margin-left:30px;
}@media screen and (max-width: 640px) {
.balloon1 {
      padding: 10px 20px;
  font-size: 1.2rem;
}
.jigyo:before{
  margin-left:20px;
  margin-right:20px;
}.jigyo:after{
  
  margin-left:20px;
  margin-right:20px;
}
    
}

.jigyo-box{
    width: 100%;
    box-sizing: border-box;
    height: auto;
    padding: 20px;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.jigyo-botan01 {
    display:inline-block;
    box-sizing: border-box;
  position: relative;
  margin:0;
  padding: 10px 10px 20px 10px;
  width: 100%;
  color: #fff;
  font-size: 1.5rem;
     background: #e16935;
text-align: center;
}
.jigyo-botan02 {
     background: #1c84aa;
}
.jigyo-botan03 {
     background: #c93c3b;
}
.jigyo-botan01 img{
 display: block;
    width: 50px !important;
    margin: -30px auto 10px auto;
    height: auto;
}
.jigyo-botan02 img{
 display: block;
    width: 73px !important;
    margin: -30px auto 10px auto;
    height: auto;
}
.jigyo-botan03 img{
 display: block;
    width: 53px !important;
    margin: -30px auto 10px auto;
    height: auto;
}

.jigyo-botan01:before {
  content: "";
    width: 100px;
    height: 100px;
  position: absolute;
  top: -40px;
  left: 50%;
  margin-left: -50px;
    background: #e16935;
    border-radius: 100px;
    z-index: -10;
}.jigyo-botan02:before {
     background: #1c84aa;
}.jigyo-botan03:before {
     background: #c93c3b;
}

.copyright{
    background: #3e3a39;
    color: #fff;
}

.gray-obi{
    width: 100%;
    background-color: #f0f0f0;
    height: 150px;
    position: relative;
    margin-top: -70px;
    z-index: 0;
    
}

.gray-obi img{
    position: absolute;
    width: 180px;
    height: auto;
    right: 5%;
    bottom: -20px;
    
}


@media screen and (max-width: 640px) {
.gray-obi img{
    position: absolute;
    width: 120px;
    height: auto;
    right: 5%;
    bottom: -20px;
    
}}


.jigyo-table table {
  width: 100%;
}
.jigyo-table th {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  padding: 15px;
  text-align: left;
  width: 20%;
}
.jigyo-table td {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;

  border-right: solid 1px #ccc;
  padding: 15px;
  text-align: left;
}


@media screen and (max-width: 640px) {
    
  
.sp-scr{
  overflow: auto; /*スクロールさせる*/
  white-space: nowrap; /*文字の折り返しを禁止*/
  width:100%; /*今回の設置を分かりやすくするためワザと狭い幅を指定。本来は不必要な指定です。*/
}

/* 以下、スクロールバーを追加 */
.sp-scr::-webkit-scrollbar{
    height: 10px;
}
.sp-scr::-webkit-scrollbar-track{
 background: #999;
}
.sp-scr::-webkit-scrollbar-thumb {
 background: #448eb7;
}


    
}