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

* {margin:0;padding:0;}

.btm_50{margin-bottom: 50px!important;}


.focus_on_area{display: flex; flex-wrap: wrap; width: 100%;}
.focus_on_area .focus_on_detail{width: calc(80% - 50px); margin-right: 50px;}
.focus_on_area .focus_on_detail h1{margin-bottom: 1em;}

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

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


.focus_on_area .focus_on_detail .eye_catching{display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 50px;}
.focus_on_area .focus_on_detail .eye_catching div{width: 50%;}

.focus_on_area .focus_on_detail .eye_catching div h2{width: 100%; font-size: 2.5rem; font-weight: 700; border-bottom: 2px solid #222;}
.focus_on_area .focus_on_detail .eye_catching div p.h2_bottom{font-size: 1.75rem; font-weight: 700; line-height: 1.5em; padding: .5em 0 .5em .5em; background: #EAEAEA; }
.focus_on_area .focus_on_detail .eye_catching div p.h2_bottom span{background: linear-gradient(transparent 60%, rgba(255, 253, 107, 0.7) 0);}

.focus_on_area .focus_on_detail .eye_catching div img.img_eye_catching{margin-left: 20px; width: calc(100% - 20px); height: 430px; object-fit: cover;}
.focus_on_area .focus_on_detail .eye_catching div p.img_eye_catching_txt{margin-left: 20px; width: calc(100% - 20px); font-size: 1.2rem; font-weight: 700;}

@media screen and (max-width: 768px) {
	.focus_on_area .focus_on_detail .eye_catching div{width: 100%;}
	.focus_on_area .focus_on_detail .eye_catching div img.img_eye_catching{margin-left: 0px; width: calc(100% - 0px);}
	.focus_on_area .focus_on_detail .eye_catching div p.img_eye_catching_txt{margin-left: 0px; width: calc(100% - 0px);}
}


.focus_on_area .focus_on_detail .detail 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.1); margin-bottom: 30px;}

.focus_on_area .focus_on_detail .detail h3{font-size: 1.33rem; padding: .5em; background: #EAEAEA; margin-bottom: 20px;}
.focus_on_area .focus_on_detail .detail p{margin-bottom: 1.5rem;}

.focus_on_area .focus_on_detail .detail img{width: 100%; height: auto;}


.focus_on_area .focus_on_detail .detail .flex_area{display: flex; flex-wrap: wrap; width: 100%;}
.focus_on_area .focus_on_detail .detail .flex_area div{width: 50%;}
.focus_on_area .focus_on_detail .detail .flex_area div img{margin-left: 20px; width: calc(100% - 20px)!important; height: auto!important;}
.focus_on_area .focus_on_detail .detail .flex_area div .img_detail_txt{margin-left: 20px; width: calc(100% - 20px)!important; font-size: 0.75em; font-weight: bold;}
.focus_on_area .focus_on_detail .detail .flex_area div .img_txt{margin-left: 20px; width: calc(100% - 20px)!important;}

.focus_on_area .focus_on_detail .detail .flex_area div .technology{width: 100%;}
.focus_on_area .focus_on_detail .detail .flex_area div .technology dt{width: 100%; background-color: #337ab7; color: #FFF; padding: .5em 1.5em .4em; font-size: 1em; line-height: 1.4; font-weight: bold; display: inline;}
.focus_on_area .focus_on_detail .detail .flex_area div .technology dd{padding: 1.5em 2em 1.5em; border: 2px solid #337ab7; position: relative; top:2px;}

@media screen and (max-width: 768px) {
	.focus_on_area .focus_on_detail .detail .flex_area div{width: 100%; margin-bottom: 30px;}
	.focus_on_area .focus_on_detail .detail .flex_area div img{margin-left: 0px; width: calc(100% - 0px)!important; height: auto!important;}
	.focus_on_area .focus_on_detail .detail .flex_area div .img_detail_txt{margin-left: 0px; width: calc(100% - 0px)!important;}
	.focus_on_area .focus_on_detail .detail .flex_area div .img_txt{margin-left: 0px; width: calc(100% - 0px)!important;}
}


.focus_on_area .focus_on_detail .detail h4{padding-bottom: .5em; border-bottom: 1px solid rgba(0,0,0,0.06); margin-bottom: 1em; line-height: 1.4em;}

.focus_on_area .focus_on_detail .detail ul li a{text-decoration: underline; text-decoration-style: dotted; text-decoration-color: rgba(0,0,0,0.3); text-decoration-thickness: 1px;}

.focus_on_area .focus_on_detail .detail ul li a:hover{color: #337ab7; text-decoration: none;}