/*-----------------------------------------------*/
/*-------------------- color --------------------*/
/*-----------------------------------------------*/
:root {
	/* Brand Colors */
	--primary: #C50018;
	--sub-red-01: #F6D8DB;
	--sub-red-02: #FBF1F2;

	/* Dark & Premium Colors */
	--premium-black: #32373E;
	--premium-gray: #6B6F75;

	/* Neutral Colors */
	--neutral-gray-01: #B5B7BA;
	--neutral-gray-02: #CCCFD1;
	--neutral-gray-03: #DFE2E5;

	/* Base Colors */
	--gray: #F0F1F4;
	--white: #ffffff;
	--black: #000000;
	--link-blue: #0356CB;
}



/*------------------------------------------------*/
/*-------------------- fonts --------------------*/
/*------------------------------------------------*/
.jost {
	font-family: "Jost", sans-serif;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
}

.ship-b1 {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 800;
	font-style: normal;
}

.ibm-medium {
	font-family: "IBM Plex Sans JP", sans-serif;
	font-weight: 500;
	font-style: normal;
}

.ibm-semibold {
	font-family: "IBM Plex Sans JP", sans-serif;
	font-weight: 600;
	font-style: normal;
}




/*------------------------------------------------*/
/*-------------------- common --------------------*/
/*------------------------------------------------*/
html,
body {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	font-size: 16px;
	font-family: "IBM Plex Sans JP", sans-serif;
	font-weight: 500;
	font-style: normal;
	line-height: 1.5;
	color: var(--premium-black);
	box-sizing: border-box;
	background-color: var(--gray);
}

body * {
	box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Shippori Mincho B1", serif;
	font-weight: 800;
	font-style: normal;
	margin: 0;
}

p {
	margin-top: 0;
}

p:last-child {
	margin: 0;
}

a {
	font-size: 14px;
	color: var(--link-blue);
	text-decoration: none;
	transition: all 0.3s ease;
}

a:hover {
	text-decoration: none;
	/* opacity: 0.7; */
}

img {
	vertical-align: bottom;
	max-width: 100%;
}

ul {
	margin: 0;
	padding: 0;

	li {
		list-style: none
	}
}

input,
textarea {
	box-sizing: border-box;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

select,
button {
	border: none;
	border-radius: 0;
	cursor: pointer;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}


/*------------------------------------------------*/
/*-------------------- header --------------------*/
/*------------------------------------------------*/
header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
	background-color: var(--white);
    transition:0.3s;
    z-index:5000;

    &.header_top{
        /* transform:translateY(-100px); */
        z-index:1000;
    
        &.active{
            /* transform:translateY(0); */
            /* animation:header_top 1.2s ease-out forwards; */
        }
    }
    /* @keyframes header_top{
        0%{
            transform:translateY(-100px);
        }
        100%{
            transform:translateY(0);
        }
    } */
    &.hide{
        transform:translateY(-100px) !important;
    }
}

.header_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 40px 10px 30px;
	/* max-width: 1440px; */
	margin: 0 auto;
}
.header_title{
	display:flex;
	align-items:center;
	gap:2px;

	img{
		width:224px;
	}
	p{
		font-family:"Shippori Mincho B1", serif;
		font-size:16px;
		line-height:24px;
	}
}
.header_link{
    display:flex;
    align-items:center;
    gap:48px;
}
.header_link_nav{
    display:flex;
    align-items:center;
    gap:32px;

    a{
        font-family:"IBM Plex Sans JP", sans-serif;
        font-weight:600;
        font-size:16px;
        line-height:24px;
        color:#32373e;

        &:hover{
            text-decoration:underline;
        }
    }
}
.header_hamburger{
	position:relative;
	width:56px;
	height:56px;
    background-color:#c50018;
    border:1px solid #cccfd1;
    border-radius:4px;
	cursor:pointer;
	z-index:100;

	span{
		position:absolute;
		left:50%;
        transform:translateX(-50%);
		width:24px;
		height:2px;
        background-color:#ffffff;
        transition:0.3s;

		&.top{
			top:21px;
		}
		&.middle_top{
            top:27px;
        }
        &.middle_bottom{
            top:27px;
		}
		&.bottom{
			top:33px;
		}
	}
}
.header_nav{
	display:block;
	position:fixed;
	top:100px;
	left:0;
	bottom:0;
	width:100%;
	background:rgba(0, 0, 0, 0.6);
	opacity:0;
	visibility:hidden;
	transition:0.3s;
	z-index:90;
}
.header_nav_area{
    position:absolute;
    top:0;
    right:0;
    width:420px;
    height:100%;
    padding:53px 40px 56px;
    background-color:#ffffff;
    overflow:auto;
}
.header_nav_list{
    display:grid;
    gap:45px;

    .box{
        border-bottom:1px solid #c6c9cc;
    }
}
.header_nav_toggle{
    display:flex;
    align-items:center;
    gap:12px;
    position:relative;
    padding:0 0 14px 12px;
    background:url('../images/common/red_circle_white_plus.png') top 5px right / 20px no-repeat;
    cursor:pointer;

    &.active{
        background:url('../images/common/red_circle_white_minus.png') top 5px right / 20px no-repeat;
    }
    &:before{
        content:'';
        position:absolute;
        top:3px;
        left:0;
        width:3px;
        height:20px;
        background-color:#c50018;
    }
    .ja{
        margin:0;
        font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:20px;
		line-height:30px;
    }
    .en{
        margin:0;
        font-family:"Jost", sans-serif;
		font-weight:600;
		font-size:14px;
        color:#b5b7ba;
    }
}
.header_nav_link{
    display:none;
    
    &.active{
        display:block;
    }
    a{
        display:flex;
        align-items:center;
        gap:12px;
        padding:22px 0;
        font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:16px;
        line-height:24px;
        color:#32373e;
        background:url('../images/common/red_arrow_right.png') center right / 20px no-repeat;
        border-top:1px solid #c6c9cc;

        img{
            width:64px;
        }
    }
}
.header_nav_container{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
    margin-top:48px;

    a{
        display:flex;
        align-items:center;
        gap:8px;
        height:66px;
        padding:0 16px 0 12px;
        font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:14px;
        line-height:20px;
        text-align:center;
        color:#32373e;
        border:1px solid #c6c9cc;
        border-radius:4px;

        &.sm{
            font-size:12px;
            line-height:15px;
        }
        img{
            width:28px;
        }
    }
}

body.nav_open{
	overflow:hidden;

    .header_top{
        z-index:5000;
    }
	.header_hamburger{
		.top{
			opacity:0;
		}
		.middle_top{
			transform:translateX(-50%) rotate(30deg);
        }
        .middle_bottom{
            transform:translateX(-50%) rotate(-30deg);
        }
		.bottom{
			opacity:0;
		}
	}
	.header_nav{
		opacity:1;
		visibility:visible;
	}
}

/*---------- hamburger-animation ----------*/
/* @keyframes nav_open_top{
	0%{
		top:0;
		transform:rotate(0deg);
	}
	50%{
		top:50%;
		transform:rotate(0deg);
	}
	100%{
		top:50%;
		transform:rotate(30deg);
	}
}
@keyframes nav_open_middle{
	0%{
		opacity:1;
	}
	50%{
		opacity:0;
	}
	100%{
		opacity:0;
	}
}
@keyframes nav_open_bottom{
	0%{
		top:100%;
		transform:rotate(0deg);
	}
	50%{
		top:50%;
		transform:rotate(0deg);
	}
	100%{
		top:50%;
		transform:rotate(-30deg);
	}
}
@keyframes nav_close_top{
	0%{
		top:50%;
		transform:rotate(30deg);
	}
	50%{
		top:50%;
		transform:rotate(0deg);
	}
	100%{
		top:0;
		transform:rotate(0deg);
	}
}
@keyframes nav_close_middle{
	0%{
		opacity:0;
	}
	50%{
		opacity:0;
	}
	100%{
		opacity:1;
	}
}
@keyframes nav_close_bottom{
	0%{
		top:50%;
		transform:rotate(-30deg);
	}
	50%{
		top:50%;
		transform:rotate(0deg);
	}
	100%{
		top:100%;
		transform:rotate(0deg);
	}
} */


/*------------------------------------------------*/
/*-------------------- footer --------------------*/
/*------------------------------------------------*/
#footer{
    padding-top:96px;
	padding-bottom:116px;
    color:var(--white);
	background-color:var(--premium-black);

    &.footer_top{
        padding-bottom:212px;
    }
    &.footer_sale{
        padding-bottom:212px;
    }
    &.footer_buy{
        padding-bottom:212px;
    }
    &.footer_market{
        padding-bottom:212px;
    }
}

#footer .footer-container {
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 48px;
}

#footer .footer-left {
	max-width: 30%;
}

#footer .f-logo {
	margin-bottom: 4px;
	max-width: 320px;
	display: block;
}

#footer .f-title {
	font-size: 24px;
	text-align: center;
	line-height: 1;
	margin-bottom: 98px;
}

#footer .copyright {
	font-size: 12px;
	line-height: 18px;
	color: var(--neutral-gray-02);
}

#footer .footer-right {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 24px;
}

#footer .footer-right .footer-col {
	flex: 1;
}

#footer .footer-right .footer-col h3 {
	font-size: 1rem;
	font-weight: 600;
	font-family: "IBM Plex Sans JP", sans-serif;
	margin-bottom: 14px;
}

/* task142 S8: the three category headings with a page of their own became links.
   The heading is white on the black footer and must stay that way -- a bare <a>
   picks up the UA blue and reads as a broken style, which is what shipped on
   2026-08-20 before this rule. inherit keeps the h3's own colour whether the
   heading is an anchor or plain text (その他 has no destination and stays text). */
#footer .footer-right .footer-col h3 a {
	color: inherit;
	text-decoration: none;
	/* the global a{font-size:14px} also overrode the h3's 1rem, which scales
	   with the root -- the heading rendered 14px at every width instead of
	   11.95/28.67/16 at 320/768/1440. */
	font-size: inherit;
}

#footer .footer-right .footer-col ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#footer .footer-right .footer-col ul li {
	margin-bottom: 14px;
	font-size: 1rem;
	line-height: 24px;
}

#footer .footer-right .footer-col ul li a {
	display: block;
	color: var(--neutral-gray-02);
}

/*---------- breadcrumb ----------*/
.breadcrumb_list{
    display:flex;
    align-items:center;
    gap:8px;
	max-width:1280px;
    margin:0 auto 92px;
    padding:0 40px;
    box-sizing:content-box;
    
    a{
        position:relative;
        margin-right:16px;
        font-size:14px;
        text-decoration:underline;
        color:#0356cb;

        &:hover{
            opacity:0.7;
        }
        &:after{
            content:'';
            position:absolute;
            top:50%;
            right:-15px;
            transform:translateY(-50%) rotate(45deg);
            width:4px;
            height:4px;
            border-top:1px solid #32373e;
            border-right:1px solid #32373e;
        }
    }
    span{
        font-size:14px;
        color:#32373e;
    }
}

/*---------- more ----------*/
.more_link{
	display:block;
	width:100%;
	max-width:374px;
	margin:0 auto;
	padding:22px 44px 18px;
	font-family:"IBM Plex Sans JP", sans-serif;
	font-weight:600;
	font-size:16px;
	line-height:24px;
	text-align:center;
	color:#32373e;
	background:url('../images/common/red_circle_white_arrow.png') center right 20px / 24px no-repeat;
	background-color:#ffffff;
	outline:1px solid #cccfd1;
	border-radius:32px;
	transition:0.3s;

	&:hover{
        color:#c50018;
        outline-color:#c50018;
    }
}

/*---------- common-page ----------*/
.common_search_page{
    padding:140px 0 104px;
    background-color:#f0f1f4;
}
.common_search_wrap{
    max-width:1280px;
    margin:0 auto;
    padding:0 40px;
    box-sizing:content-box;
}

.common_page{
	padding:137px 0 144px;
	background-color:#f0f1f4;
}

.common_title{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:4px;
	position:relative;
	margin-bottom:64px;
	padding:32px 0;
	border-top:7px solid #c50018;
	border-bottom:7px solid #c50018;

	&:before{
		content:'';
		position:absolute;
		top:-5px;
		left:0;
		width:100%;
		height:4px;
		background-color:#f0f1f4;
	}
	&:after{
		content:'';
		position:absolute;
		bottom:-5px;
		left:0;
		width:100%;
		height:4px;
		background-color:#f0f1f4;
	}
	p{
		margin:0;
		font-family:"Shippori Mincho B1", serif;
		font-weight:700;
		font-size:18px;
		line-height:26px;
		letter-spacing:-0.36px;
		color:#6b6f75;
	}
	h1{
		font-family:"Shippori Mincho B1", serif;
		font-weight:700;
		font-size:32px;
		line-height:46px;
		letter-spacing:-0.64px;
	}
}

.common_partition{
	display:flex;
	justify-content:center;
	position:relative;
	padding:28px 0 25px;
	border-top:1px solid #cccfd1;
	border-bottom:1px solid #cccfd1;

	h2{
		font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:22px;
		line-height:33px;
        text-align:center;

		span{
			color:#c50018;
		}
	}
	.balloon{
		position:absolute;
		top:-26px;
		padding:5px 14px 1px;
		font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:20px;
		line-height:26px;
		text-align:center;
		color:#ffffff;
		background-color:#c50018;
		border-radius:18px;

		&:before{
			content:'';
			position:absolute;
			bottom:-10px;
			left:50%;
			transform:translateX(-50%);
			border-right:5px solid transparent;
			border-left:5px solid transparent;
			border-top:10px solid #c50018;
		}
	}
}

/*---------- お客様の声 ----------*/
.common_voice_area{
	padding-top:124px
}
.common_voice_wrap{
	max-width:1120px;
	margin:0 auto;
    padding:0 20px;
    box-sizing:content-box;

	.text{
		max-width:800px;
		margin:48px auto 0;

		p{
			font-family:"IBM Plex Sans JP", sans-serif;
			font-weight:500;
			font-size:16px;
			line-height:28px;
		}
	}
	.container{
        display:grid;
        grid-template-columns:repeat(2, 1fr);
        gap:20px;
		margin:48px 0;
        
        .box{
            display:grid;
            grid-template-columns:1fr 117px;
            padding:29px 24px 21px;
            background-color:#ffffff;
            border:1px solid #cccfd1;
            border-radius:4px;
            transition:0.3s;

            &:hover{
                border-color:#c50018;
                opacity:0.7;

                .right{
                    .img{
                        img{
                            transform:scale(1.1);
                        }
                    }
                }
            }
            .left{
                .head{
                    display:flex;
                    align-items:center;
                    gap:16px;
                    margin-bottom:13px;

                    .voice{
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:500;
                        font-size:14px;
                        line-height:20px;
                        color:#c50018;
                    }
                    .user{
                        padding-left:12px;
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:500;
                        font-size:14px;
                        line-height:20px;
                        color:#6b6f75;
                        background:url('../images/top/customer_icon.svg') center left 0 / 8px no-repeat;
                    }
                }
                h3{
                    margin-bottom:21px;
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:20px;
                    line-height:30px;
                    color:#32373e;
                }
                p{
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:14px;
                    line-height:20px;
                    color:#6b6f75;
                }
            }
            .right{
                .img{
                    margin-bottom:23px;
                    overflow:hidden;

                    img{
                        width:100%;
                        transition:0.3s;
                    }
                }
                p{
                    padding-right:24px;
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:16px;
                    line-height:24px;
                    text-align:right;
                    color:#32373e;
                    background:url('../images/common/red_circle_white_arrow.png') center right 0 / 20px no-repeat;
                }
            }
        }
    }
}

/*---------- お客様の声 > toggle ----------*/
.common_toggle_tab{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:4px;
    margin-bottom:32px;

    button{
        display:flex;
        justify-content:center;
        padding:0 0 9px;
        font-family:"IBM Plex Sans JP", sans-serif;
        font-weight:600;
        font-size:20px;
        line-height:30px;
        background:none;
        border-bottom:4px solid #32373e;

        span{
            padding:0 28px;
        }

        &.active{
            color:#c50018;
            border-color:#c50018;

            span{
                background:url('../images/common/red_arrow_bottom.png') center right 0 / 20px no-repeat;
            }
        }
    }
}
.common_toggle_area{
    margin-bottom:40px;
}
.common_toggle_box{
    display:none;

    &.active{
        display:block;
    }
    .container{
        display:grid;
        grid-template-columns:repeat(2, 1fr);
        gap:20px;
        
        .box{
            display:grid;
            grid-template-columns:1fr 117px;
            padding:29px 24px 21px;
            background-color:#ffffff;
            border:1px solid #cccfd1;
            border-radius:4px;
            transition:0.3s;

            &:hover{
                border-color:#c50018;
                opacity:0.7;

                .right{
                    .img{
                        img{
                            transform:scale(1.1);
                        }
                    }
                }
            }
            .left{
                .head{
                    display:flex;
                    align-items:center;
                    gap:16px;
                    margin-bottom:13px;

                    .voice{
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:500;
                        font-size:14px;
                        line-height:20px;
                        color:#c50018;
                    }
                    .user{
                        padding-left:12px;
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:500;
                        font-size:14px;
                        line-height:20px;
                        color:#6b6f75;
                        background:url('../images/top/customer_icon.svg') center left 0 / 8px no-repeat;
                    }
                }
                h3{
                    margin-bottom:21px;
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:20px;
                    line-height:30px;
                    color:#32373e;
                }
                p{
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:14px;
                    line-height:20px;
                    color:#6b6f75;
                }
            }
            .right{
                .img{
                    margin-bottom:23px;
                    overflow:hidden;

                    img{
                        width:100%;
                        transition:0.3s;
                    }
                }
                p{
                    padding-right:24px;
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:16px;
                    line-height:24px;
                    text-align:right;
                    color:#32373e;
                    background:url('../images/common/red_circle_white_arrow.png') center right 0 / 20px no-repeat;
                }
            }
        }
    }
}

/*---------- 比較内容 ----------*/
.compare_area{
    position:relative;
    margin-top:56px;
}
.compare_headline{
    display:grid;
    grid-template-columns:1fr 200px 200px;
    position:sticky;
    top:0;
    margin-bottom:20px;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    overflow:hidden;

    > div{
        padding:17px 0 15px;
        font-family:"IBM Plex Sans JP", sans-serif;
        font-weight:600;
        font-size:16px;
        line-height:18px;
        color:#ffffff;
    }
    .black{
        padding-left:24px;
        background-color:#32373e;
        border-right:1px solid #ffffff;
    }
    .gray{
        text-align:center;
        background-color:#646974;
        border-right:1px solid #ffffff;
    }
    .red{
        text-align:center;
        background-color:#c50018;
    }
}
.compare_container{
    display:grid;
    gap:24px;

    .box{
        border:1px solid #cccfd1;
        background-color: #fff;

        .top{
            display:grid;
            grid-template-columns:1fr 200px 200px;
            border-bottom:1px solid #cccfd1;

            > div{
                padding:24px 0 16px;
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:600;
                font-size:20px;
                line-height:21px;
            }
            .black{
                padding-left:24px;
                font-size:16px;
                line-height:24px;
                background:rgba(50, 55, 62, 0.05);
                border-right:1px solid #cccfd1;
            }
            .gray{
                text-align:center;
                background:rgba(102, 122, 167, 0.05);
                border-right:1px solid #cccfd1;
            }
            .green{
                text-align:center;
                color:#323e34;
                background:rgba(102, 167, 107, 0.05);
                border-right:1px solid #cccfd1;
            }
            .red{
                text-align:center;
                color:#c50018;
                background:rgba(197, 0, 24, 0.05);
            }
        }
        .center{
            padding:10px 0 7px;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:16px;
            line-height:24px;
            text-align:center;
            background-color:#ffffff;
        }
        .bottom{
            padding:24px 24px 16px;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:500;
            font-size:16px;
            line-height:24px;
            background-color:#ffffff;
            border-top:1px solid #cccfd1;
        }
    }
}

/*---------- 新着物件一覧 ----------*/
.common_arrival_headline{
	display:flex;
	justify-content:center;
	align-items:center;
	max-width:1120px;
	margin:0 auto 48px;
	padding:32px 0;
	border-top:1px solid #cccfd1;
	border-bottom:1px solid #cccfd1;

	h2{
		font-family:"IBM Plex Sans JP", sans-serif;
		font-weight:600;
		font-size:22px;
		line-height:33px;
		color:#ffffff;
	}
}
.common_arrival_slider{
	margin:0 !important;

	.slick-list{
		overflow:visible;
	}
	.slide_arrow{
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		width:80px;
		height:64px;
		background-color:#32373e;
		cursor:pointer;
		z-index:100;
	}
	.prev_arrow{
		left:-40px;
		background:url('../images/common/slider_prev.png') center / cover no-repeat;
	}
	.next_arrow{
		right:-40px;
		background:url('../images/common/slider_next.png') center / cover no-repeat;
	}
	.slick-dots{
		display:flex;
		justify-content:center;
		gap:20px;
		position:static;
		margin-top:32px;
		
		li{
			width:auto;
			height:auto;
			margin:0;

			button{
				width:8px;
				height:8px;
				background-color:#ffffff;
				border-radius:50%;
				opacity:0.35;

				&:before{
					content:none;
				}
			}
			&.slick-active{
				button{
					opacity:1;
				}
			}
		}
	}
}
.common_arrival_box{
	margin:0 10px;
	padding:0 25px 28px;
	background-color:#ffffff;
	border:1px solid #cccfd1;
	border-radius:4px;
	transition:0.3s;

	&:hover{
		border-color:#c50018;
		opacity:0.7;

		.img{
			img{
				transform:scale(1.1);
			}
		}
	}
	.logo{
		display:flex;
		justify-content:center;

		img{
			width:140px;
		}
	}
	.img{
		margin-bottom:20px;
		border-radius:4px;
		overflow:hidden;

		img{
			width:100%;
			transition:0.3s;
		}
	}
	.detail{
		h3{
			margin-bottom:8px;
			padding-bottom:12px;
			font-family:"Shippori Mincho B1", serif;
			font-weight:700;
			font-size:20px;
			line-height:30px;
			letter-spacing:-0.6px;
			color:#32373e;
			background:url('../images/common/red_arrow_right.png') top 4px right 0 / 24px no-repeat;
			border-bottom:1px solid #cccfd1;
		}
		.price_main{
			display:flex;
			align-items:baseline;
			gap:4px;
			margin-bottom:1px;
			font-family:"IBM Plex Sans JP", sans-serif;
			font-weight:600;
			font-size:16px;
			line-height:24px;
			color:#32373e;

			span{
				font-size:24px;
				line-height:36px;
				color:#c50018;
			}
		}
		.price_sub{
			display:flex;
			gap:16px;
			margin-bottom:12px;

			/* task192 (CB 2026-08-26): 建物価格 shows to the LEFT of 土地価格 on /buy/
			   and the 4,593 /market/ pages -- the same order task179 gave TOP, whose
			   card is .arrival_box and whose copy of this rule lives in top.css. Swapped
			   here and not in the markup for the same reason as task179: market-area.js
			   fills these two <dl>s by position (rows[0]=土地, rows[1]=建物) and feeds
			   every page from one script, so flipping the markup would put the land
			   figure under the 建物価格 label. Each <dl> carries its own <dt>, so label
			   and amount move together. The fluid (<=1439px) and SP (<=768px) blocks
			   below never re-declare order, so this single rule holds at all widths. */
			dl:nth-child(2){
				order:-1;
			}

			dl{
				display:flex;
				align-items:center;
				gap:17px;
				margin:0;

				dt{
					position:relative;
					font-family:"IBM Plex Sans JP", sans-serif;
					font-weight:600;
					font-size:14px;
					line-height:20px;
					color:#32373e;

					&:before{
						content:'';
						position:absolute;
						top:50%;
						right:-8px;
						transform:translateY(-50%);
						width:1px;
						height:14px;
						background-color:#cccfd1;
					}
				}
				dd{
					margin:0;
					font-family:"IBM Plex Sans JP", sans-serif;
					font-weight:500;
					font-size:14px;
					line-height:20px;
					color:#32373e;
				}
			}
		}
		ul{
			display:flex;
			flex-wrap:wrap;
			gap:8px;

			li{
				padding:3px 12px 2px;
				font-family:"IBM Plex Sans JP", sans-serif;
				font-weight:500;
				font-size:14px;
				line-height:20px;
				color:#32373e;
				border:1px solid #cccfd1;
				border-radius:16px;
			}
		}
	}
}

/*---------- エリアから探す > 日本地図 ----------*/
.common_search_map{
	display:grid;
	grid-template-columns:40.625% 53.75%;
	align-items:center;
	gap:56px;
	margin-bottom:72px;

	.map{
		position:relative;
		padding:0 0 14px 16px;

		img{
			opacity:0.5;
		}
		a{
			position:absolute;
			padding:7px 16px 5px 36px;
			font-family:"IBM Plex Sans JP", sans-serif;
			font-weight:600;
			font-size:16px;
			line-height:28px;
			color:#32373e;
			background:url('../images/common/red_circle_white_arrow.png') center left 12px / 16px no-repeat;
			background-color:#ffffff;
			outline:1px solid #646974;
			border:1px solid #646974;
			border-radius:24px;
			transition:0.3s;

			&:hover{
				color:#c50018;
				border-color:#c50018;
			}
			&.link1{
				top:13%;
				left:39%;
			}
			&.link2{
				top:59%;
				left:75%;
			}
			&.link3{
				top:29%;
				left:37%;
			}
			&.link4{
				top:74%;
				left:64%;
			}
			&.link5{
				top:43%;
				left:35%;
			}
			&.link6{
				top:54%;
				left:16%;
			}
			&.link7{
				top:80%;
				left:36%;
			}
			&.link8{
				bottom:0;
				left:21%
			}
		}
	}
	.container{
		display:flex;
		gap:32px;

		.column{
			display:grid;
			gap:42px;

			.box{
				.pref{
					margin-bottom:9px;
					padding-bottom:7px;
					border-bottom:1px solid #6b6f75;

					a{
						padding-left:32px;
						font-family:"IBM Plex Sans JP", sans-serif;
						font-weight:500;
						font-size:18px;
						line-height:28px;
						color:#ffffff;
						background:url('../images/common/red_circle_white_arrow.png') center left 0 / 20px no-repeat;
					}
				}
				ul{
					display:flex;
					gap:16px;

					li{
						position:relative;

						&:not(:last-child){
							&:before{
								content:'';
								position:absolute;
								top:50%;
								right:-8.5px;
								transform:translateY(-50%);
								width:1px;
								height:12px;
								background-color:#ffffff;
								opacity:0.3;
							}
						}
						a{
							font-family:"IBM Plex Sans JP", sans-serif;
							font-weight:500;
							font-size:14px;
							line-height:24px;
							text-decoration:underline;
							color:#ffffff;
							transition:0.3s;

							&:hover{
								opacity:0.7;
							}
						}
					}
				}
			}
		}
	}
}

/*---------- modal ----------*/
.modal_area{
    display:block;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.75);
    opacity:0;
    visibility:hidden;
    transition:0.3s;
    z-index:5000;

    &.active{
        opacity:1;
        visibility:visible;
    }
}
.modal_window{
    position:relative;
    height:100%;
    padding:14.667vw 4.267vw 13.867vw;
    background-color:#ffffff;
    overflow:auto;
}
.modal_close{
    position:absolute;
    top:5.333vw;
    right:5.067vw;
    width:4.8vw;
    cursor:pointer;

    img{
        width:100%;
    }
}
.modal_header{
    display:flex;
    align-items:center;
    gap:2.133vw;
    margin-bottom:8.533vw;
    font-family:"IBM Plex Sans JP", sans-serif;
    font-weight:600;
    font-size:5.333vw;
    line-height:8.533vw;

    img{
        width:6.4vw;
    }
}

/*---------- modal > エリアから探す ----------*/
.modal_search_area{
    display:grid;
    gap:6.667vw;

    .pref{
        margin-bottom:2.4vw;
        padding-bottom:1.867vw;
        border-bottom:0.267vw solid #cccfd1;

        a{
            padding-left:6.4vw;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:500;
            font-size:4.267vw;
            line-height:7.467vw;
            color:#32373e;
            background:url('../images/common/red_circle_white_arrow.png') center left 0 / 4.267vw no-repeat;
        }
    }
    ul{
        display:flex;
        flex-wrap:wrap;
        gap:2.4vw 4.533vw;

        li{
            position:relative;

            &:not(:last-child){
                &:before{
                    content:'';
                    position:absolute;
                    top:50%;
                    right:-2.267vw;
                    transform:translateY(-50%);
                    width:0.267vw;
                    height:3.733vw;
                    background-color:#cccfd1;
                    opacity:0.3;
                }
            }
            a{
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:500;
                font-size:3.733vw;
                line-height:6.4vw;
                color:#0356cb;
                text-decoration:underline;
                transition:0.3s;

                &:hover{
                    opacity:0.7;
                }
            }
        }
    }
}

/*---------- modal > メーカーから探す ----------*/
.modal_search_maker{
    ul{
        display:grid;
        grid-template-columns:repeat(2, 1fr);
        gap:4.267vw 2.933vw;

        li{
            height:14.4vw;
            padding:1.333vw 0;
            background-color:#ffffff;
            border:0.267vw solid #cccfd1;
            border-radius:16vw;

            img{
                width:100%;
                height:100%;
                object-fit:contain;
            }
        }
    }
}

/*---------- modal > 動画 ----------*/
.modal_video{
    display:flex;
    justify-content:center;
    align-items:center;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.75);
    opacity:0;
    visibility:hidden;
    transition:0.3s;
    z-index:5000;

    &.active{
        opacity:1;
        visibility:visible;
    }
}
.modal_video_window{
    position:relative;
    margin:0 auto;

    iframe{
        width:962px;
        height:540px;
    }
}
.modal_video_close{
    position:absolute;
    top:-40px;
    right:0;
    width:24px;
    cursor:pointer;

    img{
        width:100%;
    }
}

/*---------- スクロール中は固定ナビゲーションを非表示にする処理 ----------*/
.fixed_scroll_view{
    opacity:1;
    visibility:visible;
    transition:0.3s;
    
    &.hide{
        opacity:0;
        visibility:hidden;
    }
}

/*---------- responsive ----------*/
@media(min-width:769px) {
	.sp {
		display: none !important;
	}
}





/*-------------------- pc-spの間 --------------------*/
/*---------- base > width:1440px ----------*/
@media(max-width:1439px) and (min-width:769px){
    /*------------------------------------------------*/
    /*-------------------- header --------------------*/
    /*------------------------------------------------*/
    header{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        background-color: var(--white);
        transition:0.3s;
        z-index:5000;
    
        &.header_top{
            /* transform:translateY(-6.944vw); */
            z-index:1000;
        
            &.active{
                /* transform:translateY(0); */
                /* animation:header_top 1.2s ease-out forwards; */
            }
        }
        /* @keyframes header_top{
            0%{
                transform:translateY(-6.944vw);
            }
            100%{
                transform:translateY(0);
            }
        } */
        &.hide{
            transform:translateY(-6.944vw) !important;
        }
    }
    
    .header_wrap {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.694vw 2.778vw 0.694vw 2.083vw;
        /* max-width: 100vw; */
        margin: 0 auto;
    }
    .header_title{
        display:flex;
        align-items:center;
        gap:0.139vw;
    
        img{
            width:15.556vw;
        }
        p{
            font-family:"Shippori Mincho B1", serif;
            font-size:1.111vw;
            line-height:1.667vw;
        }
    }
    .header_link{
        display:flex;
        align-items:center;
        gap:3.333vw;
    }
    .header_link_nav{
        display:flex;
        align-items:center;
        gap:2.222vw;
    
        a{
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.111vw;
            line-height:1.667vw;
            color:#32373e;
    
            &:hover{
                text-decoration:underline;
            }
        }
    }
    .header_hamburger{
        position:relative;
        width:3.889vw;
        height:3.889vw;
        background-color:#c50018;
        border:0.069vw solid #cccfd1;
        border-radius:0.278vw;
        cursor:pointer;
        z-index:100;
    
        span{
            position:absolute;
            left:50%;
            transform:translateX(-50%);
            width:1.667vw;
            height:0.139vw;
            background-color:#ffffff;
            transition:0.3s;
    
            &.top{
                top:1.458vw;
            }
            &.middle_top{
                top:1.875vw;
            }
            &.middle_bottom{
                top:1.875vw;
            }
            &.bottom{
                top:2.292vw;
            }
        }
    }
    .header_nav{
        display:block;
        position:fixed;
        top:6.944vw;
        left:0;
        bottom:0;
        width:100%;
        background:rgba(0, 0, 0, 0.6);
        opacity:0;
        visibility:hidden;
        transition:0.3s;
        z-index:90;
    }
    .header_nav_area{
        position:absolute;
        top:0;
        right:0;
        width:29.167vw;
        height:100%;
        padding:3.681vw 2.778vw 3.889vw;
        background-color:#ffffff;
        overflow:auto;
    }
    .header_nav_list{
        display:grid;
        gap:3.125vw;
    
        .box{
            border-bottom:0.069vw solid #c6c9cc;
        }
    }
    .header_nav_toggle{
        display:flex;
        align-items:center;
        gap:0.833vw;
        position:relative;
        padding:0 0 0.972vw 0.833vw;
        background:url('../images/common/red_circle_white_plus.png') top 0.347vw right / 1.389vw no-repeat;
        cursor:pointer;
    
        &.active{
            background:url('../images/common/red_circle_white_minus.png') top 0.347vw right / 1.389vw no-repeat;
        }
        &:before{
            content:'';
            position:absolute;
            top:0.208vw;
            left:0;
            width:0.208vw;
            height:1.389vw;
            background-color:#c50018;
        }

        .ja{
            margin:0;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.389vw;
            line-height:2.083vw;
        }
        .en{
            margin:0;
            font-family:"Jost", sans-serif;
            font-weight:600;
            font-size:0.972vw;
            color:#b5b7ba;
        }
    }
    .header_nav_link{
        display:none;
        
        &.active{
            display:block;
        }
        a{
            display:flex;
            align-items:center;
            gap:0.833vw;
            padding:1.528vw 0;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.111vw;
            line-height:1.667vw;
            color:#32373e;
            background:url('../images/common/red_arrow_right.png') center right / 1.389vw no-repeat;
            border-top:0.069vw solid #c6c9cc;
    
            img{
                width:4.444vw;
            }
        }
    }
    .header_nav_container{
        display:grid;
        grid-template-columns:repeat(2, 1fr);
        gap:0.833vw;
        margin-top:3.333vw;
    
        a{
            display:flex;
            align-items:center;
            gap:0.556vw;
            height:4.583vw;
            padding:0 1.111vw 0 0.833vw;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:0.972vw;
            line-height:1.389vw;
            text-align:center;
            color:#32373e;
            border:0.069vw solid #c6c9cc;
            border-radius:0.278vw;
    
            &.sm{
                font-size:0.833vw;
                line-height:1.042vw;
            }
            img{
                width:1.944vw;
            }
        }
    }
    
    body.nav_open{
        overflow:hidden;
    
        .header_top{
            z-index:5000;
        }
        .header_hamburger{
            .top{
                opacity:0;
            }
            .middle_top{
                transform:translateX(-50%) rotate(30deg);
            }
            .middle_bottom{
                transform:translateX(-50%) rotate(-30deg);
            }
            .bottom{
                opacity:0;
            }
        }
        .header_nav{
            opacity:1;
            visibility:visible;
        }
    }
    
    /*---------- hamburger-animation ----------*/
    /* @keyframes nav_open_top{
        0%{
            top:0;
            transform:rotate(0deg);
        }
        50%{
            top:50%;
            transform:rotate(0deg);
        }
        100%{
            top:50%;
            transform:rotate(30deg);
        }
    }
    @keyframes nav_open_middle{
        0%{
            opacity:1;
        }
        50%{
            opacity:0;
        }
        100%{
            opacity:0;
        }
    }
    @keyframes nav_open_bottom{
        0%{
            top:100%;
            transform:rotate(0deg);
        }
        50%{
            top:50%;
            transform:rotate(0deg);
        }
        100%{
            top:50%;
            transform:rotate(-30deg);
        }
    }
    @keyframes nav_close_top{
        0%{
            top:50%;
            transform:rotate(30deg);
        }
        50%{
            top:50%;
            transform:rotate(0deg);
        }
        100%{
            top:0;
            transform:rotate(0deg);
        }
    }
    @keyframes nav_close_middle{
        0%{
            opacity:0;
        }
        50%{
            opacity:0;
        }
        100%{
            opacity:1;
        }
    }
    @keyframes nav_close_bottom{
        0%{
            top:50%;
            transform:rotate(-30deg);
        }
        50%{
            top:50%;
            transform:rotate(0deg);
        }
        100%{
            top:100%;
            transform:rotate(0deg);
        }
    } */


    /*------------------------------------------------*/
    /*-------------------- footer --------------------*/
    /*------------------------------------------------*/
    #footer {
        padding-top:6.667vw;
        padding-bottom:8.056vw;
        color:var(--white);
        background-color:var(--premium-black);

        &.footer_top{
            padding-bottom:14.722vw;
        }
        &.footer_sale{
            padding-bottom:14.722vw;
        }
        &.footer_buy{
            padding-bottom:14.722vw;
        }
        &.footer_market{
            padding-bottom:14.722vw;
        }
    }

    #footer .footer-container {
        /* max-width: 88.889vw; */
        margin: 0 auto;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 3.333vw;
    }

    #footer .footer-left {
        /* max-width: 30%; */
    }

    #footer .f-logo {
        margin-bottom: 0.278vw;
        /* max-width: 22.222vw; */
        display: block;
    }

    #footer .f-title {
        font-size: 1.667vw;
        text-align: center;
        line-height: 1;
        margin-bottom: 6.806vw;
    }

    #footer .copyright {
        font-size: 0.833vw;
        line-height: 1.25vw;
        color: var(--neutral-gray-02);
    }

    #footer .footer-right {
        flex: 1;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 1.667vw;
    }

    #footer .footer-right .footer-col {
        flex: 1;
    }

    #footer .footer-right .footer-col h3 {
        font-size: 1rem;
        font-weight: 600;
        font-family: "IBM Plex Sans JP", sans-serif;
        margin-bottom: 0.972vw;
    }

    #footer .footer-right .footer-col ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #footer .footer-right .footer-col ul li {
        margin-bottom: 0.972vw;
        font-size: 1rem;
        line-height: 1.667vw;
    }

    #footer .footer-right .footer-col ul li a {
        display: block;
        color: var(--neutral-gray-02);
    }

    /*---------- breadcrumb ----------*/
    .breadcrumb_list{
        display:flex;
        align-items:center;
        gap:0.556vw;
        /* max-width:88.889vw; */
        margin:0 auto 6.389vw;
        padding:0 2.778vw;
        box-sizing:content-box;
        
        a{
            position:relative;
            margin-right:1.111vw;
            font-size:0.972vw;
            text-decoration:underline;
            color:#0356cb;

            &:hover{
                opacity:0.7;
            }
            &:after{
                content:'';
                position:absolute;
                top:50%;
                right:-1.042vw;
                transform:translateY(-50%) rotate(45deg);
                width:0.278vw;
                height:0.278vw;
                border-top:0.069vw solid #32373e;
                border-right:0.069vw solid #32373e;
            }
        }
        span{
            font-size:0.972vw;
            color:#32373e;
        }
    }

    /*---------- more ----------*/
    .more_link{
        display:block;
        width:100%;
        /* max-width:25.972vw; */
        margin:0 auto;
        padding:1.528vw 3.056vw 1.25vw;
        font-family:"IBM Plex Sans JP", sans-serif;
        font-weight:600;
        font-size:1.111vw;
        line-height:1.667vw;
        text-align:center;
        color:#32373e;
        background:url('../images/common/red_circle_white_arrow.png') center right 1.389vw / 1.667vw no-repeat;
        background-color:#ffffff;
        outline:0.069vw solid #cccfd1;
        border-radius:2.222vw;
        transition:0.3s;
    }

    /*---------- common-page ----------*/
    .common_search_page{
        padding:9.569vw 0 7.222vw;
        background-color:#f0f1f4;
    }
    .common_search_wrap{
        /* max-width:88.889vw; */
        margin:0 auto;
        padding:0 2.778vw;
        box-sizing:content-box;
    }

    .common_page{
        padding:9.514vw 0 10vw;
        background-color:#f0f1f4;
    }

    .common_title{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:0.278vw;
        position:relative;
        margin-bottom:4.444vw;
        padding:2.222vw 0;
        border-top:0.486vw solid #c50018;
        border-bottom:0.486vw solid #c50018;

        &:before{
            content:'';
            position:absolute;
            top:-0.347vw;
            left:0;
            width:100%;
            height:0.278vw;
            background-color:#f0f1f4;
        }
        &:after{
            content:'';
            position:absolute;
            bottom:-0.347vw;
            left:0;
            width:100%;
            height:0.278vw;
            background-color:#f0f1f4;
        }
        p{
            margin:0;
            font-family:"Shippori Mincho B1", serif;
            font-weight:700;
            font-size:1.25vw;
            line-height:1.806vw;
            letter-spacing:-0.025vw;
            color:#6b6f75;
        }
        h1{
            font-family:"Shippori Mincho B1", serif;
            font-weight:700;
            font-size:2.222vw;
            line-height:3.194vw;
            letter-spacing:-0.044vw;
        }
    }

    .common_partition{
        display:flex;
        justify-content:center;
        position:relative;
        padding:1.944vw 0 1.736vw;
        border-top:0.069vw solid #cccfd1;
        border-bottom:0.069vw solid #cccfd1;

        h2{
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.528vw;
            line-height:2.292vw;

            span{
                color:#c50018;
            }
        }
        .balloon{
            position:absolute;
            top:-1.806vw;
            padding:0.347vw 0.972vw 0.069vw;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.389vw;
            line-height:1.806vw;
            text-align:center;
            color:#ffffff;
            background-color:#c50018;
            border-radius:1.25vw;

            &:before{
                content:'';
                position:absolute;
                bottom:-0.694vw;
                left:50%;
                transform:translateX(-50%);
                border-right:0.347vw solid transparent;
                border-left:0.347vw solid transparent;
                border-top:0.694vw solid #c50018;
            }
        }
    }

    /*---------- お客様の声 ----------*/
    .common_voice_area{
        padding-top:8.611vw
    }
    .common_voice_wrap{
        /* max-width:77.778vw; */
        margin:0 auto;
        padding:0 1.389vw;
        box-sizing:content-box;

        .text{
            /* max-width:55.556vw; */
            margin:3.333vw auto 0;

            p{
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:500;
                font-size:1.111vw;
                line-height:1.944vw;
            }
        }
        .container{
            display:grid;
            grid-template-columns:repeat(2, 1fr);
            gap:1.389vw;
            margin:3.333vw 0;
            
            .box{
                display:grid;
                grid-template-columns:1fr 8.125vw;
                padding:2.014vw 1.667vw 1.458vw;
                background-color:#ffffff;
                border:0.069vw solid #cccfd1;
                border-radius:0.278vw;
                transition:0.3s;

                &:hover{
                    border-color:#c50018;
                    opacity:0.7;

                    .right{
                        .img{
                            img{
                                transform:scale(1.1);
                            }
                        }
                    }
                }
                .left{
                    .head{
                        display:flex;
                        align-items:center;
                        gap:1.111vw;
                        margin-bottom:0.903vw;

                        .voice{
                            font-family:"IBM Plex Sans JP", sans-serif;
                            font-weight:500;
                            font-size:0.972vw;
                            line-height:1.389vw;
                            color:#c50018;
                        }
                        .user{
                            padding-left:0.833vw;
                            font-family:"IBM Plex Sans JP", sans-serif;
                            font-weight:500;
                            font-size:0.972vw;
                            line-height:1.389vw;
                            color:#6b6f75;
                            background:url('../images/top/customer_icon.svg') center left 0 / 0.556vw no-repeat;
                        }
                    }
                    h3{
                        margin-bottom:1.458vw;
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:600;
                        font-size:1.389vw;
                        line-height:2.083vw;
                        color:#32373e;
                    }
                    p{
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:600;
                        font-size:0.972vw;
                        line-height:1.389vw;
                        color:#6b6f75;
                    }
                }
                .right{
                    .img{
                        margin-bottom:1.597vw;
                        overflow:hidden;

                        img{
                            width:100%;
                            transition:0.3s;
                        }
                    }
                    p{
                        padding-right:1.667vw;
                        font-family:"IBM Plex Sans JP", sans-serif;
                        font-weight:600;
                        font-size:1.111vw;
                        line-height:1.667vw;
                        text-align:right;
                        color:#32373e;
                        background:url('../images/common/red_circle_white_arrow.png') center right 0 / 1.389vw no-repeat;
                    }
                }
            }
        }
    }

    /*---------- 比較内容 ----------*/
    .compare_area{
        margin-top:3.889vw;
    }
    .compare_headline{
        display:grid;
        grid-template-columns:1fr 13.889vw 13.889vw;
        margin-bottom:1.389vw;
        border-top-left-radius:0.278vw;
        border-top-right-radius:0.278vw;
        overflow:hidden;
    
        > div{
            padding:1.181vw 0 1.042vw;
            font-family:"IBM Plex Sans JP", sans-serif;
            font-weight:600;
            font-size:1.111vw;
            line-height:1.25vw;
            color:#ffffff;
        }
        .black{
            padding-left:1.667vw;
            background-color:#32373e;
            border-right:0.069vw solid #ffffff;
        }
        .gray{
            text-align:center;
            background-color:#646974;
            border-right:0.069vw solid #ffffff;
        }
        .red{
            text-align:center;
            background-color:#c50018;
        }
    }
    .compare_container{
        display:grid;
        gap:1.667vw;
    
        .box{
            border:0.069vw solid #cccfd1;
    
            .top{
                display:grid;
                grid-template-columns:1fr 13.889vw 13.889vw;
                border-bottom:0.069vw solid #cccfd1;
    
                > div{
                    padding:1.667vw 0 1.111vw;
                    font-family:"IBM Plex Sans JP", sans-serif;
                    font-weight:600;
                    font-size:1.389vw;
                    line-height:1.458vw;
                }
                .black{
                    padding-left:1.667vw;
                    font-size:1.111vw;
                    line-height:1.667vw;
                    background:rgba(50, 55, 62, 0.05);
                    border-right:0.069vw solid #cccfd1;
                }
                .gray{
                    text-align:center;
                    background:rgba(102, 122, 167, 0.05);
                    border-right:0.069vw solid #cccfd1;
                }
                .green{
                    text-align:center;
                    color:#323e34;
                    background:rgba(102, 167, 107, 0.05);
                    border-right:0.069vw solid #cccfd1;
                }
                .red{
                    text-align:center;
                    color:#c50018;
                    background:rgba(197, 0, 24, 0.05);
                }
            }
            .center{
                padding:0.694vw 0 0.486vw;
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:600;
                font-size:1.111vw;
                line-height:1.667vw;
                text-align:center;
                background-color:#ffffff;
            }
            .bottom{
                padding:1.667vw 1.667vw 1.111vw;
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:500;
                font-size:1.111vw;
                line-height:1.667vw;
                background-color:#ffffff;
                border-top:0.069vw solid #cccfd1;
            }
        }
    }

    /*---------- 新着物件一覧 ----------*/
    .common_arrival_headline{
		display:flex;
		justify-content:center;
		align-items:center;
		/* max-width:77.778vw; */
		margin:0 auto 3.333vw;
		padding:2.222vw 0;
		border-top:0.069vw solid #cccfd1;
		border-bottom:0.069vw solid #cccfd1;
	
		h2{
			font-family:"IBM Plex Sans JP", sans-serif;
			font-weight:600;
			font-size:1.528vw;
			line-height:2.292vw;
			color:#ffffff;
		}
	}
	.common_arrival_slider{
		.slick-list{
			overflow:visible;
		}
		.slide_arrow{
			position:absolute;
			top:50%;
			transform:translateY(-50%);
			width:5.556vw;
			height:4.444vw;
			background-color:#32373e;
			cursor:pointer;
			z-index:100;
		}
		.prev_arrow{
			left:-2.778vw;
			background:url('../images/common/slider_prev.png') center / cover no-repeat;
		}
		.next_arrow{
			right:-2.778vw;
			background:url('../images/common/slider_next.png') center / cover no-repeat;
		}
		.slick-dots{
			display:flex;
			justify-content:center;
			gap:1.389vw;
			position:static;
			margin-top:2.222vw;
			
			li{
				width:auto;
				height:auto;
				margin:0;
	
				button{
					width:0.556vw;
					height:0.556vw;
					background-color:#ffffff;
					border-radius:50%;
					opacity:0.35;
	
					&:before{
						content:none;
					}
				}
				&.slick-active{
					button{
						opacity:1;
					}
				}
			}
		}
	}
	.common_arrival_box{
		margin:0 0.694vw;
		padding:0 1.736vw 1.944vw;
		background-color:#ffffff;
		border:0.069vw solid #cccfd1;
		border-radius:0.278vw;
		transition:0.3s;
	
		&:hover{
			border-color:#c50018;
			opacity:0.7;
	
			.img{
				img{
					transform:scale(1.1);
				}
			}
		}
		.logo{
			display:flex;
			justify-content:center;
	
			img{
				width:9.722vw;
			}
		}
		.img{
			margin-bottom:1.389vw;
			border-radius:0.278vw;
			overflow:hidden;
	
			img{
				width:100%;
				transition:0.3s;
			}
		}
		.detail{
			h3{
				margin-bottom:0.556vw;
				padding-bottom:0.833vw;
				font-family:"Shippori Mincho B1", serif;
				font-weight:700;
				font-size:1.389vw;
				line-height:2.083vw;
				letter-spacing:-0.042vw;
				color:#32373e;
				background:url('../images/common/red_arrow_right.png') top 0.278vw right 0 / 1.667vw no-repeat;
				border-bottom:0.069vw solid #cccfd1;
			}
			.price_main{
				display:flex;
				align-items:baseline;
				gap:0.278vw;
				margin-bottom:0.069vw;
				font-family:"IBM Plex Sans JP", sans-serif;
				font-weight:600;
				font-size:1.111vw;
				line-height:1.667vw;
				color:#32373e;
	
				span{
					font-size:1.667vw;
					line-height:2.5vw;
					color:#c50018;
				}
			}
			.price_sub{
				display:flex;
				gap:1.111vw;
				margin-bottom:0.833vw;
	
				dl{
					display:flex;
					align-items:center;
					gap:1.181vw;
					margin:0;
	
					dt{
						position:relative;
						font-family:"IBM Plex Sans JP", sans-serif;
						font-weight:600;
						font-size:0.972vw;
						line-height:1.389vw;
						color:#32373e;
	
						&:before{
							content:'';
							position:absolute;
							top:50%;
							right:-0.556vw;
							transform:translateY(-50%);
							width:0.069vw;
							height:0.972vw;
							background-color:#cccfd1;
						}
					}
					dd{
						margin:0;
						font-family:"IBM Plex Sans JP", sans-serif;
						font-weight:500;
						font-size:0.972vw;
						line-height:1.389vw;
						color:#32373e;
					}
				}
			}
			ul{
				display:flex;
				flex-wrap:wrap;
				gap:0.556vw;
	
				li{
					padding:0.208vw 0.833vw 0.139vw;
					font-family:"IBM Plex Sans JP", sans-serif;
					font-weight:500;
					font-size:0.972vw;
					line-height:1.389vw;
					color:#32373e;
					border:0.069vw solid #cccfd1;
					border-radius:1.111vw;
				}
			}
		}
	}

    /*---------- エリアから探す > 日本地図 ----------*/
    .common_search_map{
        display:grid;
        grid-template-columns:40.625% 53.75%;
        align-items:center;
        gap:3.889vw;
        margin-bottom:5vw;
    
        .map{
            position:relative;
            padding:0 0 0.972vw 1.111vw;
    
            img{
                opacity:0.5;
            }
            a{
                position:absolute;
                padding:0.486vw 1.111vw 0.347vw 2.5vw;
                font-family:"IBM Plex Sans JP", sans-serif;
                font-weight:600;
                font-size:1.111vw;
                line-height:1.944vw;
                color:#32373e;
                background:url('../images/common/red_circle_white_arrow.png') center left 0.833vw / 1.111vw no-repeat;
                background-color:#ffffff;
                outline:0.069vw solid #646974;
                border:0.069vw solid #646974;
                border-radius:1.667vw;
                transition:0.3s;
    
                &:hover{
                    color:#c50018;
                    border-color:#c50018;
                }
                &.link1{
                    top:13%;
                    left:39%;
                }
                &.link2{
                    top:59%;
                    left:75%;
                }
                &.link3{
                    top:29%;
                    left:37%;
                }
                &.link4{
                    top:74%;
                    left:64%;
                }
                &.link5{
                    top:43%;
                    left:35%;
                }
                &.link6{
                    top:54%;
                    left:16%;
                }
                &.link7{
                    top:80%;
                    left:36%;
                }
                &.link8{
                    bottom:0;
                    left:21%
                }
            }
        }
        .container{
            display:flex;
            gap:2.222vw;
    
            .column{
                display:grid;
                gap:2.917vw;
    
                .box{
                    .pref{
                        margin-bottom:0.625vw;
                        padding-bottom:0.486vw;
                        border-bottom:0.069vw solid #6b6f75;
    
                        a{
                            padding-left:2.222vw;
                            font-family:"IBM Plex Sans JP", sans-serif;
                            font-weight:500;
                            font-size:1.25vw;
                            line-height:1.944vw;
                            color:#ffffff;
                            background:url('../images/common/red_circle_white_arrow.png') center left 0 / 1.389vw no-repeat;
                        }
                    }
                    ul{
                        display:flex;
                        gap:1.111vw;
    
                        li{
                            position:relative;
    
                            &:not(:last-child){
                                &:before{
                                    content:'';
                                    position:absolute;
                                    top:50%;
                                    right:-0.59vw;
                                    transform:translateY(-50%);
                                    width:0.069vw;
                                    height:0.833vw;
                                    background-color:#ffffff;
                                    opacity:0.3;
                                }
                            }
                            a{
                                font-family:"IBM Plex Sans JP", sans-serif;
                                font-weight:500;
                                font-size:0.972vw;
                                line-height:1.667vw;
                                text-decoration:underline;
                                color:#ffffff;
                                transition:0.3s;
    
                                &:hover{
                                    opacity:0.7;
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    /*---------- modal > 動画 ----------*/
    .modal_video{
        display:flex;
        justify-content:center;
        align-items:center;
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background:rgba(0, 0, 0, 0.75);
        opacity:0;
        visibility:hidden;
        transition:0.3s;
        z-index:5000;
    
        &.active{
            opacity:1;
            visibility:visible;
        }
    }
    .modal_video_window{
        position:relative;
        margin:0 auto;
    
        iframe{
            width:66.806vw;
            height:37.5vw;
        }
    }
    .modal_video_close{
        position:absolute;
        top:-2.778vw;
        right:0;
        width:1.667vw;
        cursor:pointer;
    
        img{
            width:100%;
        }
    }
}





/*-------------------- sp --------------------*/
/*---------- デザインベースはwidth:375px ----------*/
@media(max-width:768px){
    .pc {
		display: none !important;
	}
	.sp {
		display: block !important;
	}
	html,
	body {
		font-size: 3.733vw;
	}

	.header_wrap {
        height:17.867vw;
        padding:2.133vw 4.533vw 1.067vw 0;
    }
    .header_title{
        gap:1.067vw;
    
        img{
            width:46.4vw;
        }
        p{
            font-size:3.2vw;
            line-height:4.8vw;
        }
    }

    .header_link_nav{
        display:none;
    }
    .header_hamburger{
        width:12.8vw;
        height:3.733vw;
        background:none;
        border:none;
        
        span{
            width:100%;
            height:0.533vw;
            background-color:#c50018;
            
            &.top{
                top:0;
            }
            &.middle_top{
                top:1.6vw;
            }
            &.middle_bottom{
                top:1.6vw;
            }
            &.bottom{
                top:3.2vw;
            }
        }
    }
    .header_nav{
        top:17.867vw;
    }
    .header_nav_area{
        width:100%;
        height:100%;
        padding:14.4vw 8.533vw 14.933vw;
    }
    .header_nav_list{
        gap:12.267vw;
    
        .box{
            border-bottom:0.267vw solid #c6c9cc;
        }
    }
    .header_nav_toggle{
        gap:3.2vw;
        padding:0 0 4vw 3.2vw;
        background:url('../images/common/red_circle_white_plus.png') top 1.333vw right / 5.333vw no-repeat;
    
        &.active{
            background:url('../images/common/red_circle_white_minus.png') top 1.333vw right / 5.333vw no-repeat;
        }
        &:before{
            top:0.8vw;
            width:0.8vw;
            height:4.8vw;
        }

        .ja{
            font-size:4.8vw;
            line-height:6.933vw;
        }
        .en{
            font-size:3.2vw;
        }
    }
    .header_nav_link{
        a{
            gap:3.2vw;
            padding:5.333vw 0;
            font-size:3.733vw;
            line-height:5.333vw;
            background:url('../images/common/red_arrow_right.png') center right / 5.333vw no-repeat;
            border-top:0.267vw solid #c6c9cc;
    
            img{
                width:17.067vw;
            }
        }
    }
    .header_nav_container{
        gap:3.2vw;
        margin-top:12.8vw;
    
        a{
            gap:0;
            height:17.6vw;
            padding:0 4.267vw 0 3.2vw;
            font-size:3.733vw;
            line-height:5.333vw;
            border:0.267vw solid #c6c9cc;
            border-radius:1.067vw;
    
            &.sm{
                font-size:3.2vw;
                line-height:4vw;
            }
            img{
                width:7.467vw;
            }
        }
    }
    body.nav_open{
        .header_hamburger{
            background:none;

            span{
                &.middle_top{
                    transform:translateX(-50%) rotate(20deg);
                }
                &.middle_bottom{
                    transform:translateX(-50%) rotate(-20deg);
                }
            }
        }
    }

	/* Footer */
	#footer {
		padding-top:17.067vw;
		padding-bottom:5.067vw;

        &.footer_top{
            padding-bottom:29.867vw;
        }
        &.footer_sale{
            padding-bottom:24.8vw;
        }
        &.footer_buy{
            padding-bottom:24.8vw;
        }
        &.footer_search_lists{
            padding-bottom:24.267vw;
        }
        &.footer_market{
            padding-bottom:29.867vw;
        }
	}

	#footer .footer-container {
		flex-direction: column-reverse;
		gap: 4.267vw;
		max-width: 100%;
		padding: 0 4.267vw;
	}

	#footer .footer-left {
		max-width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}

	#footer .f-logo {
		max-width: 53.333vw;
		margin: 0 1.067vw 0 0;
	}

	#footer .f-title {
		margin-bottom: 0;
		font-size: 3.733vw;
	}

	#footer .copyright {
		font-size: 2.667vw;
		line-height: 4.533vw;
		margin-top: 8.533vw;
	}

	#footer .footer-right {
		gap: 4.267vw;
	}

	#footer .footer-right .footer-col {
		flex: auto;
		width: calc(50% - 2.133vw);
		margin-bottom: 2.667vw;
	}

    /*---------- パンクズリスト ----------*/
    .breadcrumb_list{
		order:1;
        flex-wrap:wrap;
		margin:19.2vw 0 0;
		padding:4.267vw;
		background-color:#ffffff;

		a{
			font-size:3.733vw;
			line-height:5.333vw;
		}
		span{
			font-size:3.733vw;
			line-height:5.333vw;
		}
	}

    /*---------- more ----------*/
    .more_link{
        max-width:74.667vw;
        padding:3.733vw 0 3.467vw;
        font-size:3.733vw;
        line-height:5.333vw;
        background:url('../images/common/red_circle_white_arrow.png') center right 3.2vw / 6.4vw no-repeat;
        background-color:#ffffff;

        &.sp_pd{
            padding:3.733vw 12.267vw 3.467vw 6.4vw;
        }
        &.sp_mw320{
            max-width:85.333vw;
        }
    }

    /*---------- common-page ----------*/
    .common_search_page{
        display:flex;
		flex-direction:column;
		padding:32.8vw 0 0;
	}
	.common_search_wrap{
		width:100%;
		padding:0 4.267vw;
        box-sizing:border-box;
	}

    .common_page{
        display:flex;
		flex-direction:column;
        padding:32.8vw 0 0;
    }

    .common_title{
        gap:1.067vw;
        margin-bottom:12.8vw;
        padding:6.4vw 0;
        border-top:1.867vw solid #c50018;
        border-bottom:1.867vw solid #c50018;

        &:before{
            top:-1.333vw;
            height:1.067vw;
        }
        &:after{
            bottom:-1.333vw;
            height:1.067vw;
        }
        p{
            font-size:4.267vw;
            line-height:6.4vw;
            letter-spacing:-0.085vw;
        }
        h1{
            font-size:6.4vw;
            line-height:9.6vw;
            letter-spacing:-0.128vw;
        }
    }

    .common_partition{
        padding:5.6vw 0 4.8vw;
        
        h2{
            font-size:4.8vw;
            line-height:7.467vw;
            text-align:center;
        }
        .balloon{
            top:-6.933vw;
            padding:1.067vw 3.2vw 0.267vw;
            font-size:4.8vw;
            line-height:6.933vw;
    
            &:before{
                bottom:-2.133vw;
                border-right:4px solid transparent;
                border-left:4px solid transparent;
                border-top:8px solid #c50018;
            }
        }
    }

    /*---------- お客様の声 ----------*/
    .common_voice_area{
        padding-top:17.067vw;
    }
    .common_voice_wrap{
        padding:0 4.267vw;

        .container{
            grid-template-columns:1fr;
            gap:4.267vw;
            margin:8.533vw 0 6.4vw;
            
            .box{
                grid-template-columns:1fr 21.333vw;
                gap:4.267vw;
                padding:5.867vw 6.4vw 5.333vw;
                
                .left{
                    .head{
                        gap:3.2vw;
                        margin-bottom:3.2vw;
    
                        .voice{
                            font-size:3.2vw;
                            line-height:4.8vw;
                        }
                        .user{
                            padding-left:2.933vw;
                            font-size:3.2vw;
                            line-height:4.8vw;
                            background:url('../images/top/customer_icon.svg') center left 0 / 7px no-repeat;
                        }
                    }
                    h3{
                        margin-bottom:1.6vw;
                        font-size:4.267vw;
                        line-height:6.4vw;
                    }
                    p{
                        font-size:3.2vw;
                        line-height:4.8vw;
                    }
                }
                .right{
                    .img{
                        height:21.333vw;
                        margin-bottom:6.933vw;

                        img{
                            width:100%;
                            height:100%;
                            object-fit:cover;
                        }
                    }
                    p{
                        padding-right:5.333vw;
                        font-size:3.2vw;
                        line-height:4.8vw;
                        background:url('../images/common/red_circle_white_arrow.png') center right 0 / 4.267vw no-repeat;
                    }
                }
            }
        }
    }

    .common_toggle_tab{
        gap:0.8vw;
        margin-bottom:6.4vw;

        button{
            padding:0 0 3.2vw;
            font-size:3.733vw;
            line-height:8.533vw;
            border-bottom:1.067vw solid #32373e;

            span{
                padding:0 4.8vw;
            }
            &.active{
                span{
                    background:url('../images/common/red_arrow_bottom.png') center right 0 / 2.667vw no-repeat;
                }
            }
        }
    }
    .common_toggle_area{
        margin-bottom:8.533vw;
    }
    .common_toggle_box{
        .container{
            grid-template-columns:1fr;
            gap:4.267vw;
            
            .box{
                grid-template-columns:1fr 21.333vw;
                gap:4.267vw;
                padding:5.867vw 6.4vw 5.333vw;
                
                .left{
                    .head{
                        gap:3.2vw;
                        margin-bottom:3.2vw;

                        .voice{
                            font-size:3.2vw;
                            line-height:4.8vw;
                        }
                        .user{
                            padding-left:2.933vw;
                            font-size:3.2vw;
                            line-height:4.8vw;
                            background:url('../images/top/customer_icon.svg') center left 0 / 1.867vw no-repeat;
                        }
                    }
                    h3{
                        margin-bottom:1.6vw;
                        font-size:4.267vw;
                        line-height:6.4vw;
                    }
                    p{
                        font-size:3.2vw;
                        line-height:4.8vw;
                    }
                }
                .right{
                    .img{
                        height:21.333vw;
                        margin-bottom:6.933vw;

                        img{
                            height:100%;
                            object-fit:cover;
                        }
                    }
                    p{
                        padding-right:5.333vw;
                        font-size:3.2vw;
                        line-height:4.8vw;
                        background:url('../images/common/red_circle_white_arrow.png') center right 0 / 4.267vw no-repeat;
                    }
                }
            }
        }
    }

    /*---------- 比較内容 ----------*/
    .compare_area{
        margin-top:6.667vw;
    }
    .compare_headline{
        grid-template-columns:1fr 23.467vw 23.467vw;
        margin-bottom:4.267vw;
        
        > div{
            display:flex;
            justify-content:center;
            align-items:center;
            padding:4.533vw 0 3.733vw;
            font-size:3.2vw;
            line-height:4.8vw;
        }
        .black{
            justify-content:flex-start;
            padding-left:4.267vw;
        }
    }
    .compare_container{
        gap:4.267vw;
    
        .box{
            .top{
                grid-template-columns:1fr 23.467vw 23.467vw;
                
                > div{
                    display:flex;
                    justify-content:center;
                    align-items:center;
                    padding:0;
                    font-size:4.733vw;
                    line-height:5.333vw;
                }
                .black{
                    padding:4.267vw 4.267vw 2.4vw;
                    font-size:3.733vw;
                    line-height:5.333vw;
                }
            }
            .center{
                padding:2.4vw 0;
                font-size:3.733vw;
                line-height:5.333vw;
                
                span{
                    padding-right:5.333vw;
                    background:url('../images/common/gray_circle_white_plus.png') top 0.533vw right 0 / 4.267vw no-repeat;
                }
                &.active{
                    span{
                        background:url('../images/common/gray_circle_white_minus.png') top 0.533vw right 0 / 4.267vw no-repeat;
                    }
                }
            }
            .bottom{
                display:none;
                padding:4.267vw 4.267vw 2.4vw;
                font-size:3.733vw;
                line-height:5.333vw;

                &.active{
                    display:block;
                }
            }
        }
    }

    /*---------- 新着物件一覧 ----------*/
    .common_arrival_headline{
		margin-bottom:6.4vw;
		padding:5.6vw 0 4.8vw;
	
		h2{
			font-size:4.8vw;
			line-height:7.467vw;
		}
	}
	.common_arrival_slider{
		.slide_arrow{
			width:13.333vw;
			height:10.667vw;
		}
		.prev_arrow{
			left:-4.267vw;
		}
		.next_arrow{
			right:-4.267vw;
		}
		.slick-dots{
			gap:3.2vw;
			margin-top:6.4vw;
			
			li{
				button{
					width:1.6vw;
					height:1.6vw;
				}
			}
		}
	}
	.common_arrival_box{
		margin:0 2.133vw;
		padding:0 6.4vw 5.333vw;
		border-radius:1.067vw;
		
		.logo{
			img{
				width:39.467vw;
			}
		}
		.img{
			margin-bottom:5.333vw;
			border-radius:1.067vw;
			overflow:hidden;
	
			img{
				width:100%;
				transition:0.3s;
			}
		}
		.detail{
			h3{
				margin-bottom:2.133vw;
				padding-bottom:2.133vw;
				font-size:4.267vw;
				line-height:6.4vw;
				letter-spacing:-0.085vw;
				background:url('../images/common/red_arrow_right.png') top 0.8vw right 0 / 5.333vw no-repeat;
			}
			.price_main{
				gap:1.067vw;
				margin-bottom:0.533vw;
				font-size:3.467vw;
				line-height:8.533vw;
				
				span{
					font-size:6.4vw;
					line-height:8.533vw;
				}
			}
			.price_sub{
				gap:3.733vw;
				margin-bottom:2.4vw;
	
				dl{
					gap:3.2vw;
					
					dt{
						font-size:3.2vw;
						line-height:4.8vw;
						
						&:before{
							right:-1.6vw;
							width:0.267vw;
							height:3.2vw;
						}
					}
					dd{
						font-size:3.2vw;
						line-height:4.8vw;
					}
				}
			}
			ul{
				gap:2.133vw;
	
				li{
					padding:1.067vw 3.2vw 0.533vw;
					font-size:3.2vw;
					line-height:4.8vw;
				}
			}
		}
	}

    /*---------- エリアから探す > 日本地図 ----------*/
    .common_search_map{
        display:none;
		grid-template-columns:1fr;
		gap:10.667vw;
        margin:12.8vw 0 11.733vw;
	
        &.active{
            display:grid;
        }
		.map{
			padding:0 0 13.6vw;
	
			a{
				padding:2.133vw 3.2vw 1.867vw 9.6vw;
				font-size:3.733vw;
				line-height:5.333vw;
				
				&.link1{
					top:4%;
					left:28%;
				}
				&.link2{
					top:52%;
					left:76%;
				}
				&.link3{
					top:22%;
					left:22%;
				}
				&.link4{
					top:67%;
					left:60%;
				}
				&.link5{
					top:38%;
					left:24%;
				}
				&.link6{
					top:50%;
					left:0;
				}
				&.link7{
					top:75%;
					left:28%;
				}
				&.link8{
					bottom:0;
					left:4%
				}
			}
		}
		.container{
			display:block;
			border-radius:1.067vw;
			overflow:hidden;
	
			.title_sp{
				display:flex;
				justify-content:center;
				margin-bottom:7.733vw;
				padding:3.467vw 0 2.933vw;
				background-color:#6b6f75;
				
				h3{
					font-family:"IBM Plex Sans JP", sans-serif;
					font-weight:600;
					font-size:4.267vw;
					line-height:6.4vw;
					color:#ffffff;
				}
			}
			.column{
				display:grid;
				gap:4.533vw;
				/* padding:0 4vw; */
	
				&:last-child{
					margin-top:4.533vw;
				}
				.box{
					.pref{
						margin-bottom:2.4vw;
						padding-bottom:1.867vw;
	
						a{
							position:relative;
							padding-left:6.4vw;
							font-weight:600;
							font-size:4.267vw;
							line-height:7.467vw;
                            background:url('../images/common/red_circle_white_arrow.png') center left 0 / 16px no-repeat;
						}
					}
					ul{
						flex-wrap:wrap;
						gap:2.4vw 4.533vw;
	
						li{
							&:not(:last-child){
								&:before{
									right:-2.133vw;
									height:3.733vw;
									background-color:#cccfd1;
								}
							}
							a{
								font-size:3.733vw;
								line-height:6.4vw;
								text-decoration:underline;
								color:#ffffff;
							}
						}
					}
				}
			}
		}
	}

    /*---------- modal > 動画 ----------*/
    .modal_video_window{
        iframe{
            width:100vw;
            height:56vw;
        }
    }
    .modal_video_close{
        top:-8.533vw;
        right:4.267vw;
        width:5.333vw;
    }

    /*  */
    .sp_side_scroll{
        position:relative;

        &:before{
            content:'';
            position:absolute;
            top:50%;
            left:50%;
            transform:translate(-50%, -50%);
            width:148px;
            height:148px;
            background:url('../images/common/table_side_scroll.png') center center / cover no-repeat;
            transition:0.3s;
        }
        &.scroll{
            &:before{
                opacity:0;
            }
        }
    }
}

/* task142: the heading text is a link and only the +/- opens the list.
   .header_nav_toggle (every page) and .mv_nav_toggle (TOP hero) are the same
   component with the same plus artwork at the same coordinates, so these rules
   serve both. The button is transparent and sits exactly on that background --
   same numbers as the background declarations, so the plus never moves. */
.header_nav_plus{
	position:absolute;
	top:5px;
	right:0;
	width:20px;
	height:20px;
	padding:0;
	border:0;
	background:transparent;
	cursor:pointer;
}
/* global a{} sets font-size:14px and the link colour -- both would override the
   heading. Same trap as the footer headings. */
.header_nav_toggle .ja a,
.mv_nav_toggle .ja a{
	color:inherit;
	font-size:inherit;
	text-decoration:none;
}

@media(max-width:1439px) and (min-width:769px){
	.header_nav_plus{
		top:0.347vw;
		width:1.389vw;
		height:1.389vw;
	}
}

@media(max-width:768px){
	.header_nav_plus{
		top:1.333vw;
		width:5.333vw;
		height:5.333vw;
	}
}

/* task180 (CB A14 「ページ下部へ移動してハンバーガーメニューを開くと表示がバグる ※全ページ」).
   .header_nav is position:fixed, but it lives inside <header>, and header.hide sets
   transform:translateY(-100px). A transform makes the element the containing block of
   its fixed descendants, so the drawer's top:100px/bottom:0 resolve against the 109px
   header instead of the viewport -- it collapses to a sliver showing one menu heading.
   Neutralise the transform while the drawer is open. transition:none as well, so no
   frame measures the drawer against a header that is still sliding.
   One rule for all three breakpoints: the markup and .hide are the same at each. */
body.nav_open header{
	transform:none !important;
	transition:none;
}