h2, h3{
font-weight:bold;
}

.bg_color4 {
    background-color: #e4e4d8;
}

.txt_color3 {
    color: #5c615b;
}

.button:hover::after {
    box-shadow: inset 0 0 0 15em rgba(102, 117, 100, 1);
}

footer{
background-color:#f7f7f7;
min-width:100% !important;
max-width:100% !important;
}

footer .button{
z-index:1;
}

#main_img, #contents_box, #contents1,  #contents2 figure,  #contents3 .grid_6, #page_title{
position:relative;
}

#main_img:before {
    content: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(./Dup/img/font.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 55%;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    pointer-events: none;
}

#page_title:before {
      content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(./Dup/img/sub_title.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 30%;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 44%;
    left: 50%;
    pointer-events: none;
}



/*#contents_box:before{
content: "";
    position: absolute;
    width: 300px;
    height: 300px;
    background-image: url(./Dup/img/back.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: contain;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 0;
    left: 90%;
    pointer-events: none;
}*/

#contents1:before {
        content: "";
    position: absolute;
    width: 250px;
    height: 300px;
    background-image: url(./Dup/img/back.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: contain;
    z-index: 3;
    transform: translate(-50%, -150px);
    top: 0;
    left: 90%;
    pointer-events: none;
}

#contents2 figure:before {
    content: "";
    position: absolute;
    width: 30%;
    height: 30%;
    background-image: url(./Dup/img/01.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: contain;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 10%;
    left: 10%;
    pointer-events: none;
}

#contents3 .grid_6:nth-of-type(1):before {
    content: "";
    position: absolute;
    width: 25%;
    height: 25%;
    background-image: url(./Dup/img/02.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: contain;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 10%;
    left: 10%;
    pointer-events: none;
}

#contents3 .grid_6:nth-of-type(2):before {
    content: "";
    position: absolute;
    width: 25%;
    height: 25%;
    background-image: url(./Dup/img/03.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: contain;
    z-index: 3;
    transform: translate(-50%, -50%);
    top: 10%;
    left: 10%;
    pointer-events: none;
}



.flex_box{
overflow:hidden;
}

header.bg_color4, #fakeloader.bg_color1{
    background-image: url(./Dup/img/tex.png);
}

#contents2 h2{
    border-bottom: dotted 2px gray;
    padding-bottom: 5px;
}

#contents2 div.grid_6{
    background-image: url(./Dup/img/eye.png);
    background-position: top right;
    background-size: 150px;
    background-repeat: no-repeat;
}

.spinner7 > div {
    background-color: #ba7d22;
 }

.linkStyle{
color:#667564;
}

.link_box ul{
    align-items: center;
justify-content: center;
}

.link_box ul li{
margin:2px;
}

h2.txt1{
color:black;
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#contents1:before {
    content: "";
    width: 150px;
    height: 150px;
    transform: translate(80%, -100px);
    top: 0;
    left: 60%;
    pointer-events: none;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
 #contact_tel a{
font-size:18px;
}

#page_title:before {
    top: 20%;
    left: 50%;
}

footer h2.logo{
text-align:center;
}

}