@charset "utf-8";
/* CSS Document */

/* ---------- cate1 ---------- */
.cate1 {
	flex-direction: column;
	gap: 60px;
}
.cate1 .box_wrap{
	flex-direction: column;
	gap: 60px;
	width: 100%;
}
.cate1 .box-item{
	width: 100%;
	flex-direction: column;
	gap: 30px;
	align-items: flex-start;
}
.cate1 .box-item .menubox_scroll{
	background-color: #fff;
	padding: 40px 70px;
	width: 100%;
	border-radius: 30px;
	flex-direction: column;
	align-items: flex-start;
	-webkit-overflow-scrolling: touch;
}
.cate1 .box-item .menubox_scroll .menu_box{
	gap :30px;
	width: 100%;
	border-bottom:  2px dotted #BCBCBC;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.cate1 .box-item .menubox_scroll .menu_box p,
.cate1 .box-item .menubox_scroll .menu_box h4{
	width: calc((100% - 60px)/3);
}
.cate1 .box-item .menubox_scroll .menu_box h4{
	color: #e6b6c3;
}
.cate1 .box-item .menubox_scroll .menu_box p span{
	border: #e6b6c3 2px solid;
	border-radius: 50px;
	padding: 2px 15px;
}
.cate1 .box-item .menubox_scroll2 .menu_box p,
.cate1 .box-item .menubox_scroll2 .menu_box h4{
	width: calc((100% - 90px)/4);
}
/* ---------- cate2 ---------- */
.cate2 .box_wrap{
	gap: 60px;
	width: 100%;
}
.cate2 .box_wrap .box-item{
	background-color: #fff;
	padding: 50px 70px;
	gap: 40px;
	width: 100%;
	border-radius: 30px;
}
.cate2 .box_wrap .box-item .imgbox{
	width: calc(30% - 20px);
}
.cate2 .box_wrap .box-item .txtbox{
	width: calc(70% - 20px);
}
.cate2 .box_wrap .box-item .imgbox img{
	border-radius: 20px;
}
.cate2 .box_wrap .box-item .txtbox .topbox{
	gap: 5px;
	padding-bottom: 20px;
	border-bottom:  2px dotted #BCBCBC;
	margin-bottom: 20px;
	justify-content: flex-start;
}
.cate2 .box_wrap .box-item .txtbox .topbox .icon{
	width: 25px;
}


body.on .cate3 .bg_img_wrap2{
	padding: 100px 70px;
	border-radius: 30px;
	position: relative;
    overflow: hidden;
}
body.on .cate3 .bg_img_wrap2::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    pointer-events: none;
    z-index: 1;
}
.cate3 .bg_img_wrap2{
	padding: 100px 70px;
	border-radius: 30px;
}
.cate3 .bg_img_wrap2 .titlebox{
	flex-direction: column;
	margin-bottom: 60px;
}
.cate3 .bg_img_wrap2 .titlebox,
.cate3 .bg_img_wrap2 > p {
    position: relative;
    z-index: 2;
}
.cate3 .dog_item_wrap {
    width: fit-content;
    margin-left: auto;
    padding-right: 230px;
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
    .cate1 .box-item .menubox_scroll {
        overflow-x: auto;
        overflow-y: hidden;
        display: block;
    }

    .cate1 .box-item .menubox_scroll .menu_box {
        display: flex;
        flex-wrap: nowrap;
        min-width: 1000px;
        gap: 30px;
    }

    .cate1 .box-item .menubox_scroll .menu_box p,
    .cate1 .box-item .menubox_scroll .menu_box h4 {
        width: calc((100% - 60px) / 3);
        flex: 0 0 calc((100% - 60px) / 3);
    }
    .cate1 .box-item .menubox_scroll2 .menu_box p,
    .cate1 .box-item .menubox_scroll2 .menu_box h4 {
        width: calc((100% - 90px) / 4);
        flex: 0 0 calc((100% - 90px) / 4);
    }
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
	.cate2 .box_wrap .box-item {
		flex-direction: column;
	}
	.cate2 .box_wrap .box-item .imgbox {
		width: 60%;
	}
	.cate2 .box_wrap .box-item .txtbox {
		width: 100%;
	}
	.cate3 .dog_item_wrap {
		padding-right: 90px;
	}
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
     .cate1 .box-item .menubox_scroll {
         padding: 30px 40px;
    }
	.cate2 .box_wrap .box-item .imgbox {
		width: 90%;
	}
	.cate2 .box_wrap .box-item .imgbox img {
		border-radius: 10px;
	}
	.cate2 .box_wrap .box-item {
		padding: 40px 30px;
	}
	body.on .cate3 .bg_img_wrap2 {
		padding: 80px 40px;
		border-radius: 20px;
	}
	.cate3 .bg_img_wrap2 .titlebox {
		margin-bottom: 40px;
	}
	.cate1 .box-item .menubox_scroll {
        border-radius: 20px;
    }
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
    .en_title2{
        font-size: 22px;
    }
     .cate1 .box-item .menubox_scroll {
        padding: 30px 20px;
    }
    .cate1 .box-item .menubox_scroll .menu_box {
        min-width: 900px;
        gap: 30px;
    }
	.cate1 .box-item .menubox_scroll .menu_box {
		padding-bottom: 15px;
		margin-bottom: 15px;
	}
	.cate1 .box-item .menubox_scroll {
        border-radius: 10px;
    }
	.cate2 .box_wrap .box-item {
		padding: 30px 20px;
		border-radius: 10px;
	}
	.cate2 .box_wrap .box-item .txtbox .topbox {
		padding-bottom: 15px;
		margin-bottom: 15px;
	}
	.cate2 .box_wrap {
		gap: 30px;
	}
	body.on .cate3 .bg_img_wrap2 {
		padding: 50px 20px;
		border-radius: 10px;
	}
	.cate3 .dog_item_wrap {
		padding-right: 40px;
	}
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}

