@charset "utf-8";


.content_Ttl {
    margin-bottom: 20px;
    text-align: center;
}

.content_MainTtl {
    color: #015e9e;
    font-size: min(6vw, 25px);
    font-family: "Outfit", sans-serif;
    font-weight: 600;
    letter-spacing: .1em;
}
.content_SubTtl {
    margin-top: 0.5em;
    color: #333;
}

/* ぱんくず */
#bread_List {
	justify-content: flex-start;
	font-size: 12px;
	gap: 5px;
	max-width: 1200px;
	width: 90%;
	margin: 0 auto;
	padding: 10px;
	box-sizing: border-box;
}

#bread_List>li {
	display: flex;
	align-items: center;
	gap: 5px;
}

#bread_List>li::after {
	display: block;
	content: '';
	width: 0.5em;
	height: 0.5em;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
	transform: rotate(45deg);
}

#bread_List>li:last-child::after {
	content: none;
}

#bread_List>li a {
	text-decoration: underline;
}

@media only screen and (max-width: 900px) {
	#bread_List {
		display: none;
	}
}


/*faq css
-----------------------------------------*/

.faq_allList_wrap {
    max-width: 1000px;
    width: 90%;
    margin: 40px auto 60px auto;
    line-height: 1.5;
}

.faq_allList_tab {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.faq_allList_tab li {
    border: 1px solid #015e9e;
    border-radius: 10px;
    color: #015e9e;
    padding: 10px 15px;
    letter-spacing: .05em;
    cursor: pointer;
    transition: all .3s ease;
}
.faq_allList_tab li.active {
    background: #015e9e;
    color: #fff;
}
.faq_allList_tab li:hover {
    background: #015e9e;
    color: #fff;
}

.allList_contents_wrap {
    padding: 10px 30px;
    margin: 40px 0;
    border: 2px solid #015e9e;
    border-radius: 15px;
}
.content_tag {
    font-size: 14px;
    display: inline-block;
    color: #015e9e;
    border: 1px solid #015e9e;
    border-radius: 10px;
    padding: 3px 12px;
    letter-spacing: 0.02em;
    margin-bottom: 10px;
}

.content_All,
.content_Cost,
.content_Choose,
.content_Contract,
.content_After,
.content_Moveout {
    display: none;
}


.content_All.active,
.content_Cost.active,
.content_Choose.active,
.content_Contract.active,
.content_After.active,
.content_Moveout.active {
    display: block;
    animation: fade .7s ease forwards;
}


.faq_content {
    margin-top: 20px;
    border-bottom: 1px solid #dddddd;
}

.faq_content.last {
    border-bottom :none;
    margin-bottom: 20px;
}

/* タブ切替・ページ切替で表示される項目のフェード演出 */
.faq_content.is_show {
    animation: fade .7s ease forwards;
}

.faq_content dt {
    position: relative;
    padding: 10px 0 10px 3.2em;
    cursor: pointer;
}


.faq_content dd {
    position: relative;
    padding: 10px 0 10px 3.2em;
    margin-bottom: 10px;
}

.faq_content dd a {
    color: #0000EE;
}

.faq_content dt::before,.faq_content dd::before {
    position: absolute;
    display: grid;
    place-items: center;
    left: 10px;
    width: 30px;
    height: 30px;
    border-radius: 9999px;
}
.faq_content dt::before {
    top: 50%;
    transform: translateY(-50%);
    content: "Q";
    color: #eff7fc;
    background: #015e9e;
}


.faq_content dd::before {
    content: "A";
    top: 50%;
    transform: translateY(-50%);
    color: #015e9e;
    background: #eff7fc;
}

.all_Btn {
    display: block;
    width: 100%;
    padding: 20px 10px;
    margin: 40px auto 0;
    color: #264477;
    border: 1px solid #264477;
    border-radius: 2px;
    font-size: min(3vw, 16px);
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
}

@keyframes fade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/*ページネーション*/

.pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 40px;
}

.page {
    width: 40px;
    height: 40px;
    border: 1px solid #015e9e;
    color: #015e9e;
    background: none;
    cursor: pointer;
    text-align: center;
}

.page.active {
    background: #015e9e;
    color: #fff;
    cursor:unset;
}


@media only screen and (max-width: 900px) {

    
    .faq_allList_wrap {
        width: 90%;
        margin: 20px auto 40px auto;
    }

    .faq_allList_ttl {
        font-size: 16px;
    }

     .faq_allList_tab {
        gap: 10px;
        justify-content: center;
    }

    .faq_allList_tab li {
        font-size: 14px;
        padding: 8px 10px;
    }

    .allList_contents_wrap {
        padding: 10px 20px;
        margin: 20px 0;
    }
    .faq_allList_contents .flex_wrap {
        flex-direction: column;
    }
    .faq_content {
        font-size: 14px;
    }
    .faq_content.last {
        margin-bottom: 0px;
    }
    .faq_content dt {
        position: relative;
        padding: 10px 3.2em 10px 3.5em;
        cursor: pointer;
    }
    .faq_content dd {
        position: relative;
        padding: 10px 0 10px 3.5em;
        margin-bottom: 10px;
    }

    .page {
        width: 30px;
        height: 30px;
    }




}
