﻿.bg_color1 {
    background-color: #472aaf;
}

.bg_color2 {
       background-color: #f5f9eb;
    background-image: url(./Dup/img/moyo.png);
}

.bg_color3 {
    background-color: #62b77e;
}

.border_color3 {
    border-color: #2838A9;
}


#contents div.grid_4{
padding:15px;
}

#contents div.grid_4:nth-of-type(2){
margin-top:150px;
}

#fakeloader.bg_color1{
background-color:#c7bbe1;
background-image:url(./Dup/img/fake2.jpg);
}

header{
overflow:hidden;
}

header:before {
       content: "";
    display: block;
    width: 30%;
    height: 410px;
    position: absolute;
    top: 70px;
    left: -22px;
    background-image: url(./Dup/img/font.png);
    background-position: top left;
    background-repeat: no-repeat;
    /* -webkit-transform: translate(-50% , -50%); */
    /* transform: translate(-50% , -50%); */
    background-size: contain;
    pointer-events: none;
    z-index: -1;
}


.index #main_nav {
    z-index: 3;
}


#header .tel a{
font-size:1.7vw;
}

#contents{
position:relative;
}

#contents:before{
    content: "";
    position: absolute;
    background-image: url(./Dup/img/eye2.png);
    background-size: contain;
    width: 20%;
    height: 710px;
    top: -32%;
    right: 0;
    background-repeat: no-repeat;
    background-position: right;
    z-index: 2;
    pointer-events: none;
}

#contents:after{
    content: "";
    position: absolute;
    background-image: url(./Dup/img/eye3.png);
    background-size: contain;
    width: 18%;
    height: 710px;
    bottom: -40%;
    left: 0;
    background-repeat: no-repeat;
    background-position: left;
    z-index: 2;
    pointer-events: none;
}

#page_title:after {
    background-color: rgba(200, 200, 200, 0.1);
}

.index #main_nav {
    box-shadow: 0 -2px 1px rgba(255,255,255,0.3);
}

#intro h2{
position: relative;
    z-index: 1;
    background-position: center;
    background-image: url(./Dup/img/mie.png);
    background-repeat: no-repeat;
    background-size: contain;
    padding: 60px 0;
    margin-bottom: 20px;
}

/*#intro h2:before{
    content: "";
    position: absolute;
    background-image: url(./Dup/img/mie.png);
    background-size: contain;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    pointer-events: none;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
}*/

#intro figure{
position:relative;
}

#intro figure:before{
content: "";
    display: block;
    width: 50%;
    height: 50%;
    position: absolute;
    top: 0%;
    left: 10%;
    background-image: url(./Dup/img/ira1.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
}

#intro{
background-image: url(./Dup/img/ira2.png);
    background-position: 100% 20%;
    background-repeat: no-repeat;
    background-size: 13%;
}

.linkStyle{
color:green;
}

#page_title h2 , #page_title p{
    color: #276706;
font-weight:bold;
opacity:1;
}

.border_color2 {
    border-color: #2aaf41;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

header:before {
      content: none;
}

#fakeloader.bg_color1 {
    background-position: center;
background-size: cover;
}

main{
border:none !important;
}

#contents div.grid_4:nth-of-type(2) {
    margin-top: 0px;
}


#intro {
    background-image: none;
}

#contents:after {
    width: 18%;
    height: 710px;
    bottom: -33%;
}


}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#header .tel a {
     font-size: 30px; 
}

#intro h2{
font-size:16px;
    padding: 30px 0;
}

#contents:before {
    width: 30%;
    height: 710px;
    top: -17%;
    right: 0;
}




#contents:after {
    width: 28%;
    height: 710px;
    bottom: -20%;
}


}

