@charset "utf-8";
/* CSS Document */
/* レスポンシブル設定は768px～ 1em = 16px*/

h1{font-size: 2rem;}
h2{font-size: 1.75rem; padding: .5em 0 .5em .5em; background: #EAEAEA; 
	border-top: 2px solid #000; border-bottom: 1px solid rgba(0,0,0,0.6); margin: 2em auto 30px;}
h3{font-size: 1.5rem; padding: 0 0 .5em; border-bottom: 1px solid #000; line-height: 1.4em; margin: 3em auto 1em;}

@media screen and (max-width: 1030px) {
	h1{font-size: 1.75rem;}
	h2{font-size: 1.55rem;}
	h3{font-size: 1.3rem;}
}


/* カダイトッパー Collection 詳細ページ */
.page_title{}
.page_title{background: #333333; width: 100%; padding: 1.5em 0;}
.page_title p{color: #FFF; font-size: 2rem; font-weight: 700; line-height: 1.4em; text-align: left;
max-width: 1200px; width:calc(100% - 40px); margin: auto; }
.page_title p small{display: block; font-size: 16px; line-height: 1; padding-top: 16px;}


.changecase{display: flex; flex-wrap: wrap; width: 100%;}
.changecase .changecase_detail{width: calc(80% - 50px); margin-right: 50px;}
.changecase .changecase_detail .published{font-size: 0.875rem;}

.changecase .changecase_detail .img_eye_catching_area{text-align: center;}
.changecase .changecase_detail .img_eye_catching_area .img_eye_catching{width: auto; height: auto; margin: auto auto 10px;}
.changecase .changecase_detail .img_eye_catching_area .img_w100{width: 100%; height: auto;}
.changecase .changecase_detail .img_eye_catching_area .img_w70{width: 70%; height: auto;}
@media screen and (max-width: 768px) {
	.changecase .changecase_detail .img_eye_catching_area .img_eye_catching{width: 100%; height: auto; margin: auto auto 10px;}
	.changecase .changecase_detail .img_eye_catching_area .img_w70{width: 100%; height: auto;}
}
.changecase .changecase_detail .img_eye_catching_txt{font-size: 1em; text-align: center;}


.changecase .changecase_detail .detail{font-size: 1em; line-height: 1.7em; margin-bottom: 1.5rem;}
.changecase .changecase_detail .detail_lst{font-size: 1em; line-height: 1.7em; margin:auto auto 1.5rem 1em; }
.changecase .changecase_detail .detail_lst li{text-indent: -1em; padding-left: 1em; list-style: disc;}

.changecase .changecase_detail .img_Additional_area{display: flex; flex-wrap: wrap; justify-content: space-between;}
.changecase .changecase_detail .img_Additional_area div{width: calc(50% - 15px); text-align: center;}

.changecase .changecase_detail .img_Additional_area .img_Additional{width: auto; height: auto; margin: auto auto 10px;}
.changecase .changecase_detail .img_Additional_area .img_w100{width: calc(100% - 0px); height: auto;}
.changecase .changecase_detail .img_Additional_area .img_w50{width: calc(50% - 10px); height: auto;}
@media screen and (max-width: 768px) {
	.changecase .changecase_detail .img_Additional_area div{width: calc(100% - 0px); text-align: center;}
	.changecase .changecase_detail .img_Additional_area .img_Additional{width: 100%; height: auto; margin: auto auto 10px;}
	.changecase .changecase_detail .img_Additional_area .img_w100{width: 100%; height: auto;}
	.changecase .changecase_detail .img_Additional_area .img_w50{width: 100%; height: auto;}
}
.changecase .changecase_detail .img_Additional_area_txt{font-size: 1em; text-align: center;}
.changecase .changecase_detail .img_Additional_area div .img_Additional_area_txt{text-align: left;}



.changecase .changecase_detail table.company_profile{width: 100%; border-collapse: collapse;}
.changecase .changecase_detail table.company_profile th,
.changecase .changecase_detail table.company_profile td{border: 1px solid #ebebeb; padding: 0.5em; font-size: 0.875rem; font-weight: normal; text-align: left;}
.changecase .changecase_detail table.company_profile th{width: 130px;}
.changecase .changecase_detail table.company_profile td{width: calc(100% - 130px);}



.changecase .changecase_detail .trouble{display: flex;  margin: 3em auto 1em; font-size: 16px;}
.changecase .changecase_detail .trouble dt{display:inline-block; background-color: #5996c7; color: #FFF; text-align: center; font-size: 1rem; padding: 0px 10px; width: 70px; margin-right: 16px;}
.changecase .changecase_detail .trouble dd{width: calc(100% - 70px - 16px);}

.changecase .changecase_detail .related_links{display: flex;  margin: 2em auto 3em; font-size: 16px;}
.changecase .changecase_detail .related_links dt{display:inline-block; background-color: #666; color: #FFF; text-align: center; font-size: 1rem; padding: 0px 10px; margin-right: 16px; border-radius: 3px;}
.changecase .changecase_detail .related_links dd{margin-right: 16px;}
.changecase .changecase_detail .related_links dd a{color: #222; /*text-decoration: none;*/}



.changecase #nav_menu_right_outline{width: calc(20% - 0px); }
.changecase #nav_menu_right_outline #nav_menu_right{position: sticky; top:120px; margin-bottom: 50px;}

@media screen and (max-width: 768px) {
	.changecase .changecase_detail{width: calc(100% - 0px); margin-right: auto;}
	.changecase #nav_menu_right_outline{width: calc(100% - 0px);}
}

/* スクロール固定解除の位置を半角数値で設定する為のタグ */
/*
.menu_fix{position:fixed; top:110px; width: 240px;}
.menu_fix_center{position:fixed; bottom:0px; width: 240px;}
.menu_fix_bttom{position:relative; top:1000px; width: 240px;}
@media screen and (max-width: 768px) {
	.menu_fix{position:relative; top:0;}	
}
*/