@charset "UTF-8";
.l-header_inner {
/*   max-width: 1056px; */
   max-width: 1300px; 
/*	max-width: 1350px;*/
  width: 100%;
    padding-top: 1.6rem;
  padding-left: 1.0rem;
  padding-right: 1.0rem;
  margin: 0 auto;
  overflow: hidden;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
    overflow: inherit;
    align-items: center;
}

@media only screen and (max-width:480px) {
    .l-header_inner {
    padding-left: 2.4rem;
    padding-right: 2.4rem
  }
}

.l-header_menu .gnav_text {
  font-size: 1.2rem;
  letter-spacing: 0.1rem
}

.l-header .menu-container .gnav_title {
  cursor: pointer
}

@media screen and (min-width:1024px) {
  .l-header {
    width: 100%;
    height: 100px;
    position: relative;
    top: 0;
    z-index: 99;
    background: #fff;
      position: fixed;
	  border-bottom:3px solid #f9688f;
  }

  .l-header .cls-1 {
    fill: #000
  }
  .l-header a {
    font-size: 1.2rem;
    letter-spacing: 0.1rem;

  }


  .l-header_logo {
    width: 190px;
    /*height: 54px*/
  }

    .l-header_logo a{
        display: block;
    }

    .l-header_logo img{
    height: auto;
    max-width: unset;
    width: 100%;
    }

  .l-header_menu {
    width: calc(100% - 332px);
    width: -webkit-calc(100% - 332px)
  }
  .l-header_menu_contact {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end;
    width: 100%;
    height: 55px;
    margin-bottom: 0.8rem
  }
  .l-header_menu_contact_link {
    display: inline-block;
    color: #888;
    line-height: 55px
  }
  .l-header_menu_contact_link:hover {
    text-decoration: underline
  }
  .l-header_menu_contact .gnav_text {
    font-size: 1.6rem
  }
  .l-header_menu_contact_btn {
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
    display: inline-block;
    border-radius: 4px;
    width: 200px;
    text-align: center;
    font-size: 1.4rem;
    letter-spacing: 0.1rem;
    color: #fff;
    padding-top: 0.6rem;
    padding-bottom: 0.2rem;
    margin-left: 1.6rem
  }
  .l-header_menu_contact_btn .small {
    display: block;
    font-size: 1.4rem;
    margin-bottom: -0.3rem
  }
  .l-header_menu_contact_btn .fas {
    margin-right: 0.8rem
  }
  .l-header_menu_contact .btn_tel {
    background-color: #fb9602
  }
  .l-header_menu_contact .btn_tel:hover {
    background-color: #fa8804
  }
  .l-header_menu_contact .btn_web {
    background-color: #f9688f
  }
  .l-header_menu_contact .btn_web:hover {
    background-color: #fa507d
  }
  .l-header .menu-mobile {
    display: none
  }
  .l-header .menu-container .menu_area {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end
  }
  .l-header .menu-container .menu_area .contact_menu {
    display: none
  }
  .l-header .menu-container .menu_area_list {
    margin-left: 1.5rem;

  }
    .l-header .menu-container .menu_area_list span{
/*         border-right: 1px solid #f9688f; */
		text-align: center;
        padding-right: 1.5rem;
        display: block;
		font-weight:bold;
    }

  .l-header .menu-container .menu_area_list span.last{
    padding-right: 0;
    border-right: none;
  }

  .l-header .menu-container .menu_area_list:first-of-type {
    margin-left: 0
  }
  .l-header .menu-container .menu_area_list .megamenu_link {
	height: 83px;
    display: table-cell;
/*     display: block; */
    font-size: 1.6rem;
    padding-bottom: 1.1rem;
    padding-top: 1.2rem;
    vertical-align: middle;
    border-right: 1px solid #f9688f;
  }
  .l-header .menu-container .menu_area_list .megamenu_link:hover {
    opacity: 0.3
    
  }
  .l-header .menu-container .menu_area_list .megamenu_link img {
    vertical-align: text-top
  }
  .l-header .menu-container .menu .megamenu_tel {
    display: none
  }
  .l-header .menu-container .menu .megamenu:hover .megamenu_mark {
    position: relative
  }
  .l-header .menu-container .menu .megamenu:hover .megamenu_mark:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 15px;
    display: block;
    border-top: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 15px solid #fb9602;
    border-left: 10px solid transparent;
    margin: auto
  }
  .l-header .menu-container .menu>ul>li>ul.normal-sub {
/* width: 1030px; */
width: 1300px;
/*     left: auto; */
    margin: 0px auto;
    padding: 1.6rem 2.4rem
  }
  .l-header .menu-container .menu>ul>li>ul.normal-sub>li {
    width: 100%
  }
  .l-header .menu-container .menu>ul>li>ul.normal-sub>li a {
    display: block;
    font-size: 1.6rem
  }
  .l-header .menu-container .menu>ul>li>ul.normal-sub>li a:hover {
    background-color: #eee
  }
  .l-header .menu-container .menu .menu_icon {
    display: inline-block;
    position: relative;
    line-height: 24px;
    padding-top: 0.8rem;
    padding-left: 4.8rem;
    padding-bottom: 0.8rem
  }
  .l-header .menu-container .menu .menu_icon:before {
    content: "";
    position: absolute;
    left: 0.8rem;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 24px;
    height: 24px
  }
  .l-header .menu-container .menu .icon1:before {
    background-image: url(/assets/img/common/header/r_header_icon1.png)
  }
  .l-header .menu-container .menu .icon2:before {
    background-image: url(/assets/img/common/header/r_header_icon2.png)
  }
  .l-header .menu-container .menu .icon3:before {
    background-image: url(/assets/img/common/header/r_header_icon3.png)
  }
  .l-header .menu-container .menu .icon4:before {
    background-image: url(/assets/img/common/header/r_header_icon4.png)
  }
  .l-header .menu-container .menu .icon5:before {
    background-image: url(/assets/img/common/header/r_header_icon5.png)
  }
  .l-header .menu-container .menu .icon6:before {
    background-image: url(/assets/img/common/header/r_header_icon6.png)
  }
  .l-header .menu-container .menu .icon7:before {
    background-image: url(/assets/img/common/header/r_header_icon7.png)
  }
  .l-header .menu-container .menu .icon8:before {
    background-image: url(/assets/img/common/header/r_header_icon8.png)
  }
  .l-header .menu-container .menu .icon9:before {
    background-image: url(/assets/img/common/header/r_header_icon9.png)
  }
  .l-header .menu-container .menu .icon11:before {
    background-image: url(/assets/img/common/header/r_header_icon11.png)
  }
  .l-header .menu-container .menu .icon12:before {
    background-image: url(/assets/img/common/header/r_header_icon12.png)
  }
  .l-header .menu-container .menu .icon13:before {
    background-image: url(/assets/img/common/header/r_header_icon13.png)
  }
  .l-header .menu-container .menu .icon14:before {
    background-image: url(/assets/img/common/header/r_header_icon14.png)
  }
  .l-header .menu-container .menu .icon15:before {
    background-image: url(/assets/img/common/header/r_header_icon15.png)
  }
  .icon-new {
  	color: #ff0000 !important;
  	font-size: 13px !important;
  	border-right: none !important;
    padding-right: 10px !important;
    display: inline-block !important;
    font-weight: bold;
  }

  .l-header .menu-container .menu>ul>li>.wide_sub2 {
    width: 550px;
    left: 0;
    right: 0;
    padding: 1.6rem 2.4rem;
    margin: auto
  }
  .l-header .menu-container .menu>ul>li>.wide_sub2 li {
    display: inline-block;
    vertical-align: top;
    width: 48%;
    width: calc(480px / 2);
    width: -webkit-calc(480px / 2)
  }
  .l-header .menu-container .menu>ul>li>.wide_sub2 li a {
    display: block;
    font-size: 1.6rem
  }
  .l-header .menu-container .menu>ul>li>.wide_sub2 li a:hover {
    background-color: #eee
  }
  .l-header .menu-container .menu>ul>li>.wide_sub {
    width: 1030px;
    left: 0;
    right: 0;
    padding: 1.6rem 2.4rem;
    margin: auto;
  }
    .l-header .menu-container .menu>ul>li>.wide_sub a{width: 100%;}
    .l-header .menu-container .menu>ul>li>.wide_sub a:nth-child(1) li,
    .l-header .menu-container .menu>ul>li>.wide_sub a:nth-child(2) li{
        width: 230px;
        margin-right: 0.5rem;
    }

    .l-header .menu-container .menu>ul>li>.wide_sub a:nth-child(3) li{
        width: 320px;
    }

  .l-header .menu-container .menu>ul>li>.wide_sub li {
    display: inline-block;
    vertical-align: top;
   /* width: 33.3333%;
    width: calc(793px / 3);
    width: -webkit-calc(793px / 3)*/
  }
  .l-header .menu-container .menu>ul>li>.wide_sub li a {
    display: block;
    font-size: 1.6rem
  }
  .l-header .menu-container .menu>ul>li>.wide_sub li a:hover {
    background-color: #eee
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox {
    padding: 1rem 2rem 2rem;
    border: solid 2px #f9688f;
    background: rgba(254, 232, 238, .5);
    transition: 0.3s
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .pack3 .packprice {
  	color: #f9688f;
  	font-size: 25px;
  	text-align: center;
  	padding-right: 0px;
  	display: block !important;
  	border-right: none !important;
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .pack3 .packyen {
  	color: #f9688f;
	font-size: 15px;
  	padding-right: 0px;
  	display: inline-block !important;
  	border-right: none !important;
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .pack3 .pack-text {
  	font-size: 15px;
  	padding-right: 0px;
  	display: block;
/*  	display: inline-block !important;*/
  	border-right: none !important;
  }




  .l-header .menu-container .menu>ul>li>.wide_sub .packbox:hover {
    opacity: 0.5
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox_title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #f9688f;
    text-align: center;
    margin-bottom: 1rem
  }
 .l-header .menu-container .menu>ul>li>.wide_sub .pack-text {
	 text-align: center;
	 display: block !important;
 }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox_text {
    width: 50%;
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
    line-height: 2
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox_text .pack_link {
    display: block;
    font-weight: 700;
    font-size: 1.6rem
  }
  .l-header .menu-container .menu>ul>li>.wide_sub .packbox_text .pack_link:before {
    content: "●";
    color: #f9688f
  }
  .l-header .menu-container .menu>ul>li>ul {
    display: none;
    position: absolute;
    background-color: #fff;
    filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.3));
    z-index: 999
  }
}

@media screen and (max-width:1023px) {
  .l-header {
    position: fixed;
    width: 100%;
    background-color: #fff;
   /* padding-top: 0.8rem; */
    padding-bottom: 0.8rem;
    z-index: 99;
      height: 0;
      top: 0;
  }
    .l-header_inner{
        background: #fff;
    height: 58px;
        padding-top: 0;
    }
  .l-header_logo {
    width: 400px;
  }
    .l-header_logo a{
        display: block;
        width: 100%;
    }

    .l-header_logo img{
        width: 100%;
        max-width: unset;
    }

  .l-header a {
    font-size: 1.6rem;
    letter-spacing: 0.1rem
  }
  .l-header_menu_contact {
    display: none
  }
  .cls-1 {
    fill: #fff
  }
  .sp {
    display: none
  }

  .menu-mobile {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #f9688f;
    width: 64px;
    height: 58px
  }
  .menu-mobile:before {
    content: "\f0c9";
    position: absolute;
      top:0;
    left: 0;
    right: 0;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 2.4rem;
    padding: 0;
    color: #fff;
    width: 20px;
    height: 42px;
    margin: auto;
    z-index: 1000
  }

.menu-mobile:after {
    content: "menu";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    color: #fff;
    margin: auto;
    text-align: center;
}

  .menu_icon .menu-mobile:after {
    content: "\f00d"
  }
  .menu>ul>li>ul {
    display: none;
    background-color: #fff;
    z-index: 99
  }
  .menu_area {
    background-color: #ff85a5;
    padding: 6.4rem 0 4rem
  }
  .megamenu_link {
    display: block;
    color: #fff;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    margin-left: 2.4rem;
    margin-right: 2.4rem;
    border-bottom: solid 1px #fbb5c7
  }
  .megamenu .wide_sub, .megamenu .wide_sub2, .megamenu .normal-sub  {
    padding-left: 2.4rem;
    padding-right: 2.4rem;
    margin-top: -0.1rem
  }
  .megamenu .wide_sub li ul li a {
    display: block;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    border-bottom: solid 1px #eee
  }
  .megamenu .wide_sub li:last-of-type ul li a {
    border-bottom: none
  }
  .megamenu .normal-sub li a,
.megamenu .wide_sub2 li a,
.megamenu .wide_sub a li {
    display: block;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    border-bottom: solid 1px #eee
  }
  .megamenu .normal-sub li:last-of-type a,
    .megamenu .wide_sub2 li:last-of-type ul li a,
    .megamenu .wide_sub li:last-of-type ul li a{
    border-bottom: none
  }
.megamenu .normal-sub li a,
.megamenu .wide_sub2 li a,
    .megamenu .wide_sub a li p{
        font-size: 1.4rem;
    }



  .megamenu .packbox a {
    display: block;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    border-bottom: solid 1px #eee
  }
  .megamenu_tel {
    margin-left: 2.4rem;
    margin-right: 2.4rem
  }
  .megamenu_tel_button {
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
    display: block;
    text-align: center;
    font-size: 1.2rem;
    letter-spacing: 0.1rem;
    background-color: #fff;
    color: #ff85a5;
    border-radius: 8px;
    padding-top: 0.8rem;
    padding-bottom: 0.4rem
  }
  .megamenu_tel_button .small {
    display: block;
    font-size: 1rem;
    margin-bottom: -0.3rem
  }
  .megamenu_tel_button .fas {
    margin-right: 0.8rem
  }
  .menu_area_list:last-of-type .megamenu_link {
    border-bottom: none
  }
  .menu-dropdown-icon:before {
    content: "\f067";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: none;
    float: right;
    font-size: 1rem;
    cursor: pointer;
    color: #fff;
    line-height: 58px;
    padding-right: 3.2rem
  }
  .active:before {
    content: "\f068"
  }
  .menu-container {
    width: 100%
  }
  .menu-mobile {
    display: block
  }
  .menu-dropdown-icon:before {
    display: block
  }
  .menu>ul {
    position: absolute;
    top: 0;
    right: -320px;
    width: 320px;
    height: 100vh;
    overflow: scroll;
    transition: 0.5s;
    z-index: 999
  }
  .menu>ul>li {
    float: none;
    display: block
  }
  .menu>ul>li.normal-sub {
    width: 100%
  }
  .menu .show-on-mobile {
    padding-bottom: 100px;
    display: block;
    position: absolute;
    height: 100vh;
    overflow: scroll;
    top: 0;
    right: 0;
    width: 255px;
    z-index: 999;
    transition: 0.5s
  }
.scroll_off {
	overflow:hidden;
}

 html.fix,
body.fix    {
    position: fixed;
    /*z-index: -1;*/
    width: 100%;
    /*height: 100%;*/
    overflow: hidden;

    }

}
@media only screen and (min-width:320px) and (max-width:1023px){
	.iamge_of_work_ok {
		min-width: 100px;
		max-width: 117px;
		font-family: '游ゴシック' !important;
		text-align: center;
		margin-left: auto;
		margin-right: 60px;
		color: #637407;
		letter-spacing: 0px;
		font-size: clamp(12px, 3.5vw, 16px);
		font-weight: bold;
		display: block;
		padding: 5px;
		border-radius: 10px;
		border: 1px solid #dcde39;
		background-color: #fff45c;
	}
	.l-header_inner {
		padding-left: 10px !important;
	}
	.l-header_logo {
	  width: 400px !important;
	  margin-right: 10px;
	}
	.menu-container {
/*	  width: 10% !important*/
	}
}

@media only screen and (max-width:480px), only screen and (max-width:321px) {
  .menu_area {
    padding: 2rem 0 4rem 0
  }
}
@media only screen and (max-width:480px) {
  .icon-new {
  	color: #ff0000 !important;
  	font-size: 13px !important;
  	border-right: none !important;
    padding-right: 10px !important;
    display: inline-block !important;
    font-weight: bold;
  }
	
}