@charset "utf-8";

/* -------------------------------------------------- */
/* #block-case */
/* -------------------------------------------------- */
#block-case .search{border-top:1px solid #999;border-bottom:1px solid #999;padding:35px 0;margin:50px auto 100px;}
#block-case .search dl{display:flex;align-items:center;}
#block-case .search dl + dl{margin-top:30px;}
#block-case .search dt{font-size:2rem;color:#9f312d;width:190px;padding:0 40px;white-space:nowrap;position:relative;}
#block-case .search dt::after{content:"";display:block;width:1px;height:60%;background:#999;position:absolute;right:0;top:20%;}
#block-case .search dd{padding-left:50px;flex:1;}
#block-case .search .category{font-size:1.8rem;}
#block-case .search .tag{font-size:1.8rem;display:flex;flex-wrap:wrap;gap:10px;}
#block-case .search .tag span{display:block;border:1px solid #333;border-radius:100px;white-space:nowrap;line-height:1;padding:4px 28px 6px;}
#block-case .search .tag span.active{background:#d5443f;color:#fff;border-color:#d5443f;}
#block-case .pager{margin-top:50px;font-family: 'Reddit Sans';text-align:center;display:flex;flex-wrap:wrap;justify-content:center;gap:15px;}
#block-case .pager > li a,
#block-case .pager > li span{white-space:nowrap;display:block;width:31px;height:31px;position:relative;display:flex;align-items:center;justify-content:center;line-height:1;}
#block-case .pager > li.current span::after{content:"";display:block;width:100%;height:100%;border:1px solid #333;border-radius:100%;position:absolute;top:0;left:0;box-sizing:border-box;pointer-events:none;}
#block-case .pager > li.prev a::before{content:"";display:block;width:15px;height:12px;background:url(../img/icon-arrow-red.svg) no-repeat;background-size:contain;transform:scale(-1,1);}
#block-case .pager > li.next a::before{content:"";display:block;width:15px;height:12px;background:url(../img/icon-arrow-red.svg) no-repeat;background-size:contain;}

/* -------------------------------------------------- */
/* #block-detail */
/* -------------------------------------------------- */
#block-detail .service-info{border-top:1px solid #999;border-bottom:1px solid #999;padding:30px 0;margin:0 auto 40px;}
#block-detail .service-info dl{display:flex;align-items:center;}
#block-detail .service-info dt{font-size:2rem;color:#9f312d;width:190px;padding:0 40px;white-space:nowrap;position:relative;}
#block-detail .service-info dt::after{content:"";display:block;width:1px;height:60%;background:#999;position:absolute;right:0;top:20%;}
#block-detail .service-info dd{padding-left:40px;flex:1;display:flex;align-items:center;gap:60px;}
#block-detail .service-info .name{font-size:2rem;}
#block-detail .service-info .tag{font-size:1.8rem;display:flex;flex-wrap:wrap;gap:10px;}
#block-detail .service-info .tag span{display:block;border:1px solid #333;border-radius:100px;white-space:nowrap;line-height:1;padding:4px 28px 6px;}
#block-detail .service-info .tag span.active{background:#d5443f;color:#fff;border-color:#d5443f;}

#block-detail .mvarea{max-width:900px;margin:0 auto 40px;}
#block-detail .mvarea .img img{display:block;margin:auto;}
#block-detail .mvarea .name{font-size:2.4rem;font-weight:bold;text-align:right;margin-top:35px;}

#block-detail .editarea{max-width:900px;margin:auto;}
#block-detail .editarea img{display:block;margin:40px auto;}
#block-detail .editarea h2{font-size:2.8rem;font-weight:bold;border-bottom:1px solid #303030;position:relative;padding:0 0 12px 20px;margin:80px auto 40px;line-height:1.5;}
#block-detail .editarea h2::before{content:"";display:block;width:6px;height:30px;background:#d5423c;position:absolute;left:0;top:8px;}
#block-detail .editarea h2:first-child{margin-top:0;}
#block-detail .editarea ul,
#block-detail .editarea ol{margin:40px auto;counter-reset:item;}
#block-detail .editarea ul > li,
#block-detail .editarea ol > li{position:relative;padding-left:28px;counter-increment:item;}
#block-detail .editarea ul > li::before{content:"";display:block;width:7px;height:7px;background:#d5423c;position:absolute;left:0;top:13px;}
#block-detail .editarea ol > li::before{content:counter(item)".";display:block;position:absolute;left:0;top:5px;line-height:1;font-family: 'Reddit Sans';color:#d5423c;font-weight:bold;font-size:2rem;}
#block-detail .editarea ul > li + li,
#block-detail .editarea ol > li + li{margin-top:8px;}
#block-detail .editarea a{text-decoration:underline;}
#block-detail .editarea a:hover{text-decoration:none;}
#block-detail .editarea .problem{margin:40px auto;box-shadow:0 0 15px rgba(0,0,0,0.1);border-radius:10px;padding:40px 50px;}
#block-detail .editarea .problem h2{font-size:2.4rem;font-weight:bold;text-align:center;border:0;padding:0;margin:0;}
#block-detail .editarea .problem h2::before{display:none;}
#block-detail .editarea .problem h2::after{content:"";display:block;width:80px;height:3px;background:#bbb;margin:12px auto 30px;}
#block-detail .editarea .problem ul{margin:0;}
#block-detail .editarea .problem ul > li{position:relative;padding-left:28px;font-size:1.8rem;}
#block-detail .editarea .problem ul > li + li{margin-top:8px;}
#block-detail .editarea .problem ul > li::before{content:"";display:block;width:7px;height:7px;background:#aaa;position:absolute;left:0;top:13px;}
#block-detail .editarea .solution{margin:40px auto;box-shadow:0 0 15px rgba(0,0,0,0.1);border-radius:10px;padding:37px 47px;border:3px solid #d5423c;position:relative;}
#block-detail .editarea .solution h2{font-size:2.4rem;font-weight:bold;text-align:center;border:0;padding:0;margin:0;}
#block-detail .editarea .solution h2::before{display:none;}
#block-detail .editarea .solution h2::after{content:"";display:block;width:80px;height:3px;background:#d5423c;margin:12px auto 30px;}
#block-detail .editarea .solution ul{margin:0;}
#block-detail .editarea .solution ul > li{position:relative;padding-left:28px;font-size:1.8rem;}
#block-detail .editarea .solution ul > li + li{margin-top:8px;}
#block-detail .editarea .solution ul > li::before{content:"";display:block;width:7px;height:7px;background:#d5423c;position:absolute;left:0;top:13px;}
#block-detail .editarea .problem + .solution::before,
#block-detail .editarea .factor + .solution::before{content:"";display:block;width:71px;height:39px;background:url(../img/case/arrow.png) no-repeat;background-size:contain;position:absolute;bottom:calc(100% + 3px);left:50%;margin-left:-35px;}
#block-detail .editarea .factor{margin:40px auto;box-shadow:0 0 15px rgba(0,0,0,0.1);border-radius:10px;padding:37px 47px;border:3px solid #e38b13;position:relative;}
#block-detail .editarea .factor h2{font-size:2.4rem;font-weight:bold;text-align:center;border:0;padding:0;margin:0;}
#block-detail .editarea .factor h2::before{display:none;}
#block-detail .editarea .factor h2::after{content:"";display:block;width:80px;height:3px;background:#e38b13;margin:12px auto 30px;}
#block-detail .editarea .factor ul{margin:0;}
#block-detail .editarea .factor ul > li{position:relative;padding-left:28px;font-size:1.8rem;}
#block-detail .editarea .factor ul > li + li{margin-top:8px;}
#block-detail .editarea .factor ul > li::before{content:"";display:block;width:7px;height:7px;background:#e38b13;position:absolute;left:0;top:13px;}
#block-detail .editarea .problem + .factor::before{content:"";display:block;width:71px;height:39px;background:url(../img/case/arrow2.png) no-repeat;background-size:contain;position:absolute;bottom:calc(100% + 3px);left:50%;margin-left:-35px;}

#block-detail .editarea .interview{margin:50px auto;padding-left:50px;}
#block-detail .editarea .interview h3{font-size:2rem;font-weight:bold;padding:0;margin:0 0 30px;border:0;position:relative;}
#block-detail .editarea .interview h3::before{content:"";display:block;width:30px;height:2px;background:#d5423c;position:absolute;left:-50px;top:18px;}
#block-detail .editarea .interview .name{width:fit-content;background:#eee;border-radius:100px;white-space:nowrap;padding:5px 18px;line-height:1;margin:30px 0 10px;}

#block-detail .cvarea{background:url(../img/case/cv-bg.jpg) no-repeat;background-size:cover;border-radius:10px;margin-top:80px;overflow:hidden;}
#block-detail .cvarea > a{display:flex;align-items:center;gap:50px;position:relative;padding:70px 80px;font-size:2.2rem;font-weight:bold;}
#block-detail .cvarea .logo{max-width:37%;}
#block-detail .cvarea .inner{flex:1;}
#block-detail .cvarea .btn{position:absolute;right:0;bottom:0;font-size:1.8rem;color:#fff;background:#d5423c;border-radius:20px 0 0 0;padding:10px 50px 10px 55px;}

#block-detail .otherarea{margin-top:100px;}
#block-detail .otherarea .btn a{display:block;font-size:2rem;font-weight:bold;color:#fff;background:#d5443f;border-radius:100px;padding:12px 40px;width:100%;max-width:360px;margin:auto;text-align:center;}

/* ======================================================================================================================= */
/* for tablet */
/* ======================================================================================================================= */
@media screen and (min-width:1px) and (max-width:999px){
	
}

/* ======================================================================================================================= */
/* for sp */
/* ======================================================================================================================= */
@media screen and (min-width:1px) and (max-width:767px){
	/* -------------------------------------------------- */
	/* #block-case */
	/* -------------------------------------------------- */
	#block-case .search{margin:30px auto 40px;padding:20px 0;}
	#block-case .search dl{display:block;}
	#block-case .search dl + dl{margin-top:15px;}
	#block-case .search dt{padding:0;font-size:1.6rem;width:100%;}
	#block-case .search dt::after{display:none;}
	#block-case .search .category{padding:0;font-size:1.6rem;}
	#block-case .search .category .cmn-radio input[type="radio"] + span{margin:2px 0;padding:5px 15px 5px 20px;}
	#block-case .search .category .cmn-radio span::before{width:16px;height:16px;top:8px;left:0;}
	#block-case .search .category .cmn-radio span::after{width:10px;height:10px;top:11px;left:3px;}
	#block-case .search .tag{padding:0;font-size:1.4rem;margin-top:10px;gap:5px;}
	#block-case .search .tag span a{padding:4px 20px;}

	/* -------------------------------------------------- */
	/* #block-detail */
	/* -------------------------------------------------- */
	#block-detail .service-info{padding:20px 0;margin-bottom:25px;}
	#block-detail .service-info dl{display:block;position:relative;}
	#block-detail .service-info dt{padding:0;font-size:1.6rem;width:100%;position:absolute;left:0;top:1px;}
	#block-detail .service-info dt::after{display:none;}
	#block-detail .service-info dd{padding:0;display:block;}
	#block-detail .service-info .name{font-size:1.8rem;padding-left:100px;}
	#block-detail .service-info .tag{margin-top:10px;gap:5px;}
	#block-detail .service-info .tag span{font-size:1.4rem;padding:4px 20px;}
	
	#block-detail .mvarea{margin-bottom:25px;}
	#block-detail .mvarea .name{font-size:2rem;margin-top:20px;}

	#block-detail .editarea h2{font-size:2.2rem;padding:0 0 10px 18px;margin:60px auto 25px;}
	#block-detail .editarea h2::before{width:5px;height:22px;top:5px;}
	#block-detail .editarea img{margin:25px auto;}
	#block-detail .editarea ul, #block-detail .editarea ol{margin:30px auto;}
	#block-detail .editarea .problem{margin:25px auto;padding:25px;}
	#block-detail .editarea .problem h2{font-size:2rem;}
	#block-detail .editarea .problem h2::after{width:60px;height:2px;margin:8px auto 15px;}
	#block-detail .editarea .problem ul > li{font-size:1.6rem;padding-left:18px;}
	#block-detail .editarea .problem ul > li::before{width:6px;height:6px;top:8px;}
	#block-detail .editarea .solution{margin:25px auto;padding:25px 23px;border-width:2px;}
	#block-detail .editarea .solution h2{font-size:2rem;}
	#block-detail .editarea .solution h2::after{width:60px;height:2px;margin:8px auto 15px;}
	#block-detail .editarea .solution ul > li{font-size:1.6rem;padding-left:18px;}
	#block-detail .editarea .solution ul > li::before{width:6px;height:6px;top:8px;}
	#block-detail .editarea .problem + .solution::before,
	#block-detail .editarea .factor + .solution::before{height:25px;background-position:center center;}
	#block-detail .editarea .factor{margin:25px auto;padding:25px 23px;border-width:2px;}
	#block-detail .editarea .factor h2{font-size:2rem;}
	#block-detail .editarea .factor h2::after{width:60px;height:2px;margin:8px auto 15px;}
	#block-detail .editarea .factor ul > li{font-size:1.6rem;padding-left:18px;}
	#block-detail .editarea .factor ul > li::before{width:6px;height:6px;top:8px;}
	#block-detail .editarea .problem + .factor::before{height:25px;background-position:center center;}
	#block-detail .editarea .interview{margin:30px auto;padding-left:30px;}
	#block-detail .editarea .interview h3{font-size:1.8rem;margin-bottom:20px;}
	#block-detail .editarea .interview h3::before{width:18px;left:-30px;top:12px;}
	#block-detail .editarea .interview .name{margin:20px 0 8px;padding:4px 12px;}

	#block-detail .cvarea{margin-top:60px;background-position:55% center;}	
	#block-detail .cvarea > a{display:block;padding:30px 35px 55px;font-size:1.8rem;}
	#block-detail .cvarea .logo{max-width:100%;text-align:center;margin-bottom:20px;}
	#block-detail .cvarea .btn{font-size:1.6rem;padding:8px 30px 8px 35px;border-radius:15px 0 0 0;}

	#block-detail .otherarea{margin-top:60px;}
	#block-detail .otherarea .btn a{font-size:1.8rem;width:90%;}
}