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

#breadcrumb{ background-color: #fff;}
.breadcrumb{ background-color: #fff; margin: 0 auto; font-weight: bold; font-weight: 600;}
.breadcrumb-item.active{ color: black;}
.breadcrumb-item.active h1{ display: inline; font-size: inherit; font-weight: normal; margin: 0;}
.breadcrumb>.breadcrumb-item a{ color: #707070;}
.breadcrumb>.breadcrumb-item a.home{ background: url("../images/home.svg") no-repeat left top; display: inline-block;}
.breadcrumb-item + .breadcrumb-item::before{ content: "/";}
@media (min-width: 768px) {
	#breadcrumb{ min-width: 1010px; margin-bottom: 100px;}
	.breadcrumb{ padding: 14px 15px; width: 1010px; font-size: 14px;}
	.breadcrumb-item{ line-height: 22px;}
	.breadcrumb>.breadcrumb-item a.home{ padding-left: 20px;}
}
@media (max-width: 767.98px) {
	#breadcrumb{}
	.breadcrumb{ padding: 10px 10px; font-size: 10px;}
	.breadcrumb-item{ line-height: 14px;}
	.breadcrumb>.breadcrumb-item a.home{ background-size: auto 11px; padding-left: 12px;}
}


#detail_dl{ border-bottom: 1px solid #d2d2d2; flex-wrap: wrap; display: flex;}
#detail_dl>dl{ background-color: white; border-top: #d2d2d2 solid 1px; display: flex; margin: 0;}
#detail_dl>dl>dt,#detail_dl>dl>dd{ display: flex; align-items: center; height: 100%; margin: 0; font-weight: bold; font-weight: 600;}
#detail_dl>dl>dt{ background-color: rgba(210,210,210,0.50); justify-content: center;}
#detail_dl>dl>dd{}
@media (min-width: 768px) {
	#detail_ttl{ margin-top: 100px; margin-bottom: 100px;}

	#detail_dl{}
	#detail_dl>dl{ width: 33.33%;}
	#detail_dl>dl:first-child{ width: 100%;}
	#detail_dl>dl>dt,#detail_dl>dl>dd{ min-height: 60px; font-size: 14px;}
	#detail_dl>dl>dt{ width: 100px;}
	#detail_dl>dl>dd{ width: calc(100% - 100px); padding: 0 30px;}
}
@media (max-width: 767.98px) {}


.tag_link{ display: flex; flex-wrap: wrap;}
.tag_link>a{ background-color: white; border: 1px solid #d2d2d2; border-radius: 10px; padding: 0.2em 0.6em;}
.tag_link>a:hover{ text-decoration: none; opacity: 0.5;}
@media (min-width: 768px) {
	.tag_link{ margin: -5px;}
	.tag_link>a{ margin: 5px;}
}
@media (max-width: 767.98px) {}


.back_btn{ display: flex; justify-content: center; align-items: center; border: #d2d2d2 solid 2px; border-radius: 50%; font-weight: bold; font-weight: 700; position: relative; background: white url("../back/line_gray2_45.png") repeat center / 4px;}
.back_btn>input{ display: block; opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 3; border-radius: 50%;}
.back_btn::before{ content: ""; background-color: black; height: 1px; position: absolute;}
@media (min-width: 768px) {
	.back_btn{ width: 80px; height: 80px; margin: 50px auto 0;}
	.back_btn::before{ width: 30px; left: calc(50% - 15px); bottom: 26px;}
}
@media (max-width: 767.98px) {
	.back_btn{ width: 80px; height: 80px; margin: 30px auto 0;}
	.back_btn::before{ width: 30px; left: calc(50% - 15px); bottom: 26px;}
}


.list_01{ list-style: none; padding: 0; margin: 0 -1px;}
.list_01>li{}
.list_01>li>span{ background-repeat: no-repeat; background-position: center; background-size: cover; padding: 0 0 69%; display: block;}
@media (min-width: 768px) {
	.list_01 p>strong{ font-size: 20px;}
	.list_01 p>small{ font-size: 15px;}
}
@media (max-width: 767.98px) {
	.list_01 p>strong{ font-size: 10px;}
	.list_01 p>small{ font-size: 8px;}
}


.text_center_left { text-align: center; line-height: 2.0; margin: 0;}
.text_left { text-align: left; line-height: 2.0; margin: 0;}

.bg_white { padding: 5em 0; }

.pagetopWrapper { width: 100%; text-align: center; padding-top: 3em; padding-bottom: 3em; }
.pagetopWrapper.green { background-color: #cfece7;}
.pagetopWrapper.purple { background-color: #dee1f3;}
.pagetopWrapper.blue { background-color: #d9e9f9;}
.pagetopWrapper h1{ font-weight: bold;}
.pagetopWrapper p { font-weight: bold;}

.pagetopWrapper>.icon{ position: relative; display: block;}
.pagetopWrapper>.icon::before,
.pagetopWrapper>.icon::after,
.pagetopWrapper>.icon>span::before,
.pagetopWrapper>.icon>span::after{ content: ""; display: block; position: absolute;}
.pagetopWrapper>.icon::before{ z-index: 4;}
.pagetopWrapper>.icon::after{ z-index: 3;}
.pagetopWrapper>.icon>span::before{ z-index: 2;}
.pagetopWrapper>.icon>span::after{ z-index: 1;}
.pagetopWrapper>.icon::before,
.pagetopWrapper>.icon::after{ background-color: black;}
.pagetopWrapper>.icon>span::before,
.pagetopWrapper>.icon>span::after{ background-color: gray;}
@media (min-width: 768px) {
	.pageSpace.green { width: 100%; height: 120px; background-color: #cfece7;}
	.pageSpace.purple { width: 100%; height: 120px; background-color: #dee1f3;}
	.pageSpace.blue { width: 100%; height: 120px; background-color: #d9e9f9;}
	.pagetopWrapper{ padding-bottom: 5px;}
	.pagetopWrapper>.large_t{ font-size: 32px; letter-spacing: 2px;}
	.pagetopWrapper>.small_t{ font-size: 14px;}
	.pagetopWrapper>.icon{ height: 54px;}
	.pagetopWrapper>.icon::before{ width: 14px; height: 18px; left: calc(50% - 7px); top: calc(50% - 9px);}
	.pagetopWrapper>.icon::after{ width: 100px; height: 5px; bottom: -5px; left: calc(50% - 50px);}
	.pagetopWrapper>.icon>span::before,
	.pagetopWrapper>.icon>span::after{ width: 26px; height: 26px;}
	.pagetopWrapper>.icon>span::before{ left: calc(50% - 19px); top: 10px;}
	.pagetopWrapper>.icon>span::after{ right: calc(50% - 19px); bottom: 10px;}
}
@media (max-width: 767.98px) {
	.pageSpace.green { width: 100%; height: 80px; background-color: #cfece7;}
	.pageSpace.purple { width: 100%; height: 80px; background-color: #dee1f3;}
	.pageSpace.blue { width: 100%; height: 80px; background-color: #d9e9f9;}
	.pagetopWrapper{ padding-bottom: 3px;}
	.pagetopWrapper>.large_t{ font-size: 18px; letter-spacing: 1px;}
	.pagetopWrapper>.small_t{ font-size: 9px;}
	.pagetopWrapper>.icon{ height: 34px;}
	.pagetopWrapper>.icon::before{ width: 8px; height: 10px; left: calc(50% - 4px); top: calc(50% - 5px);}
	.pagetopWrapper>.icon::after{ width: 50px; height: 3px; bottom: -3px; left: calc(50% - 25px);}
	.pagetopWrapper>.icon>span::before,
	.pagetopWrapper>.icon>span::after{ width: 14px; height: 14px;}
	.pagetopWrapper>.icon>span::before{ left: calc(50% - 10px); top: 8px;}
	.pagetopWrapper>.icon>span::after{ right: calc(50% - 10px); bottom: 8px;}
}
.pagetopWrapper.green>.icon::before,
.pagetopWrapper.green>.icon::after,
.list01>li>.icon::before,
.link_c.green{ background-color: #64c6b4;}
.pagetopWrapper.green>.icon>span::before,
.pagetopWrapper.green>.icon>span::after,
.list01.green>li>.icon>span::before,
.list01.green>li>.icon>span::after{ background-color: #98d9cd;}
.back_color.green{ background-color: #cfece7;}

.pagetopWrapper.purple>.icon::before,
.pagetopWrapper.purple>.icon::after,
.list01>li>.icon::before,
.link_c.purple{ background-color: #7b84bf;}
.pagetopWrapper.purple>.icon>span::before,
.pagetopWrapper.purple>.icon>span::after,
.list01.purple>li>.icon>span::before,
.list01.purple>li>.icon>span::after{ background-color: #a7add4;}
.back_color.purple{ background-color: #dee1f3;}

.pagetopWrapper.blue>.icon::before,
.pagetopWrapper.blue>.icon::after,
.list01>li>.icon::before,
.link_c.purple{ background-color: #0059ad;}
.pagetopWrapper.blue>.icon>span::before,
.pagetopWrapper.blue>.icon>span::after,
.list01.blue>li>.icon>span::before,
.list01.blue>li>.icon>span::after{ background-color: #52a3f0;}
.back_color.blue{ background-color: #d9e9f9;}

@media (min-width: 768px) {}
@media (max-width: 767.98px) {}

@media (min-width: 768px) {}
@media (max-width: 767.98px) {}
