@charset "utf-8";
/* CSS Document */
body{
    background-color: rgba(250, 246, 237, 1);
    color: #2d2d2d;
}
/*メインビジュアル*/
main{
    position: relative;
}

main .img{
    position: absolute;
}
@media (max-width: 768px) {
    main{
        margin-bottom: 40px;
    }
    main::before{
        content: "";
        display: block;
        padding-top: calc(765 / 375 * 100%);
    }
    main .img00{
        top: 0;
        left: 0;
        width: calc(339 / 375 * 100%);
        z-index: 2;
    }
    main .img01{
        width: calc(193 / 375 * 100%);
        top: calc(493 / 765 * 100%);
        left: calc(10 / 375 * 100%);
    }
    main .img02{
        width:calc(177 / 375 * 100%);
        top: calc(398 / 765 * 100%);
        right: calc(-22 / 375 * 100%)
    }
    main .img03{
        width: calc(131 / 375 * 100%);
        transform: rotate(3deg);
        left: calc(19 / 375 * 100%);
        top: calc(284 / 765 * 100%);
    }
    main .img04{
        top: calc(309 / 765 * 100%);
        left: calc(157 / 375 * 100%);
        width: calc(60 / 375 * 100%);
        
    }
    main .img05{
        top: calc(391 / 765 * 100%);
        left: calc(153 / 375 * 100%);
        width: calc(64 / 375 * 100%);
        
    }
    main .img06{
        width: calc(222 / 375 * 100%);
        top: calc(128 / 765 * 100%);
        left: calc(26 / 375 * 100%);
        /* z-index: 2; */
    }
    main .img07{
         width: calc(187 / 375 * 100%);
         right: calc(-25 / 375 * 100%);
         top: calc(99 / 765 * 100%);
    }
    main .img08{
        width: calc(50 / 375 * 100%);
        left: 0;
        top: calc(213 / 765 * 100%);
        z-index: -1;
    }
    main .img09{
        width: calc(93 / 375 * 100%);
        right: 0;
        top: calc(481 / 765 * 100%);
        z-index: -1;
    }
    main .img10{
        width: calc(44 / 375 * 100%);
        left: 0;
        bottom: 0;
        z-index: -1;
    }
    .spNone{
        display: none;
    }
}
@media (min-width: 769px) {
    main::before{
        content: "";
        display: block;
        padding-top: calc(800 / 1200 * 100%);   
    }
    div.img00{
        width: calc(524 / 1200 * 100%);
        top: 0;
        left: 0;
        z-index: 2;
    }
    div.img01{
        width: calc(388 / 1200 * 100%);
        top: calc(240 / 800 * 100%);
        left: calc(81 / 1200 * 100%);
    }
    div.img02{
        width: calc(263 / 1200 * 100%);
        top: calc(72 / 800 * 100%);
        left: calc(528 / 1200 * 100%);
    }
    div.img03{
        width: calc(193 / 1200 * 100%);
        top: calc(415 / 800 * 100%);
        left: calc(510 / 1200 * 100%);
        transform: rotate(-3deg);
    }
    div.img04{
        width: calc(53 / 1200 * 100%);
        top: calc(454 / 800 * 100%);
        left: calc(716 / 1200 * 100%);
        transform: rotate(-31deg);
    }
    div.img05{
        width: calc(77 / 1200 * 100%);
        top: calc(575 / 800 * 100%);
        left: calc(708 / 1200 * 100%);
        transform: rotate(-31deg);
    }
    div.img06{
        width: calc(330 / 1200 * 100%);
        top: calc(0 / 800 * 100%);
        right: calc(100 / 1200 * 100%);
    }
    div.img07{
        width: calc(345 / 1200 * 100%);
        top: calc(187 / 800 * 100%);
        right: calc(40 / 1200 * 100%);
    }
    div.img08{
        width: calc(192 / 1200 * 100%);
        bottom: calc(0 / 800 * 100%);
        left: calc(0 / 1200 * 100%);
        z-index: -1;
    }
    div.img09{
        width: calc(153 / 1200 * 100%);
        top: calc(0 / 800 * 100%);
        right: calc(0 / 1200 * 100%);
        z-index: -1;
    }
    div.img10{
        width: calc(180 / 1200 * 100%);
        top: calc(498 / 800 * 100%);
        right: calc(0 / 1200 * 100%);
        z-index: -1;
    }
    .pcNone{
        display: none !important;
    }
}  
  



.firstview{
    margin-bottom: 45px;
}

.read_section{
    position: relative;
    margin-bottom: 50px;
}

.read_section::before{
    content: "";
    display: block;
    padding-top: calc(332 / 375 * 100%);
}

.pink_motif{
    width: calc(356 / 375 * 100%);
    display: block;
    margin: 0 auto;
    position: absolute; 
    top:0;
    right: calc(12 / 375 * 100%);
    
}
.read_section p{
    width:calc(300 / 375 * 100%) ;
    position: absolute;
    top:calc(36 / 375 * 100%);
    left: calc(38 /375 *100%);
    text-align: left;
    line-height: 2.2;
    font-size: 14px;

}

/* リードテキスト開始 */

.fade-text{
    display: block;
    color: transparent;
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
    background-clip: text;
    -webkit-background-clip: text;
    background-size: 300% 300%;
  }

  .fade-text.to__right {
    background-image: linear-gradient(to right, #2d2d2d 30%, rgba(255, 255, 255, 0) 60%);
    background-position: left 100% center;
    transform: translate(-20px, 0);
    -webkit-animation: toRight var(--duration, 2.4s) var(--ease) var(--delay, 0.6s) forwards;
            animation: toRight var(--duration, 2.4s) var(--ease) var(--delay, 0.6s) forwards;
  }

  @keyframes toRight {
    100% {
      transform: translate(0, 0);
      background-position: left 0% center;
    }
  }


  /* リードテキストフェードイン終了 */


.read_twodogs{
    position: absolute;
    width: calc(226 / 375 * 100% );
    top:calc(213 / 332 * 100% );
    left: calc(145 / 375 * 100% );
}

.menu_list h1{
    font-size: 36px;
    text-align: center; 
    font-family: "Candal", sans-serif;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: rgb(11, 11, 11);
    -webkit-text-fill-color: white;
    display: block; 
    width: calc(317 / 375 * 100%);
    padding-bottom: 18px;
    /* border-bottom: 1px solid black; */
    margin: 0 auto 35px;
    border-bottom: dashed 1px #2d2d2d;

}

.menu_list{
    margin-bottom:170px;
    position: relative;
}

.category_list{
    width: calc(263 / 375 * 100%);
    margin: 0 auto 140px;
    position: relative;
}
 .category_list li a img{
    display: block;
}
.category_list li:nth-child(1) a img{
    width: calc(235 / 263 * 100%);
    margin: 0 0 40px;
}
.category_list li:nth-child(2) a img{
    width: calc(179 / 263 * 100%);
    margin: 0 0 40px;
}
.category_list li:nth-child(3) a img{
    width: calc(263 / 263 * 100%);
    margin: 0 0 40px;
}

.gizmo_pic{
    width: calc(233 / 263 * 100%);
    position: absolute;
    bottom: calc(-139 / 169 * 100%);
    right: calc(-42 / 263 * 100%);
    animation: fadeIn;
     animation-duration:  1s; 
    animation-timing-function: cubic-bezier(0.33, 1, 0.68, 1); 
    animation-fill-mode:forwards;
  }

   @keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  } 


/* .category_list::after{
    content:"";
    display: inline-block;
    background-image: url('category_gizmo.png');
    background-size:contein;
    width: calc(222 /375 * 100%);
    position: absolute;
    right: 0;
    
} */

/* .category_gizmo{
    width: calc(222 /375 * 100%);
    position: absolute;
    right: 0;
    
    
}  */
.code_1_section{
    padding-top: 30px;
}
.code_1_section::before{
    content: "";
    display: block;
    width: 100%;
    height: 70px;
    background-image: url(img/bg_top.png);
    position: absolute;
    left:0;
    top:-70px;
    background-size: cover;
}

.code_1 .inubu_top {
    width: 100%;
}

/* ここから安西さんのセクション */
.code_2_section,.code_1_section{
    background-color: #FFFDF9;
    position:relative;
}
.code_2_section{
    padding-bottom: 100px;
}
.code_1{
    margin-bottom: 50px;
    position: relative;
}

.code_1::before{
    content: "";
    display: block;
    padding-top: calc(515 / 375 * 100%);
}
.code_1 h1{
    width:calc(321 / 375 *100%);
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    
}
.code_1 h1 img{
    width: 100%;
}
.code1_bastup{
    position: absolute;
    top: calc(121 / 375 * 100%);
    left: 0;
    width: calc(146 / 375 * 100%);
    z-index: 4;
}
.code1_bg{
    position: absolute;
    top: calc(141 / 375 * 100%);
    right: 0;
    width: calc(366 / 375 * 100%);

}
.insta_white{
    width: 16px;
}
.code_1_proftext{
   width: calc(180 / 375 * 100%); 
   position: absolute;
   top: calc(165 / 375 * 100%);
   left: calc(153 / 375 * 100%);
   opacity: 0;
   animation-name: fadein;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}

.code_1_proftext span{
    font-size: 13px;
    display: inline-block;
    margin-right: 5px;
}
@keyframes fadein {
    0% {
       opacity: 0;
       transform: translateY(20px);
    }
    100% {
       opacity: 1;
       transform: translateY(0);
    }
  }

div.code_1_proftext ul li{
    border-bottom: 1px dotted #fff;
    font-size: 18px;
    padding-bottom: 7px;
    padding-top: 11px;
}
div.code_1_proftext ul.owner_prof{
    margin-top: 33px;
}
div.code_1_proftext ul li p{
    color: #fff;
    font-weight: bold;
}
div.code_1_proftext ul li p span{
    font-weight: 500;
    margin-left: 6px;
    font-size: 11px;
}

div.code_1_proftext ul li a{
    text-decoration: none;
    color: #fff;
}
div.code_1_proftext ul li:first-child{
    border-bottom: none;
    font-size: 12px;
}
div.code_1_proftext ul li:nth-child(2){
    font-size: 24px;
    padding-top: 0;
}

/* フェードの記述をする */




.code_text{
    position: relative;
    margin: 10px  auto 20px;
    padding: 34px 0;
    width: calc(330 / 375* 100%);
    /* width: calc(285 / 375 * 100%); */

}
.code_text::before{
    display: block;
    content: "";
    background-image: url(img/nikukyu.png);
    width: 42px;
    height: 24px;
    background-size: cover;
    position: absolute;
    top:0;
    left: 0;
   
}
.code_text p{
    max-width: calc(288 / 330 * 100%);
    text-align: left;
    font-size: 14px;
    line-height: 1.7;
    margin: 0 auto;
}
.code_text::after{
    content: "";
    background-image: url(img/nikukyu.png);
    background-size: cover;
    position: absolute;
    right: 0; 
    bottom: 0;
    width: 42px;
    height: 24px;
}



.item_pic_kingaku{
    display: flex;
    align-items: flex-end;
    width: calc(212 /275 *100%);
}
.item_pic_kingaku p{
    font-size: 12px;
}
.credit img{
  width: calc(50 / 212 * 100%);
  margin-right: 10px;
} 
.credit{
    width: calc(275 / 375 * 100%);
    display: flex;
    justify-content: space-between;
    align-items:flex-end;
    margin: 0px auto 10px;
    gap:15px;
}

.buy_button {
    display: inline-block;
    /* ここのemをpxにへんこう */
    width: calc(63 / 275 *100%);
    background: #F39EC3;
    border-radius: 60px;
    font-size: 14px;
    cursor: pointer;
    position: relative;
    display: flex;
    height: 24px;
    align-items: center;
    justify-content: center;
    

  }

  .buy_button a{
    text-decoration: none;
    color: #fff;
  }

  .buy_button:hover {
      background: #FFFDF9;
      
      border:1px solid #F39EC3;
      box-sizing: border-box;
  }
.buy_button:hover a{
    color: #F39EC3;
}
  .credit_last{
    margin-bottom: calc(60 / 375 * 100%);
  }

  /* クレジットの記述終了 */



.code1_otherpic{
    position: relative; 
    /* padding-bottom: 148px; */
}
.code1_otherpic::before{
    content: "";
    display: block;
    padding-top: calc(1725 / 375 * 100%);
}
img.a{
    position: absolute;
    top:0;
    left: 0;
    display: block;
    width: calc(338 / 375 * 100%);
    z-index: 2;
}
img.b{
    position: absolute;
    right: calc(-163 / 375 * 100%);
    top:calc(322 / 1725  * 100%);
    display: block;
    width: calc(523 / 375 * 100%);
    overflow: hidden;

}
img.c{
    position: absolute;
    right: 0;
    top:calc(977 / 1725  * 100%);
    display: block;
    width: calc(175 / 375 * 100%);
}
img.d{
    position: absolute;
    left: 0;
    top:calc(1073 / 1725  * 100%);
    display: block;
    width: calc(175 / 375 * 100%);
    
}

img.target{
    width: calc(113 / 375 * 100%);
    position: absolute;
    top: calc(1330 / 1725 * 100%);
    right: calc(35 / 375 * 100%);
    z-index: 5;
    animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
    0% {
      transform: translateY(-10%);
    }
    100% {
      transform: translateY(10%);
    }
  }

 
div.e{
    position: absolute;
    bottom: 0;
    left: 0;
    width:100% ;
}


 /* もちこアザーカット */

.code2_otherpic{
    position: relative;
    margin-bottom: 100px;
}
.code2_otherpic::before{
    content: "";
    display: block;
    padding-top: calc(1593 / 375 * 100%);
}
.other_top{
    width: calc(338 / 375 * 100%);
    display: block;
    position: absolute;
    top: 0;
    right: 0;

}
.ashiato{
    width: calc(189 / 375 * 100%);
    display: block;
    position: absolute;
    top: calc(444 / 1593 * 100%);
    left: calc(25 / 375 * 100%);
}
.kirinuki{
    width: calc(198 / 375 * 100%);
    position: absolute;
    top: calc(501 / 1593 * 100%);
    right: calc(14 / 375 * 100%);
}
.set{
    width: calc(330 / 375 *100%);
    position: absolute;
    top: calc(626 / 1593 * 100%);
    left: 0;

}
.fade_kirinuki{
    width: calc(181 / 375 * 100%);
    position: absolute;
    top:calc(1007 / 1593 * 100%);
    right: 0;
    z-index: 6;
}
.fade_under{
    width: calc(375 / 375 * 100%);
    position: absolute;
    bottom: 0;
}

p.code_1_proftext_3 .sex {
    font-size: 13px;
}

/* もちこ終了 */


 /* kissaの情報 */
 
 .shop_info_wrap{
    position: relative;
    display: block; 
    margin-bottom: 20px;
    margin-top: -56px;
 }
 .shop_info_wrap::before{
    content: "";
    display: block;
    padding-top: calc(584 / 375 * 100%);

 }
 .kissa_pome{
    width:calc(293 / 375 * 100%) ;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 8;
 }
 .kissa_info_pic{
    display: block;
    width: calc(375 / 375 * 100%);
    position: absolute;
    top: calc(50 / 584  * 100%);
 }
 .kissa_info_pic_pc{
    display: none;
 }
 .kissa_toy{
    display: block;
    height:calc(151 / 375 * 100%) ;
    position: absolute;
    top: calc(207 / 584  * 100%);
    left:0 ;
    z-index: 10;
 }

 .kissa_toy_pc {
    display: none;
 }
 .bg_under{
    width:calc(375 / 375 * 100%) ;
    position: absolute;
    top: calc(322 / 584 * 100%);
    z-index: -1;

 }

 /* kissa終了 */

 /* 犬グッズ */

 .first_image{
    position: relative; 
    margin-bottom: 51px;
 }
 
 /* .first_image::before{
    content: "";
    display: block;
    padding-top:calc(370 / 375 * 100%) ;
 } */
 /* .firstname{
    width: calc(326 / 375 * 100%);
    position: absolute;
    top:0;
    left: calc(25 / 375 * 100%);
 } */

 .goods_pic{
    width: calc(375 / 375 * 100%);
    top: 0;
    /* top: calc(160 / 527 * 100%); */

 }
 .first_image img.circle1{
    position: absolute;
    right: 0;
    bottom: calc(-87 / 370 * 100%);
    width: calc(86 / 375 * 100%);
    z-index: -1;
 }
 /* .goods_bg{
    width: calc(82 / 375 *100%);
    position: absolute;
    top: calc(371 / 527 * 100%);
    right: 0;
    z-index: -5;
 } */

.birthdaybar_wrap{
    margin-bottom: 51px;
    position: relative;
}
.circle2{
    position: absolute;
    top: 128px;
    left: 0;
    z-index: -1;
    width: 133px;
}
.ear_wrap{
    position: relative;
}
.circle_3{
    position: absolute;
    top:-25px;
    left:0;
    width: 86px;
    z-index: -1;
}
.circle_4{
    position: absolute;
    width: 100px;
    bottom: -41px;
    right: 0;
    z-index:-1 ;
}

.cpcm_wrap{
    position: relative;
    margin-bottom: 50px;
}

.buyer_cpcm_giz{
    position: absolute;
    width: 97px;
    right: 20px;
    top: 210px;
}

.circle_5{
    position:absolute;
    width: 164px;
    top:184px;
    right: 0;
     z-index:-1 ; 
}

.threecoins_wrap{
    position: relative;
}

.circle_6{
    position:absolute;
    width: 113px;
    top:-64px;
    left: 0;
    z-index:-1 ; 
}

.circle_7{
    position:absolute;
    width: 112px;
    top:788px;
    right: 0;
    z-index:-1 ;
}

.circle_8{
    position:absolute;
    width:76px;
    top:570px;
    left: 0;
    z-index:-1 ; 
}




.brand_name{
    font-size: 30px;
    font-weight: 600;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: rgb(11, 11, 11);
    -webkit-text-fill-color: white;
    display: block;
    text-align: center;
    margin-bottom: 15px;
}

.brand_name_furigana{
    text-align: center;
}



.dog_goods_prof{
    position: relative;
    /* margin-bottom: 175px; */
    margin-bottom: 150px;
    
}

.dog_goods_prof::before{
    content: "";
    display: block;
    padding-top:calc(252 / 375 * 100%) ;
}

.bdb_prof_bg{
    width: calc(356 / 375 *100%);
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);

}

.prof_name{
    position: absolute;
    top: calc( 15 / 252 *100%);
    left: calc(46 / 375 *100%);
    width: calc(300 / 375 * 100%);
    padding-bottom: 10px;
    border-bottom: #2d2d2d dotted 1px;
    display: flex;
    z-index: 10;
    margin-bottom: 10px;
}

.insta_icon{
    width: 60px;
}

.prof_name_instagram{
    padding-top: 9px;
    width: calc(180 / 375 * 100%);
    margin-left: 10px;
}
.prof_name_instagram a{
    font-weight: bold;
    font-size:19px;
    text-decoration: none;
    color: #2d2d2d;
    margin-bottom: 12px;
}
.prof_name_instagram p{
    font-size:12px;
    margin-top: 10px;
    font-weight: bold;
}
.prof_name_instagram span img{
    width: 12px;
}
.buyer_intro_text{
    width: calc(288 / 375 * 100%);
    position: absolute;
    top:calc(94 / 252 * 100%);
    left: calc(44 / 375 * 100%);
    line-height: 1.6;
    font-size: 12px;
    /* padding-top: 10px; */
}
.fade{
    width: calc(300 / 375 * 100%);
    margin: 0 auto;
}
.credit_2{
    display: flex;
    width: calc(300 / 375 * 100%);
    flex-wrap: wrap;
    gap:15px calc(7 /300 *100%);
    margin: 20px auto 35px;
}
.credit_2 div{
    display: block;
    width: calc(95 / 300 * 100%);
}
.credit_2 div p{
    margin-top: 5px;
    margin-bottom: 5px;
}
.credit_2 a{

    color: #2d2d2d;
    text-decoration: none; 
    font-size: 12px;
}
.credit_2 span{
    text-decoration: underline;
}
.credit_2 span::before{
    content: "¥";
}
.credit_2 img{
    width: 100%;
}

.buer_coment_gizmo{
    position: absolute;
    right: calc(10 / 375 * 100%);
    bottom: calc(-93 / 252 * 100%);
    width: calc(223 / 375 * 100%);
}



.buer_coment_gizmo_ear{
    width: calc(160 /375 * 100%);
    position: absolute;
    bottom:calc(-100 / 252 * 100%);
    left:calc(3 / 375 * 100%);
}

.threecoins_wrap{
    margin-bottom: 112px;
}

.three_more{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(300 / 375 *100%);
    height: 50px;
    background-color: #F39EC3;
    border-radius: 50px;
    /* margin-left: calc(36 / 375 *100%); */
    margin: 0 auto;

}

.three_more a{
    text-decoration:none;
    color: #fff;
    font-size: 16px;
}

.threecoins_backimage{
    margin-bottom: 64px;
}


.section_inubu{
    background-color: #FFFDF9;
    padding: 30px 0 25px 0;
    position: relative;
}
.section_inubu::before{
    content: "";
    display: block;
    width: 100%;
    height: 70px;
    background-image: url(img/bg_top.png);
    background-size: cover;
    position: absolute;
    left:0;
    top:-70px;
    background-size: cover;
}

.inubu_top{
    margin-bottom: 25px;
}

.inubu_top p{
    /* font-size: 16px; */
    text-align: center;
}
.inubu_top img{
    display: block;
    width: calc(43 / 375 * 100%);
    margin: 0 auto 15px;
}
.inubu_name{
    font-size: 34px;
    font-weight: 600;
    width: calc(326 /375 *100%);
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 1px dashed #2d2d2d;
    margin: 0 auto 10px;
}
.inubu_name_other{
    font-size: 20px;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: rgb(11, 11, 11);
    -webkit-text-fill-color: white;
    text-align: center;
    font-family: "Candal", sans-serif;
    font-weight: 400;
    font-style: normal;
    /* margin-bottom: 20px; */
}

.inubu_hassyu{
    font-size: 16px;
    line-height: 1.5;
    margin-top: 25px;
}
.leep{
    width: calc(300 / 375 *100%);
    margin: 0 auto 0px;
}
.section_last{
    padding-top: 93px;
    position: relative;
    padding-bottom: 90px;
}
.section_last::before{
    content: "";
    display: block;
    width: 100%;
    height: 70px;
    position: absolute;
    top: 0;
    left:0;
    background-image:url(img/bg_bottom.png);
    background-size: cover;
}
.section_last div{
    width: calc(169 / 375 *100%);
    margin: 0 auto ;
}
.section_last div img:first-child{
    width: 100%;
}
.section_last div img:last-child{
    display: block;
    width: calc(70 /169 *100% );
    margin: 0 auto;
}
.last_circle1{
    width: 141px;
    position: absolute;
    top: -90px;
    right: 0;
}

.last_circle2{
    width:100px ;
    bottom: 18px;
    left: 0;
    position: absolute;
}

.code_1 .dog_goods_first{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.brand_name,.inubu_name,.menu_list h1 {

    overflow: hidden;
   
}

.brand_name span,.inubu_name span,.menu_list h1 span{
    transform: translateY(200%);
    display:block;
    transition:1.5s;
}
.brand_name.active span,.inubu_name.active span,.menu_list h1.active span{
    transform: translateY(0);
}
.pickup_img img{
    width: 100%;

}


@media (min-width: 769px) {
    div.read_section{
        width: 535px;
        /* margin: 0 auto 25px; */
        margin: 0 auto 75px;
        
    }
    div.read_section p{
        /* top: 39%; */
        top: 35%;
        left: 50%;
        transform: translate(-50%,-50%);
        /* line-height: 2.1; */
        line-height: 2.5;
        font-size:16px;
        text-align: center;
    }
    .pink_motif{
        width: 535px;
        right: 0;   

    }
    .read_twodogs{
        width: 345px;
        left: 238px;
        top: 282px;
    }
    div.menu_list{
        width: 540px;
        margin: 0 auto;
        padding-bottom: 135px;
    }
    .menu_list h1{
        font-size: 52px;
        padding-bottom: 28px;
    }
    .code_1_section{
        padding-top: 43px;
    }
    
    .code_1_section::before{
        background-image: url(img/bg_top_pc.png);
        height: auto;
        padding-top: calc(302 / 2400 * 100%);
        top : 0;
        transform: translateY(-100%);
    }
    .code_1::before{
        padding-top: calc(726 / 601 * 100%);
    }
    .inner_code_2_section .code_1::before{
        padding-top: calc(668 / 601 * 100%) !important;
    }
    .code1_bastup{
        width: 225px;
        top: 250px;
        left: 0;
    }
    .code1_bg{
        width: 559px;
        right: 0;
        top: 273px;
    }
    .code_1_proftext{
        top: 324px;
        right: 67px;
        width: calc(283/600*100%);
    }
    .inner_code_2_section .code_1_proftext{
        top: calc(266/668*100%);
        right: 67px;
    }
    .inner_code_2_section .code1_bg{
        top: calc(216/668*100%);
    }
    .inner_code_2_section .code1_bastup {
        top: calc(192/668*100%);
        width: calc(225/600*100%);
    }

    p.code_1_proftext_1{
        font-size: 19px;
    }
    p.code_1_proftext_2{
        font-size: 36px;
    }
    /* 安斎さんother pic */
    img.a{
        position: absolute;
        top:0;
        left: 0;
        display: block;
        width: calc(447 / 600 * 100%);
        z-index: 2;
    }
    img.b {
        width: calc(590/600*100%);
        right: calc(-24/600*100%);
        top: calc(479/2236*100%);
    }
    img.c, img.d {
        width: calc(272/600*100%);
    }
    img.c {
        top: calc(1184/2236*100%);
    }
    img.d {
        top: calc(1325/2236*100%);
    }
    div.e {
        width: calc(489/600*100%) !important;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    }
    .code1_otherpic::before {
        content: "";
        display: block;
        padding-top: calc(2236/600*100%);
    }

    /* もちこother pic */
    .code2_otherpic::before {
        content: "";
        display: block;
        padding-top: calc(2233/600*100%);
    }
    .other_top {
        width: calc(448/600*100%);
        right: calc(-40/600*100%);
    }
    .kirinuki {
        width: calc(314/600*100%);
        top: calc(683/2233*100%);
    }
    .ashiato {
        width: calc(300/600*100%);
        top: calc(592/2233*100%);
    }
    .set {
        width: calc(626/600*100%);
        top: calc(914/2233*100%);
        left: calc(-76/600*100%);
    }
    .fade_kirinuki {
        width: calc(253/600*100%);
        right: calc(45/600*100%);
        top: calc(1447/2233*100%);
    }
    .fade_under {
        width: calc(489/600*100%);
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    }
    .insta_white{
        width: 20px;
    }
    p.code_1_proftext_3{
        font-size: 28px;
    }
    div.code_1_proftext ul li p span{
        font-size: 21px;
        font-weight: 500;
    }
    p.code_1_proftext_3 .sex {
        font-size: 20px;
    }
    div.code_1_proftext ul li a{
        font-weight: bold;
        font-size: 36px;
    }
    .code_text{
        margin-top: 42px;
    }
    .code_text p{
        font-size: 16px;
    }
    .code_text::before{
        width: 46px;
        height: 27px;
    }
    .code_text::after{
        width: 46px;
        height: 27px;
        
    }
    img.target{
        width: 146px;
    }
    .credit{
        width: 418px;
        margin-bottom: 15px;
    }
    .credit_last{
        margin-bottom: 96px;
    }
    .credit img{
        width:calc(45 / 212 * 100%) ;
    }
    .item_pic_kingaku p{
        font-size: 16px;
    }
    .buy_button{
        width: 73px;
        height: 27px;
        font-size: 16px;
    }
    .code_1_section .inner_code_1_section,.code_2_section .inner_code_2_section{
        width: 600px;
        margin: 0 auto;
    }
    .shop_info{
        background-color: #FFFDF9;
        padding-bottom: 143px;
        position: relative;
    }
    .shop_info::after{
        position: absolute;
        content: "";
        background-image: url(img/bg_bottom_pc.png);
        background-size: cover;
        display: block;
        padding-top: calc(301 /2400 *100%);
        width: 100%;
        bottom: 0;
        left: 0;
        transform: translateY(100%);

    }
    /* kissa */
   
    .buer_coment_gizmo{
        width: 320px;
        bottom: -70px;
        right:23px;

    }
    .dog_goods{
        padding-top: 180px;
        position: relative;
    }
    .circle1{
        position: absolute;
        width: 135px;
        right: 0;
        top: 643px;
    }
    .circle2{
        width: 211px;
        top:200px
    }
    .ear_name{
        position: relative;
    }
    .circle_3{
        position: absolute;
        width: 293px;
        top:-100px;
        left: -181px;
    }
    .circle_4{
        position: absolute;
        right: -56px;
        bottom: -1304px;
        width: 247px;
    }
    .circle_6{
        position: absolute;
        left:0;
        width: 228px;
        top: -160px;
    }
    .circle_7{
        width: 289px;
        position: absolute;
        top: 515px;
        right: 0;
    }
    .circle_8{
        position: absolute;
        top: 1016px;
        left: 0;
        width: 148px;

    }


    .dog_goods_prof{
        margin-bottom: 200px;
    }
    
    .shop_info_wrap{
        width: 100%;
        background: #F39EC3;
        box-sizing: border-box;
        padding: 35px 0;
    }
    .shop_info_wrap::before{
        display: none;
    }
    .shop_info_wrap .kissa_info_pic_pc{
        width: 438px;
        margin: 0 auto;
        display: block;
        position: relative;
        top: 0;
        left: 0;
    }
    .shop_info_wrap img.kissa_pome{
        width: 397px;
        position: absolute;
        top: -82px;
        left: 50%;
        transform: translateX(-50%);
        margin-left: -100px;
    }
    .shop_info_wrap img.kissa_toy_pc{
        position: absolute;
        top: 230px;
        height: auto;
        transform: translate(-50%,24%);
        display: block;
        width: calc(319/1200*100%);
        left: calc(196/1200*100%);
    }
    div.first_image,div.inner_dog_goods_wrap{
        width: 600px;
        margin: 40px auto 80px;
    }
    .brand_name{
        font-size: 36px;
    }
    .credit_2 div p{
        font-size: 12px;
    }
    .bdb_prof_bg{
        width: 520px;
    }
    .prof_name{
        width: 437px;
        top:37px;
    }
    .insta_icon{
        width: 88px;
    } 
    .prof_name_instagram p{
        margin-top:16px ;
    }
    .prof_name_instagram a{
        font-size:28px ;
    }
    .prof_name_instagram p{
        font-size: 19px;
    }
    .prof_name_instagram span img{
        width: 17px;
    }

    div.inubu_top{
        width: 540px;
        margin:0 auto;
    }
    .inubu_top img{
        display: block;
        width: calc(66 / 600 * 100%);
        margin: 0 auto 15px;
    }
    div.leeep{
        width: 600px;
        margin: 0 auto;
    }
    .section_last div{
        width: 267px;
        margin: 0 auto
    }
    .section_last div a img:last-child{
        width: 112px;
        margin: 0 auto;
    }
    .buyer_intro_text{
        font-size: 14px;
        line-height: 1.6;
        
    }
    .buer_coment_gizmo_ear{
        width: 240px;
        bottom: -114px;
    }
    .buyer_cpcm_giz{
        width: 157px;
        bottom: -68px;
    }
    .three_more{
        width: 438px;
        height: 76px;
    }
    .three_more a{
        font-size: 23px;
    }
    .threecoins_wrap{
        margin-bottom: 220px;
    }
    .section_inubu::before{
        height: auto;
        top: 0;
        background-image: url(img/bg_top_pc.png);
        background-size: cover;
        padding-top: calc(302 /2400 *100%);
        transform: translateY(-100%);
    }
    .inubu_name{
        font-size: 48px;
        padding-bottom: 30px;
        width: 540px;

    }
    .inubu_name_other{
        margin-bottom: 35px;
        font-size: 25px;
    }
    .inubu_hassyu{
        font-size: 25px;
        margin-bottom: 40px;
    }
    .leep{
        width: 600px;
        margin: 0 auto;
    }
    .section_last::before{
        height: auto;
        top: 0;
        background-image: url(img/bg_bottom_pc.png);
        background-size: cover;
        padding-top: calc(302 /2400 *100%);
        transform: translateY(0%);
    }
    .gzmo_insta{
        width: 284px;
        margin: 0 auto;
    }
    .section_last div img:first-child{
        width: 284px;
        margin: 0 auto;
    }
    .last_circle1{
        width: 280px;
        top: -195px;
    }
    .last_circle2{
        width: 249px;
        bottom: -239px;
    }
}