.zen-kaku-gothic-new-light {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .zen-kaku-gothic-new-regular {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .zen-kaku-gothic-new-medium {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .zen-kaku-gothic-new-bold {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .zen-kaku-gothic-new-black {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  

  .league-spartan-<uniquifier> {
    font-family: "League Spartan", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
  }

  /* 共通================================
   */

   .english {
    font-family: "League Spartan", sans-serif;
    font-weight: 100;
   }

   .japanese {
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 300;
    font-style: normal;
   }
   
   body {
    overflow-x: hidden;
   }

   .phone_view {
    display: none;
   }

   .pc_view {
    display: inline;
   }

   /* ローディングロゴ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
   /* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
      position: fixed;
      width: 100%;
      height: 100%;
      z-index: 1000;
      background:#fff;
      text-align:center;
      color:#fff;
    }
    
    /* Loading画像中央配置　*/
    #splash_logo {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    
    /* Loading アイコンの大きさ設定　*/
    #splash_logo img {
      width:260px;
    }
    
    /* fadeUpをするアイコンの動き */
    .fadeUp{
    animation-name: fadeUpAnime;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    }
    
    @keyframes fadeUpAnime{
      from {
        opacity: 0;
      transform: translateY(100px);
      }
    
      to {
        opacity: 1;
      transform: translateY(0);
      }
    }

/* メインビジュアル　＝＝＝＝＝＝＝＝＝＝＝＝ */

.main_visual_div {
    position: relative;
    background-image: url(images/main_visual.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 120vh;
}

.main_visual_div ul{
    position: absolute;
    top: 40%;
    left: 3%;
    list-style: none;
    color: white;
    font-size: 25px;
}

.main_visual_div li{
    margin: 25px;
}

.main_visual_div a{
    text-decoration: none;
    color: white;
}

.main_visual_div p{
    writing-mode: vertical-rl;
    color: white;
    position: absolute;
    font-size: 32px;    
}

.p1 {
    right: 70px;
    top: 230px;
    letter-spacing: 0.6rem;
}

.p2 {
    right: 130px;
    top: 398px;
    letter-spacing: 0.6rem;
}


.logo2 {
    position: absolute;
    top: 20px;
    left: 60px;
    width: 300px;
    height: auto; 
}

/*=================================================== 9-1-2 丸が動いてスクロールを促す 
==============================================*/

/*スクロールダウン全体の場所*/
.scrolldown2{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	bottom:10px;
	left:7%;
}

/* 丸の描写 */
.scrolldown2:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom:0;
    left:-4px;
    /*丸の形状*/
	width:10px;
	height:10px;
	border-radius: 50%;
	background:#eee;
    /*丸の動き1.6秒かけて透過し、永遠にループ*/
	animation:
		circlemove 2s ease-in-out infinite,
		cirlemovehide 2s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove{
      0%{bottom:45px;}
     100%{bottom:-100px;}
 }

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide{
      0%{opacity:0}
     50%{opacity:1;}
    80%{opacity:0.9;}
	100%{opacity:0;}
 }

/* 線の描写 */
.scrolldown2:after{
	content:"";
    /*描画位置*/
	position: absolute;
    bottom: -165px;
	left:0;
    /*線の形状*/
	width:1px;
	height: 230px;
	background:#eee;
}

/* 挨拶　====================================== */

.aisatsu1 {
    background-color: #fff;
    padding-bottom: 50px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-bottom: 220px;
    position: relative;
}

.aisatsu_photo {
    max-width: 700px;
    transform: translate(-100px,0);
}

.fadeInTrigger{
    opacity: 0;
}

/* その場で */
.fadeIn{
    animation-name:fadeInAnime;
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity:0;
    }
    
    @keyframes fadeInAnime{
      from {
        opacity: 0;
      }
    
      to {
        opacity: 1;
      }
    }


.aisatsu_suisai {
    position: absolute;
    opacity: 0.5;
    transform: translate(500px,300px);
    max-width: 400px;
}


.aisatsu_p {
    transform: translate(-60px,330px);
}

.aisatsu_p1 {
    font-size: 20px;
}

.aisatsu_p2 {
    transform: translate(110px,10px);
    font-size: 20px;

}
.aisatsu_p3 {
    transform: translate(10px,50px);
    line-height: 2.5rem;
}

.aisatsu_p4 {
    transform: translate(10px,70px);
}

span {
    font-size: 13px;
}

/* page top ボタン */

/*リンクの形状*/
#page-top a{
	display: flex;
	justify-content:center;
	align-items:center;
	background:#cccccc;
	border-radius: 30px;
	width: 60px;
	height: 60px;
	color: #fff;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	font-size: 20px;
	transition:all 0.3s;
    opacity: 0.7;
}

#page-top a:hover{
	background: #777;
}

/*リンクを右下に固定*/
#page-top {
	position: fixed;
	right: 10px;
	bottom:10px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*　下に下がる動き　*/

#page-top.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}


  /*==================================================
スライダーのためのcss
===================================*/
.slider img {
    max-width: 100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0;/*スライド左右の余白調整*/
}

.slider {
    background-color: #fff;
    
}


/* item　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.item_title,
.about_title {
    font-size: 100px;
    color: #C3C3C3;
}

.item_container {
    background-color: #fff;
    position: relative;    
    /* overflow-x: hidden; */
      
}



.item_title{
    position: absolute;
    margin-top: 170px;
    left: 230px;
    z-index: 2;
    
        opacity:0;
        }


        .fadeUp {
            animation-name: fadeUpAnime;
            animation-duration:2s;
            animation-fill-mode:forwards;
            opacity: 0;
        }
        @keyframes fadeUpAnime{
        from {
            opacity: 0;
            transform: translateY(100px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
        }
        
.item_suisai_left_top{
    position: absolute;
    opacity: 0.4;
    max-width: 250px;
    left: 80px;
    top: 90px;
    background-color: #fff;
    
}

.item_suisai_right_top{
    position: absolute;
    max-width: 400px;
    right: -90px;
   opacity: 0.4;

}

.item_suisai_left_bottom{
    position: absolute;
    max-width: 400px;
    left: -80px;
    bottom: -1165px;
    opacity: 0.4;

    background-color: #fff;

}

.item_suisai_right_bottom{
    position: absolute;
    max-width: 450px;
    bottom: -1100px;
    right: -70px;
    opacity: 0.3;
    background-color: #fff;

}

/* アイテムアイコン＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.icon_container_1 {
    background-color: #fff;
    padding-bottom: 160px;
}

.icon_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1200px;
    padding: 280px 0 50px;
    margin: 0px auto 0px;
}

.icon_item {
    width: 266px;
    margin: 30px;
    padding-bottom: 20px;
    text-align: center;
    background-image: url(images/item_icon_solid.png);
    background-position: right bottom;
    background-size: 110%;

}

.icon_item a{
    text-decoration: none;
    color: #000;
}

.icon_bag {
    width: 160px;
    margin-top: 30px;
}

.bag_container p{
    margin-top: 10px;
}

.bag_container .icon_bag:hover,
.tops_container .icon_tops:hover,
.zakka_container .icon_zakka:hover,
.fashion_container .icon_fashion:hover,
.amigurumi_container .icon_amigurumi:hover {
        animation:shake 0.4s ease;
    }
     
    @keyframes shake {
        0%   { transform:rotate(0); }
        16%  { transform:rotate(12deg); }
        32%  { transform:rotate(-10deg); }
        48%  { transform:rotate(8deg); }
        64%  { transform:rotate(-6deg); }
        80%  { transform:rotate(4deg); }
        96%  { transform:rotate(-2deg); }
        100% { transform:rotate(0deg); }
    }


.icon_tops {
    width: 180px;
    margin-top: 10px;
}

.tops_container p{
    margin-top: 10px;
}

.icon_zakka {
    width: 170px;
    margin-top: 15px;
}

.zakka_container p{
    margin-top: 15px;
}

.icon_fashion {
    width: 170px;
    margin-top: 20px;
}

.fashion_container p{
   margin-top: 15px;
}

.icon_amigurumi {
    width: 170px;
   
}


/* view all ボタン＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.btn_view_all {
    display: inline-block;

    width: 200px;
    text-decoration: none;
    padding-right: 20px;
    line-height: 50px;
    outline: none;
    font-size: 20px;
    font-weight: 300;
    color: #000000;
    border:1px solid #CCCCCC;
    border-radius: 30px;
    background-color: #fff;
    -webkit-transition: all .3s;
    transition: all .3s;
    letter-spacing: 1.5px;
    background-image: url(images/view_all_btn.png);
    background-position: 140px 20px;
  }

  .btn_view_all:hover {
    color: #fff;
    border:1px solid #CCCCCC;
    background-color: #CCCCCC;
    font-weight: 300;
    background-image: url(images/view_all_btn_hover.png);
  }
  
  /* 以下はレイアウト調整用 */
  .view_all_container{
    vertical-align:middle; 
    text-align: center;
    background-color: #fff;

  
  }

  .pc_view_block {
    display: block;
  }

/* about==================================
 */

 .about_container_1 {
    background-image: url(images/about_back.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 1px;
  
 }

.about_container {
    display: flex; /* photoとpを横並び */
    align-items: flex-start; /* 初期値だとphotoが引き延ばされるので指定 */
    justify-content: center;
    margin: 255px 0 100px;
    height: 120vh;
    box-sizing: border-box;
}

.about_title {
    position: absolute;
    top: -75px;
    right: 0;   /* ←topとrightで起点を指定 */
    line-height: 1;
    

    opacity:0;
        }


        .fadeUp {
            animation-name: fadeUpAnime;
            animation-duration:2s;
            animation-fill-mode:forwards;
            opacity: 0;
        }
        @keyframes fadeUpAnime{
        from {
            opacity: 0;
            transform: translateY(100px);
        }
        to {
            opacity: 1;
            transform: translateY(0px);
        }
        }



.about_photo {
    max-width: 435px;
    height: auto;
    transform: translate(40px,-100px);
    position: relative;
    z-index: 2;
   
}

.about_p {
    position: relative;
    top: 20px;
    background-color: rgba(255, 253, 239,0.6);
    padding: 80px 60px;
    border-radius: 10px;  
    line-height: 2;
}

.about_p1,
.about_p2,
.about_p3,
.about_p4 {
    margin-bottom: 30px;
}


.blanket {
    background-image: url(images/blanket.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: -1;
}

/* フッター部分　＝＝＝＝＝＝＝＝＝＝ */

.bottom_btn {
    display: flex;
    justify-content: center;
    background-image: url(images/bottom_view_all_back.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-top: 700px;
    padding-top: 110px;
  }


.bottom_view_all_font {
   max-width: 430px;
   height: auto;
   background-image: url(images/item_view_all_btn.png);
   background-size: contain;
   background-position: right;
   padding: 8px 85px 8px 0;
   transform: translate(0,-40px);
}

.bottom_view_all_font:hover {
    background-image: url(images/item_view_all_btn_hover.png);
    transition: .5s;
}

.bottom_btn a{
    display: block;
    transition: .5s;
}

.bottom_btn a:hover{
    transform: scale(1.05);
    transition: .5s;
}




.footer {
    background-color: #FFFDEF;
    padding: 60px 0 20px 0;
    margin: 0;
    background-image: url(images/footer_keito.png);
    background-position: right;

}

.item_footer {
    background-color: #FFFDEF;
    padding: 60px 0 20px 0;
    margin: 0;
    background-image: url(images/footer_keito.png);
    background-position: right;
}

.contact_footer {
    background-color: #FFFDEF;
    padding: 60px 0 20px 0;
    margin: 0;
    background-image: url(images/footer_keito.png);
    background-position: right;

}

.logo {
    margin-left: 120px;
    max-width: 283px;

}

.navi_container {
    display: flex;
    margin-top: 30px;
}

.insta_icon {
   width: 25px;
   height: 25px;
   margin: 21px 0 0 30px;
}

.insta_icon:hover {

}

.footer_list {
    margin-left: 95px;
}

.footer_list ul{
    list-style: none;
    display: flex;

}

.footer_list li{
    margin-left: 30px;

}

.footer_list a{
    text-decoration: none;
    color: #000000;
    font-size: 14px;
}

.c_ {
    text-align: center;
    margin: 50px 0 10px 0;
    font-size: 12px;
}

/* 共通　横並びのための設定
===================================*/

.gnavi,
.gnavi_header{
    display: flex;
    flex-wrap: wrap;/*スマホ表示折り返し用なのでPCのみなら不要*/
    margin: 20px 0 0 95px;
    list-style: none;
    font-weight: 300;
    font-size: 23px;
}

.gnavi li a,
.gnavi_header li a{
    display: block;
    padding:5px 30px;
    text-decoration: none;
    color: #333;
    letter-spacing: 1.5px;
}

.gnavi li,
.gnavi_header li{
    margin-bottom:20px;
}

/*　5-3-3 左から右に線が伸びる（下部）
===================================*/

.gnavi li a,
.gnavi_header li a {
    /*線の基点とするためrelativeを指定*/
	position: relative;
}

.gnavi li.current a,
.gnavi li a:hover,
.gnavi_header li.current a,
.gnavi_header li a:hover {
	color:#000000;
}

.gnavi li a::after,
.gnavi_header li a::after {
    content: '';
    /*絶対配置で線の位置を決める*/
    position: absolute;
    bottom: 0;
    left: 15%;
    /*線の形状*/
    width: 70%;
    height: 0.5px;
    background:#000000;
    /*アニメーションの指定*/
    transition: all .3s;
    transform: scale(0, 1);/*X方向0、Y方向1*/
    transform-origin: left top;/*左上基点*/
}

/*現在地とhoverの設定*/
.gnavi li.current a::after,
.gnavi li a:hover::after,
.gnavi_header li.current a::after,
.gnavi_header li a:hover::after {
    transform: scale(1, 1);/*X方向にスケール拡大*/
}


/* アイテムページ============================================================================== */

.navi_container_header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    position: fixed; 
    /* padding-top: 20px; */
    z-index: 1000;
    width: 100%;
    /* height: 121px; */
    color: white;
    background-color: rgb(255, 255, 255);
    padding-inline: 15px;
    align-content: center;
    height: 90px;
    
}

.logo_header {
    margin-left: 120px;
    max-width: 250px;
    transform: translate(0,13px);

}
.gnavi_header {
    margin: 40px 0 0 240px;
    list-style: none;
    font-weight: 300;
    font-size: 23px;
}

.insta_icon_header {
    margin: 50px 0 0 30px;
    width: 25px;
    height: 25px;
}

.item_header {
    background-image: url(images/item_header.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 210px;
    transform: translate(0,100px);
}

.item_header h3{
    font-size: 40px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    padding: 90px 0;
    letter-spacing: 2.0px;
}

.itempage_flex {
    display: flex; /* 左固定メニューと画像コンテナ横並び */
}

.category_menu_container {
    background-image: url(images/suisai_pink.png);
    background-repeat: no-repeat;
    background-size: 40%;
    background-position: left  150px;
    padding: 200px 0 0 60px;
    position: sticky; /* 固定　*/
    align-self:flex-start;
    top: 10px;
    width: 310px;
}

.category_menu_container h3{
    font-size: 40px;
    color: grey;
    margin-bottom: 40px;
    
}

.category_menu_container a{
    text-decoration: none;
    color: #000;
    margin-bottom: 20px;
}

.category_menu_container img{
    transform: translate(0,3px);
}

.onlineshop_btn {
    margin-top: 10px;
    display: inline-block;
    width: 180px;
    text-decoration: none;
    text-align: center;
    padding-right: 20px;
    transform: translate(-15px,0);
    line-height: 50px;
    outline: none;
    font-size: 20px;
    font-weight: 300;
    color: #000000;
    border:1px solid #CCCCCC;
    border-radius: 30px;
    background-color: #fff;
    -webkit-transition: all .3s;
    transition: all .3s;
    letter-spacing: 1.5px;
    background-image: url(images/category_btn.png);
    background-position: 135px 15px;
  }

  .onlineshop_btn:hover {
    color: #fff;
    border:1px solid #CCCCCC;
    background-color: #CCCCCC;
    font-weight: 300;
    background-image: url(images/category_btn_hover.png);
  }

.category_menu { 
    display: flex;
    flex-direction:column;
}

/* item画像 */

.container {
    margin: 150px 0 0 220px;
    overflow-x: hidden;

}

/* バッグ */

.bag_title {
    font-size: 32px;
    padding: 50px 0 80px 80px;

}
     .itempage_bag_container1 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(5, 1fr);
        gap: 30px;
    }

#bag {
    background-image: url(images/suisai_item.png);
    background-size: 20%;
    background-position: left 0px;
}
        
    .bag1 {
        grid-row: span 4 / span 4;
        height: 601px;
        width:  110%;
        background-image: url(images/bag_1.png);
        transition: .5s;
    }

    .bag1:hover {
        background-image: url(images/bag_1_hover.png);
        transition: .5s;
    }
    
    .bag2 {
        grid-row: span 2 / span 2;
        grid-column-start: 2;
        grid-row-start: 2;
        width: 100%;
        height: 350px;

        background-image: url(images/bag_2.png);
        transition: .5s;
        margin-left: 20px;
    }

    .bag2:hover {
        background-image: url(images/bag_2_hover.png);
        transition: .5s;
    }
    
    
    .bag3 {
        grid-row: span 2 / span 2;
        grid-column-start: 2;
        grid-row-start: 4;
        width: 100%;
        height: 350px;
        background-image: url(images/bag_3.png);
        transition: .5s;
        margin-left: 20px;
    }

    .bag3:hover {
        background-image: url(images/bag_3_hover.png);
        transition: .5s;
    }
    
    
    .bag1_3 {
        grid-row-start: 5;
        transform: translate(0,-135px);
        margin-left: 10px;
    }

    .bag1_3 li{
        list-style: none;
        border-bottom: 2px dotted rgb(198, 198, 198);
        width: 310px;
        padding-bottom: 10px;
    }

    .bag1_3 img{
        width: 23px;
        height: 23px;
        transform: translate(5px,5px);
    }


    .itempage_bag_container1 p{
        color: #fff;
        font-size: 20px;
        font-weight: 400;
        margin-left: 10px;
    }

    .bag1_p{

    }

    .bag2 p{
        transform: translate(20px,10px);
    }

    .bag3 p{
        transform: translate(20px,10px);
    }



    .itempage_bag_container2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(5, 1fr);
        gap: 30px;
        margin-right: 80px;
        margin-top: 50px;
    }
        
    .bag4 {
        grid-row: span 2 / span 2;
        height: 350px;
        width: 100%;
        background-image: url(images/bag_4.png);
        transition: .5s;
    }

    .bag4:hover{
        background-image: url(images/bag_4_hover.png);
        transition: .5s;
    }
    
    .bag5 {
        grid-row: span 2 / span 2;
        grid-column-start: 1;
        grid-row-start: 3;
        height: 350px;
        width: 100%;

        background-image: url(images/bag_5.jpg);
        transition: .5s;
    }

    .bag5:hover{
        background-image: url(images/bag_5_hover.jpg);
        transition: .5s;
    }
    
    .bag6 {
        grid-row: span 4 / span 4;
        grid-column-start: 2;
        grid-row-start: 2;
        transform: translate(0px,80px);
        height: 601px;
        width: 130%;

        background-image: url(images/bag_6.png);
        transition: .5s;
    }

    .bag6:hover{
        background-image: url(images/bag_6_hover.png);
        transition: .5s;
    }
    
    .bag4_6 {
        grid-row-start: 5;
        transform: translate(0,-5px);
        margin-left: 10px;
    }

    .bag4_6 li{
        list-style: none;
        border-bottom: 2px dotted rgb(198, 198, 198);
        width: 250px;
        padding-bottom: 10px;
    }

    .bag4_6 img{
        width: 23px;
        height: 23px;
        transform: translate(5px,5px);
    }


    .itempage_bag_container2 p{
        color: #fff;
        font-size: 20px;
        font-weight: 400;
        margin-left: 10px;
    }

    .bag4 p{
        transform: translate(20px,10px);
    }

    .bag5 p{
        transform: translate(20px,10px);
    }

    .bag6 p{
        transform: translate(20px,10px);
    }
         
    
/* トップス */

.tops_title {
    font-size: 32px;
    padding: 120px 0 80px 80px;
}

#tops{
    background-image: url(images/suisai_item.png);
    background-size: 20%;
    background-position: left 50px;
}
    
.itempage_tops_container {
    width: 100%;
    height: 601px;
    background-image: url(images/tops.jpg);
    transition: .5s;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 8px;
}
  
.itempage_tops_container:hover {
    width: 100%;
    height: 601px;
    background-image: url(images/tops_hover.png);
    transition: .5s;
}

.tops_p_title {
    color: #fff;
    display: flex;
    margin: 10px 0 0 50px;
}

.tops_p1 {
    transform: translate(0,20px);
}

.tops_p2 {
    transform: translate(300px,20px);
}

.tops_p3 {
    transform: translate(550px,20px);
}



.tops_p{
    display: flex;
    width: 850px;
    transform: translate(-20px,60px);
    margin-top: 10px;
    grid-row-start: 4;
}

.tops_p p{
  border-bottom: 2px dotted rgb(198, 198, 198);     
  padding-bottom: 10px;
  margin-left: 25px;
}

.tops_p img{
    width: 23px;
    height: 23px;
    transform: translate(5px,5px);
}


/* 雑貨 */
.zakka_title {
    font-size: 32px;
    padding: 240px 0 80px 80px;
}

#zakka{
    background-image: url(images/suisai_item.png);
    background-size: 20%;
    background-position: left 180px;
}

.itempage_zakka_container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
    
.zakka1 img{
    width: 78%;
}
     
.zakka1 {
    grid-column: span 2 / span 2;
    background-image: url(images/zakka_1.png);
    width: 100%;
    height: 485px;
    transition: .5s;

}

.zakka1:hover {
    background-image: url(images/zakka_1_hover.png);
    transition: .5s;
}

.zakka2 {
    grid-row-start: 2;
    background-image: url(images/zakka_2.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-top: 20px;
}

.zakka2:hover {
    background-image: url(images/zakka_2_hover.png);
    transition: .5s;
}

.zakka3 {
    grid-row-start: 2;
    margin-right: 235px;
    background-image: url(images/zakka_3.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-top: 20px;
}

.zakka3:hover {
    background-image: url(images/zakka_3_hover.png);
    transition: .5s;
}

.zakka4 {
    grid-row-start: 3;
    background-image: url(images/zakka_4.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-top: 20px;
}

.zakka4:hover {
    background-image: url(images/zakka_4_hover.png);
    transition: .5s;
}

.zakka5 {
    grid-row-start: 3;
    background-image: url(images/zakka_5.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-top: 20px;
}

.zakka5:hover {
    background-image: url(images/zakka_5_hover.png);
    transition: .5s;
}

.zakka1_5 {
    grid-row-start: 4;
    margin-top: 20px;
}
                 
.zakka1_5 li{
    list-style: none;
    border-bottom: 2px dotted rgb(198, 198, 198);
    width: 340px;
    padding-bottom: 10px;
    margin-left: 10px;
}

.zakka1_5 img{
    width: 23px;
    height: 23px;
    transform: translate(5px,5px);
}


.itempage_zakka_container p{
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    margin-left: 10px;
}

.zakka1 p{
    transform: translate(20px,10px);
}

.zakka2 p{
    transform: translate(20px,10px);
}

.zakka3 p{
    transform: translate(20px,5px);
}

.zakka4 p{
    transform: translate(20px,10px);
}
.zakka5 p{
    transform: translate(20px,10px);
}


       
/* ファッション */

.fashion_title {
    font-size: 32px;
    padding: 170px 0 80px 80px;
}

#fashion{
    background-image: url(images/suisai_item.png);
    background-size: 20%;
    background-position: left 100px;
}

.itempage_fashion_container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 8px;
}
    
.fashion1 {
    grid-row: span 2 / span 2;

    background-image: url(images/fashion_1.png);
    width: 100%;
    height: 350px;
    transition: .5s;
}

.fashion1:hover {
    background-image: url(images/fashion_1_hover.png);
    transition: .5s;
    
}

.fashion2 {
    grid-row: span 2 / span 2;
    grid-column-start: 1;
    grid-row-start: 3;
    transition: .5s;
    background-image: url(images/fashion_2.png);
    width: 100%;
    height: 350px;
}

.fashion2:hover {
    background-image: url(images/fashion_2_hover.png);
    transition: .5s;
    
}

.fashion3 {
    grid-row: span 3 / span 3;
    grid-column-start: 2;
    grid-row-start: 2;
    margin-right: 240px;
    transform: translate(-40px,-80px);
    transition: .5s;
    background-image: url(images/fashion_3.png);
    width: 100%;
    height: 601px;

}

.fashion3:hover {
    background-image: url(images/fashion_3_hover.png);
    transition: .5s;
    
}

.fashion1_3 {
    grid-column-start: 2;
    grid-row-start: 5;
    margin-left: 10px;
    transform: translate(-40px,-80px);
    margin-top: 20px;
}

.itempage_fashion_container p{
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    margin-left: 10px;
}

.fashion1 p{
    transform: translate(20px,10px);
}

.fashion2 p{
    transform: translate(20px,10px);
}

.fashion3 p{
    transform: translate(20px,10px);
}

.fashion1_3 li{
    list-style: none;
    border-bottom: 2px dotted rgb(198, 198, 198);
    width: 310px;
    padding-bottom: 10px;
}

.fashion1_3 img{
    width: 23px;
    height: 23px;
    transform: translate(5px,5px);
}
      
/* あみぐるみ */

.amigurumi_title {
    font-size: 32px;
    padding: 60px 0 80px 80px;
}

#amigurumi{
    background-image: url(images/suisai_item.png);
    background-size: 20%;
    background-position: left 0px;
}

.itempage_amigurumi_container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 8px;
    margin-bottom: 100px;
}
    
.amigurumi1 {
    grid-row: span 3 / span 3;

    background-image: url(images/amigurumi_1.png);
    width: 100%;
    height: 467px;
    transition: .5s;
}

.amigurumi1:hover {
    background-image: url(images/amigurumi_1_hover.png);
    transition: .5s;
}

.amigurumi2 {
    grid-row: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 2;
    margin-right: 240px;
    transform: translate(0,-50px);
    background-image: url(images/amigurumi_2.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-left: 20px;
}

.amigurumi2:hover {
    background-image: url(images/amigurumi_2_hover.png);
    transition: .5s;
}

.amigurumi3 {
    grid-row: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 4;
    transform: translate(0,-50px);
    background-image: url(images/amigurumi_3.png);
    width: 100%;
    height: 350px;
    transition: .5s;
    margin-left: 20px;
    margin-top: 20px;
}

.amigurumi3:hover {
    background-image: url(images/amigurumi_3_hover.png);
    transition: .5s;
}

.amigurumi1_3 {
    grid-column-start: 1;
    margin-top: 20px;

}

.itempage_amigurumi_container p{
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    margin-left: 10px;
}

.amigurumi1 p{
    transform: translate(20px,10px);
}

.amigurumi2 p{
    transform: translate(20px,10px);
}

.amigurumi3 p{
    transform: translate(20px,10px);
}

.amigurumi1_3 li{
    list-style: none;
    border-bottom: 2px dotted rgb(198, 198, 198);
    width: 215px;
    padding-bottom: 10px;
    margin-left: 10px;
}

.amigurumi1_3 img{
    width: 23px;
    height: 23px;
    transform: translate(5px,5px);
}
    
        
/* CONTACT======================================================================================= */

.contact_header {
    background-image: url(images/contact_header.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 210px;
    transform: translate(0,100px);
}

.contact_header h3{
    font-size: 40px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    padding: 90px 0;
    letter-spacing: 2.0px;
}

.contact_p {
    background-image: url(images/suisai_pink_green.png);
    background-position: 400px -5px;
    background-size: 10%;
    margin-top: 200px;
    padding-top: 50px;
    padding-bottom: 30px;
    text-align: center;
    line-height: 2;
    
}

.contact_container {
    margin-top: 50px;
    background-image: url(images/contact_back.png);
    background-position: center;
    background-size: 70%;
    
}

.contact_radio {
    max-width: 800px;
    margin-left: 380px;
    padding-bottom: 30px;
    line-height: 2;

}

label {
    padding-right: 25px;
}

 /* 入力ボックスの共通スタイル */
 input[type="text"],
 input[type="email"],
 textarea {
   width: 800px;
   padding: 10px;
   font-size: 1em;
   border: 1px solid #8d8d8d;
   border-radius: 5px;
   margin-bottom: 30px;
   margin-top: 5px;
   background-color: #fff;
}

 textarea {
    padding: 80px;
 }

 .submit_btn {
    text-align: center;
    margin-bottom: 150px;
    margin-top: 20px;
 }

.submit {
  display: inline-block;
  width: 250px;
  text-align: center;
  text-decoration: none;
  line-height: 50px;
  outline: none;
  color: #000000;
  border:1px solid #8d8d8d;
  border-radius: 5px;
  background-color: #fff;
  -webkit-transition: all .3s;
  transition: all .3s;
  margin: 0 auto;
  letter-spacing: 1.5px;
}

.submit:hover {
  color: #fff;
  border:1px solid #CCCCCC;
  background-color: #CCCCCC;
  font-weight: 400;
 }


 /* フォーム全体の見た目をちょっと整える */
 .contact_form {
   width: 100%;
   max-width: 800px;
   margin: 0 auto;
   padding: 20px;
   color: #000000;
   border-radius: 5px;
 }

/* トップページ　スマホ版　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

@media (max-width: 400px) {
    .phone_view {
        display: block;
    }

    .pc_view {
        display: none;
    }

/* 固定ヘッダー */
.header1 {
    background-color: #fff;
    position: fixed;
    /* box-sizing: border-box; */
}

.header1_logo {
    width: 60%;
    padding: 60px 0 0 23px;
}

.header1_logo_item {
    width: 60%;
    padding: 30px 0 0 23px;
}

#header {
    display: none;
    position: fixed;/*fixedを設定して固定*/
	height: 40px;/*高さ指定*/
	width:100%;/*横幅指定*/
    z-index: 1000;/*最前面へ*/
	/*以下はレイアウトのためのCSS*/
	display: flex;
	justify-content: space-between;
	align-items: center;
	/* color:#fff; */
    box-sizing: border-box;
    transition: .5s; /* アニメーションタイミング */
}


/*==ふわっと出現させるためのCSS*/

/*　上に上がる動き　*/

#header.UpMove{
	position: fixed;
	width:100%;
	animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime{
  from {
    opacity: 1;
	transform: translateY(0);
  }
  to {
    opacity: 0;
	transform: translateY(-100px);
  }
}

/*　下に下がる動き　*/

#header.DownMove{
	position: fixed;
	width:100%;
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 0;
	transform: translateY(-100px);
  }
  to {
  	opacity: 1;
	transform: translateY(0);
  }
}



/* ハンバーガーメニュー */

.hamburger_white {
    background-color: white;
}

/* 
hamburger(ハンバーガーアイコン)
=================================== */
.hamburger {
    position: absolute;
    right: 20px;
    top: 32px;
    width: 50px;
    height: 40px;
    cursor: pointer;
    z-index: 300;
  }

  .hamburger_item,
  .hamburger_contact {
    position: absolute;
    right: 20px;
    top: 32px;
    width: 50px;
    height: 40px;
    cursor: pointer;
    z-index: 300;
  }
  
  .hamburger__line {
    position: absolute;
    width: 40px;
    height: 2px;
    right: 0;
    background-color: #c3c3c3;
    transition: all 0.5s;
  }
  
  .hamburger__line--1 {
    top: 10px;
  }
  
  .hamburger__line--2 {
    top: 23px;
  }
  
  .hamburger__line--3 {
    top: 36px;
  }
  
  /*ハンバーガーがクリックされたら*/
  .open .hamburger__line--1 {
    transform: rotate(-45deg);
    top: 22px;
  }
  
  .open .hamburger__line--2 {
    opacity: 0;
  }
  
  .open .hamburger__line--3 {
    transform: rotate(45deg);
    top: 22px;
  }
  


.hamburger_container {
position: fixed;
  right: -100%;
  /*ハンバーガーがクリックされる前はWindow右側に隠す*/
  top: 0;
  width: 100%;
  /* 出てくるスライドメニューの幅 */
  height: 100vh;
  background-color: #fff;
  transition: all 0.5s;
  z-index: 999;
  overflow-y: auto;
  /* メニューが多くなったらスクロールできるように */

}

/*ハンバーガーがクリックされたら右からスライド*/
.hamburger_container.open  {
    right: 0;
  }

  /* 
black-bg(ハンバーガーメニュー解除用bg)
=================================== */
.black-bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 5;
    background-color: #000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s;
    cursor: pointer;
    z-index: 100;
  }
  
  /*ハンバーガーメニューが開いたら表示*/
  .open .black-bg {
    opacity: 0.3;
    visibility: visible;
  }

.hamburger1 {
    background-image: url(images/suisai_pink_green.png);
    background-position: -80px 100px;
    background-size: 50%;
    padding-top: 50px;
   }
.hamburger1.active{ 
    transform:translateX(0); /*クリックされたときの状態。右から現れて全体が見える*/
   }


.hamburger_list {
    list-style: none;
    margin: 50px 0 0px 80px;
}

.hamburger_list a{
    text-decoration: none;
    color: #000000;
    font-size: 25px;
}

.hamburger_list li {
    margin-bottom: 20px;
}

.hamburger_insta {
    width: 25px;
    height: 25px;
    margin: 5px 0 30px 80px
}

.hamburger_insta_item {
    width: 25px;
    height: 25px;
    margin: 0 0 30px 2px
}

.hamburger2 {
    background-image: url(images/suisai_pink.png);
    background-position: -80px 0px;
    background-size: 50%;   
}

.hamburger_category_title {
    font-size: 32px;
    font-weight: 300;
    color: #c3c3c3;
    margin-left: 50px;
}

.hamburger_list_2 {
    list-style: none;
    font-size: 20px;
    margin: 10px 0 0 70px;
}

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

.hamburger_list_2 li {
    margin-bottom: 12px;
}

 /* メインビジュアル */
.s_logo {
    max-width: 70%;
    transform: translate(60px,40px);
}

.main_visual_div {
    background-image: url(images/s_main_visual.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    height: 100vh;
}

.main_visual_div p{
    font-size: 25px;
    font-weight: 400;
}

.p1 {
    top: 0;
    right: 0;
    transform: translate(-20px,260px);
}

.p2 {
    top: 0;
    right: 0;
    transform: translate(-65px,400px);

}

.main_visual_div ul{
   font-weight: 400;
   transform: translate(0,10px);
}

.scrolldown2{
	bottom:30px;
	left:18%;
}

/* 挨拶 */
.aisatsu1 {
    flex-flow: column;
    overflow-x: hidden;
}

.aisatsu_photo {
    max-width: 130%;
    transform: translate(-140px,50px);
}

.aisatsu_suisai {
    transform: translate(160px,300px);

}
.aisatsu_p {
    transform: translate(20px,100px);
    font-size: 16px;
    margin: 30px 0 70px 0;
}

.aisatsu_p2 {
    transform: translate(45px,10px);
}

.aisatsu_p3 {
    transform: translate(25px,50px);
}

.aisatsu_p4 {
    transform: translate(25px,70px);
    line-height: 2.5rem;
}

/* item */
#item {
    overflow-x: hidden;
}

.item_title {
    left: 140px;
    margin-top: 140px;
    font-size: 80px;
}

.item_suisai_left_top {
    max-width: 40%;
    transform: translate(-20px,0px);
}

.item_suisai_right_top {
    max-width: 55%;
}

.item_suisai_right_bottom {
    transform: translate(10px,-90px);
    max-width: 80%;
}
.item_suisai_left_bottom {
    transform: translate(30px,-140px);
    max-width: 45%;
    opacity: 0.3;
}

.icon_item {
    width: 50%;
    margin: 0;
    padding-bottom: 0;
    background-image: none;
}

.bag_container p{
    transform: translate(-5px,-50px);
}

.tops_container p{
    transform: translate(-5px,-50px);
}

.zakka_container p{
    transform: translate(-5px,-57px);
}

.fashion_container p{
    transform: translate(0,-73px);
}

.amigurumi_container {
    transform: translate(-100px,-30px);
}

.amigurumi_container p{
    transform: translate(0,-40px);
}

/* .view_all_container {
    transform: translate(90px,-260px);
    background-color: transparent;
} */

.pc_view_block {
    display: none;
}

.s_view_all_btn {
    text-align: right;
    transform: translate(200px,-90px);
}

/* view all ボタン＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.s_btn_view_all {
    display: inline-block;
    width: 150px;
    text-decoration: none;
    padding-right: 20px;
    line-height: 45px;
    outline: none;
    font-size: 20px;
    font-weight: 200;
    color: #000000;
    border:1px solid #CCCCCC;
    border-radius: 30px;
    background-color: #fff;
    -webkit-transition: all .3s;
    transition: all .3s;
    letter-spacing: 1.5px;
    background-image: url(images/view_all_btn.png);
    background-position: 110px 20px;
    background-size: 13%;
    margin-left: 210px;
    transform: translate(0,-80px);
  }

  /* 以下はレイアウト調整用 */
  .view_all_container{
    vertical-align:middle; 
    text-align: center;
    background-color: #fff;
  }

  .icon_container_1 {
    padding-bottom: 0px;
  }

  .icon_item img{
    padding-left: 13px
  }

  /* about */
  .about_container_1 {
    transform: translate(0,-30px);
    background-image: url(images/s_about_back.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 105%;
    height: 205vh;



    /* background-attachment: fixed; iphoneじゃ効かないやつ*/
 }

.about_container {
    display: grid; 
    margin-top: 160px;
}

.s_about_title {
    max-width: 50%;
    height: auto;
    margin: 0 auto;
}

.about_photo {
    max-width: 95%;
    height: auto;
    transform: translate(10px,0px)

}

.about_p {
    padding: 50px 35px;
    margin: 54px 20px;
}

.about_p p{
    margin-left: 5px;
}


.blanket {
    background-image: url(images/s_blanket.png);
    background-position: left;
    right: 0;
}

.footer {
    background-size: 90%;
}

.bottom_btn {
    background-image: url(images/s_bottom_view_all_back.png);
    margin-top: 500px;
    display: flex;
    justify-content: center;
    padding-top: 110px;
    padding-bottom: 30px;
  }


.bottom_view_all_font {
   max-width: 90%;
   height: auto;
   padding: 8px 70px 8px 0;
   transform: translate(0,-40px);
   margin-left: 20px;
}

.logo {
    margin-left: 20px;
    max-width: 55%;
}

.gnavi {
    margin: 0;
    width: 20px;
}

.insta_icon {
    margin-left: 10px;
    transform: translate(0,225px);
}

.footer_list {
    margin: 0;
}

.footer_list ul{
    margin: 70px 0 0 30px;
    padding: 0;
    display: block;
}

.footer_list li{
    margin: 0 0 5px 0;
}

.gnavi li{
    margin-bottom: 15px;
}

.footer {
    background-image: url(images/s_footer_keito.png);
    background-size: 85%;
    background-position: right 170px;
    padding-bottom: 10px;
    padding-top: 0px;
}

.item_footer {
    background-image: url(images/s_footer_keito.png);
    background-size: 85%;
    background-position: right 230px;
    padding-bottom: 10px;
    padding-top: 60px;
}

.contact_footer {
    background-image: url(images/s_footer_keito.png);
    background-size: 85%;
    background-position: right 230px;
    padding-bottom: 10px;
    padding-top: 60px;
}

.c_ {
    margin-top: 30px;
    margin-bottom: 5px;
}

/* アイテムページ　スマホ版=================== */

.item_header {
    background-image: url(images/s_item_header.png);
    background-position: center 10px;
    width: 100%;
}

.container {
    margin: 100px 0px 0 0px;
}

.bag_title {
    padding:100px 0 80px 0px;
}
     
.itempage_bag_container1 {
    display: flex;
    flex-wrap: wrap;
}

.itempage_bag_container1 p{
    color: #000;
    font-weight: 200;
    font-size: 16px;
}

#bag { /* suisai */
    text-align: center;
    background-size: 30%;
    background-position: 80px 60px;
}
        
    .bag1 {
        background-size: 105%;
        background-position: -5px 0;
    }

    .bag1:hover {
        background-image: none
    }

    .bag1_s {
        margin-top: -30px;
        transform: translate(70px,0)
    }
    
    .s_cart {
        width: 35px;
        height: 35px;
        transform: translate(0,5px);
    }

    .bag2 {
        margin-top: 20px;
    }

    .bag2:hover {
        background-image: none
    }

    .bag2_s {
        transform: translate(45px,0);
        margin-top: -30px;
        
    }
    
    
    .bag3 {
        margin-top: 20px;
    
    }

    .bag3:hover {
        background-image: none;
    }

    .bag3_s {
        transform: translate(75px,0);
        margin-top: -30px;
    }

    .itempage_bag_container2 {
        display: flex;
        flex-wrap: wrap;
        gap: 0;
        margin: 0;
    }

    .itempage_bag_container2 p {
        color: #000;
        font-weight: 200;
        font-size: 16px;
    }

    .bag4 {
        margin-left: 20px;
        margin-top: 40px;
    }

    .bag4:hover{
        background-image: none;
    }
    
    .bag4_s {
        transform: translate(75px,0);
        margin-top: 0px;
    }

    .bag5 {
        margin-top: 45px;
        margin-left: 20px;
    }

    .bag5:hover{
        background-image: none;
    }
    
    .bag5_s {
        margin-top: 0px;
        transform: translate(85px,0);
    }

    .bag6 {
        background-size: 105%;
        background-position: -5px 0;
        transform: translate(0,50px);
    }

    .bag6:hover{
        background-image: none
    }

    .bag6_s {
        margin-top: 50px;
        transform: translate(85px,0);
    }
    

    /* トップス */

.tops_title {
    padding: 130px 0 80px 0px;
}

#tops{
    text-align: center;
    background-size: 30%;
    background-position: 80px 90px;
}

.itempage_tops_container {
    gap: 0px; 
    height: 400px;
    background-size: 105%;
    background-position: -5px 0;
    grid-template-columns: none;
    grid-template-rows: none;
    display: block;
}
  
.itempage_tops_container:hover {
    background-image: none;
}

.tops_p_title {
    color: #fff;
    display: flex;
    margin: 10px 0 0 50px;
}

.tops_p_title p{
    font-weight: 400;
}

.tops_p1 {
    transform: translate(-30px,5px);
}

.tops_p2 {
    transform: translate(105px,10px);
}

.tops_p3 {
    transform: translate(240px,40px);
}

.tops_p{
    display: grid;
    width: 290px;
    transform: translate(55px,290px);
    margin-top: 10px;
    grid-row-start: 4;
    text-align: left;
    font-size: 20px;

}

.tops_p p{
  border-bottom: 2px dotted rgb(198, 198, 198);     
  padding-bottom: 10px;
  margin-left: 0px;
  font-size: 16px;
}

.tops_p img{
    width: 35px;
    height: 35px;
    transform: translate(5px,5px);
}


/* 雑貨 */
.zakka_title {
    padding: 210px 0 80px 0px;
    text-align: center;
}

#zakka{
    background-size: 30%;
    background-position: 90px 170px;
}

.itempage_zakka_container {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
}
     
.zakka1 {
    background-size: 125%;
    height: 300px;
    background-position: -50px 0;

}

.zakka1_s {
    transform: translate(85px,0);
    margin-bottom: 30px;
}

.zakka1:hover {
    background-image: none
}

.zakka2 {
    background-size: 90%;
    background-position: 20px 0;
}

.zakka2:hover {
    background-image: none;
}

.zakka2_s {
    transform: translate(35px,-30px);
}

.zakka3 {
    margin-right: 0px;
    margin-top: 20px;
    background-size: 90%;
    background-position: 20px 0;
}

.zakka3:hover {
    background-image: none;
}

.zakka3_s {
    transform: translate(55px,-30px);
}

.zakka4 {
    background-size: 90%;
    background-position: 20px 0;
}

.zakka4:hover {
    background-image: none;
}

.zakka4_s {
    transform: translate(95px,-30px);
}

.zakka5 {
    background-size: 90%;
    background-position: 20px 0;
}

.zakka5:hover {
    background-image: none;
}

.zakka5_s {
    transform: translate(40px,-30px);
}

              
.itempage_zakka_container p{
    color: #000;
    font-size: 16px;
    font-weight: 200;
}

       
/* ファッション */

.fashion_title {
    padding: 120px 0 80px 0px;
    text-align: center
}

#fashion{
    background-size: 30%;
    background-position: 20px 80px;
}

.itempage_fashion_container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
    
.fashion1 {
    margin-left: 20px;
}

.fashion1:hover {
    background-image: none;
    
}

.fashion1_s {
    transform: translate(55px,0);
    margin-bottom: 40px;
}

.fashion2 {
    margin-left: 20px;
}

.fashion2:hover {
    background-image: none;
    
}

.fashion2_s {
    transform: translate(50px,0);
    margin-bottom: 40px;

}

.fashion3 {
    margin-right: 0px;
    margin-left: -5px;
    transform: translate(0px,0px);
}

.fashion3:hover {
    background-image: none;
}

.fashion3_s {
    transform: translate(130px,0);
}

.itempage_fashion_container p{
    color: #000;
    font-weight: 200;
    font-size: 16px;
}


/* あみぐるみ */

.amigurumi_title {
    padding: 130px 0 80px 0px;
    text-align: center;
}

#amigurumi{
    background-size: 30%;
    background-position: 50px 95px;
}

.itempage_amigurumi_container {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
    margin-bottom: 100px;

}
    
.amigurumi1 {
   background-size: 105%;
   margin-left: -5px;
   width: 105%;
}

.amigurumi1:hover {
    background-image: none;
}

.amigurumi1_s {
    transform: translate(140px,0);
    margin-bottom: 40px;
}

.amigurumi2 {
    margin-right: 0px;
    transform: translate(0,0px);
}

.amigurumi2:hover {
    background-image: none;
}

.amigurumi2_s {
    transform: translate(140px,0);
    margin-bottom: 40px;
}

.amigurumi3 {
    transform: translate(0,0px);
    margin-left: 20px;
    margin-top: 0px;
}

.amigurumi3:hover {
    background-image: none;
}

.amigurumi3_s {
    transform: translate(95px,0);

}

.itempage_amigurumi_container p{
    color: #000;
    font-size: 20px;
    font-weight: 200;
    font-size: 16px;
}

.amigurumi1 p,
.amigurumi2 p,
.amigurumi3 p{
    color: #fff;
}


.amigurumi1 p{
    transform: translate(20px,10px);
}

.amigurumi2 p{
    transform: translate(20px,10px);
}

.amigurumi3 p{
    transform: translate(20px,10px);
}

/* フッターカテゴリーメニュー */

.s_category_container {
    padding-bottom: 120px;
    position: relative;
    z-index: 10;
}

.s_category_suisai{
    position: absolute;
    width: 50%;
    bottom: 20px;
    right: -10px;
    z-index: -100;
    opacity: 0.3;
}


.s_category_container img{
    margin-left: 120px;
    margin-bottom: 30px;
    z-index: 0;
}

.s_category_container h3{
    font-size: 60px;
    color: #c3c3c3;
    margin-bottom: 30px;
    text-align: center;
}

.s_category_menu li{
    list-style: none;
    margin-bottom: 20px;
    margin-left: 105px;
    z-index: 100;
}


.s_category_menu a{
    text-decoration: none;
    color: #000;
    font-size: 20px;
}

.s_onlineshop_btn_container {
    text-align: center;
}

.keito {
        animation: swing 3s ease-in-out infinite;
      }
      
      @keyframes swing {
        20% {
          transform: rotate(15deg);
        }
        40% {
          transform: rotate(-10deg);
        }
        60% {
          transform: rotate(5deg);
        }
        80% {
          transform: rotate(-5deg);
        }
        100% {
          transform: rotate(0deg);
        }
      }


       
/* コンタクトページ　スマホ版=================== */

.contact_header {
    background-image: url(images/s_contact_header.png);
    background-position: center 10px;
    width: 100%;
}

.contact_p {
    max-width: 370px;
    margin: 150px auto 30px auto;
    padding-top: 70px;
    background-position: -10px top;
    background-size: 40%;
}

.contact_radio {
    margin-left: 10px;
    padding-bottom: 30px;
}

.contact_radio p{
    margin-bottom: 10px;
}

label {
    padding-right: 15px;
}

.contact_form {
    padding: 0 10px;
}

input[type="text"],
 input[type="email"],
 textarea {
   width: 370px;
   padding: 8px;
   margin-bottom: 25px;
   margin-top: 5px;
}

 textarea {
    padding: 80px;
 }

 .submit_btn {
    margin-bottom: 0px;
    padding-bottom: 100px;
 }

 .contact_container {
    background-position: 150px 400px;
    background-size: 100%;
    background-image: url(images/suisai_pink.png);
}
}


        
        
