:root{
    --pin:#d6888b;
    --gre:#a7cc46;
}


.bg_color1 {
    background-color: var(--pin);
}

.bg_color3 {
    background-color: var(--gre);
}

#intro_bg{
        background-color: #fafdf3;
    background-image: linear-gradient(-90deg, #ffffff 40%, transparent 40%, transparent);
    background-size: 30px 30px;
        padding-top: 50px;
}

.txt_color6{
    color: #f2ede7;
}

.svg_wrap{
    height: 85vh;
    position: relative;
    bottom: auto;
}



.svg_box {
    position: absolute;
    width: 101%;
    bottom: -1px;
    left: 0;
    z-index: 10;
}

.svg_box.re{
        transform: rotate(180deg);
    top: -1px;
    bottom: auto;
}

#intro{
    padding-bottom: 0;
}

.other{
        text-align: center;
    font-size: max(1.4vw, 20px);
    padding-bottom: 50px;
    color: #d6888b;
    background-image: url(./Dup/img/white.png);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: contain;
    margin-bottom: 50px;
}

.mata{
    display: block;
    margin: 30px auto;
}

#contents .con_box .con_img{
        background-position: center;
    background-repeat: no-repeat;
    background-color: #f1f8e1;
        background-size: contain;
}

#main_img {
    width: 74%;
        margin: auto;
    background-color: red;
    margin-right: 0;
   /*max-width: 750px !important; */
    border-radius: 200px 0 0 0;
    height: 100vh;
    width: 60% !important;
    background-image: url(./Dup/img/main1.jpg);
    background-position: center;
    background-size: cover;
}

h2.catch{
   font-size: max(3vw, 30px);
    width: 20% !important;
    position: relative;
}

h2.catch:before{
        content: "";
    display: block;
    width: 400px;
    height: 400px;
    position: absolute;
    top: 120%;
    left: -50%;
    background-image: url(./Dup/img/pic.png);
    background-position: center;
    background-repeat: no-repeat;
    /* -webkit-transform: translate(-50% , -50%); */
    /* transform: translate(-50% , -50%); */
    background-size: contain;
    pointer-events: none;
    z-index: 5;
}

.test{
        position: relative;
    background-image: url(./Dup/img/left.png), url(./Dup/img/bottom.png);
    background-position: top left, 35% 100%;
    background-repeat: no-repeat;
    background-size: 300px, 400px;
}

header{
    background-color: transparent;
}

header.transform{
        background-color: rgba(242,237,231,0.6);
}

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

#filter_white h2 span, #filter_white p{
     color: white;
    filter: drop-shadow(0px 0px 10px #b47476) drop-shadow(0px 0px 10px #b47476);
}

#cms_2-g .cate_img1 img {
    top: 70% !important;
}

.linkStyle{
color: #29a9e0;
font-weight: bold;
}

.drawer-hamburger-icon, .drawer-hamburger-icon:after, .drawer-hamburger-icon:before{
    background-color: black;
}

.drawer-hamburger-icon::after, .drawer-hamburger-icon::before {
    background-color: rgb(0, 0, 0) !important;
}

.line{
        max-width: 300px;
    margin: auto;
}

header.transform #logo .logo{
        width: 100px;
        transition: 0.3s;
}

header #logo .logo{
    transition: 0.3s;
}

.border_color2 {
    border-color: #998e82;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
h2.catch {
    font-size: max(3vw, 30px);
    width: 40% !important;
    position: relative;
    margin-left: 0 !important;
    padding: 15px;
}

.svg_wrap {
    height: 0vh;
}

#logo .logo {
    width: 140px;
}

}

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

h2.catch {
    font-size: max(3vw, 24px);
    width: 100% !important;
    position: relative;
    z-index: 2;
    top: 100%;
    background-color: white;
    margin-left: 0 !important;
    padding: 10px;
    text-align: center;
}

#main_img {
    height: 70vh;
    width: 100% !important;
}

h2.catch:before {
    opacity: 0;
}

#intro {
    margin-top: -2px;
}

#intro_bg {
    padding-top: 10px;
}



.mata {
    text-align: center;
}

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

.other{
    text-align: left;
}

#logo .logo {
    width: 100px;
}

#page_title #filter_white {
    padding-top: 140px;
}

#page_title .svg_wrap2{
    margin-bottom: 10px;
}

#page_title h2 span {
    font-size: 28px;
}

.catch img{
        max-width: 250px;
    display: block;
    margin: 20px auto;
}

h2.catch {
    background-color: #f4f3f2;
}

}