﻿#catch{
    background-image: url(./Dup/img/hito.png), url(./Dup/img/3k.png), url(./Dup/img/intro_back.png);
    background-position: bottom left, top left, center;
    background-repeat: no-repeat;
    background-size: 35%, 50%, 80%;
    position: relative;
}

#catch:before{
    content: "";
    width: 60%;
    height: 100%;
    position: absolute;
    bottom: 0%;
    left: 50%;
    background-image: url(./Dup/img/eye.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

.catch_txt h2{
        color: #ff0099;
    text-align: center;
    font-size: 2em;
    margin-bottom: 50px;
}

#contents .box .box_item:after {
    background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #000 50.5%) no-repeat top left/100% 100%;
}

.no {
    background-image: url(./Dup/img/num_back.png);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover;
}

#contents .box h2{
        color: #ff0099;
        font-size: 1.5em;
}

#page_title:after {
    background-color: rgba(215, 38, 114, 0.25);
    /* mix-blend-mode: plus-lighter; */
    background-image: url(./Dup/img/left.png);
    background-position: top left;
    background-size: 60% 100%;
    background-repeat: no-repeat;
}

.pare{
    position: relative;
}

.pare:before{
       content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0%;
    left: 46%;
    background-image: url(./Dup/img/catch.png);
    background-position: top right;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , 0%);
    background-size: contain;
    pointer-events: none;
    z-index: 1;
}

.banner2 {
    bottom: 0px;
    right: 0;
    z-index: 100;
    max-width: 350px;
}

.catch_txt {
   background-color: transparent; 
}


.catch_txt p{
        background-color: black;
}

#wrap{
        min-width: 1080px;
}

#main .main_box {
    width: 30vw;
    min-width: 300px;
}

.is-show .logo, .clone-nav h1.logo{
        max-width: 150px;
}

.catch_img{
    display: none;
}

#cms_6-d .cate_title {
    color: #db2672;
}

#cms_6-d .cate_box.noimg:after, .cms_6-d .cate_box.noimg:after {
    background-color: transparent;
}

#loading_bg {
    background-color: #4c4c4c;
}

.linkStyle{
color: #db2672;
font-weight: bold;
}

.page10 .content_wrap .more{
           margin: 20px 0;
    width: 95% !important;
    font-size: 16px;
}

.page_title p.font_30up{
    color: white;
}

.page_title p.font_9up{
    color: #db2672;
}

#page_title .sns_link li {
    background-color: transparent;
}



/* ---------- カスタム ---------- */
@media screen and (max-width: 1280px){

}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

#wrap{
        min-width: 100%;
}



#catch {
padding-bottom: 100px;
}




#main .cms_img1 img {
    width: 200%;
    height: 100vh;
}

#main .main_box {
    width: 30vw;
    min-width: 400px;
    top: auto;
    left: 0%;
    transform: translateY(-0%);
    -webkit-transform: translateY(-0%);
    bottom: 0;
    filter: drop-shadow(2px 2px 2px black) drop-shadow(-2px 2px 2px black) drop-shadow(2px -2px 2px black) drop-shadow(-2px -2px 2px black);
    z-index: 1;
}

.pare:before {
    background-position: top center;
    background-size: 50%;
    left: 35%;
}

#catch {
    padding-bottom: 100px;
    background-size: 35%, 50%, cover;
}

.catch_txt h2 {
    font-size: 3em;
    margin-bottom: 20px;
}

#header .logo{
        max-width: 160px;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#catch {
    background-size: 35%, 90%, cover;
}

.no {
        background-image: url(./Dup/img/num_back_sp.png);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: contain;
}

#main .cms_img1 img {
    width: 220%;
    height: 100vh;
}

.banner2 {
    right: auto;
    z-index: 100;
    max-width: 290px;
    left: 0;
}

#main .main_box {
    width: 30vw;
    min-width: 300px;
    top: 45%;
    left: 0;
    z-index: 2;
    filter: drop-shadow(2px 2px 2px black) drop-shadow(-2px 2px 2px black) drop-shadow(2px -2px 2px black) drop-shadow(-2px -2px 2px black);
}

.pare:before {
    background-position: top left;
    background-size: 45%;
    left: 50%;
}

.catch_txt h2 {
    font-size: 2em;
    filter: drop-shadow(2px 2px 10px black) drop-shadow(2px 2px 10px black);
}

.shop_info h2 {
    font-size: 28px;
}

#main .main_box h1 {
    max-width: 350px;
    margin-bottom: 10px;
}

.banner2 {
    max-width: 200px;
}

.page_title p.font_30up {
    font-size: -webkit-calc(1rem + 14px);
    font-size: calc(1rem + 14px);
}

#tel_contact .tel a{
        font-size: -webkit-calc(1rem + 2px);
    font-size: calc(1rem + 2px);
}

.cate{
   margin-top: 50px;
   
}

.cate_list li a {
    padding: 0;
}



}