/*html, body{overflow: auto}
.pp-section{position: static}*/
/* color */
body,.txt_color_nomal{color: #333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #7ae37a} /* メインカラー */
.txt_color2{color: #f7f7f7} /* サブカラー */
.txt_color3{color: #7ae37a} /* アクセントカラー1 */
.txt_color4{color: #cccccc} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #fdf5e6} /* メインカラー */
.bg_color2{background-color: #fdf5e6} /* サブカラー */
.bg_color3{background-color: #7ae37a} /* アクセントカラー1 */
.bg_color4{background-color: #fdf5e6} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #7ae37a}
.border_color2{border-color: #f7f7f7}
.border_color3{border-color: #7ae37a}
.border_color4{border-color: #cccccc}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #1a1a1a;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #fdf5e6} /* メインカラー */
.hvr_txt_color2:hover{color: #f7f7f7} /* サブカラー */
.hvr_txt_color3:hover{color: #7ae37a} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #cccccc} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #fdf5e6} /* メインカラー */
.hvr_bg_color2:hover{background-color: #f7f7f7} /* サブカラー */
.hvr_bg_color3:hover{background-color: #7ae37a} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #cccccc} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.hvr_border_color1:hover{border-color: #fdf5e6}
.hvr_border_color2:hover{border-color: #f7f7f7}
.hvr_border_color3:hover{border-color: #7ae37a}
.hvr_border_color4:hover{border-color: #cccccc}

.cacth, h2, h3, #cms_2-c .box_txt1, .cms_2-c .box_txt1, .cate_title, .modal_txt {
    font-family: 'Yuji Boku', serif !important;
}
.modal_txt {
    font-weight: bold;
}
.tel_box {
    display: flex;
}
.tel, .mail {
    margin: 0 auto;
    background-color: #fdf5e6;
    width: 350px;
    border-radius: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.tel_bt a {
    text-decoration: none;
}
.mail a {
    font-size: 22px;
    color: #333;
}
.tel a {
    color: #333;
}
.tel p, .mail p {
    color: #333;
    width: 90%;;
}
#cms_5-a .cate .cate_title {
    cursor: pointer;
    border-radius: 16px;
}
.footer_right {
    background-color: #fdf5e6;
}
.nav_bg {
    background-color: #7ae37a;
}
.intro_wrap .font_bar {
    color: #9c4a4b;
}
.sakura_parts_box {
    width: 100%;
}
#sakura_block .sakura_parts_box{
  position: relative;
}
#sakura_block .sakura_parts_box img{
  position: absolute;
}
#sakura_block .sakura_parts_box img:nth-child(2n+1){
  width: 13px;/*花びらのサイズ*/
}
#sakura_block .sakura_parts_box img:nth-child(2n){
  width: 15px;/*花びらのサイズ*/
}
/*-----------------------------------
桜の花びらパーツの表示位置
-----------------------------------*/
img.parts_01{top: 0; left: 5%;}
img.parts_02{top: 0; left: 12%;}
img.parts_03{top: 0; left: 15%;}
img.parts_04{top: 0; left: 22%;}
img.parts_05{top: 0; left: 25%;}
img.parts_06{top: 0; left: 28%;}
img.parts_07{top: 0; left: 35%;}
img.parts_08{top: 0; left: 40%;}
img.parts_09{top: 0; left: 43%;}
img.parts_10{top: 0; left: 50%;}
img.parts_11{top: 0; left: 55%;}
img.parts_12{top: 0; left: 60%;}
img.parts_13{top: 0; left: 63%;}
img.parts_14{top: 0; left: 70%;}
img.parts_15{top: 0; left: 75%;}
img.parts_16{top: 0; left: 81%;}
img.parts_17{top: 0; left: 85%;}
img.parts_18{top: 0; left: 90%;}
img.parts_19{top: 0; left: 93%;}

/*-----------------------------------c
舞い散るアニメーション
どんな風に降らせるかのアニメーションの指定をする
-----------------------------------*/
@keyframes sakura {
    0% {
      opacity: 0;
    }
    20% {
      transform:translate(3px,30px) rotate(20deg);
      opacity: 1;
    }
    30% {
      transform:translate(0,50px) rotate(50deg);
    }
    50% {
      transform:translate(-20px,100px)  rotate(150deg);
    }
    70% {
      transform:translate(-40px,150px) rotate(-50deg);
      opacity: .8;
    }
    90% {
      transform:translate(-60px,200px) rotate(-180deg);
    }
    100% {
      transform:translate(-70px,230px);
      opacity: 0;
    }
}

.sakura_parts_box img {
    animation: sakura linear 6s infinite;
    /*アニメーションが始まるまで画像を見えなくしておく*/
    opacity: 0;
}

/*-----------------------------------
アニメーションが始まるまでの時間
-----------------------------------*/
img.parts_01,img.parts_04,img.parts_07,img.parts_10,img.parts_08,img.parts_11,img.parts_13,img.parts_16,img.parts_19{
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
img.parts_02,img.parts_05{
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}
img.parts_03,img.parts_06,img.parts_09,img.parts_12{
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}
img.parts_08,img.parts_11,img.parts_13,img.parts_16,img.parts_19{
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
img.parts_14,img.parts_17{
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
img.parts_15,img.parts_18{
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}


.cacth {
    font-size: 60px;
    color: #fff;
    text-shadow: 3px 3px 4px #555;
    text-align: center;
    left: 23%;
    top: 8%;
    transform: translate(-50%, -50%);
    opacity: 0;
    animation: fuwa;
    animation-delay: 3s;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@keyframes fuwa {
0% {
 opacity: 0;
 transform: scale(0.4);
}
  /*50%{
    opacity: 1;
     transform: translateY(0);
  }*/
 100% {
 opacity:1;
 transform: scale(1);
 } 
}
#contents .con_img {
    border-radius: 50%;
    top: 100px;
    bottom: 100px;
    left: 3%;
    width: 47% !important;
}
.square_img, .rectangle_img, #cms_6-c .box_img1 {
    position: relative;
    overflow: hidden;
    border-radius: 44% 50% 46% 54%;
}
.con_wrap .con_no, .con_wrap .con_txt, .con_wrap .con_title, .more a, #cms_5-a .cate_title {
    color: #333;
}
.more a:hover {
    color: #fff;
}
#contents .con_box1::before {
    background-color: #7ae37a;
}
.ume {
    bottom: 10%;
    opacity: 0.5;
}
.con_box1, .con_box2 {
    position: relative;
    z-index: 1;
}
.intro_wrap {
    position: relative;
    top: -60px;
}
.intro_wrap .font_2up {
    font-size: -webkit-calc(1rem + 6px);
    font-size: calc(1rem + 6px);
}
.intro_left {
    background-image: url(./Dup/img/intro_back.png);
    background-size: 100% 100%;
    transform: rotate(-1deg);
    position: relative;
    z-index: 1;
    padding-top: 0;
}
.intro_right {
    position: relative;
}
.intro_img1 {
    border-radius: 1%;
    border: 8px solid #fdf5e6;
    box-shadow: 2px 2px 3px;
}
.intro_img2 {
    transform: rotate(
4deg);
    border-radius: 3%;
    border: 8px solid #fdf5e6;
    box-shadow: 2px 2px 3px;
    position: relative;
    top: -20px;
    z-index: 1;
}
.intro_img3 {
    border-radius: 3%;
    border: 8px solid #fdf5e6;
    box-shadow: 2px 2px 3px;
    transform: rotate(
-2deg);
    position: relative;
    top: -25px;
}
.intro_txt {
    color: #101010;
    
}
#logo {
    margin-top: 100px;
}
footer {
    background-image: url(./Dup/img/footer_ume.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom left;
}
.line_hana {
    top: -110px;
    z-index: 1;
}
.pager a {
    color: #333;
}
.pager a:hover {
    color: #7ae37a;
}
.linkStyle {
    color: #9c4a4b;
}
.cate_list a:hover {
    color: #9c4a4b;
}
#cms_1-a .cate_box {
    border-color: #999999;
}
#page10 .hvr_txt_color1:hover, #footer_nav .hvr_txt_color1:hover {
    color: #9c4a4b;
}
#pc_nav li {
    font-size: 20px;
}
.hum_box {
    margin-top: 150px;
}
/*******************モーダル*****************************/
.modal_bt{cursor: pointer}
.modal_bt {
    margin-bottom: -100px;
    margin-top: -40px;
}
.modal_txt {
    font-size: 30px;
}
.modal_bg {
    top: 0;
    left: 0;
    /* background-color: rgba(0,0,0,0.8); */
    background-image: url(./Dup/img/modal_back.jpg);
    background-size: cover;
    background-position: center center;
    z-index: 9;
    transform: rotate(
1deg);
}
.modal_box{
     max-height: 80%;
     overflow-y: auto;
     z-index: 10
}
.close_bt{cursor: pointer}

.intro_left{transition: 0s;}
.intro_left.active{width: 100%!important;}
.intro_right.active{display: none!important;}

.modal_bt:hover {
    animation: bound-anim 1s infinite;
}
@keyframes bound-anim {
	0%,100% {top: 0;transform: scale(1);}
	30% {top: -60%; transform: scale(0.96,1.04);}
	60% {transform: scale(1);}
	90% {top: 0;transform: scale(1.15,0.9);}
}
.shop_icon {
    transition: .5s;
}
.shop_icon:hover {
    transition: 1s;
    transform: scale(1.1);
}
/*（1480px以下）環境の設定
---------------------------------------------------------------------------*/
@media screen and (max-width: 1480px){
.cacth {
    left: 19%;
}
}
/*（1370px以下）環境の設定
---------------------------------------------------------------------------*/
@media screen and (max-width: 1370px){
.cacth {
    left: 11%;
}
}
/*（1092px以下）環境の設定
---------------------------------------------------------------------------*/
@media screen and (max-width: 1092px){
.cacth {
    left: 5%;
}
}
/*ここからタブレット用（780px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 768px){
.tel_box {
    display: block;
}
.mail {
    margin-top: 20px;
}
.cacth {
    font-size: 43px;
    left: 4%;
    top: 15%;
}
.intro_img2 {
    top: -20px;
    z-index: 1;
    left: 23px;
}
.intro_left {
    transform: rotate(
0deg);
}
.intro_img3 {
    transform: rotate( 
-2deg);
    position: relative;
    top: -25px;
    right: 10px;
}
.intro_img1 {
    border: 4px solid #fdf5e6;
}
.intro_img2 {
    border: 4px solid #fdf5e6;
}
.intro_img3 {
    border: 4px solid #fdf5e6;
}
.footer_right {
    background-color: rgba(0,0,0,0);
}
.line_hana {
    display: none;
}
#contents .con_img {
    border-radius: 50%;
    top: -40px;
    bottom: 100px;
    left: -5%;
    width: 90% !important;
}
.modal_bg {
    transform: rotate( 
0deg);
}
.modal_txt {
    font-size: 27px;
}
.intro_left.active{width: 100%!important;transform: none!important;}
.intro_right.active{display: block!important;}
.intro_right.active .intro_img2{z-index: 0;}
#pc_nav .width_50per {
    width: 60%!important;
}
.hum_box {
    margin-top: 100px;
}
}

/*ここからスマホ用（667px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 667px){
.tel, .mail {
    width: 296px;
}
.mail a {
    font-size: 20px;
}
.cacth {
    font-size: 30px;
    left: 2%;
    top: 16%;
    width: 95%;
}

.modal_bt {
    width: 250px;
}
.shop_box {
    width: 90%!important;
}
.modal_txt {
    font-size: 22px;
}
#contents .con_img {
    border-radius: 50%;
    top: auto;
    bottom: 30px;
    left: -19px;
    width: 90% !important;
}
#pc_nav li {
    font-size: 16px;
}
.hum_box .width_300-max {
    padding-bottom: 0px;
}
.hum_box {
    margin-top: 0px;
}
}
@media all and (-ms-high-contrast:none) {
#cms_5-a .cate .cate_title span:last-of-type {
    padding-top: 0px !important;
}
}