@charset "UTF-8";
/*** PC/SP ����CSS ***/
.caseDetail .title h1 {
padding-right: .8rem;
padding-left: .8rem;
}
.caseDetail h2 {
margin-top: -52px;
padding-top: 52px;
position: relative;
padding-left: 10px;
border-left: none;
}
.caseDetail h2:before {
content: "";
width: 5px;
height: 30px;
line-height: 30px;
position: absolute;
bottom: 0;
left: 0;
background: #2f6698;
}
.first {

}
.first .imageBox{
max-height: auto;

}
.first .imageBox img{
height: initial;
}
.first .outline{
margin: 2rem auto;
border: 5px solid #EAEFF3;
}
.first .outline .outline_ttl,
.first .outline h3 {
background: #EAEFF3;
padding: 5px;
text-align: center;
color: #2f6698;
font-size: 1rem;
font-weight: 700;
}
.first .outline ul {
padding: .5rem 1rem;
counter-reset: section;
}
.first .outline ul li {
padding: 5px 0;
border-bottom: 2px solid #EAEFF3;
}
.first .outline ul li:first-child {
padding-top: 0;
}
.first .outline ul li:last-child {
border-bottom: none;
}
.first .outline ul li a:visited,
.first .outline ul li a:link {
text-decoration: none;
font-weight: bold;
color: #2f6698;
}
.first .outline ul li a:before {
counter-increment: section;  
content: counter(section) "";
padding-right: 1rem;
font-weight: bold;
}
.second .asset{
margin: 2rem auto;
border: 1px solid #EAEFF3;
}
.second .asset h3 {
background: #EAEFF3;
padding: 5px;
text-align: center;
}
.second .asset ul {
padding: .5rem 1rem;
}
.second .asset ul li {
padding: 5px 0 5px 1rem;
font-size: .95rem;

}

.second .asset ul li:before {
	content: '';
	width: 3px;
	height: 3px;
	display: inline-block;
	border-radius: 100%;
	background: #2f6698;
	position: relative;
	left: -15px;
	top: -3px;
}
.linkList {
margin: 1rem;
}
.linkList .related{
margin: 2rem auto;
border: 1px solid #EAEFF3;
}
.linkList .related h3 {
background: #EAEFF3;
padding: 5px;
text-align: center;
color: #2f6698;
font-weight: 800;
margin-bottom: .5rem;
}
/*.linkList .related h3:before {
border-left: 8px solid #306597;
content: "";
display: inline;
height: 24px;
width: 16px;
margin-right: 10px;
}
.linkList .related h3:after {
border-bottom: 4px solid #306597;
content: "";
display: block;
height: 10px;
width: 100%;
}*/
.linkList .related ul {
padding: .5rem 1rem;
border:5px solid #EAEFF3;
display: flex;
flex-flow: wrap;
}
.linkList .related ul li {
padding: 5px 0;
display: flow-root;
width: 100%;
}
.linkList .related ul li .thumb {
width: 50px;
float: left;
height: 50px;
overflow: hidden;
position: relative;
width: 15%;
float: left;
}
.linkList .related ul li .thumb img {
max-width: initial;
height: 100%;
position: absolute;
left: -20%;

}
.linkList .related ul li a span {
padding-left: .5rem;
font-size: .85rem;
float: left;
width: 85%;
}
.contsBlock {
margin-bottom: 2rem;
}

/*## Small Mobile screen ##*/
@media screen and (max-width: 350px) {
}
@media screen and (min-width: 460px) and (max-width: 768px){
}



/*** PC ***/
@media screen and (min-width: 769px) {
.caseDetail h2 {
margin-top: -130px;
padding-top: 130px;
}
.linkList {
width: 960px;
margin: 0 auto;
}
.linkList .related {
width: 97%;
margin: 2rem auto 6rem;
}
.first {
position: relative;
margin-bottom: 5rem;
}
.first .imageBox{ 
width: 55%;
}
.second .imageBox{
width: 100%;
}
.first .imageBox img{
max-width: 100%;
width: 100%;
}
.first .outline{
position: absolute;
width: 40%;
/*border: 5px solid rgba(0,0,0,.2);*/
border: none;
border-left: 1px solid #EAEFF3;
border-bottom: 1px solid #EAEFF3;
opacity: .9;
background: rgba(255,255,255,1);
box-shadow: 4px 5px rgba(0,0,0,.2);
top: 0;
right: 4px;
margin: 0;
}
.first .outline .outline_ttl,
.first .outline h3 {
text-align: left;
padding: .4rem .5rem 0 1rem;
}
.first .outline ul {
padding: .7rem 1rem .7rem 1rem;
}
.first .outline ul li {
padding: 5px 0 0 0;
margin-bottom: 0;
}
.first .outline ul li:first-child {
padding-top: 0;
}
#cont .first .outline ul li a {
font-size: .9rem;
text-decoration: none;
padding-left: 1rem;
}

.imageBox img{
max-width: 100%;
width: 100%;
}
.second {
position: relative;
margin-bottom: 5rem;
}
.second .imageBox{
width: 100%;
}
.second .asset{
position: absolute;
width: 29%;
margin: 3rem auto;
top: 43.6px;
right: 0;
margin: 0;
}
.contsBlock {
margin-bottom: 5rem;
}
.contsBlock:last-child {
margin-bottom: 0;
}
.caseDetail .linkList {
width: 70%;
margin: 2rem auto 5rem;
}
.linkList .related {
border: none;
}
.linkList .related h3 {
padding: .5rem 1.5rem;
font-size: 1.15rem;
text-align: left;
}
.linkList .related ul {
/*border: 2px solid #ccc;*/
padding: .5rem;
display: flex;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
.linkList .related ul li {
border-bottom: 2px solid #ccc;
min-height: 60px;
}
.linkList .related ul li:last-child {
border-bottom: none;
}
.linkList .related ul li a {
display: inline-block;
width: 100%;
}
.linkList .related ul li .thumb {
width: 60px;
height: 60px;
position: relative;
}
.linkList .related ul li .thumb img {
max-width: none;
height: 100%;
position: absolute;
left: -30%;
}
.linkList .related ul li a span{
display: table-cell;
vertical-align: middle;
font-size: .9rem;
padding-left: 1rem;
width: initial;
line-height: 60px;
}
.caseDetail section:nth-child(2) {
margin-bottom: 5rem;
}
.caseDetail .contsBlock .text h3{
padding-top: 1rem;
padding-bottom: 1rem;
}
    .text ul{
        padding: 1rem;
    }
    .text p{
        line-height: 1.7;
    }
}
