/* ====================================================================
   ベース
   ==================================================================== */

html, body {
   height: 100%;
}
 


.wrapper{
   position: relative;
   z-index: 2;
   padding-top: 60px;
}
   @media screen and (max-width: 1200px) {
      .wrapper{
        padding-top: 40px;
      } 
   }
   @media screen and (max-width: 600px) {
      .wrapper{
        padding-top: 20px;
      } 
   }

.bg_base{
   background-image: url("../images/bg/bg_001.jpg");
   background-repeat: repeat;
   background-position: top center;
   background-size: 100% auto;
}
   @media screen and (max-width: 600px) {
      .bg_base{
        background-size: 180% auto;
      } 
   }


/* ====================================================================
   ヘッダ
   ==================================================================== */
header{
   position: relative;
   width: 100%;
   background-color: rgba(255,255,255,1.00);
   background-image: url("../images/tmp/k_head.png"),url("../images/bg/bg_batsu.png");
   background-position: top left,center;
   background-size: auto 100%,250px auto;
   background-repeat: no-repeat,repeat;
}
   @media screen and (max-width: 600px) {
      header{
        background-size: auto 80%,250px auto;
      } 
   }



header.is-head{
   background-color: rgba(255,255,255,0.90);
   background-position: top center;
   background-size: 100% auto;
}

header .inner{
   position: relative;
   width: 100%;
   height: 140px;
   background-image: url("../images/tmp/head_border.png");
   background-position: bottom left;
   background-repeat: no-repeat;
   background-size: 90% 2px;
   display: flex;
   justify-content: space-between;
   align-items: center;
}
   @media screen and (max-width: 1024px) {
      header .inner{
        height: 120px;
      } 
   }
   @media screen and (max-width: 800px) {
      header .inner{
        height: 100px;
      } 
   }
   @media screen and (max-width: 600px) {
      header .inner{
        height: 80px;
      } 
   }


header .inner .head_logo{
   width: 700px;
   margin: auto;
}
   @media screen and (max-width: 1024px) {
      header .inner .head_logo{
        width: 500px;
      } 
   }
   @media screen and (max-width: 800px) {
      header .inner .head_logo{
        width: 400px;
      } 
   }
   @media screen and (max-width: 600px) {
      header .inner .head_logo{
        width: 300px;
      } 
   }
   @media screen and (max-width: 480px) {
      header .inner .head_logo{
        width: 250px;
        margin-left: 15%;
      } 
   }




.menu_btn_bg{
   position: fixed;
   top: 0;
   right: 0;
   width: 100px;
   transition: all 1s;
}
   @media screen and (max-width: 1024px) {
      .menu_btn_bg{
         margin-top: -60px;
      } 
   }
   @media screen and (max-width: 700px) {
      .menu_btn_bg{
         width: 80px;
         margin-top: -60px;
      } 
   }
   @media screen and (max-width: 480px) {
      .menu_btn_bg{
         width: 70px;
         margin-top: -60px;
      } 
   }


.menu_btn_bg.is-head{
   transition: all 1s;
   margin-top: -80px;
}
   @media screen and (max-width: 1024px) {
      .menu_btn_bg.is-head{
         margin-top: -100px;
      } 
   }
   @media screen and (max-width: 700px) {
      .menu_btn_bg.is-head{
         margin-top: -90px;
      } 
   }
   @media screen and (max-width: 480px) {
      .menu_btn_bg.is-head{
         margin-top: -60px;
      } 
   }



.view {
  opacity: 0;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.view.active{
   opacity: 1;
}

.overflow_wrap{
   position: relative;
   overflow: hidden;
}



/* ====================================================================
   基本ページ
   ==================================================================== */
.content_wrap{
   position: relative;
   width: min(98% , 1100px);
   margin: 0 auto auto auto;
}
   @media screen and (max-width: 1200px) {
      .content_wrap{
         width: 94%;
      } 
   }
   @media screen and (max-width: 800px) {
      .content_wrap{
      } 
   }
   @media screen and (max-width: 600px) {
      .content_wrap{
         width: 94%;
      } 
   }
   
   /* ニュースページ用 */
   @media screen and (max-width: 1024px) {
      .content_wrap.news{
         width: 100%;
      } 
   }
   

.content_waku_wrap{
   position: relative;
   width: 100%;
   border: rgba(0,0,0,1.00) 2px solid;
   border-radius: 60px;
   box-sizing: border-box;
   background-color: rgba(255,255,255,1.00);
   margin-bottom: 60px;
}

   @media screen and (max-width: 1024px) {
      .content_waku_wrap{
         border-radius: 40px;
      } 
   }
   @media screen and (max-width: 600px) {
      .content_waku_wrap{
         border-radius: 20px;
         margin-bottom: 40px;
      } 
   }



   /* ニュースページ用 */
   @media screen and (max-width: 1024px) {
      .content_waku_wrap.news{
         border: none;
         background-color: transparent;
      } 
   }




/* ====================================================================
   1列レイアウト
   ==================================================================== */
.content_inner{
   position: relative;
   width: 100%;
   margin: auto;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
}

/* ====================================================================
   2列レイアウト（ソート用）
   ==================================================================== */
.content_flex_inner{
   position: relative;
   width: 100%;
   margin: auto;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
}

.content_flex_inner .left_wrap{
   position: relative;
   width: 30%;
   background-color: rgba(255,45,180,1.00);
   border-top-left-radius: 60px;
   border-bottom-left-radius: 60px;
   padding: 20px 0 0 0;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner .left_wrap{
         width: 100%;
         padding: 20px 0 0 0;
      } 
   }
   @media screen and (max-width: 480px) {
      .content_flex_inner .left_wrap{
         width: 100%;
         padding: 0px 0 0 0;
      } 
   }

.content_flex_inner .right_wrap{
   position: relative;
   width: 65%;
   padding: 20px 0 0 0;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner .right_wrap{
         width: 100%;
      } 
   }
   @media screen and (max-width: 600px) {
      .content_flex_inner .right_wrap{
         padding: 20px 0 0 0;
      } 
   }



/* ニュースページ_リスト用 */
.content_flex_inner.news{
   background-image: url("../images/bg/bg_maru_01.png");
   background-size: 300px auto;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner.news{
         background-image: none;
      } 
   }


.content_flex_inner.news .left_wrap{
   position: relative;
   width: 30%;
   background-color: rgba(255,45,180,1.00);
   border-top-left-radius: 60px;
   border-bottom-left-radius: 60px;
   padding: 20px 0 0 0;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner.news .left_wrap{
         width: 100%;
         padding: 0;
         border-radius: 0;
      } 
   }
   @media screen and (max-width: 480px) {
      .content_flex_inner.news .left_wrap{
         width: 100%;
         padding: 0px 0 0 0;
      } 
   }

/* ニュースページ_中面用 */
.content_flex_inner.kiji .left_wrap{
   position: relative;
   width: 15%;
   background-color: rgba(255,45,180,1.00);
   border-top-left-radius: 60px;
   border-bottom-left-radius: 60px;
   padding: 20px 0 0 0;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner.kiji .left_wrap{
         width: 15%;
         padding: 20px 0 0 0;
         border-top-left-radius: 40px;
         border-bottom-left-radius: 40px;
      } 
   }
   @media screen and (max-width: 600px) {
      .content_flex_inner.kiji .left_wrap{
         width: 100%;
         padding: 0px 0 0 0;
         border-top-left-radius: 20px;
         border-top-right-radius: 20px;
         border-bottom-left-radius: 0;
      } 
   }

.content_flex_inner.kiji .right_wrap{
   position: relative;
   width: 70%;
   margin: auto;
   padding: 20px 0 0 0;
}
   @media screen and (max-width: 1024px) {
      .content_flex_inner.kiji .right_wrap{
      } 
   }
   @media screen and (max-width: 600px) {
      .content_flex_inner.kiji .right_wrap{
         width: 90%;
      } 
   }







.b_back_list{
   position: fixed;
   top: 120px;
   left: 0;
   background-color: rgba(126,76,67,1.00);
   color: rgba(255,255,255,1.00);
   z-index: 15;
}
   @media screen and (max-width: 1200px) {
      .b_back_list{
        top: 100px;
      } 
   }
   @media screen and (max-width: 480px) {
      .b_back_list{
        top: 60px;
      } 
   }


.b_back_list a{
   display: block;
   padding: 4px 30px;
  font-family: YakuHanJP, 'Zen Maru Gothic', serif; 
  transform: rotate(0.03deg);
   color: rgba(255,255,255,1.00);
   font-weight: 600;
   font-size: 120%;
}
   @media screen and (max-width: 480px) {
      .b_back_list a{
        font-size: 90%;
        padding: 4px 20px;
      } 
   }


/* ソートFIX */
.menufix{
  position: -webkit-sticky;
  position: sticky;
  top: 40px;
}
   @media screen and (max-width: 480px) {
      .menufix{
        position: relative;
        top: 0;
      } 
   }



/* ====================================================================
   ページ下部
   ==================================================================== */
.i_section01{
   position: relative;
   width: 100%;
   margin-bottom: 20px;
   display: flex;
   justify-content: flex-start;
}

.i_section01 .left_box{
   width: 18%;
}
   @media screen and (max-width: 1024px) {
      .i_section01 .left_box{
         width: 25%;
      } 
   }
   @media screen and (max-width: 600px) {
      .i_section01 .left_box{
         width: 35%;
      } 
   }
   @media screen and (max-width: 480px) {
      .i_section01 .left_box{
         width: 45%;
      } 
   }


.i_section01 .right_box{
   border-bottom: rgba(62,64,82,1.00) 2px solid;
   width: 82%;
}
   @media screen and (max-width: 1024px) {
      .i_section01 .right_box{
         width: 75%;
      } 
   }
   @media screen and (max-width: 600px) {
      .i_section01 .right_box{
         width: 65%;
      } 
   }
   @media screen and (max-width: 480px) {
      .i_section01 .right_box{
         width: 55%;
         border-bottom: rgba(62,64,82,1.00) 1px solid;
      } 
   }


/* ====================================================================
   タイトル
   ==================================================================== */

.section_title{
   position: relative;
   width: 100%;
   text-align: center;
   font-size: 360%;
   font-weight: 800;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   line-height: 1.2;
}
   @media screen and (max-width: 600px) {
      .section_title{
         font-size: 6.8vw;
      } 
   }
   @media screen and (max-width: 480px) {
      .section_title{
         font-size: 10.4vw;
      } 
   }


.section_title_jp{
   position: relative;
   width: 100%;
   text-align: center;
   font-size: 120%;
   font-weight: 700;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   letter-spacing: 5px;
   line-height: 1.2;
   transform: rotate(0.03deg);
   margin-bottom: 40px;
}
   @media screen and (max-width: 600px) {
      .section_title_jp{
         font-size: 2.5vw;
         margin-bottom: 20px;
      } 
   }



/* ====================================================================
   ニュース
   ==================================================================== */

.news_list_inner{
   position: relative;
   width: 100%;
}

.news_list_box{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   align-items: center;
   transform: translateY(30px);
}
   @media screen and (max-width: 1024px) {
      .news_list_box{
         width: 85%;
         margin: auto;
      } 
   }
   @media screen and (max-width: 600px) {
      .news_list_box{
         width: 90%;
         margin: auto;
      } 
   }


.news_list_box.active{
   transform: translateY(0);
   }




.news_list_box article{
   border: rgba(0,0,0,1.00) 2px solid;
   border-radius: 100px;
   width: 95%;
   margin-bottom: 20px;
   transition: all .5s ease-in-out;
   box-shadow: 5px 5px rgba(255,213,240,1.00);
}
   @media screen and (max-width: 1024px) {
      .news_list_box article{
         width: 100%;
         margin-bottom: 20px;
      } 
   }


.news_list_box article:hover{
   transform: scale(1.05);
   transition: all .5s ease-in-out;
}

.news_box{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   transform: rotate(0.03deg);
}

.news_box .news_left{
   position: relative;
   width: 100px;
   background-color: rgba(255,45,180,1.00);
   border-top-left-radius: 100px;
   border-bottom-left-radius: 100px;
   padding: 20px 0 20px 0;
   text-align: center;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
}
   @media screen and (max-width: 600px) {
      .news_box .news_left{
         width: 70px;
      } 
   }


.news_box .news_right{
   position: relative;
   width: calc(100% - 100px);
   padding: 20px;
   background-color: rgba(255,255,255,1.00);
   border-top-right-radius: 100px;
   border-bottom-right-radius: 100px;
   display: flex;
   align-items: center;
}
   @media screen and (max-width: 600px) {
      .news_box .news_right{
         width: calc(100% - 70px);
         padding: 10px;
      } 
   }




a .news_box .day{
   width: 100%;
   color: rgba(255,255,255,1.00);
   font-weight: 600;
   display: grid;
   place-content: center;
   font-size: 90%;
   transform: rotate(0.03deg);
   text-align: center;
   line-height: 1;
}


a .news_box .day2{
   width: 100%;
   color: rgba(255,255,255,1.00);
   font-weight: 600;
   font-size: 260%;
   display: grid;
   place-content: center;
   transform: rotate(0.03deg);
   text-align: center;
   line-height: 1;
}
   @media screen and (max-width: 600px) {
      a .news_box .day2{
        font-size: 6vw;
      } 
   }


a .news_box .title{
   color: rgba(0,0,0,1.00);
   transform: rotate(0.03deg);
}




/* ニュース中面ページ */

.news_kiji{
   line-height: 1.8;
}

.news_in_day_wrap{
   position: relative;
   width: 100%;
   font-size: 120%;
   margin: 40px auto 40px auto;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   transform: rotate(0.03deg);
}
   @media screen and (max-width: 1024px) {
      .news_in_day_wrap{
        font-size: 2vw;
      } 
   }
   @media screen and (max-width: 600px) {
      .news_in_day_wrap{
        font-size: 4vw;
        margin: auto;
        padding: 15px;
        display: flex;
        justify-content: center;
      } 
   }
   @media screen and (max-width: 480px) {
      .news_in_day_wrap{
        font-size: 5vw;
      } 
   }

.news_in_day_wrap .month{
   color: rgba(255,255,255,1.00);
   font-weight: 600;
   display: grid;
   place-content: center;
   font-size: 90%;
   text-align: center;
   line-height: 1;
}
   @media screen and (max-width: 600px) {
      .news_in_day_wrap .month{
        font-size: 100%;
        display: block;
      } 
      .news_in_day_wrap .day::before{
         content: ".";
         font-size: 100%;
      }
   }

.news_in_day_wrap .day{
   color: rgba(255,255,255,1.00);
   font-weight: 600;
   display: grid;
   place-content: center;
   font-size: 300%;
   text-align: center;
   line-height: 1;
}
   @media screen and (max-width: 600px) {
      .news_in_day_wrap .day{
        font-size: 100%;
        display: block;
      }
   }

.news_in_title{
   position: relative;
   margin: 40px auto 40px auto;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   transform: rotate(0.03deg);
   font-size: 160%;
   font-weight: 800;
   line-height: 1.4;
   background-image: url("../images/news_tmp/k_title.png");
   background-position: bottom left;
   background-repeat: no-repeat;
   background-size: 70% auto;
   padding-bottom: 40px;
}
   @media screen and (max-width: 600px) {
      .news_in_title{
        font-size: 4.0vw;
        margin: 20px auto 20px auto;
        padding-bottom: 20px;
      }
   }
   @media screen and (max-width: 480px) {
      .news_in_title{
        font-size: 5vw;
        margin: 20px auto 20px auto;
        padding-bottom: 20px;
      }
   }


.b_list_back_bottom_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: flex-end;
   margin: 60px auto 60px auto;
}
.b_list_back_bottom{
   position: relative;
   width: 200px;
}
   @media screen and (max-width: 600px) {
      .b_list_back_bottom{
        width: 40%;
      }
   }



/* 追加 */
.ns02_01{
   border: rgba(0,0,0,0.50) 3px dotted;
   padding: 15px;
   box-sizing: border-box;
   font-size: 110%;
   font-weight: 600;
   font-family: 'M PLUS Rounded 1c', sans-serif;
   transform: rotate(0.03deg);
}


.ns03_wrap{
   position: relative;
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   margin-bottom: 40px;
}
   @media screen and (max-width: 800px) {
      .ns03_wrap{
        display: block
      }
   }

.ns03_wrap .pic_box{
   position: relative;
   align-self: flex-start;
   width: 25%;
   border: rgba(0,0,0,1.00) 2px solid;
}
   @media screen and (max-width: 800px) {
      .ns03_wrap .pic_box{
        width: 40%;
        margin-bottom: 20px;
      }
   }
   @media screen and (max-width: 600px) {
      .ns03_wrap .pic_box{
        width: 60%;
        margin: auto;
        margin-bottom: 20px;
      }
   }


.ns03_wrap .txt_box{
   position: relative;
   width: 70%;
}
   @media screen and (max-width: 800px) {
      .ns03_wrap .txt_box{
        width: 100%;
      }
   }