body, .txt_color_nomal {
    color: #0e0e0e;
}

.bg_color1 {
    background-color: #0251a5;
}

.bg_color3 {
    background-color: #0093d6;
}

header {
    background: rgba(255,255,255,0.8);
}


#main_img{
position:relative;
}



#main_img:before{
content: "";
    display: block;
    width: 90%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/font1.svg);
    background-position: center left;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    pointer-events: none;
}

#main_img:after{
    content: "";
    display: block;
    width: 90%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/font2.png);
    background-position: center left;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    pointer-events: none;
opacity:0;
    animation: slide-skew 0.4s cubic-bezier(0.25, 1, 0.5, 1) 2s 1 forwards;
}

/*.anime{
 display: block;
    width: 90%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    pointer-events: none;
opacity:0;
    animation: slide-skew 0.4s cubic-bezier(0.25, 1, 0.5, 1) 2s 1 forwards;
}*/

@keyframes slide-skew {
  0% {
    transform: translate(-50%,-50%) scale(5);
    opacity: 0;
  }
  100% {
    transform: translate(-50% , -50%) scale(1);
opacity:1;
  }
}


.svg_box, .svg_box2{
display:none !important;
}

h2,h3{
font-weight:bold;
}


.border_color3 {
    border-color: #66b1f1;
}

.font_22 {
    font-size: 32px;
}

.ichi{
    background-image: url(./Dup/img/back1.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 43%;
}

.ni{
    background-image: url(./Dup/img/back2.png);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 43%;
}

.san{
 background-image: url(./Dup/img/back3.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 43%;
}

.txt_color3 {
    color: #009de4;
}

.font_20 {
    font-size: 26px;
}

.eye{
    max-width: 150px;
    margin: auto;
    text-align: center;
    display: block;
    margin-top: -140px;
}

.border_color4 {
    border-color: #0159ab;
}

#contents h3{
position: relative;
    line-height: 1.2em;
}

.kate{
    background-color: #009de4;
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
  
    transform-origin: right;
}

.fadein{
     opacity: 1;
       transform: scalex(1);
     transition: 0.5s;
     transition-property: opacity,transform;
}

.fadein.fadetrans{
     opacity: 1;
 transform: scalex(0);
}

#fakeloader:before{
 content: "";
    display: block;
    width: 100%;
    height: 0%;
    position: absolute;
    top: 50%;
    left: 50%;
  background-color:white;
    -webkit-transform: translate(-50% , -50%) ;
    transform: translate(-50% , -50%) ;
    pointer-events: none;
 animation: slide-skew2 0.2s cubic-bezier(0.25, 1, 0.5, 1) 0s 1 forwards;
}

@keyframes slide-skew2 {
  0% {
   width:100%;
height:0%;
  }
  100% {
    width:0%;
opacity:0.2;
height:100%;
  }
}

#fakeloader .fl {
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%,-50%) scale(0);
    width: 50%!important;
    max-width: 200px!important;
 animation: logon 0.3s cubic-bezier(0.25, 1, 0.5, 1) 0.3s 1 forwards;
}


@keyframes logon {
  0% {
  }
  100% {
  transform: translate(-50%,-50%) scale(1.1);
  }
}


.hvr_txt_color3:hover {
    color: #46a6fb;
}

.cate_list a{
background-color:#f6f6f6;
}





#page_title{
    background-position: bottom right;
}

.check{
    max-width: 100px;
    display: block;
    margin-bottom: 10px;
}

.box_txt1{
font-weight:bold;
}

.font_4up {
    font-size: -webkit-calc(1rem + 8px);
    font-size: calc(1rem + 8px);
}

.txt_color1 {
    color: #0251a5;
}

footer .bg-mask {
    background-image: url(./Dup/img/backk.jpg);
    background-position: center;
    background-size: cover;
}

#filter_white{
background-color: rgba(255,255,255,0.2) !important;
}

#tel_txt p a, .linkStyle{
color:#0251a5;
border-bottom:1px solid #0251a5;
}

#tel_txt p a:hover, .linkStyle:hover{
border-bottom: none;
}

/*---------20210324 start------*/


#bottom_menu{
background-color: #cacaca;
    margin: 0;
    color: white;
    padding: 5px 0;
}

#bottom_menu a{
    color: #0251a5;
}

.cms_box{
background-color: white;
    padding: 40px 30px;
    border-radius: 10px;
}

main{
    background-color: #f3f3f3;
}

#top_cms{
background-color:white;
border-radius:10px;
}

.info_box{
background-color:transparent;
}


/*---------20210324 end------*/


/*-----20210329 atart------*/

.cms_box {
background-color:transparent;
    padding: 40px 30px;
    border-radius: 10px;
}

/*-----20210329 end------*/

/*-------20210330 start-------*/

#intro_txt{
background-color: #f3f3f3;
}

#top_cms {
background-color:transparent !important;
    border-radius: 10px;
    border: 6px solid white;
    padding: 30px 10px;
}


/*-------20210330 end-------*/


@media all and (-ms-high-contrast: none){
 .cate_list a{
    padding-bottom: 5px !important;
}

#main_img:after{
    top: 0%;
    left: 5%;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    pointer-events: none;
opacity:0;
    animation: slide-skew 0.4s cubic-bezier(0.25, 1, 0.5, 1) 2s 1 forwards;
}
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
header #header #header_menu li {
    width: auto;
}

#main_img {
    margin-top: 130px;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){

.ichi, .ni, .san {
    background-size: contain;
    padding-bottom: 20px;
background-image:none;
}

.eye {
    max-width: 80px;
    margin-top: -120px;
}

#main_img {
    margin-top: 60px;
}

header{
padding-bottom:0;
}

header #logo{
padding-top:10px;
}

.font_22 {
    font-size: 24px;
}

#fakeloader .fl {
    max-width: 100px!important;
}

/*--------0324  0324 start--------*/

.cms_box {
    padding: 30px 20px;
}
/*--------0324 0324 end--------*/


}